/*
 * ZS-6N-B1
 * Header completeness repair.
 *
 * This layer intentionally sits above ZS-6N-A2.
 */


/* ---------------------------------------------------------
 * Account / access icon
 *
 * A2 used the runtime class lg:inline-grid, but that
 * generated utility is not present in the compiled CSS.
 * Visibility is now controlled here instead.
 * --------------------------------------------------------- */

html.zenda-ia-ready .zenda-access-trigger {
    display: grid !important;
}


/* ---------------------------------------------------------
 * Access cards
 * --------------------------------------------------------- */

html.zenda-ia-ready
.zenda-access-grid
> .mega-item {
    grid-column: auto !important;
    width: 100% !important;
    min-width: 0;
}


/* ---------------------------------------------------------
 * Complete Products catalog
 * --------------------------------------------------------- */

html.zenda-ia-ready
.zenda-products-panel
.mega-panel {
    width: min(820px, 94vw) !important;
    max-height: min(670px, calc(100vh - 96px));
    overflow-y: auto;
}

html.zenda-ia-ready
.zenda-products-grid {
    grid-template-columns:
        repeat(3, minmax(0, 1fr))
        !important;
}

html.zenda-ia-ready
.zenda-products-grid
.zenda-coming-soon {
    opacity: .72;
    cursor: default;
}

html.zenda-ia-ready
.zenda-products-grid
.zenda-coming-soon:hover {
    transform: none;
}


/* ---------------------------------------------------------
 * Corporate Services
 * --------------------------------------------------------- */

html.zenda-ia-ready
.zenda-services-panel
.mega-panel {
    width: min(790px, 94vw) !important;
}

html.zenda-ia-ready
.zenda-services-grid {
    grid-template-columns:
        repeat(3, minmax(0, 1fr))
        !important;
}


/* ---------------------------------------------------------
 * Responsive
 * --------------------------------------------------------- */

@media (max-width: 1180px) {

    html.zenda-ia-ready
    .zenda-products-grid,

    html.zenda-ia-ready
    .zenda-services-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;
    }

}


@media (max-width: 1023px) {

    html.zenda-ia-ready
    .zenda-access-wrap {
        display: none !important;
    }

}


@media (max-width: 640px) {

    html.zenda-ia-ready
    .zenda-products-grid,

    html.zenda-ia-ready
    .zenda-services-grid,

    html.zenda-ia-ready
    .zenda-access-grid {
        grid-template-columns:
            1fr
            !important;
    }

}