#search-product-input::placeholder{
	color: #D9D9D9;
	opacity: 0.2;
}
.navbar-toggler:focus{
	box-shadow: none !important;
	text-decoration: none !important;
	outline: 0;
}
.navbar-collapse.collapsing {
    transition: height 0.6s ease;
}

.nav-actions {
    display: flex;
    align-items: center;
}

#navSearchBtn,
#navCartBtn {
    transition: all 0.3s ease;
}

.nav-link{
	color: #FFFFFF !important;
}

#navCartBtn {
    max-width: 60px;
    overflow: hidden;
}

.nav-open #navCartBtn {
    opacity: 0;
    max-width: 0;
    padding: 0;
    margin: 0;
	pointer-events: none;
}

.navbar-dash{
    border: 1px solid transparent;

    border-image:
        repeating-linear-gradient(
            90deg,
            #C19027 0 5px,        /* DASH LENGTH */
            transparent 10px 20px /* GAP */
        ) 1;
}

.accordion-button{
    box-shadow: none !important;
    border: none !important;
    background-color: transparent !important;
}

.accordion-button:focus{
    box-shadow: none !important;
    border: none !important;
}

.accordion-button::after{
    background-image: none !important;

    content: "";

    background-image: url('/images/home-icons/plus-icon.svg') !important;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    transition: transform 0.3s ease;
}

.accordion-button:not(.collapsed)::after{
    background-image: url('/images/home-icons/minus-icon.svg') !important;

    transform: rotate(180deg);
}

.categories-accordion{
    text-decoration: none;
}

.categories-accordion:not(.collapsed){
    text-decoration: underline;
    text-underline-offset: 4px;
}

.search-open #navCartBtn,
.search-open #menuBtn{
    opacity: 0;
    max-width: 0;
    overflow: hidden;
    padding: 0;
    margin: 0;
    pointer-events: none;
    transition: all 0.3s ease;
}
/* BLUR BACKGROUND WHEN OFFCANVAS OPEN */
.offcanvas-backdrop.show{
    background-color: black !important;
	opacity: 0.8 !important;
}
.cart-badge{
    position: absolute;
    top: -3px;
    right: -1px;

    min-width: 14px;
    height: 14px;
	aspect-ratio: 1/1;
    padding: 0 5px;

    border-radius: 50px;

    background-color: #FF5A5F;
    color: #FFFFFF;

    font-size: 10px;
    font-weight: 600;

    display: flex;
    align-items: center;
    justify-content: center;

    line-height: 1;
}

/* ///////// age restriction CSS /////////// */

.age-gate-offcanvas{
    height:300px !important;
    background-color:#0F0F0F !important;
    border-top-left-radius:24px;
    border-top-right-radius:24px;
    overflow:hidden;
}

.age-gate-offcanvas .offcanvas-body{
    position:relative;
	overflow: hidden;
}

.age-gate-offcanvas .offcanvas-body::after{
	content: "";
	position: absolute;
	width: 361px;
	height: 362px;
	right: -170px;
	top: -170px;
	border-radius: 50%;
	background: radial-gradient( circle, rgba(212,170,58,.32) 20%, rgba(212,170,58,.22) 25%, rgba(212,170,58,.12) 50%, rgba(212,170,58,.05) 60%, transparent 95% );
	filter: blur(12px);
	pointer-events: none;
}

.age-gate-page{

    display:flex;
    flex-direction:column;
    align-items:center;

    padding:40px;

    height:100%;
}

.age-gate-title{

    color:#FFF;
    font-size:30px;
    font-family:Georgia, serif;
    font-weight:400;
}

.age-gate-subtitle{

    color:#FFF;
    font-size:13px;
}

.age-gate-warning{

    color:#ff4444;
    font-size:13px;
    line-height:1.6;
    max-width:320px;
    letter-spacing: -2%;
}

.age-gate-link-btn{

    background:none;
    border:none;

    color:#FFFFFF;
	letter-spacing: -2%;

    text-decoration:underline;
}

.age-gate-footer{

    margin-top:auto;

    max-width:320px;

    color:#FFF;
	letter-spacing: -2%;
    line-height:1.7;
}

.age-gate-footer a{

    color:#D3A43D;
    text-decoration:none;
}

.age-gate-footer a:hover{

    text-decoration:underline;
}

/* sub category accordion */

.nav-category-accordion .accordion-button::after{
    display: none !important;
}

.nav-category-icon{
    display: inline-block;
    transition: transform .2s ease;
}

.nav-category-icon::before{
    content: "❯";
    display: inline-block;
}

 .accordion-button:not(.collapsed) .nav-category-icon{
    transform: rotate(90deg);
}