.sia-shell:has(.food-main) > .sia-sidebar { background: linear-gradient(160deg, #194c3f, #0d3532 72%, #0b302e); }
.sia-shell:has(.food-main) .sia-nav a.active { border-left: 3px solid #d3a532; background: rgba(255,255,255,.13); color: #fff; }
.sia-shell:has(.food-main) .sia-nav a:hover { background: rgba(255,255,255,.1); }
.sia-shell:has(.food-main) .national-public-nav a.data-domain-menu-link { gap: 10px; min-height: 34px; padding: 8px 9px; }
.sia-shell:has(.food-main) .national-public-nav .sia-nav-icon,
.sia-shell:has(.food-main) .national-public-nav a.data-domain-menu-link:hover .sia-nav-icon,
.sia-shell:has(.food-main) .national-public-nav a.data-domain-menu-link.active .sia-nav-icon { flex: 0 0 18px; width: 18px; height: 18px; border-radius: 0; background: transparent; box-shadow: none; color: inherit; }
.sia-shell:has(.food-main) .national-public-nav .sia-nav-icon svg { width: 15px; height: 15px; }
.sia-shell:has(.food-main) .national-public-nav .sia-nav-text small { display: none; }
.food-main { color: #203d38; }
.food-main .food-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 155px; margin: -4px 0 14px!important; padding: 22px 28px!important; overflow: hidden; border: 1px solid #dae5dd; border-radius: 7px; background: linear-gradient(90deg,#fbfdfa 0%,rgba(251,253,250,.98) 28%,rgba(251,253,250,.84) 51%,rgba(251,253,250,.14) 82%),url('img/food-security-hero.png') right center / cover no-repeat!important; }
.food-main .food-hero > div { max-width: 680px; }
.food-main .food-hero > div > span { color: #a07822; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.food-main .food-hero h1 { margin: 5px 0!important; color: #153c35; font-size: clamp(28px,2.7vw,39px)!important; font-weight: 550; letter-spacing: -.035em; }
.food-main .food-hero p { margin: 0; color: #49645c; font-size: 14px; line-height: 1.5; }
.food-hero-actions { display: flex; align-self: flex-end; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.food-hero-actions a { padding: 9px 11px; border: 1px solid #d0dfd5; border-radius: 5px; background: rgba(255,255,255,.92); color: #174d3e; font-size: 12px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.food-hero-actions a:first-child { border-color: #155944; background: #155944; color: #fff; }
.food-hero-actions a:hover { border-color: #b88a25; }
.food-main .food-kpis { display: grid!important; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 11px; margin: 0 0 13px; }
.food-main .food-kpis article { display: flex; align-items: center; gap: 13px; min-width: 0; min-height: 96px; padding: 14px; border: 1px solid #dce6df; border-radius: 7px; background: #fff; box-shadow: 0 4px 15px rgba(26,64,48,.05); }
.food-kpi-icon { display: grid; flex: 0 0 54px; width: 54px; height: 54px; place-items: center; border: 1px solid rgba(23,80,56,.08); border-radius: 12px; background: #e9f4ed; color: #1a684a; }
.food-kpis article:nth-child(2) .food-kpi-icon { background: #eef3e4; color: #627b2a; }
.food-kpis article:nth-child(3) .food-kpi-icon { background: #fff0e1; color: #b56724; }
.food-kpis article:nth-child(4) .food-kpi-icon { background: #edf2f8; color: #41638a; }
.food-kpi-icon svg { width: 32px; height: 32px; }
.food-kpis article > div { min-width: 0; }
.food-kpis article > div > span,.food-kpis article > div > strong,.food-kpis article > div > small { display: block; }
.food-kpis article > div > span { color: #45635a; font-size: 12px; font-weight: 600; }
.food-kpis article > div > strong { margin: 2px 0; color: #123b32; font-size: clamp(19px,1.7vw,27px); font-weight: 600; line-height: 1.2; }
.food-kpis article > div > small { color: #788b82; font-size: 11px; }
.food-main .public-domain-workspace { display: block!important; margin: 0; }
.food-main .public-domain-panels { display: grid; grid-template-columns: minmax(0,1.7fr) minmax(320px,.9fr); gap: 13px; min-width: 0; }
.food-main .public-domain-panels > .sia-card { min-width: 0; overflow: hidden; border: 1px solid #dce6df; border-radius: 7px; background: #fff; box-shadow: 0 5px 18px rgba(24,58,47,.055); }
.food-main .public-domain-panels .sia-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 70px; padding: 14px 18px; border-bottom: 1px solid #e6eee8; }
.food-main .public-domain-panels .sia-card-head h2 { margin: 0; color: #193d34; font-size: 19px; font-weight: 600; letter-spacing: -.015em; }
.food-main .public-domain-panels .sia-card-head p { margin: 3px 0 0; color: #657e71; font-size: 12px; line-height: 1.4; }
.food-main .data-source-badge { flex: 0 0 auto; color: #1c6a4e; font-size: 11px; }
.food-main .excel-download-action { flex: 0 0 auto; font-size: 12px; }
.food-map-stage { position: relative; min-width: 0; }
.food-main .cnsa-ipc-map { height: 520px; min-height: 520px; background: #a9d8ed; }
.food-main .cnsa-ipc-legend { position: absolute; bottom: 17px; left: 17px; z-index: 650; display: grid; grid-template-columns: 1fr; gap: 6px; width: 165px; padding: 12px; border: 1px solid #dbe6de; border-radius: 6px; background: rgba(255,255,255,.96); box-shadow: 0 7px 20px rgba(23,55,48,.15); }
.food-main .cnsa-ipc-legend > strong { color: #1e3e34; font-size: 12px; }
.food-main .cnsa-ipc-legend > span { display: flex; align-items: center; gap: 7px; padding: 0; color: #405950; font-size: 11px; }
.food-main .cnsa-ipc-legend i { flex: 0 0 13px; width: 13px; height: 13px; background: var(--phase-color); }
.food-map-stage:has(.source-error) .cnsa-ipc-legend { display: none; }
.food-main .cnsa-ipc-summary { display: flex; flex-direction: column; }
.food-main .cnsa-ipc-summary-grid { display: grid; grid-template-columns: 1fr; }
.food-main .cnsa-ipc-summary-grid section { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 2px 8px; padding: 13px 18px; border-right: 0; border-bottom: 1px solid #edf1ed; }
.food-main .cnsa-ipc-summary-grid section > span { color: #45635a; font-size: 12px; font-weight: 600; }
.food-main .cnsa-ipc-summary-grid section > strong { grid-column: 2; grid-row: 1 / 3; align-self: center; color: #173d32; font-size: 23px; font-weight: 600; white-space: nowrap; }
.food-main .cnsa-ipc-summary-grid section > small { color: #788b82; font-size: 11px; }
.food-phase-breakdown { padding: 14px 18px; }
.food-phase-breakdown h3 { margin: 0 0 12px; color: #1c3f35; font-size: 14px; font-weight: 650; }
.food-phase-row { margin: 0 0 10px; }
.food-phase-row > div { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 4px; color: #486158; font-size: 11px; }
.food-phase-row strong { font-weight: 600; text-align: right; }
.food-phase-track { display: block; height: 8px; overflow: hidden; border-radius: 99px; background: #edf1ed; }
.food-phase-track i { display: block; width: var(--phase-width); height: 100%; min-width: 2px; border-radius: inherit; background: var(--phase-color); }
.food-main .cnsa-ipc-method-note { margin-top: auto; padding: 13px 18px; background: #f7faf7; color: #62776b; font-size: 11px; line-height: 1.5; }
.food-main .cnsa-ipc-table-card,.food-main .cnsa-ipc-alert-status,.food-main .food-unavailable,.food-explore { grid-column: 1 / -1; }
.food-main .cnsa-ipc-table-wrap { max-height: 360px; }
.food-main .cnsa-ipc-table-wrap th { background: #f1f6f1; color: #385a4c; font-size: 12px; font-weight: 600; }
.food-main .cnsa-ipc-table-wrap td { color: #344f44; font-size: 12px; }
.food-main .cnsa-ipc-table-wrap tbody tr:hover { background: #f7faf7; }
.food-main .cnsa-ipc-alert-status > div:last-child { padding: 15px 18px; background: #fffbf1; }
.food-main .cnsa-ipc-alert-status strong { color: #825c13; font-size: 13px; }
.food-main .cnsa-ipc-alert-status p { color: #6f705a; font-size: 12px; }
.food-main .food-unavailable { padding: 24px; }
.food-explore { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 11px; }
.food-explore a { display: flex; flex-direction: column; min-height: 130px; padding: 17px; border: 1px solid #dce6df; border-radius: 7px; background: #fff; box-shadow: 0 4px 13px rgba(24,58,47,.04); color: #173d32; text-decoration: none; }
.food-explore a:hover { border-color: #b7ceb9; background: #f8fbf8; }
.food-explore a > span { color: #b48625; font-size: 11px; letter-spacing: .09em; }
.food-explore a > strong { margin: 6px 0; font-size: 16px; }
.food-explore a > small { color: #677f71; font-size: 12px; line-height: 1.4; }
.food-explore a > em { margin-top: auto; padding-top: 11px; color: #1b704f; font-size: 12px; font-style: normal; font-weight: 600; }
@media (max-width: 1170px) { .food-main .public-domain-panels { grid-template-columns: 1fr; } .food-main .cnsa-ipc-map { height: 460px; min-height: 460px; } }
@media (max-width: 850px) { .food-main .food-hero { align-items: flex-start; flex-direction: column; } .food-hero-actions { align-self: flex-start; justify-content: flex-start; } .food-main .food-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 600px) { .food-main .food-hero { min-height: 0; padding: 19px!important; background: linear-gradient(90deg,rgba(251,253,250,.98),rgba(251,253,250,.85)),url('img/food-security-hero.png') right center / cover no-repeat!important; } .food-main .food-hero h1 { font-size: 28px!important; } .food-hero-actions a { font-size: 11px; } .food-main .food-kpis { gap: 7px; } .food-main .food-kpis article { gap: 8px; padding: 10px; } .food-kpi-icon { flex-basis: 38px; width: 38px; height: 38px; } .food-kpi-icon svg { width: 21px; height: 21px; } .food-kpis article > div > strong { font-size: 18px; } .food-main .cnsa-ipc-map { height: 360px; min-height: 360px; } .food-explore { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .food-main * { scroll-behavior: auto!important; transition-duration: 0s!important; animation-duration: 0s!important; } }
