/* ========================================================
   VEGA MOBILE TRACK ORDER DRAWER
   ======================================================== */

.vega-track-drawer {
    display: none;
}


@media (max-width: 767px) {

    body.vega-track-drawer-open {
        overflow: hidden !important;
        touch-action: none;
    }


    .vega-track-drawer {
        display: block;

        position: fixed;
        z-index: 100050;

        inset: 0;

        pointer-events: none;
    }


    .vega-track-drawer[hidden] {
        display: none !important;
    }


    .vega-track-drawer__backdrop {
        position: absolute;

        inset: 0;

        width: 100%;
        height: 100%;

        margin: 0;
        padding: 0;

        border: 0;

        background:
            rgba(11, 16, 12, .54);

        opacity: 0;

        backdrop-filter:
            blur(2px);

        -webkit-backdrop-filter:
            blur(2px);

        transition:
            opacity .25s ease;
    }


    .vega-track-drawer__panel {
        position: absolute;

        top: 0;
        right: 0;
        bottom: 0;

        display: flex;
        flex-direction: column;

        width: min(
            92vw,
            430px
        );

        max-width: 100%;

        background:
            #f7f9f6;

        box-shadow:
            -22px 0 60px
            rgba(12, 18, 13, .18);

        transform:
            translateX(102%);

        transition:
            transform .28s
            cubic-bezier(
                .2,
                .75,
                .25,
                1
            );

        overflow: hidden;
    }


    .vega-track-drawer.is-open {
        pointer-events: auto;
    }


    .vega-track-drawer.is-open
    .vega-track-drawer__backdrop {
        opacity: 1;
    }


    .vega-track-drawer.is-open
    .vega-track-drawer__panel {
        transform:
            translateX(0);
    }


    /* HEADER */

    .vega-track-drawer__header {
        flex: 0 0 auto;

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

        min-height: 76px;

        padding:
            12px 14px 12px 16px;

        border-bottom:
            1px solid #e2e6df;

        background:
            rgba(255,255,255,.96);
    }


    .vega-track-drawer__heading {
        display: flex;
        align-items: center;

        min-width: 0;

        gap: 11px;
    }


    .vega-track-drawer__heading > div {
        min-width: 0;
    }


    .vega-track-drawer__icon {
        display: grid;
        place-items: center;

        flex: 0 0 42px;

        width: 42px;
        height: 42px;

        border-radius: 13px;

        background:
            #edf3eb;

        color:
            #263226;
    }


    .vega-track-drawer__icon svg {
        width: 22px;
        height: 22px;
    }


    .vega-track-drawer__heading small {
        display: block;

        margin-bottom: 2px;

        color:
            #929a8f;

        font-size: 7px;
        font-weight: 900;

        letter-spacing:
            .11em;
    }


    .vega-track-drawer__heading strong {
        display: block;

        color:
            #1d271e;

        font-size: 15px;
        font-weight: 900;

        line-height: 1.15;
    }


    .vega-track-drawer__close {
        display: grid;
        place-items: center;

        flex: 0 0 38px;

        width: 38px;
        height: 38px;

        padding: 0;

        border:
            1px solid #e1e5df;

        border-radius: 12px;

        background:
            #fff;

        color:
            #596158;

        font-size: 25px;
        font-weight: 300;

        line-height: 1;
    }


    /* BODY */

    .vega-track-drawer__body {
        flex: 1 1 auto;

        min-height: 0;

        overflow-y: auto;
        overscroll-behavior: contain;

        padding:
            20px 16px
            calc(
                100px
                + env(
                    safe-area-inset-bottom
                )
            );
    }


    .vega-track-drawer__intro {
        margin-bottom:
            18px;
    }


    .vega-track-drawer__eyebrow {
        display: inline-flex;

        margin-bottom: 7px;

        padding:
            5px 8px;

        border-radius:
            999px;

        background:
            #edf3eb;

        color:
            #60705f;

        font-size: 7px;
        font-weight: 900;

        letter-spacing:
            .1em;
    }


    .vega-track-drawer__intro h2 {
        margin:
            0 0 7px !important;

        color:
            #172018;

        font-size:
            27px !important;

        line-height:
            1.04 !important;

        letter-spacing:
            -.045em;
    }


    .vega-track-drawer__intro p {
        max-width:
            34em;

        margin: 0;

        color:
            #778075;

        font-size:
            10px;

        line-height:
            1.65;
    }


    /* FORM CARD */

    .vega-track-drawer__form {
        padding:
            16px;

        border:
            1px solid #e1e6df;

        border-radius:
            17px;

        background:
            #fff;

        box-shadow:
            0 12px 34px
            rgba(
                26,
                34,
                25,
                .055
            );
    }


    .vega-track-drawer__field {
        margin-bottom:
            14px;
    }


    .vega-track-drawer__field label {
        display: block;

        margin-bottom:
            6px;

        color:
            #354034;

        font-size:
            9px;

        font-weight:
            850;
    }


    .vega-track-drawer__input {
        display: grid;

        grid-template-columns:
            38px minmax(0,1fr);

        align-items: center;

        min-height:
            50px;

        border:
            1px solid #dce2d9;

        border-radius:
            12px;

        background:
            #fafbf9;

        overflow: hidden;

        transition:
            border-color .2s ease,
            box-shadow .2s ease,
            background .2s ease;
    }


    .vega-track-drawer__input:focus-within {
        border-color:
            #536451;

        background:
            #fff;

        box-shadow:
            0 0 0 3px
            rgba(
                57,
                73,
                56,
                .07
            );
    }


    .vega-track-drawer__input > span {
        display: grid;
        place-items: center;

        height: 100%;

        border-right:
            1px solid #e7eae5;

        color:
            #7a8378;

        font-size:
            12px;

        font-weight:
            900;
    }


    .vega-track-drawer__input input {
        width: 100% !important;
        min-width: 0;
        min-height: 48px !important;

        margin: 0 !important;
        padding:
            8px 11px !important;

        border:
            0 !important;

        border-radius:
            0 !important;

        outline:
            none !important;

        background:
            transparent !important;

        box-shadow:
            none !important;

        color:
            #202920 !important;

        font-size:
            11px !important;
    }


    .vega-track-drawer__hint {
        display: block;

        margin-top:
            6px;

        color:
            #969d94;

        font-size:
            7.5px;

        line-height:
            1.45;
    }


    .vega-track-drawer__submit {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 100%;

        min-height:
            49px;

        margin-top:
            4px;

        gap:
            8px;

        border: 0;
        border-radius:
            12px;

        background:
            #222d22;

        color:
            #fff;

        font-size:
            10px;

        font-weight:
            900;

        box-shadow:
            0 9px 20px
            rgba(
                27,
                39,
                27,
                .16
            );
    }


    .vega-track-drawer__submit svg {
        width: 16px;
        height: 16px;
    }


    .vega-track-drawer__submit:disabled {
        cursor:
            wait;

        opacity:
            .72;
    }


    .vega-track-drawer__form.is-loading
    .vega-track-drawer__submit svg {
        animation:
            vegaTrackPulse
            .75s ease
            infinite alternate;
    }


    @keyframes vegaTrackPulse {
        to {
            transform:
                translateX(4px);
        }
    }


    /* ERROR / NOTICE */

    .vega-track-drawer__notice {
        margin-top:
            12px;

        padding:
            11px 12px;

        border-radius:
            11px;

        font-size:
            9px;

        line-height:
            1.5;
    }


    .vega-track-drawer__notice.is-error {
        border:
            1px solid #f1d3cf;

        background:
            #fff5f3;

        color:
            #99493f;
    }


    /* LIVE RESULT */

    .vega-track-drawer__result {
        margin-top:
            14px;

        scroll-margin-top:
            15px;
    }


    /*
     * Keep existing premium tracking renderer
     * usable inside the narrow drawer.
     */
    .vega-track-drawer__result
    .vega-live-track,

    .vega-track-drawer__result
    .vega-track-v2,

    .vega-track-drawer__result
    .vega-tracking-result {

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin:
            0 !important;

        overflow:
            hidden;
    }


    .vega-track-drawer__result * {
        max-width:
            100%;

        box-sizing:
            border-box;
    }


    .vega-track-drawer__fallback {
        display: flex;
        flex-direction: column;

        padding:
            16px;

        border:
            1px solid #e1e6df;

        border-radius:
            15px;

        background:
            #fff;
    }


    .vega-track-drawer__fallback small {
        color:
            #899187;

        font-size:
            8px;

        font-weight:
            850;
    }


    .vega-track-drawer__fallback strong {
        margin-top:
            4px;

        color:
            #1c271c;

        font-size:
            20px;
    }


    .vega-track-drawer__fallback p {
        margin:
            8px 0 0;

        color:
            #777f75;

        font-size:
            9px;

        line-height:
            1.55;
    }


    /* TRUST */

    .vega-track-drawer__trust {
        display: grid;

        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );

        gap:
            8px;

        margin-top:
            14px;
    }


    .vega-track-drawer__trust > div {
        display: flex;
        align-items: center;

        min-width: 0;

        gap:
            8px;

        padding:
            10px;

        border:
            1px solid #e3e7e1;

        border-radius:
            12px;

        background:
            rgba(
                255,
                255,
                255,
                .75
            );
    }


    .vega-track-drawer__trust
    > div > span {
        display: grid;
        place-items: center;

        flex:
            0 0 28px;

        width:
            28px;
        height:
            28px;

        border-radius:
            9px;

        background:
            #edf3eb;

        color:
            #4f6350;

        font-size:
            11px;

        font-weight:
            900;
    }


    .vega-track-drawer__trust p {
        min-width: 0;

        margin:
            0;
    }


    .vega-track-drawer__trust strong {
        display: block;

        color:
            #374037;

        font-size:
            8px;
    }


    .vega-track-drawer__trust small {
        display: block;

        margin-top:
            2px;

        color:
            #929990;

        font-size:
            6.8px;

        line-height:
            1.3;
    }


    .vega-track-drawer__full-link {
        display: block;

        margin-top:
            15px;

        color:
            #646d62 !important;

        font-size:
            8px;

        font-weight:
            800;

        text-align:
            center;

        text-decoration:
            none !important;
    }


    /* BOTTOM NAV ICON */

    .vega-mobile-dock__item[
        data-vega-nav-type="track-order"
    ]
    .vega-nav-icon-svg--track {

        width:
            23px !important;

        height:
            23px !important;

        fill:
            none !important;
    }


    .vega-mobile-dock__item[
        data-vega-nav-type="track-order"
    ]
    small {
        font-size:
            8.5px !important;
    }

}


