.elementor-29179 .elementor-element.elementor-element-c32a2aa{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;}.elementor-29179 .elementor-element.elementor-element-f4372b4{padding:6% 0% 0% 0%;}.elementor-29179 .elementor-element.elementor-element-4ab7c03{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0%;--padding-bottom:0%;--padding-left:5%;--padding-right:5%;}.elementor-29179 .elementor-element.elementor-element-4ab7c03:not(.elementor-motion-effects-element-type-background), .elementor-29179 .elementor-element.elementor-element-4ab7c03 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}@media(max-width:768px){.elementor-29179 .elementor-element.elementor-element-c32a2aa{--padding-top:0%;--padding-bottom:0%;--padding-left:0%;--padding-right:0%;}.elementor-29179 .elementor-element.elementor-element-f4372b4{padding:10% 0% 0% 0%;}}/* Start custom CSS for html, class: .elementor-element-f4372b4 *//* ==================================================
   Zythex Labs — Responsive Premium Page Header
================================================== */

.zyx-page-hero {
    --zyx-blue: #215cf3;
    --zyx-dark: #10101f;
    --zyx-text: #64677b;

    position: relative;
    isolation: isolate;
    display: flex;
    width: 100%;
    min-height: 440px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 80px 24px;

    border-top: 1px solid rgba(33, 92, 243, 0.07);
    border-bottom: 1px solid rgba(33, 92, 243, 0.08);

    background:
        radial-gradient(
            circle at 50% 105%,
            rgba(57, 92, 255, 0.17) 0%,
            rgba(88, 105, 255, 0.08) 26%,
            transparent 54%
        ),
        radial-gradient(
            circle at 15% 15%,
            rgba(255, 255, 255, 0.92),
            transparent 30%
        ),
        radial-gradient(
            circle at 85% 15%,
            rgba(255, 255, 255, 0.72),
            transparent 31%
        ),
        linear-gradient(
            120deg,
            #f7f8ff 0%,
            #eeedff 46%,
            #f3efff 100%
        );
}

/* Subtle premium lighting */

.zyx-page-hero::before {
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    width: min(760px, 64vw);
    height: 280px;
    content: "";
    pointer-events: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    filter: blur(65px);
    transform: translate(-50%, -50%);
}

.zyx-page-hero::after {
    position: absolute;
    z-index: -1;
    right: 13%;
    bottom: -155px;
    left: 13%;
    height: 250px;
    content: "";
    pointer-events: none;
    border-radius: 50%;
    background: rgba(52, 73, 229, 0.11);
    filter: blur(65px);
}

/* Minimal decorative line */

.zyx-page-hero__decor {
    position: absolute;
    z-index: 0;
    bottom: 0;
    left: 50%;
    width: min(700px, 58vw);
    height: 1px;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(33, 92, 243, 0.3),
        transparent
    );
    transform: translateX(-50%);
}

/* ==================================================
   Main content
================================================== */

.zyx-page-hero__content {
    position: relative;
    z-index: 3;
    width: min(800px, 62vw);
    margin: 0 auto;
    text-align: center;
}

/* Eyebrow */

.zyx-page-hero__eyebrow {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-bottom: 25px;
    padding: 10px 18px;

    color: #283457;
    font-family: "Manrope", sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.16em;
    text-transform: uppercase;

    border: 1px solid rgba(33, 92, 243, 0.12);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.78);

    box-shadow:
        0 10px 30px rgba(38, 48, 110, 0.07),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);

    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.zyx-page-hero__eyebrow-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--zyx-blue);
    box-shadow: 0 0 0 4px rgba(33, 92, 243, 0.1);
}

/* Heading */

