/* =========================================================
   FLEXPRESS PRODUCTS MEGA DROPDOWN
   Scoped to .fx-products-dd only
   ========================================================= */

/* Center mega dropdown under Products */

.fx-topbar {
    position: sticky;
    top: 0;
    z-index: 1080;
    /* Frosted glass effect */
    background: rgba(255,255,255,0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    /* Subtle separation */
    border-bottom: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 4px 16px rgba(0,0,0,0.06);
}

.fx-products-dd {
    position: relative;
}

    .fx-products-dd > .dropdown-menu.fx-products-mega {
        width: min(980px, calc(100vw - 2rem));
        border-radius: 14px;
        overflow: hidden;
        margin-top: 10px;
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%);
    }

        /* Do not let any end aligned dropdown rule override this menu */
        .fx-products-dd > .dropdown-menu.fx-products-mega.dropdown-menu-end {
            right: auto !important;
        }

    /* Base wrapper */
    .fx-products-dd .fx-mega {
        background: #fff;
    }

    /* Hide radios only inside this dropdown */
    .fx-products-dd .fx-tab {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    /* Left pane */
    .fx-products-dd .fx-left {
        background: transparent;
        border-right: 1px solid rgba(0,0,0,.08);
    }

    .fx-products-dd .fx-left-inner {
        padding: 12px;
    }

    /* Category rows */
    .fx-products-dd .fx-cat {
        width: 100%;
        border: 0;
        border-radius: 10px;
        padding: 10px 12px;
        margin-bottom: 6px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        cursor: pointer;
        color: inherit;
        background: transparent;
    }

        .fx-products-dd .fx-cat:hover {
            background: rgba(0,0,0,.05);
        }

    /* Right pane scroll */
    .fx-products-dd .fx-right-inner {
        max-height: 520px;
        overflow-y: auto;
        overflow-x: hidden;
    }

    /* Panels hidden by default */
    .fx-products-dd .fx-panel {
        display: none;
    }

    /* Show correct panel based on checked radio, scoped */
    .fx-products-dd #fxCatBooks:checked ~ .row .fx-right .fx-panel[data-panel="fxCatBooks"] {
        display: block;
    }

    .fx-products-dd #fxCatCards:checked ~ .row .fx-right .fx-panel[data-panel="fxCatCards"] {
        display: block;
    }

    .fx-products-dd #fxCatFlyers:checked ~ .row .fx-right .fx-panel[data-panel="fxCatFlyers"] {
        display: block;
    }

    .fx-products-dd #fxCatFolders:checked ~ .row .fx-right .fx-panel[data-panel="fxCatFolders"] {
        display: block;
    }

    .fx-products-dd #fxCatMisc:checked ~ .row .fx-right .fx-panel[data-panel="fxCatMisc"] {
        display: block;
    }

    .fx-products-dd #fxCatSeasonal:checked ~ .row .fx-right .fx-panel[data-panel="fxCatSeasonal"] {
        display: block;
    }

    /* Active highlight on the left */
    .fx-products-dd #fxCatBooks:checked ~ .row .fx-left label[for="fxCatBooks"],
    .fx-products-dd #fxCatCards:checked ~ .row .fx-left label[for="fxCatCards"],
    .fx-products-dd #fxCatFlyers:checked ~ .row .fx-left label[for="fxCatFlyers"],
    .fx-products-dd #fxCatFolders:checked ~ .row .fx-left label[for="fxCatFolders"],
    .fx-products-dd #fxCatMisc:checked ~ .row .fx-left label[for="fxCatMisc"],
    .fx-products-dd #fxCatSeasonal:checked ~ .row .fx-left label[for="fxCatSeasonal"] {
        background: rgba(0,0,0,.08);
        color: inherit;
    }

    /* Product tiles */
    .fx-products-dd .fx-prod {
        display: block;
        text-decoration: none;
        color: inherit;
    }

    .fx-products-dd .fx-thumb {
        width: 100%;
        aspect-ratio: 4 / 3;
        border-radius: 12px;
        overflow: hidden;
        background: #f2f3f5;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .fx-products-dd .fx-thumb img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

    .fx-products-dd .fx-thumb-empty i {
        font-size: 1.6rem;
        color: #adb5bd;
    }

    .fx-products-dd .fx-name {
        margin-top: 8px;
        font-size: .9rem;
        font-weight: 600;
    }

/* Small screens */
@media (max-width: 991.98px) {
    .fx-products-dd > .dropdown-menu.fx-products-mega {
        width: calc(100vw - 1rem);
    }

    .fx-products-dd .fx-left {
        border-right: 0;
        border-bottom: 1px solid rgba(0,0,0,.08);
    }
}


/*cart - right pane*/
/* Scope everything to this drawer only */
.fx-cart-drawer {
    width: min(420px, 92vw);
    z-index: 999999999999;
}

    /* Smooth slide in from right with ease */
    .fx-cart-drawer.offcanvas-end {
        transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
    }

/* Optional: nicer backdrop feel */
.offcanvas-backdrop.show {
    opacity: 0.35;
}

/* Optional: empty icon style */
.fx-cart-empty-icon {
    font-size: 56px;
    line-height: 1;
    opacity: 0.55;
}


.fx-cat {
    width: 100%;
    text-align: left;
    background: transparent;
    border: 0;
    padding: 12px 14px;
}

    .fx-cat.active {
        font-weight: 600;
    }