/* Extra-small phones */

@media (max-width: 380px) {

    .vega-track-drawer__panel {
        width:
            95vw;
    }


    .vega-track-drawer__body {
        padding-left:
            13px;

        padding-right:
            13px;
    }


    .vega-track-drawer__intro h2 {
        font-size:
            25px !important;
    }
}



/* ========================================================
   TRACK DRAWER — HEADER OVERLAP FIX
   Keep complete tracking drawer above site/header/nav UI.
   ======================================================== */

@media (max-width: 767px) {

    body.vega-track-drawer-open
    .vega-track-drawer {
        position: fixed !important;
        inset: 0 !important;

        z-index: 2147483000 !important;

        isolation: isolate;
    }


    body.vega-track-drawer-open
    .vega-track-drawer__backdrop {
        z-index: 1 !important;
    }


    body.vega-track-drawer-open
    .vega-track-drawer__panel {
        z-index: 2 !important;

        isolation: isolate;
    }


    /*
     * Drawer header always stays visible while
     * tracking result/body scrolls underneath.
     */
    body.vega-track-drawer-open
    .vega-track-drawer__header {
        position: sticky !important;

        top: 0 !important;

        z-index: 20 !important;

        flex-shrink: 0;

        background: rgba(255,255,255,.98) !important;

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

        box-shadow:
            0 1px 0 rgba(25,35,25,.07);
    }


    /*
     * Prevent theme's sticky header / search / mobile
     * nav layers from competing with opened drawer.
     */
    body.vega-track-drawer-open
    :is(
        .vega-header,
        .vega-site-header,
        .vega-v27-header,
        .vega-v28-header,
        .vega-el-header-pro,
        .elementor-location-header,
        #masthead,
        .site-header
    ) {
        z-index: 1000 !important;
    }


    /*
     * Bottom navigation must remain underneath drawer.
     */
    body.vega-track-drawer-open
    .vega-mobile-dock {
        z-index: 999 !important;
    }

}