/* HEADER */

/*Scrollbar*/
/* Works on Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--primary-d-4) var(--ivory1);
}

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 12px;
}

*::-webkit-scrollbar-track {
  background: var(--ivory1);
}

*::-webkit-scrollbar-thumb {
    background-color: var(--ivory1);
    border-radius: 6px;
    border: 1px solid var(--primary-d-4);
}

/* Overlay Header */



@media (min-width: 991px) {

    body #brx-header[data-x-overlay="none"] .ib-header {
        background-color: var(--light);
        color: initial;
    }

    body #brx-header[data-x-overlay="none"] .ib-header__logo {
        filter: none;
    }

    body #brx-header[data-x-overlay="none"] .bricks-button.outline {
        border-color: initial;
    }

    /* Apply styles only if header does NOT have data-x-overlay="none" */
    body #brx-header:not([data-x-overlay="none"]):not(.scrolling):not(.x-header_sticky-active) > .ib-header:not([data-x-sticky-active*=true]):hover,
    body.x-header-search-open #brx-header:not([data-x-overlay="none"]):not(.scrolling):not(.x-header_sticky-active) > .ib-header:not([data-x-sticky-active*=true]) {
        background-color: var(--light) !important;
    }

    body:not(.x-header-search-open) #brx-header:not([data-x-overlay="none"]):not(.scrolling):not(.x-header_sticky-active) > .ib-header:not([data-x-sticky-active*=true]):not(:hover) {
        color: var(--light);
    }

    body:not(.x-header-search-open) #brx-header:not([data-x-overlay="none"]):not(.scrolling):not(.x-header_sticky-active) > .ib-header:not([data-x-sticky-active*=true]):not(:hover) .ib-header__logo {
        filter: invert(1);
    }

    body #brx-header:not([data-x-overlay="none"]):not(.scrolling):not(.x-header_sticky-active) > .ib-header:not([data-x-sticky-active*=true]):hover .bricks-button.outline,
    body.x-header-search-open #brx-header:not([data-x-overlay="none"]):not(.scrolling):not(.x-header_sticky-active) > .ib-header:not([data-x-sticky-active*=true]):hover .bricks-button.outline {
        border-color: var(--base);
    }
}



/* Keyframe Animations */

@keyframes slideOut {
    from {
        transform: translate3d(0,0,0);
        opacity: 1;
    }

    to {
        transform: translate3d(100%,0,0);
        opacity: 0;
    }
}

@keyframes slideIn {
    from {
        transform: translate3d(-100%,0,0);
        opacity: 0;
    }

    to {
        transform: translate3d(0,0,0);
        opacity: 1;
    }
}

/* Links style */

.element-visible-base::after {
    content: '';
    bottom: 0;
    width: 100%;
    opacity: 1;
    transition: transform 250ms ease-out,opacity 250ms ease-out;
}


.element-visible-slide-active::after {
    animation: slideOut 250ms forwards;
}

.element-visible-slide-in::after {
    animation: slideIn 250ms forwards;
}

.element-base::after,.element-visible-base::after {
    position: absolute;
    height: 1px;
    background-color: currentColor;
    left: 0;
}


/*Search*/


li.bricks-posts-nothing-found {
    list-style: none; 
}


/*Product page */
.ib-product__titleIn {
    transform: translateY(20px);
    opacity: 0;
    transition: transform 0.3s ease-out, opacity 0.6s ease-out;
    font-size: var(--text-2xl);
}

.ib-product__titleIn.tVisible {
    transform: translateY(0);
    opacity: 1;
}