/*
 * Matsnakk.no – Phase 3S kort-scene/panel for /grill
 * Avgrenset visuell test: legger kortlisten og pagineringen under /grill-hero på et kontrollert lyst panel.
 * Rører ikke router, Update Terminal, database, oppskriftssider eller header/footer.
 */

:root {
    --mn-3s-stage-panel-width: 1248px;
    --mn-3s-stage-inner-width: 1180px;
    --mn-3s-stage-bg-top: #fffdf7;
    --mn-3s-stage-bg-bottom: #fff8ee;
    --mn-3s-stage-border: rgba(176, 137, 90, .36);
    --mn-3s-stage-shadow: 0 30px 78px rgba(48, 32, 20, .18), 0 2px 0 rgba(255, 255, 255, .82) inset;
    --mn-3s-stage-card-shadow: 0 14px 34px rgba(55, 36, 22, .10);
}

.mn-main[data-route="/grill"] .mn-v22-content-shell,
.mn-main[data-route="/grill/"] .mn-v22-content-shell {
    width: min(calc(100% - 2rem), var(--mn-3s-stage-panel-width)) !important;
    max-width: var(--mn-3s-stage-panel-width) !important;
    margin: 1.35rem auto 4.75rem !important;
    padding: clamp(1.05rem, 1.7vw, 1.65rem) !important;
    box-sizing: border-box !important;
    border-radius: clamp(1.35rem, 2.15vw, 2rem) !important;
    border: 1px solid var(--mn-3s-stage-border) !important;
    background:
        radial-gradient(circle at 8% 0%, rgba(255, 255, 255, .88), transparent 28rem),
        linear-gradient(180deg, var(--mn-3s-stage-bg-top) 0%, var(--mn-3s-stage-bg-bottom) 100%) !important;
    box-shadow: var(--mn-3s-stage-shadow) !important;
    overflow: visible !important;
}

.mn-main[data-route="/grill"] .mn-v22-content-shell .mn-v22-content-grid,
.mn-main[data-route="/grill/"] .mn-v22-content-shell .mn-v22-content-grid {
    width: 100% !important;
    max-width: var(--mn-3s-stage-inner-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.mn-main[data-route="/grill"] .mn-v22-content-shell .mn-v22-content-card,
.mn-main[data-route="/grill/"] .mn-v22-content-shell .mn-v22-content-card {
    border: 1px solid rgba(92, 61, 38, .10) !important;
    box-shadow: var(--mn-3s-stage-card-shadow) !important;
    background: rgba(255, 252, 246, .99) !important;
}

.mn-main[data-route="/grill"] .mn-v22-content-shell .mn-v22-content-card__body,
.mn-main[data-route="/grill/"] .mn-v22-content-shell .mn-v22-content-card__body {
    background: linear-gradient(180deg, rgba(255, 252, 246, 1), rgba(255, 248, 236, .98)) !important;
}

.mn-main[data-route="/grill"] .mn-v22-content-shell .mn-pagination,
.mn-main[data-route="/grill/"] .mn-v22-content-shell .mn-pagination,
.mn-main[data-route="/grill"] .mn-v22-content-shell .mn-phase3s-grill-pagination,
.mn-main[data-route="/grill/"] .mn-v22-content-shell .mn-phase3s-grill-pagination {
    width: 100% !important;
    max-width: var(--mn-3s-stage-inner-width) !important;
    margin: 1.75rem auto .15rem !important;
}

@media (max-width: 760px) {
    .mn-main[data-route="/grill"] .mn-v22-content-shell,
    .mn-main[data-route="/grill/"] .mn-v22-content-shell {
        width: min(calc(100% - 1rem), var(--mn-3s-stage-panel-width)) !important;
        padding: .8rem !important;
        border-radius: 1.35rem !important;
        margin-top: 1rem !important;
    }
}