.zyx-page-hero__title {
    margin: 0;

    color: var(--zyx-dark);
    font-family: "Bricolage Grotesque", sans-serif;
    font-size: clamp(54px, 5.4vw, 88px);
    font-weight: 700;
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.zyx-page-hero__title span {
    color: var(--zyx-blue);
}

/* Description */

.zyx-page-hero__description {
    max-width: 720px;
    margin: 27px auto 0;

    color: var(--zyx-text);
    font-family: "Manrope", sans-serif;
    font-size: clamp(16px, 1.25vw, 20px);
    font-weight: 400;
    line-height: 1.7;
}

/* ==================================================
   Vial clusters
================================================== */

.zyx-page-vials {
    position: absolute;
    z-index: 2;
    top: 50%;

    /* Reduced from the previous 520px maximum */
    width: clamp(270px, 22vw, 400px);
    max-height: calc(100% - 34px);
    object-fit: contain;

    pointer-events: none;
    user-select: none;

    filter: drop-shadow(
        0 24px 27px rgba(32, 42, 119, 0.15)
    );

    will-change: transform;
}

/* Left cluster */

.zyx-page-vials--left {
    left: clamp(-115px, -5.5vw, -40px);
    transform-origin: 45% 65%;
    animation: zyxFloatLeft 7.5s ease-in-out infinite;
}

/* Right cluster */

.zyx-page-vials--right {
    right: clamp(-115px, -5.5vw, -40px);
    transform-origin: 55% 65%;
    animation: zyxFloatRight 8s ease-in-out 0.5s infinite;
}

/* Smooth and light movement */

@keyframes zyxFloatLeft {
    0%,
    100% {
        transform:
            translate3d(0, -50%, 0)
            rotate(-1.2deg);
    }

    50% {
        transform:
            translate3d(6px, calc(-50% - 9px), 0)
            rotate(0.3deg);
    }
}

@keyframes zyxFloatRight {
    0%,
    100% {
        transform:
            translate3d(0, -50%, 0)
            rotate(1.2deg);
    }

    50% {
        transform:
            translate3d(-6px, calc(-50% - 8px), 0)
            rotate(-0.3deg);
    }
}

/* ==================================================
   Large laptop screens
================================================== */

@media (max-width: 1366px) {
    .zyx-page-hero {
        min-height: 420px;
    }

    .zyx-page-hero__content {
        width: min(720px, 60vw);
    }

    .zyx-page-vials {
        width: clamp(250px, 21vw, 350px);
    }
}

/* ==================================================
   Tablet
================================================== */

@media (max-width: 1024px) {
    .zyx-page-hero {
        min-height: 400px;
        padding: 72px 24px;
    }

    .zyx-page-hero__content {
        width: min(620px, 68vw);
    }

    .zyx-page-hero__title {
        font-size: clamp(48px, 7vw, 68px);
    }

    .zyx-page-vials {
        width: clamp(215px, 25vw, 285px);
        max-height: calc(100% - 42px);
    }

    .zyx-page-vials--left {
        left: -85px;
    }

    .zyx-page-vials--right {
        right: -85px;
    }
}

/* ==================================================
   Small tablet
================================================== */

@media (max-width: 767px) {
    .zyx-page-hero {
        min-height: 390px;
        padding: 65px 22px 80px;
    }

    .zyx-page-hero__content {
        width: min(540px, 80vw);
    }

    .zyx-page-hero__eyebrow {
        min-height: 40px;
        margin-bottom: 20px;
        padding: 9px 15px;
        font-size: 10px;
    }

    .zyx-page-hero__title {
        font-size: clamp(43px, 9vw, 58px);
    }

    .zyx-page-hero__description {
        max-width: 480px;
        margin-top: 20px;
        font-size: 15px;
        line-height: 1.65;
    }

    .zyx-page-vials {
        width: 210px;
        max-height: 330px;
        opacity: 0.72;
    }

    .zyx-page-vials--left {
        left: -115px;
    }

    .zyx-page-vials--right {
        right: -115px;
    }
}

/* ==================================================
   Mobile
================================================== */

@media (max-width: 600px) {
    .zyx-page-hero {
        min-height: 430px;
        padding: 65px 18px 90px;
    }

    .zyx-page-hero__content {
        width: 100%;
        max-width: 410px;
    }

    .zyx-page-hero__title {
        font-size: clamp(41px, 12vw, 54px);
        line-height: 1;
    }

    .zyx-page-hero__title span {
        display: block;
    }

    .zyx-page-hero__description {
        max-width: 330px;
        font-size: 14px;
        line-height: 1.65;
    }

    /*
     * Vials remain visible but are moved toward the
     * lower corners to avoid covering the heading.
     */
    .zyx-page-vials {
        top: auto;
        bottom: -47px;
        width: 155px;
        max-height: 230px;
        opacity: 0.48;
        filter: drop-shadow(
            0 15px 18px rgba(32, 42, 119, 0.13)
        );
    }

    .zyx-page-vials--left {
        left: -49px;
        animation: zyxMobileFloatLeft 7.5s ease-in-out infinite;
    }

    .zyx-page-vials--right {
        right: -49px;
        animation: zyxMobileFloatRight 8s ease-in-out 0.5s infinite;
    }
}

/* Extra-small phones */

@media (max-width: 390px) {
    .zyx-page-hero {
        min-height: 420px;
        padding-right: 16px;
        padding-left: 16px;
    }

    .zyx-page-hero__title {
        font-size: 41px;
    }

    .zyx-page-vials {
        bottom: -40px;
        width: 135px;
        opacity: 0.4;
    }

    .zyx-page-vials--left {
        left: -43px;
    }

    .zyx-page-vials--right {
        right: -43px;
    }
}

/* Mobile floating movement */

@keyframes zyxMobileFloatLeft {
    0%,
    100% {
        transform:
            translate3d(0, 0, 0)
            rotate(-1deg);
    }

    50% {
        transform:
            translate3d(4px, -7px, 0)
            rotate(0.3deg);
    }
}

@keyframes zyxMobileFloatRight {
    0%,
    100% {
        transform:
            translate3d(0, 0, 0)
            rotate(1deg);
    }

    50% {
        transform:
            translate3d(-4px, -7px, 0)
            rotate(-0.3deg);
    }
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
    .zyx-page-vials {
        animation: none !important;
    }

    .zyx-page-vials--left,
    .zyx-page-vials--right {
        transform: translateY(-50%);
    }

    @media (max-width: 600px) {
        .zyx-page-vials--left,
        .zyx-page-vials--right {
            transform: none;
        }
    }
}

/* ==================================================
   Final Vial Position and Mobile Fix
================================================== */

/* Keep both vial clusters fully visible */
.zyx-page-vials {
    width: clamp(230px, 18vw, 330px);
    max-height: calc(100% - 50px);
    object-fit: contain;
}

/* Remove negative positioning that caused cropping */
.zyx-page-vials--left {
    left: clamp(20px, 2.5vw, 55px);
}

.zyx-page-vials--right {
    right: clamp(20px, 2.5vw, 55px);
}

/* Medium laptops */
@media (max-width: 1366px) {
    .zyx-page-vials {
        width: clamp(210px, 17vw, 280px);
    }

    .zyx-page-vials--left {
        left: 18px;
    }

    .zyx-page-vials--right {
        right: 18px;
    }

    .zyx-page-hero__content {
        width: min(720px, 62vw);
    }
}

/* Tablet */
@media (max-width: 1024px) {
    .zyx-page-vials {
        width: clamp(175px, 20vw, 220px);
        max-height: calc(100% - 60px);
    }

    .zyx-page-vials--left {
        left: 14px;
    }

    .zyx-page-vials--right {
        right: 14px;
    }

    .zyx-page-hero__content {
        width: min(600px, 62vw);
    }
}

/* Hide vials completely on mobile and small tablets */
@media (max-width: 767px) {
    .zyx-page-vials,
    .zyx-page-vials--left,
    .zyx-page-vials--right {
        display: none !important;
        visibility: hidden !important;
        animation: none !important;
    }

    .zyx-page-hero {
        min-height: 370px;
        padding: 70px 22px;
    }

    .zyx-page-hero__content {
        width: 100%;
        max-width: 620px;
    }

    .zyx-page-hero__title {
        font-size: clamp(43px, 10vw, 58px);
    }

    .zyx-page-hero__description {
        max-width: 520px;
        margin-top: 21px;
        font-size: 15px;
    }
}

/* Phones */
@media (max-width: 600px) {
    .zyx-page-hero {
        min-height: 390px;
        padding: 65px 18px;
    }

    .zyx-page-hero__content {
        max-width: 410px;
    }

    .zyx-page-hero__title {
        font-size: clamp(41px, 12vw, 54px);
        line-height: 1;
    }

    .zyx-page-hero__title span {
        display: block;
    }

    .zyx-page-hero__description {
        max-width: 340px;
        font-size: 14px;
        line-height: 1.65;
    }
}
/* =========================================================
   ZYTHEX HERO TITLE
   Keep "Research Peptides" on ONE LINE on mobile
========================================================= */

@media (max-width: 767px) {

    .zyx-page-hero__content {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 18px !important;
        padding-right: 18px !important;
        box-sizing: border-box !important;
    }

    .zyx-page-hero__title {
        width: 100% !important;
        max-width: none !important;

        margin-left: auto !important;
        margin-right: auto !important;

        font-size: clamp(30px, 8.4vw, 38px) !important;
        line-height: 1.05 !important;
        letter-spacing: -0.045em !important;

        white-space: nowrap !important;

        text-align: center !important;
    }

    .zyx-page-hero__title span {
        display: inline !important;
        white-space: nowrap !important;
    }

}


/* Extra protection for smaller phones */
@media (max-width: 390px) {

    .zyx-page-hero__title {
        font-size: clamp(27px, 8.1vw, 32px) !important;
        letter-spacing: -0.05em !important;
    }

}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-50987c9 *//* Zythex Labs — Premium responsive AJAX shop */
.zyx-store-section{--blue:#215cf3;--blue2:#1748c9;--ink:#11101f;--copy:#6d7082;--line:rgba(20,24,62,.10);padding:82px 24px 110px;background:#fff}.zyx-store-section *{box-sizing:border-box}.zyx-store-container{width:min(100%,1500px);margin:auto}.zyx-store-header{margin-bottom:38px;text-align:left}.zyx-store-header__copy{max-width:900px}.zyx-store-subtitle{display:inline-flex;align-items:center;gap:10px;margin-bottom:16px;color:var(--blue);font:700 12px/1 "Manrope",sans-serif;letter-spacing:.18em;text-transform:uppercase}.zyx-store-subtitle:before{width:27px;height:2px;content:"";border-radius:9px;background:currentColor}.zyx-store-title{margin:0;color:var(--ink);font:700 clamp(52px,5.15vw,82px)/1 "Bricolage Grotesque",sans-serif;letter-spacing:-.055em}.zyx-store-title span{display:block;color:var(--blue)}.zyx-store-description{max-width:900px;margin:24px 0 0;color:var(--copy);font:400 17px/1.7 "Manrope",sans-serif}
.zyx-store-toolbar{display:flex;align-items:center;gap:14px;margin-bottom:22px}.zyx-store-search{position:relative;display:flex;width:min(100%,620px);height:54px;align-items:center}.zyx-store-search svg{position:absolute;left:20px;width:21px;fill:none;stroke:#9297a9;stroke-width:2;pointer-events:none}.zyx-store-search input{width:100%;height:100%;padding:0 52px;border:1px solid #dfe2e9!important;border-radius:999px!important;outline:0;background:#fff!important;color:var(--ink);font:500 15px "Manrope",sans-serif;box-shadow:0 4px 16px rgba(20,26,66,.03);transition:border-color .25s,box-shadow .25s}.zyx-store-search input:focus{border-color:rgba(33,92,243,.48)!important;box-shadow:0 0 0 4px rgba(33,92,243,.09)}.zyx-store-search__clear{position:absolute;right:13px;width:31px;height:31px;padding:0;border:0;border-radius:50%;background:#f0f2f8;color:#565b70;font-size:20px;cursor:pointer}.zyx-store-sort{position:relative}.zyx-store-sort select{height:54px;min-width:210px;padding:0 45px 0 20px;border:1px solid #dfe2e9;border-radius:999px;background:#fff;color:#555a6e;font:700 13px "Manrope",sans-serif;cursor:pointer;outline:0}
.zyx-store-filters{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 44px}.zyx-store-filter{min-height:42px;padding:10px 22px;border:1px solid transparent;border-radius:999px;background:#f3f1fa;color:#55586d!important;font:700 11px/1 "Manrope",sans-serif;letter-spacing:.13em;text-transform:uppercase;cursor:pointer;transition:.3s}.zyx-store-filter:hover{color:var(--blue)!important;border-color:rgba(33,92,243,.16);background:#fff;box-shadow:0 9px 22px rgba(34,44,102,.08);transform:translateY(-2px)}.zyx-store-filter.is-active{color:#fff!important;background:linear-gradient(110deg,#6030ae,#a15dd5);box-shadow:0 11px 26px rgba(113,53,183,.23)}
.zyx-store-results{position:relative;min-height:380px}.zyx-store-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;transition:opacity .25s,transform .25s}.zyx-store-grid.is-loading{opacity:.22;pointer-events:none;transform:translateY(6px)}.zyx-store-grid.has-loaded{animation:zyxIn .4s ease}@keyframes zyxIn{from{opacity:0;transform:translateY(10px)}}.zyx-product-card{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:17px;background:#fff;box-shadow:0 8px 26px rgba(25,31,73,.055);transition:transform .4s,box-shadow .4s,border-color .4s}.zyx-product-card:hover{border-color:rgba(33,92,243,.2);box-shadow:0 26px 55px rgba(28,39,119,.14);transform:translateY(-7px)}.zyx-product-card__media{position:relative;display:block;aspect-ratio:1;overflow:hidden;border-radius:16px 16px 0 0;background:transparent}.zyx-product-card__image-wrap{width:100%;height:100%;padding:0}.zyx-product-card__image-wrap img,.zyx-product-card__image{display:block;width:100%!important;height:100%!important;margin:0!important;object-fit:cover!important;object-position:center!important;transition:transform .55s ease}.zyx-product-card:hover .zyx-product-card__image{transform:scale(1.035)}.zyx-product-card__sale{position:absolute;z-index:2;top:14px;left:14px;padding:7px 11px;border-radius:999px;background:var(--blue);color:#fff;font:700 9px "Manrope",sans-serif;letter-spacing:.1em;text-transform:uppercase}.zyx-product-card__content{padding:20px 21px 22px}.zyx-product-card__category{display:block;margin-bottom:8px;overflow:hidden;color:#858697;font:700 9px "Manrope",sans-serif;letter-spacing:.16em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.zyx-product-card__mainline{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.zyx-product-card__title{margin:0;font:700 21px/1.28 "Bricolage Grotesque",sans-serif;letter-spacing:-.025em}.zyx-product-card__title a{color:var(--ink)!important;text-decoration:none!important}.zyx-product-card__price{flex:0 0 auto;color:var(--ink);font:700 17px/1.3 "Manrope",sans-serif;text-align:right}.zyx-product-card__price del{display:block;color:#999baa;font-size:11px;font-weight:500}.zyx-product-card__price ins{color:var(--blue);text-decoration:none}.zyx-product-card__button{display:flex;width:100%;min-height:43px;align-items:center;justify-content:center;gap:10px;margin-top:17px;border-radius:999px;background:var(--ink);color:#fff!important;font:700 10px "Manrope",sans-serif;letter-spacing:.1em;text-decoration:none!important;text-transform:uppercase;transition:.3s}.zyx-product-card__button:hover{background:var(--blue);color:#fff!important;transform:translateY(-2px)}
.zyx-store-loader{position:absolute;z-index:4;top:120px;left:50%;visibility:hidden;opacity:0;transform:translateX(-50%)}.zyx-store-loader.is-visible{visibility:visible;opacity:1}.zyx-store-loader span{display:block;width:45px;height:45px;border:4px solid rgba(33,92,243,.14);border-top-color:var(--blue);border-radius:50%;animation:zyxSpin .7s linear infinite}@keyframes zyxSpin{to{transform:rotate(360deg)}}.zyx-store-grid:has(.zyx-store-empty){display:block}.zyx-store-empty{display:grid;min-height:330px;place-items:center;text-align:center}.zyx-store-empty p{color:#5d6072;font:400 17px/1.6 "Manrope",sans-serif}.zyx-store-pagination{display:flex;justify-content:center;margin-top:45px}.zyx-store-pagination[hidden]{display:none!important}.zyx-store-load-more{min-width:235px;min-height:54px;padding:13px 24px;border:0;border-radius:999px;background:var(--blue);box-shadow:0 14px 32px rgba(33,92,243,.22);color:#fff;font:700 12px "Manrope",sans-serif;cursor:pointer}.zyx-store-load-more:hover{background:var(--blue2);transform:translateY(-2px)}
@media(max-width:1024px){.zyx-store-section{padding:70px 20px 90px}.zyx-store-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:21px}}
@media(max-width:767px){.zyx-store-section{padding:42px 15px 72px}.zyx-store-header{text-align:center;margin-bottom:29px}.zyx-store-header__copy{margin:auto}.zyx-store-subtitle{justify-content:center;font-size:10px}.zyx-store-title{font-size:clamp(38px,11.5vw,54px);line-height:1.02}.zyx-store-description{max-width:520px;margin:16px auto 0;font-size:14px;line-height:1.6}.zyx-store-toolbar{display:grid;grid-template-columns:1fr;gap:13px;margin-bottom:21px}.zyx-store-search{width:100%;height:51px}.zyx-store-sort select{width:100%;height:49px}.zyx-store-filters{justify-content:center;gap:8px;margin-bottom:38px}.zyx-store-filter{min-height:39px;padding:9px 17px;font-size:9px}.zyx-store-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.zyx-product-card{border-radius:13px}.zyx-product-card__media{border-radius:12px 12px 0 0}.zyx-product-card__content{padding:13px 12px 14px}.zyx-product-card__category{margin-bottom:6px;font-size:7px}.zyx-product-card__mainline{display:block}.zyx-product-card__title{min-height:42px;display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:clamp(14px,4.3vw,18px)}.zyx-product-card__price{margin-top:6px;font-size:14px;text-align:left}.zyx-product-card__price del{display:inline;margin-right:3px;font-size:9px}.zyx-product-card__button{min-height:37px;margin-top:10px;padding:8px 5px;font-size:7.5px}.zyx-product-card__sale{top:8px;left:8px;padding:5px 7px;font-size:7px}.zyx-store-pagination{margin-top:30px}.zyx-store-load-more{width:100%;max-width:320px}}
@media(max-width:390px){.zyx-store-section{padding-inline:10px}.zyx-store-grid{gap:9px}.zyx-product-card__content{padding:11px 9px 12px}.zyx-product-card__title{font-size:14px}.zyx-product-card__price{font-size:13px}}
@media(prefers-reduced-motion:reduce){.zyx-store-section *{scroll-behavior:auto!important;transition:none!important;animation-duration:.01ms!important}}

/* ==================================================
   Search Bar Icon Fix — Desktop & Mobile
================================================== */

.zyx-store-search {
    position: relative !important;
    display: flex !important;
    width: min(100%, 620px);
    height: 54px;
    align-items: center !important;
    overflow: hidden;
    border: 1px solid #dfe2e9;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 4px 16px rgba(20, 26, 66, 0.03);
}

/* Search icon */

.zyx-store-search > svg {
    position: absolute !important;
    z-index: 3;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    left: 20px !important;

    display: block !important;
    width: 21px !important;
    min-width: 21px !important;
    height: 21px !important;
    margin: 0 !important;

    fill: none !important;
    stroke: #8b90a3 !important;
    stroke-width: 2 !important;
    stroke-linecap: round;
    stroke-linejoin: round;

    pointer-events: none;
    transform: translateY(-50%) !important;
}

/* Search input */

.zyx-store-search input[type="search"] {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 58px 0 54px !important;

    color: #11101f !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1 !important;

    border: 0 !important;
    border-radius: 999px !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;

    appearance: none;
    -webkit-appearance: none;
}

/* Remove browser's native search close icon */

.zyx-store-search input[type="search"]::-webkit-search-cancel-button,
.zyx-store-search input[type="search"]::-webkit-search-decoration,
.zyx-store-search input[type="search"]::-webkit-search-results-button,
.zyx-store-search input[type="search"]::-webkit-search-results-decoration {
    display: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}

/* Custom close button */

.zyx-store-search__clear {
    position: absolute !important;
    z-index: 5;
    top: 50% !important;
    right: 10px !important;
    bottom: auto !important;
    left: auto !important;

    display: grid !important;
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    place-items: center !important;
    margin: 0 !important;
    padding: 0 0 2px !important;

    color: #5c6072 !important;
    font-family: Arial, sans-serif !important;
    font-size: 19px !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    cursor: pointer;
    border: 0 !important;
    border-radius: 50% !important;
    outline: 0;
    background: #f0f1f6 !important;
    box-shadow: none !important;

    transform: translateY(-50%) !important;
    transition:
        color 0.25s ease,
        background-color 0.25s ease,
        transform 0.25s ease !important;
}

.zyx-store-search__clear:hover {
    color: #ffffff !important;
    background: #215cf3 !important;
    transform: translateY(-50%) scale(1.05) !important;
}

/* Keep the button hidden when no search text exists */

.zyx-store-search__clear[hidden] {
    display: none !important;
}

/* Focus state on the complete search container */

.zyx-store-search:focus-within {
    border-color: rgba(33, 92, 243, 0.5);
    box-shadow: 0 0 0 4px rgba(33, 92, 243, 0.09);
}

/* Mobile adjustments */

@media (max-width: 767px) {
    .zyx-store-search {
        width: 100% !important;
        height: 51px;
    }

    .zyx-store-search > svg {
        left: 17px !important;
        width: 19px !important;
        min-width: 19px !important;
        height: 19px !important;
    }

    .zyx-store-search input[type="search"] {
        padding-right: 53px !important;
        padding-left: 48px !important;
        font-size: 14px !important;
    }

    .zyx-store-search__clear {
        right: 8px !important;
        width: 33px !important;
        min-width: 33px !important;
        height: 33px !important;
        min-height: 33px !important;
        font-size: 18px !important;
    }
}
/* =========================================================
   ZYTHEX STORE — BRANDED FILTER BUTTONS
========================================================= */

/* Active category */
.zyx-store-filter.is-active {
    color: #ffffff !important;

    background: linear-gradient(
        135deg,
        #126CF4 0%,
        #0757D5 100%
    ) !important;

    border-color: #126CF4 !important;

    box-shadow:
        0 8px 22px rgba(18, 108, 244, 0.22) !important;
}


/* Normal category buttons */
.zyx-store-filter {
    color: #30384A !important;

    background: #F4F7FB !important;

    border: 1px solid rgba(18, 108, 244, 0.08) !important;

    transition:
        background .25s ease,
        color .25s ease,
        border-color .25s ease,
        box-shadow .25s ease,
        transform .25s ease !important;
}


/* Hover */
.zyx-store-filter:hover {
    color: #126CF4 !important;

    background: #F1F6FF !important;

    border-color: rgba(18, 108, 244, 0.25) !important;

    box-shadow:
        0 6px 18px rgba(18, 108, 244, 0.10) !important;

    transform: translateY(-1px);
}


/* Active hover */
.zyx-store-filter.is-active:hover {
    color: #ffffff !important;

    background: linear-gradient(
        135deg,
        #126CF4 0%,
        #0757D5 100%
    ) !important;

    border-color: #126CF4 !important;

    box-shadow:
        0 10px 25px rgba(18, 108, 244, 0.27) !important;
}/* End custom CSS */