@media(min-width:900px){
.weekbar{display:flex!important;flex-wrap:wrap;align-items:flex-end;gap:12px 16px}
.weekbar .plan-date-field{flex:0 0 280px!important;width:280px!important;min-width:240px!important;order:1}
.weekbar .plan-length{flex:0 0 110px!important;width:110px!important;order:2}
.weekbar #allergymenu{flex:1 1 220px;min-width:220px;order:3}
.weekbar #weekdates{flex:1 0 100%!important;order:5;margin:0}
}
.plan-save-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;margin:20px 0 12px}
.plan-save-row #saveweek{flex:0 0 auto}
.plan-save-row #addweek{flex:0 0 auto}
.plan-save-row .plan-delete{margin-left:auto;background:transparent;border-color:transparent;color:var(--muted,#687265);text-decoration:underline;text-underline-offset:3px}
.plan-save-row .plan-delete:hover:not(:disabled){color:inherit}
.plan-save-row .plan-delete:disabled{opacity:.5;text-decoration:none}
@media(max-width:600px){
.plan-save-row #saveweek{flex:1 0 100%;order:1}
.plan-save-row #addweek{flex:1 1 0;order:2}
.plan-save-row .plan-delete{flex:1 1 0;order:3;margin-left:0;border-color:var(--line,#d9ded0);text-decoration:none}
}

/* Allergimenyen: knappen er alltid like stor. Panelet ligger over innholdet og flytter ingenting. */
.weekbar #allergymenu{position:relative}
.weekbar #allergymenu[open]>summary::before{transform:rotate(-45deg)}
.weekbar #allergymenu .allergy-options{position:absolute!important;left:0!important;right:auto!important;top:calc(100% + 8px)!important;width:min(440px,calc(100vw - 32px))!important;margin:0!important;box-shadow:0 10px 30px var(--shadow,rgba(0,0,0,.18))!important;z-index:30}
@media(max-width:700px){.weekbar #allergymenu .allergy-options{left:0!important;right:0!important;width:auto!important}}

/* Mine uker: alle datoer på én linje i en fast kolonne. */
.saved-week-card li{grid-template-columns:9.6em minmax(0,1fr)!important;align-items:start}
.saved-week-card li>span{white-space:nowrap;font-variant-numeric:tabular-nums}
@media(max-width:360px){.saved-week-card li{grid-template-columns:1fr!important;gap:2px}}
/* Menystrekene: tykkere og i temaets grønnfarge i stedet for nesten svart. */
header#appheader #menutoggle{color:var(--green)}
#menutoggle .menu-lines{height:28px}
#menutoggle .menu-lines i{height:4px;border-radius:3px}

/* Logo, varselfelt og innhold har samme venstreinnrykk på alle skjermbredder (5 % av bredden, 16 px på mobil,
   og på skjermer over 1400 px følger de det sentrerte innholdet). */
header#appheader,#syncbar{padding-left:calc(max(0px,(100% - 1400px)/2) + 5%);padding-right:calc(max(0px,(100% - 1400px)/2) + 5%)}
@media(max-width:700px){header#appheader,#syncbar{padding-left:16px;padding-right:16px}}
#home{margin-left:0;margin-right:auto}
/* 500-stjernen sitter fast på enden av ordet Oppskrifter, litt over linjen, i både toppmenyen og sidemenyen. */
#appheader #mainnav .nav-label #count{position:absolute!important;left:100%!important;right:auto!important;top:0!important;margin:0 0 0 -.1em!important;transform:translateY(-70%) rotate(-12deg)!important;pointer-events:none}
@media(min-width:1101px){#appheader #mainnav a[data-tab="recipes"]{padding-right:1.8em!important}}

/* Dagkort: større porsjonstall og store piler, og tydelig hjelpetekst når ingen rett er valgt. */
.day label{font-size:15px!important;font-weight:600}
.day .stepper{display:inline-flex;align-items:stretch;gap:0;border:1px solid var(--line,#d9d9cf);border-radius:14px;background:#fff;overflow:hidden}
.day .stepper input{width:64px!important;border:0!important;border-radius:0!important;font-size:24px!important;font-weight:700;text-align:center;padding:10px 4px!important;margin:0;-moz-appearance:textfield;appearance:textfield;background:transparent;box-shadow:none!important}
.day .stepper input::-webkit-inner-spin-button,.day .stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.day .step-btns{display:flex;flex-direction:column;border-left:1px solid var(--line,#d9d9cf)}
.day .step-btns .step-btn{margin:0!important;width:44px!important;flex:1;min-height:26px;padding:0!important;border:0!important;border-radius:0!important;background:#f1f1e8;color:var(--green,#2f5d3a);font-size:16px!important;line-height:1;cursor:pointer}
.day .step-btns .step-btn+.step-btn{border-top:1px solid var(--line,#d9d9cf)!important}
.day .step-btns .step-btn:hover{background:#e4ecd9}
.day label input{width:auto}
.day>button[data-detailday]{font-size:14px!important;line-height:1.35;white-space:normal;min-height:44px}
.day>button[data-detailday]:disabled{font-style:italic}
