:root { font-family: 'Open Sans', Arial, sans-serif; color: #1b171c; background: #f7f7f7; }
body { margin: 0; }
main { max-width: 68rem; margin: 2rem auto; padding: 1.5rem; background: #fff; border-top: .4rem solid #006bb3; }
h1 { line-height: 1.2; }
p { line-height: 1.6; }
button { font: inherit; padding: .8rem 1.2rem; cursor: pointer; border: 2px solid #006bb3; border-radius: .2rem; background: #006bb3; color: #fff; }
button:focus-visible, a:focus-visible { outline: 3px solid #165d9c; outline-offset: 4px; }
a { color: #164f7c; }
* { box-sizing: border-box; }
h1, h2, h3 { color: #006bb3; }
h2 { font-size: 1.3rem; }
h2 span { font-weight: normal; color: #444; }
nav { display: flex; flex-wrap: wrap; gap: 1.4rem; margin: 1rem 0; }
nav a { padding: .4rem 0; }
label { display: block; margin: .8rem 0; font-weight: 600; }
input, select { display: block; width: 100%; min-width: 0; font: inherit; padding: .7rem; margin: .4rem 0 .9rem; color: #1b171c; background: #fff; border: 1px solid #777; border-radius: .15rem; }
input:focus-visible, select:focus-visible, summary:focus-visible { outline: 3px solid #006bb3; outline-offset: 3px; }
form { margin: 1rem 0; }
.days { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.day, .panel, .week-nav { border: 1px solid #d4dbe0; padding: 1.2rem; margin-bottom: 1rem; }
.day { margin: 0; }
.meal { border-top: 1px solid #d4dbe0; padding: .6rem 0; }
.meal h3 { margin-bottom: .4rem; }
.check { display: inline-flex; align-items: center; gap: .4rem; margin-right: 1rem; }
.check input { width: auto; margin: 0; }
.lunch-day { margin: 1rem 0; border: 1px solid #d4dbe0; }
.lunch-slots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
textarea { display: block; width: 100%; padding: .7rem; font: inherit; margin-top: .5rem; }
.allergy-note { background: #fff4db; padding: .7rem; overflow-wrap: anywhere; }
@media (max-width: 700px) { .lunch-slots { grid-template-columns: 1fr; } }
.week-nav { background: #f2f7fa; }
.week-nav form { display: flex; flex-wrap: wrap; align-items: end; gap: 1rem; }
.week-nav label, .week-nav input { margin-bottom: 0; }
.status { font-weight: bold; }
.notice { background: #edf6ef; border-left: .3rem solid #287640; padding: 1rem; }
.muted { color: #505760; font-size: .95rem; }
.secondary { background: #fff; color: #00558e; }
button:hover { background: #00558e; color: #fff; }
button:disabled { background: #eee; color: #666; border-color: #aaa; cursor: not-allowed; }
article { border-top: 1px solid #d4dbe0; padding: .6rem 0; }
.total { font-size: 1.2rem; }
details { margin: 2rem 0; }
summary { cursor: pointer; padding: .6rem 0; }
li { margin: .7rem 0; line-height: 1.5; }
@media (max-width: 700px) { main { margin: 0; padding: 1rem; } .days { grid-template-columns: 1fr; } .day, .panel, .week-nav { padding: .9rem; } button { width: 100%; } }
/* One compact week form, with lunch receiving most of the width. */
.order-week { width: 100%; table-layout: fixed; border-collapse: collapse; }
.order-week th, .order-week td { text-align: left; vertical-align: top; padding: .7rem; border-bottom: 1px solid #d4dbe0; }
.order-week thead { background: #f2f7fa; }
.order-week th:first-child { width: 16%; }
.order-week .small-meal { width: 17%; }
.order-week select { margin: 0; padding: .55rem .35rem; }
.order-week small { display: block; color: #505760; margin-top: .3rem; }
.day-date { display: block; font-weight: normal; margin-top: .25rem; }
.mobile-meal { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.weekend { margin: .6rem 0 1rem; }
.week-save { display: flex; align-items: center; gap: 1rem; padding: 1rem 0; }
.week-save p { margin: 0; font-size: .9rem; color: #505760; }
.order-note { margin: .3rem 0; font-size: .85rem; overflow-wrap: anywhere; }
.order-note summary { padding: 0; }
@media (max-width: 700px) {
    .order-week, .order-week tbody { display: block; }
    .order-week thead { display: none; }
    .order-week tr { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem .8rem; border-bottom: 1px solid #d4dbe0; padding: .8rem 0; }
    .order-week th, .order-week td { width: auto !important; border: 0; padding: 0; }
    .order-week th { grid-column: 1 / -1; }
    .order-week td:nth-child(3) { grid-column: 1 / -1; grid-row: 2; }
    .day-date { display: inline; margin-left: .5rem; }
    .mobile-meal { position: static; width: auto; height: auto; clip-path: none; margin: .2rem 0; font-size: .85rem; }
    .week-save { display: block; }
    .week-save p { margin-top: .5rem; }
}
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.compact-week-nav { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem 1.2rem; padding: .8rem; }
.compact-week-nav h2, .compact-week-nav p, .compact-week-nav nav, .compact-week-nav form { margin: 0; }
.compact-week-nav form { margin-left: auto; }
.compact-week-nav label { margin: 0; }
.compact-week-nav button { padding: .55rem .8rem; }
.page-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1.5rem; }
.page-header > div { min-width: 0; }
.brand-logo { display: block; width: 16rem; max-width: 32%; height: auto; margin-top: .8rem; flex-shrink: 0; }
@media (max-width: 600px) {
    .page-header { flex-wrap: wrap; gap: 0; }
    .brand-logo { width: 12rem; max-width: 65%; margin: 0 0 .8rem auto; }
}
 .kitchen-day { margin: 1.5rem 0; border-top: 1px solid #cbd6df; }
 .kitchen-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
 .kitchen-table th, .kitchen-table td { text-align: left; vertical-align: top; padding: .65rem; border-bottom: 1px solid #cbd6df; overflow-wrap: anywhere; }
 .kitchen-table th { background: #f1f6f9; }
 .kitchen-table th:nth-child(2) { width: 4rem; }
 .kitchen-table ul { margin: 0; padding-left: 1rem; }
/* Compact kitchen dashboard; retain readable scrolling on small screens. */
main:has(.kitchen-dashboard) { max-width: 96rem; margin: .7rem auto; padding: 1rem; }
main:has(.kitchen-dashboard) h1 { font-size: 1.6rem; margin: .4rem 0; }
main:has(.kitchen-dashboard) .page-header p { margin: .4rem 0; }
main:has(.kitchen-dashboard) nav { margin: .4rem 0; }
main:has(.kitchen-dashboard) .week-nav { margin-bottom: .5rem; padding: .5rem; }
main:has(.kitchen-dashboard) .brand-logo { width: 12rem; margin-top: 0; }
main:has(.kitchen-dashboard) > form { margin: .5rem 0 0; }
main:has(.kitchen-dashboard) > form button { padding: .45rem .7rem; }
.kitchen-dashboard > p { margin: .4rem 0; font-size: .85rem; }
.kitchen-scroll { overflow-x: auto; }
.kitchen-week { width: 100%; min-width: 68rem; table-layout: fixed; border-collapse: collapse; font-size: .85rem; }
.kitchen-week th, .kitchen-week td { padding: .65rem; text-align: left; vertical-align: top; border: 1px solid #9cabb8; overflow-wrap: normal; word-break: normal; }
.kitchen-week thead th { text-align: center; border-top: 4px solid #006bb3; border-bottom: 2px solid #006bb3; }
.kitchen-week abbr { text-decoration: none; }
.kitchen-week tbody th { background: #f2f7fa; }
.kitchen-week tbody tr + tr { border-top: 2px solid #9cabb8; }
.kitchen-week thead, .kitchen-week tfoot { background: #f2f7fa; }
.kitchen-week th:first-child { width: 8rem; white-space: nowrap; }
.kitchen-week th:last-child { width: 6rem; white-space: nowrap; }
.kitchen-week thead th:first-child { text-align: left; }
.kitchen-week tfoot { border-top: 2px solid #006bb3; }
.kitchen-week tfoot td, .kitchen-sum { color: #006bb3; font-size: 1.25rem; }
.kitchen-week tfoot th { vertical-align: middle; }
.kitchen-notes li { overflow-wrap: anywhere; }
.kitchen-count { display: block; color: #006bb3; font-size: 1.25rem; }
.kitchen-dish { margin-top: .45rem; padding-top: .4rem; border-top: 1px solid #d4dbe0; line-height: 1.4; }
.kitchen-dish small { display: block; color: #505760; }
.kitchen-sum, .kitchen-week tfoot { font-weight: bold; }
.kitchen-notes { margin: .15rem 0 0; }
.kitchen-notes summary { padding: .2rem 0; color: #805100; }
.kitchen-notes ul { padding-left: .9rem; }
.kitchen-notes li { margin: .4rem 0; }
/* Day colors supplement the written labels and grid, never replace them. */
.kitchen-week tr > :nth-child(2) { --day-tint: #eef6fc; --day-accent: #39749f; }
.kitchen-week tr > :nth-child(3) { --day-tint: #eff7f1; --day-accent: #427a54; }
.kitchen-week tr > :nth-child(4) { --day-tint: #fff7e8; --day-accent: #956b21; }
.kitchen-week tr > :nth-child(5) { --day-tint: #f4f0fa; --day-accent: #795b99; }
.kitchen-week tr > :nth-child(6) { --day-tint: #edf7f7; --day-accent: #377b7b; }
.kitchen-week tr > :nth-child(7) { --day-tint: #fcf1ed; --day-accent: #9a6248; }
.kitchen-week tr > :nth-child(8) { --day-tint: #faf0f4; --day-accent: #925e77; }
.kitchen-week tr > :nth-child(n+2):nth-child(-n+8) { background-color: var(--day-tint); }
.kitchen-week thead tr > :nth-child(n+2):nth-child(-n+8) { border-top: 4px solid var(--day-accent); }
.guest-table { width: 100%; border-collapse: collapse; }
.guest-table th, .guest-table td { padding: .65rem; border: 1px solid #9cabb8; text-align: left; vertical-align: top; }
.guest-table th { background: #f2f7fa; }
.guest-table input { width: 6rem; margin: 0; }
.guest-history, .guest-history details { margin: .4rem 0; overflow-wrap: anywhere; }
.guest-days { table-layout: fixed; }
.guest-days th:first-child { width: 9rem; }
.guest-days tbody tr { border-top: 2px solid #9cabb8; }
.guest-days tbody th { border-left: 4px solid var(--guest-accent); background: transparent; }
.guest-day-1 { background: #eef6fc; --guest-accent: #39749f; }
.guest-day-2 { background: #eff7f1; --guest-accent: #427a54; }
.guest-day-3 { background: #fff7e8; --guest-accent: #956b21; }
.guest-day-4 { background: #f4f0fa; --guest-accent: #795b99; }
.guest-day-5 { background: #edf7f7; --guest-accent: #377b7b; }
.guest-day-6 { background: #fcf1ed; --guest-accent: #9a6248; }
.guest-day-7 { background: #faf0f4; --guest-accent: #925e77; }
.guest-meals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem 1rem; }
.guest-offer { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin: 0; padding: .4rem; font-weight: normal; border-bottom: 1px solid #cbd6df; }
.guest-offer span { min-width: 0; }
.guest-offer input { flex: 0 0 5rem; width: 5rem; }
@media (max-width: 800px) { .guest-meals { grid-template-columns: 1fr; } .guest-days th:first-child { width: 7rem; } }
.guest-days .guest-meals { display: block; }
.guest-meal-block { padding: .5rem; }
.guest-meal-block + .guest-meal-block { border-top: 2px solid #9cabb8; margin-top: .5rem; }
.guest-meal-block h3 { margin: 0 0 .3rem; font-size: .95rem; }
.guest-meal-lunch { background: rgba(255,255,255,.6); border-left: 3px solid #006bb3; }
.guest-meal-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .3rem 1rem; }
@media (max-width: 800px) { .guest-meal-options { grid-template-columns: 1fr; } }
