/* NG08 Step 35.2.2 — Geometric Mega Menu Refinement */

/* Overall mega-menu proportion */
.mega-menu .mega-shell.products-showcase{
    align-items:stretch;
}

.mega-menu .products-lead{
    min-height:0 !important;
    padding-top:28px !important;
    padding-bottom:28px !important;
}

.mega-menu .products-index.ng-dynamic-category-index{
    align-content:center;
    align-items:stretch;
    gap:12px !important;
    padding:18px !important;
}

/* Five-category state: one precise architectural row */
.products-index.ng-count-5{
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
}

/* Cards: same geometry, same vertical rhythm */
.ng-category-mega-card{
    min-height:176px !important;
    border-radius:14px;
    border:1px solid rgba(255,255,255,.045);
    background:rgba(255,255,255,.025);
}

.ng-category-mega-card__body{
    min-height:176px !important;
    padding:18px 16px !important;
    justify-content:flex-end;
}

.ng-category-mega-card strong{
    max-width:13ch;
    text-wrap:balance;
}

/* Remove badge-style primary treatment */
.ng-category-mega-card.is-primary::after{
    display:none !important;
}

/* Primary becomes a subtle architectural emphasis */
.ng-category-mega-card.is-primary{
    border-color:rgba(183,213,50,.42) !important;
    background:
        linear-gradient(
            180deg,
            rgba(183,213,50,.055),
            rgba(255,255,255,.02)
        ) !important;
    box-shadow:inset 0 0 0 1px rgba(183,213,50,.045);
}

.ng-category-mega-card.is-primary .ng-category-mega-card__number,
.ng-category-mega-card.is-primary .ng-category-mega-card__arrow{
    color:#B7D532;
}

/* When an image exists, keep same tonal architecture */
.ng-category-mega-card__media::after{
    background:
        linear-gradient(
            180deg,
            rgba(11,32,26,.10) 0%,
            rgba(11,32,26,.68) 100%
        );
}

/* Tighten lead-panel vertical rhythm */
.mega-menu .products-lead h3{
    margin-bottom:16px !important;
}

.mega-menu .products-lead p{
    margin-bottom:16px !important;
}

.mega-menu .products-feature-list{
    gap:7px !important;
}

.mega-menu .mega-all{
    margin-top:18px !important;
}

/*
 * Remove excessive dead space below the category row.
 * Existing mega shell keeps the original width, only vertical space is normalized.
 */
.mega-menu .products-showcase{
    min-height:0 !important;
}

.mega-menu .products-index{
    min-height:0 !important;
}

/* Laptop refinement */
@media(max-width:1180px) and (min-width:821px){
    .mega-menu .products-index.ng-dynamic-category-index{
        padding:14px !important;
        gap:10px !important;
    }

    .ng-category-mega-card,
    .ng-category-mega-card__body{
        min-height:154px !important;
    }

    .ng-category-mega-card__body{
        padding:15px 13px !important;
    }
}

/* Mobile/tablet keeps functionality and readable spacing */
@media(max-width:820px){
    .mega-menu .products-index.ng-dynamic-category-index{
        align-content:start;
        padding:12px !important;
    }

    .ng-category-mega-card,
    .ng-category-mega-card__body{
        min-height:138px !important;
    }
}
