:root{--primary:#1f5f8b;--accent:#f2a541;--bg:#f3f4f6;--card:#fff;--ink:#1d2330;--muted:#6b7280;--line:#e5e7eb;--red:#c0392b;--green:#1e8e5a;--r:10px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--primary)}
h1{font-size:1.6rem;margin:.2em 0 .6em;line-height:1.2}
h2{font-size:1.05rem;margin:1.4em 0 .6em}
h2:first-child{margin-top:0}
h3{margin:0;font-size:1.05rem}
code{background:#eef1f5;padding:2px 6px;border-radius:5px;font-size:.92em}
.muted{color:var(--muted)} .small{font-size:.85rem} .nowrap{white-space:nowrap}
.num{text-align:right}

/* Topbar */
.topbar{display:flex;align-items:center;gap:20px;flex-wrap:wrap;background:#fff;border-bottom:3px solid var(--primary);padding:10px 24px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:700;font-size:1.05rem}
.brand img{max-height:34px;max-width:140px}
.topbar nav{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto}
.topbar nav a{padding:6px 12px;border-radius:6px;text-decoration:none;color:var(--ink)}
.topbar nav a.on{background:var(--primary);color:#fff}
.topbar nav a:hover:not(.on){background:#f0f2f5}
.wrap{max-width:1180px;margin:0 auto;padding:24px}

.page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.page-head h1{margin:0}
.tabs{display:flex;background:#e6e9ee;border-radius:8px;padding:3px}
.tabs a{padding:5px 14px;border-radius:6px;text-decoration:none;color:var(--ink)}
.tabs a.on{background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.08)}

.panel{background:var(--card);border-radius:var(--r);padding:20px;box-shadow:0 1px 2px rgba(0,0,0,.05);margin-bottom:18px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.grid2.wide-left{grid-template-columns:1.7fr 1fr}
@media(max-width:860px){.grid2,.grid2.wide-left{grid-template-columns:1fr}}

/* Tables */
table.list{width:100%;border-collapse:collapse;background:var(--card);border-radius:var(--r);overflow:hidden}
.wrap>table.list{box-shadow:0 1px 2px rgba(0,0,0,.05)}
table.list th{text-align:left;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600;padding:10px 12px;border-bottom:1px solid var(--line)}
table.list td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
table.list tr:last-child td{border-bottom:0}
table.list.compact td{padding:8px 6px}
table.list tbody tr[data-href]{cursor:pointer}
table.list tbody tr[data-href]:hover{background:#f8fafc}
tr.cancelled td{opacity:.55}
tr.total td{font-weight:700;border-top:2px solid var(--line)}

.tag{display:inline-block;font-size:.72rem;padding:1px 8px;border-radius:20px;background:#e8ebef;color:#444;vertical-align:middle;font-weight:600}
.tag.red{background:#fde8e6;color:var(--red)} .tag.green{background:#e3f5ec;color:var(--green)}

/* Forms */
label{display:flex;flex-direction:column;gap:4px;font-weight:600;font-size:.9rem}
input,select,textarea{font:inherit;padding:9px 11px;border:1px solid #cfd5dd;border-radius:7px;background:#fff;font-weight:400;width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid color-mix(in srgb,var(--primary) 35%,transparent);border-color:var(--primary)}
input[type=color]{padding:2px;height:40px;width:70px}
input[type=checkbox],input[type=radio]{width:auto;flex:none}
label.check{flex-direction:row;align-items:center;gap:8px;font-weight:400}
.stack{display:flex;flex-direction:column;gap:14px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.row.end{align-items:flex-end;margin-top:12px}
.row>label{flex:1;min-width:120px}
.suffix-input{display:flex;align-items:stretch}
.suffix-input input{border-radius:7px 0 0 7px}
.suffix-input span{background:#eef1f5;border:1px solid #cfd5dd;border-left:0;border-radius:0 7px 7px 0;padding:9px 10px;font-weight:400;color:var(--muted);white-space:nowrap}
form.inline{display:inline}

.btn{display:inline-block;background:var(--primary);color:#fff;border:0;border-radius:7px;padding:9px 18px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none}
.btn:hover{filter:brightness(1.08)}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid #cfd5dd}
.btn.ghost:hover{background:#f5f6f8}
.btn.danger{color:var(--red)}
.btn.tiny{padding:3px 10px;font-size:.82rem}
.btn.big{padding:13px 28px;font-size:1.05rem}

.flash{padding:11px 14px;border-radius:8px;margin-bottom:14px;background:#e3f5ec;color:#145c3b;border:1px solid #bfe6d1}
.flash.err{background:#fde8e6;color:#8f2a1f;border-color:#f6c7c1}
.flash.warn{background:#fff6e0;color:#7a5600;border-color:#f3dfa6}
.empty{background:#fff;border-radius:var(--r);padding:40px;text-align:center}

.facts{display:flex;flex-wrap:wrap;gap:10px 28px;margin:0 0 18px}
.facts dt{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.facts dd{margin:0;font-weight:600}

.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;background:#f0f3f7;border-radius:20px;padding:5px 12px;font-size:.92rem}
.chip strong{color:var(--primary);font-size:1.05rem}
.chip .x{border:0;background:none;cursor:pointer;color:var(--muted);font-size:1.1rem;padding:0 0 0 2px}
.note-line{background:#fff8e6;border-radius:6px;padding:4px 8px;margin-top:6px}
.logo-preview{max-height:44px;max-width:160px;background:#f5f6f8;padding:4px;border-radius:6px}
code.copy{cursor:pointer}

.kitchen-card .kc-head{display:flex;gap:16px;align-items:center;margin-bottom:12px}
.kc-time{font-size:1.5rem;font-weight:800;color:var(--primary);min-width:70px}
.kitchen-card.cancelled{opacity:.5}

/* ---------- Offentlige sider (deltager/login) ---------- */
body.public{background:linear-gradient(180deg,var(--primary) 0,var(--primary) 180px,var(--bg) 180px)}
.card-page{max-width:640px;margin:28px auto;background:#fff;border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.12);overflow:hidden}
.pub-head{padding:20px 28px;border-bottom:1px solid var(--line);min-height:76px;display:flex;align-items:center}
.pub-head img{max-height:44px;max-width:200px}
.pub-head strong{font-size:1.2rem;color:var(--primary)}
.pub-body{padding:24px 28px}
.pub-foot{padding:14px 28px;background:#f7f8fa;color:var(--muted);font-size:.82rem}
.eyebrow{color:var(--accent);font-weight:700;text-transform:uppercase;font-size:.75rem;letter-spacing:.08em;filter:brightness(.85)}
.meeting-head h1{margin-top:2px}
.cat{font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:22px 0 8px}
.items{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid var(--line);transition:background .15s}
.item:last-child{border-bottom:0}
.item.chosen{background:color-mix(in srgb,var(--primary) 7%,#fff)}
.item-text{display:flex;flex-direction:column}
.item-name{font-weight:600}
.item-desc,.item-price{font-size:.85rem;color:var(--muted)}
.toggle{position:relative;flex:none}
.toggle input{position:absolute;opacity:0;width:1px;height:1px}
.toggle span{display:block;width:30px;height:30px;border:2px solid #c3cad3;border-radius:8px;cursor:pointer;transition:.15s}
.toggle input:checked+span{background:var(--primary);border-color:var(--primary)}
.toggle input:checked+span::after{content:"";display:block;width:8px;height:15px;border:solid #fff;border-width:0 3px 3px 0;transform:translate(9px,3px) rotate(45deg)}
.toggle input:focus-visible+span{outline:2px solid var(--primary);outline-offset:2px}
.toggle input:disabled+span{cursor:default;opacity:.6}
.stepper{display:flex;align-items:center;flex:none;border:1px solid #cfd5dd;border-radius:8px;overflow:hidden}
.stepper button{width:36px;height:36px;border:0;background:#f3f5f8;font-size:1.2rem;cursor:pointer}
.stepper button:disabled{cursor:default;opacity:.5}
.stepper input{width:44px;border:0;border-radius:0;text-align:center;padding:6px 0;-moz-appearance:textfield}
.stepper input::-webkit-inner-spin-button{-webkit-appearance:none}
.note{margin-top:20px}
.sticky-save{position:sticky;bottom:0;background:#fff;padding:16px 0 4px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
@media(max-width:640px){.card-page{margin:0;border-radius:0;min-height:100vh}body.public{background:#fff}.pub-body{padding:18px}.wrap{padding:14px}.topbar{padding:10px 14px}}

@media print{
  .topbar,.noprint,.btn,.tabs{display:none!important}
  body{background:#fff}.panel{box-shadow:none;border:1px solid #ddd;break-inside:avoid}.wrap{padding:0;max-width:none}
}

.series-note{display:inline-block;background:#f0f3f7;border-radius:20px;padding:4px 12px;font-size:.88rem;margin-bottom:12px}
.series-panel{padding:14px 20px}
.chip.on{background:var(--primary);color:#fff}
.chip.struck{text-decoration:line-through;opacity:.6}
a.chip{text-decoration:none;color:inherit}
label.standing{margin-top:16px;background:#f5f7fa;border-radius:8px;padding:12px 14px;align-items:flex-start}
label.standing input{margin-top:4px}
fieldset.radios{border:1px solid var(--line);border-radius:8px;padding:10px 14px;display:flex;flex-direction:column;gap:10px}
fieldset.radios legend{font-weight:600;font-size:.9rem;padding:0 4px}
fieldset.radios label{align-items:flex-start}
fieldset.radios input{margin-top:4px}
.items.occ .item{padding:9px 14px}

.chip.mini{padding:1px 8px;font-size:.78rem}
.loc-checks{display:flex;flex-wrap:wrap;gap:6px 16px;padding-left:24px}
.small-select{padding:4px 8px;font-size:.88rem;width:auto}
.inline-label{flex-direction:row;align-items:center;gap:8px;font-weight:400}
.inline-label select{width:auto}
.printonly{display:none}
@media print{.printonly{display:inline}}

.codes{display:grid;grid-template-columns:repeat(2,max-content);gap:6px 14px;margin:12px 0}
.codes code{font-size:1rem;padding:4px 10px}
.qr{width:200px;height:200px;margin:8px 0}
.qr svg{width:100%;height:100%}
.code-input{font-size:1.4rem;letter-spacing:.2em;max-width:220px}
ol.steps{padding-left:18px;margin:0 0 4px}

/* v5: mærker, frister, indkalder */
.item-meta{display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center;margin-top:2px}
.badge{display:inline-block;font-size:.72rem;padding:1px 7px;border-radius:10px;background:#eef1f5;color:#444;font-weight:600}
.badge.diet{background:#e3f5ec;color:#145c3b}
.badge.allergen{background:#fff3e0;color:#8a4b00;font-weight:500}
.badge.time{background:#e8f0fb;color:#1f4f8b}
.badge.deadline{background:#fff8e1;color:#7a5600}
.badge.closedb{background:#fde8e6;color:#8f2a1f}
.item.closed{background:#fafafa}
.item.closed .item-name{color:#777}
.item.hidden{display:none}
.diet-filter{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:4px 0 6px}
.chip-btn{border:1px solid #cfd5dd;background:#fff;border-radius:20px;padding:4px 12px;font:inherit;font-size:.85rem;cursor:pointer}
.chip-btn.on{background:var(--primary);border-color:var(--primary);color:#fff}
.org-panel{border:2px solid color-mix(in srgb,var(--primary) 30%,#fff);border-radius:12px;padding:16px;margin:12px 0 22px;background:color-mix(in srgb,var(--primary) 3%,#fff)}
.org-panel h2{margin-top:0}
.org-panel .decide{gap:10px}
.section-title{margin-top:24px}
.guests{max-width:280px;margin-bottom:6px}
.serve-times{margin:14px 0;background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px 14px}
.serve-times summary{cursor:pointer;font-weight:600}
.serve-row{justify-content:space-between;font-weight:400;flex-direction:row;padding:4px 0}
.serve-row select{width:auto}
.tag.blue{background:#e8f0fb;color:#1f4f8b}
.allergen-box summary{cursor:pointer;font-weight:600;font-size:.9rem}
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.plan h3{margin:0 0 6px;font-size:1.2rem}
.plan-price{font-size:1.4rem;font-weight:800;color:var(--primary);margin-bottom:6px}
.org-panel .decide{margin-bottom:22px}

.health-fail{border-left:5px solid var(--red)}
.health-warn{border-left:5px solid #e0a800}
.health-ok{border-left:5px solid var(--green)}
.audit-details span{display:inline-block;margin-right:8px;color:#555}

/* Statistik – én serie, mærkefarve; tekst i blæk-farver, aldrig serie-farven */
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:4px}
.filters input[type=date],.filters select{width:auto}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin:12px 0 18px}
.kpi{background:#fff;border-radius:var(--r);padding:16px 18px;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.small-kpis .kpi{box-shadow:none;border:1px solid var(--line)}
.kpi-label{font-size:.8rem;color:var(--muted);font-weight:600}
.kpi-value{font-size:1.9rem;font-weight:800;line-height:1.2;margin:4px 0 2px;color:var(--ink)}
.kpi-value small{font-size:.9rem;font-weight:600;color:var(--muted)}
.kpi-sub{font-size:.82rem}
.chart-sub{margin:-6px 0 12px}
.hbars{display:flex;flex-direction:column;gap:8px}
.hbar{display:grid;grid-template-columns:minmax(90px,34%) 1fr 80px;align-items:center;gap:10px;font-size:.88rem;border-radius:4px;padding:2px 0}
.hbar:hover,.hbar:focus{background:#f6f7f9;outline:none}
.hbar-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbar-track{display:flex;align-items:center;gap:6px;min-width:0}
.hbar-fill{display:block;height:14px;max-height:24px;background:var(--primary);border-radius:0 4px 4px 0;min-width:2px}
.hbar-val{font-weight:700;font-size:.82rem;color:var(--ink);white-space:nowrap}
.hbar-amount{text-align:right;font-size:.8rem;white-space:nowrap}
.vchart{position:relative;height:220px;margin:8px 0 34px 44px}
.vgrid{position:absolute;inset:0}
.vgridline{position:absolute;left:0;right:0;border-top:1px solid #e9ecf0}
.vgridline span{position:absolute;left:-44px;top:-9px;width:38px;text-align:right;font-size:.75rem;color:var(--muted)}
.vbars{position:absolute;inset:0;display:flex;align-items:flex-end;gap:2px}
.vcol{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;cursor:default}
.vcol:hover,.vcol:focus{background:rgba(0,0,0,.03);outline:none}
.vbar{width:min(24px,70%);background:var(--primary);border-radius:4px 4px 0 0;min-height:1px}
.vlabel{position:absolute;top:100%;margin-top:6px;font-size:.72rem;color:var(--muted);text-align:center;line-height:1.2}
.table-view{margin-top:6px}
.table-view summary{cursor:pointer;font-size:.85rem;color:var(--muted)}
.tip{position:fixed;z-index:50;background:#1d2330;color:#fff;font-size:.82rem;padding:6px 10px;border-radius:6px;pointer-events:none;max-width:280px;box-shadow:0 4px 12px rgba(0,0,0,.2)}
@media(max-width:640px){.hbar{grid-template-columns:1fr 1fr}.hbar-amount{display:none}.vchart{margin-left:38px}}

/* Opsætningsguide */
.setup{max-width:760px;margin:0 auto}
.stepper-nav{display:flex;list-style:none;padding:0;margin:0 0 18px;gap:6px;flex-wrap:wrap}
.stepper-nav li{flex:1;min-width:110px}
.stepper-nav a{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;background:#e9ecf0;color:var(--muted);text-decoration:none;font-weight:600;font-size:.9rem}
.stepper-nav span{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#fff;font-size:.8rem}
.stepper-nav li.on a{background:var(--primary);color:#fff}
.stepper-nav li.on span{color:var(--primary)}
.stepper-nav li.done a{color:var(--ink)}
.stepper-nav li.done span{background:var(--green);color:#fff}
.big-address code{font-size:1.3rem;padding:8px 14px;display:inline-block}
.howto{padding-left:20px;line-height:1.8}
.tpl-list{padding-left:18px;margin:0 0 12px;font-size:.9rem;line-height:1.7}

.pp-select{width:auto;margin-top:6px;padding:3px 8px;font-size:.82rem;border-radius:6px}
.item.per-person .stepper input{background:#f3f6fb;font-weight:700;color:var(--primary)}
.headcount-line{background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 12px;margin:0 0 12px}
.headcount-line strong{font-size:1.15rem}
.badge.serves{background:#f3e8fb;color:#5b2a86}
.pp-hint{display:block;margin-top:2px}
.linklike{background:none;border:0;padding:6px 12px;font:inherit;cursor:pointer;color:var(--muted);border-radius:6px}
.linklike:hover{background:#f0f2f5}
.err-text{color:#b42318;font-weight:600}
/* Backup */
.checks{display:flex;flex-wrap:wrap;gap:6px 18px}
.tag.orange{background:#fff1d6;color:#8a5300}
tr.selected td{background:rgba(0,0,0,.035)}
#bkform h3{margin:18px 0 6px;font-size:15px}

/* ---- Layout-rettelser (version 19) ---- */
/* Felter i samme række flugter fra toppen, også når én har hjælpetekst under sig */
.row{align-items:flex-start}
.row>.btn,.row>button,.row>form,.row>a.btn{align-self:flex-end}
.row.center{align-items:center}
td.num,th.num{white-space:nowrap}
/* Brede tabeller scroller inden i deres egen boks i stedet for at skubbe hele siden ud */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.table-scroll>table.list{min-width:100%}
@media(max-width:760px){
  .page-head{flex-wrap:wrap;gap:8px}
  .page-head select,.page-head form{max-width:100%}
  table.list th,table.list td{padding:8px 8px}
  .table-scroll>table.list td:first-child{white-space:nowrap}
}
.grid2>*{min-width:0}
/* Afkrydsningsfelter flugter med første tekstlinje, også når der står hjælpetekst under */
label.check{align-items:flex-start}
label.check>input[type=checkbox],label.check>input[type=radio]{margin-top:3px;flex:none}
/* Ny modtageradresse: adressen på hele bredden, resten i to kolonner */
.add-intake{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;margin-top:12px;align-items:end}
.add-intake>label:first-of-type{grid-column:1/-1}
.add-intake>button{justify-self:start}
.suffix-input>input{flex:1;min-width:0}
.suffix-input>span{flex:none}
@media(max-width:480px){.add-intake{grid-template-columns:1fr}}
/* Kontroller i sidehovedet (fx Køkken: dato, sted, pile) står på én linje i naturlig bredde */
.page-head .row{align-items:center;flex-wrap:wrap;justify-content:flex-end}
.page-head .row>*,.page-head .row form>*{align-self:center}
.page-head .row input,.page-head .row select{width:auto;max-width:100%}
.page-head form.row{flex-wrap:nowrap}
/* Afkrydsning ved siden af et felt i en række: flugter med feltets midte */
.row>label.check{align-self:flex-end;min-height:42px;align-items:center}
.row>label.check>input{margin-top:0}
@media(max-width:640px){
  .page-head>.row{justify-content:flex-start;width:100%}
  .page-head form.row{flex-wrap:wrap}
}
@media(max-width:640px){
  .page-head form.row{flex-wrap:nowrap;gap:6px}
  .page-head .row input[type=date]{width:150px}
  .page-head .row select{max-width:130px}
}
/* Skygge i kanten viser, at en tabel kan scrolles vandret */
@media(max-width:760px){
  .table-scroll{background:
    linear-gradient(to right,var(--card) 30%,rgba(255,255,255,0)),linear-gradient(to right,rgba(255,255,255,0),var(--card) 70%) 100% 0,
    radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.18),rgba(0,0,0,0)),radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.18),rgba(0,0,0,0)) 100% 0;
    background-repeat:no-repeat;background-size:40px 100%,40px 100%,14px 100%,14px 100%;background-attachment:local,local,scroll,scroll}
  .table-scroll>table.list{background:transparent}
}
/* Telefon: felter i en række stables, så de altid flugter (lange overskrifter brydes ellers forskelligt) */
@media(max-width:480px){
  .row>label:not(.check){flex-basis:100%}
}

/* Varebilleder */
.item-cell{display:flex;gap:10px;align-items:flex-start}
.item-thumb{width:44px;height:44px;object-fit:cover;border-radius:8px;flex:none;background:#f1f3f5}
.image-field{display:flex;gap:12px;align-items:flex-end}
.image-field>label{flex:1;min-width:0}
.item-preview{width:84px;height:84px;object-fit:cover;border-radius:10px;flex:none;border:1px solid var(--line)}
.item-img{flex:none;display:block;width:64px;height:64px;border-radius:10px;overflow:hidden;background:#f1f3f5}
.item-img img{width:100%;height:100%;object-fit:cover;display:block}
.item .item-text{flex:1;min-width:0}
@media(max-width:480px){.item-img{width:56px;height:56px}}
.lightbox{position:fixed;inset:0;background:rgba(15,20,30,.82);display:flex;align-items:center;justify-content:center;z-index:1000;padding:18px;cursor:zoom-out}
.lightbox img{max-width:100%;max-height:100%;border-radius:12px;box-shadow:0 10px 40px rgba(0,0,0,.4)}
.lightbox img{background:#fff}

/* ===== Bestilling som kiosk ===== */
.card-page.wide{max-width:1080px}
.kiosk{display:grid;grid-template-columns:minmax(0,1fr) 300px;grid-template-areas:"tabs tabs" "main cart";gap:4px 22px;margin:8px 0 12px;align-items:start}
.kiosk-tabs{grid-area:tabs;display:flex;gap:6px;overflow-x:auto;padding:8px 0;position:sticky;top:0;z-index:5;background:#fff;scrollbar-width:thin}
.ktab{flex:0 0 auto;border:1px solid var(--line);background:#f7f8fa;color:var(--ink);border-radius:999px;padding:8px 16px;font:inherit;font-weight:600;cursor:pointer;white-space:nowrap}
.ktab.on{background:var(--primary);border-color:var(--primary);color:#fff}
.ktab:focus-visible,.tile:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.kiosk-main{grid-area:main;min-width:0}
.kiosk-cat h3.cat{margin:14px 0 10px}
.kiosk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:14px}
.tile{position:relative;display:flex;flex-direction:column;text-align:left;padding:0;border:2px solid transparent;border-radius:16px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.08),0 4px 14px rgba(0,0,0,.05);cursor:pointer;overflow:hidden;font:inherit;color:inherit;transition:transform .12s,box-shadow .12s,border-color .12s}
.tile:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.12)}
.tile:active{transform:scale(.98)}
.tile.chosen{border-color:var(--primary)}
.tile.closed{opacity:.55;filter:grayscale(.6)}
.tile.hidden{display:none}
.tile-img{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;background:linear-gradient(135deg,#f6efe4,#eef3f8);overflow:hidden}
.tile-img img{width:100%;height:100%;object-fit:cover;display:block}
.tile-icon{font-size:3.2rem;line-height:1}
.tile-body{display:flex;flex-direction:column;gap:4px;padding:10px 12px 12px}
.tile-name{font-weight:700;line-height:1.25}
.tile-sub{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:.88rem}
.tile-opts{color:var(--muted);font-size:.8rem}
.tile-count{position:absolute;top:8px;right:8px;min-width:30px;height:30px;padding:0 8px;border-radius:999px;background:var(--primary);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.tile-count[hidden]{display:none}

.cart{grid-area:cart;position:sticky;top:64px;background:#f7f8fa;border:1px solid var(--line);border-radius:14px;padding:14px;margin-top:14px;max-height:calc(100vh - 90px);overflow:auto}
.cart-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:6px}
.cart-empty{margin:6px 0}
.cart-lines{list-style:none;margin:0;padding:0}
.cart-line{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 0;border-top:1px solid var(--line)}
.cart-line:first-child{border-top:0}
.cl-text{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.cl-text:disabled{cursor:default}
.cl-text:focus-visible{outline:2px solid var(--accent);border-radius:4px}
.cl-name{font-weight:600}
.cl-right{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.cl-remove{border:0;background:none;color:var(--muted);font-size:1.2rem;cursor:pointer;padding:2px 6px;border-radius:6px}
.cl-remove:hover{background:#e9ecf0;color:var(--red)}
.opt-text{display:block;color:#a15c07;font-size:.84rem;font-weight:400}
li .opt-text,.chip .opt-text,td .opt-text{display:inline}
.chip .opt-text::before,.items.occ .opt-text::before{content:"· "}
.qty-pick{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;background:#fff;overflow:hidden}
.qty-pick button{border:0;background:none;width:40px;height:40px;font-size:1.25rem;cursor:pointer;color:var(--primary)}
.qty-pick button:disabled{color:#c3c8d0;cursor:default}
.qty-pick output{min-width:28px;text-align:center;font-weight:700}
.qty-pick.small button{width:30px;height:30px;font-size:1.05rem}
.qty-pick.muted{opacity:.6}

/* Kortet med billede og til-/fravalg */
body.sheet-open{overflow:hidden}
.sheet-backdrop{position:fixed;inset:0;background:rgba(15,20,30,.55);display:flex;align-items:center;justify-content:center;z-index:900;padding:18px}
.sheet-backdrop[hidden]{display:none}
.sheet{position:relative;background:#fff;border-radius:20px;width:100%;max-width:520px;max-height:calc(100vh - 36px);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.35);animation:sheetIn .18s ease-out}
@keyframes sheetIn{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
.sheet-close{position:absolute;top:10px;right:10px;z-index:2;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.92);font-size:1.5rem;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.2)}
.sheet-img{flex:0 0 auto;display:flex;align-items:center;justify-content:center;height:240px;background:linear-gradient(135deg,#f6efe4,#eef3f8)}
.sheet-img img{width:100%;height:100%;object-fit:cover}
.sheet-img .tile-icon{font-size:5rem}
.sheet-body{padding:16px 20px;overflow:auto;flex:1 1 auto}
.sheet-body h2{margin:0 0 4px;font-size:1.35rem}
.sheet-desc{margin:0 0 8px}
.sheet-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:6px}
.opt-choices{border:0;padding:0;margin:14px 0 0}
.opt-choices legend{font-weight:700;padding:0;margin-bottom:6px}
.opt-choice{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;margin-bottom:6px;cursor:pointer}
.opt-choice:has(input:checked){border-color:var(--primary);background:#eef5fb}
.opt-choice input{width:20px;height:20px;margin:0;accent-color:var(--primary)}
.oc-name{flex:1}
.sheet-pp{margin-top:14px;display:flex;flex-direction:column;gap:4px}
.sheet-pp[hidden]{display:none}
.sheet-note{margin:10px 0 0;min-height:1em}
.sheet-foot{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:12px 20px 16px;border-top:1px solid var(--line);background:#fff}
.sheet-foot[hidden]{display:none}
.sheet-foot .btn{flex:1}

/* Indkalderens serveringsvalg */
fieldset.serving{border:1px solid var(--line);border-radius:12px;padding:12px 16px 6px;margin:16px 0}
fieldset.serving legend{font-weight:700;padding:0 6px}
.serve-cat{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:8px 0;border-top:1px solid var(--line)}
.serve-cat:first-of-type{border-top:0}
.serve-cat-name{font-weight:600}
.serve-pick{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.serve-pick input[type=time]{width:auto}
.serve-pick [hidden]{display:none}

/* Admin: til-/fravalgseditor og kategorier */
.stack-col{min-width:0}
.options-box{border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.options-box summary{cursor:pointer;font-weight:600}
.opt-group{border:1px solid var(--line);border-radius:10px;padding:10px;margin:8px 0;background:#fafbfc;display:flex;flex-direction:column;gap:6px}
.opt-head{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.opt-head input:not([type=checkbox]){flex:1 1 140px;min-width:0}
.opt-row{display:grid;grid-template-columns:minmax(0,1fr) 80px auto auto;gap:6px;align-items:center}
.opt-price{text-align:right}
.opt-add{gap:8px}
.badge.opts{background:#fff4e5;color:#a15c07}
.sort-input{width:80px}
.cat-table td{vertical-align:middle}

@media(max-width:860px){
  .kiosk{grid-template-columns:minmax(0,1fr);grid-template-areas:"tabs" "main" "cart"}
  .cart{position:static;max-height:none}
}
@media(max-width:480px){
  .kiosk-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .tile-body{padding:8px 10px 10px}
  .tile-icon{font-size:2.6rem}
  .sheet-backdrop{padding:0;align-items:flex-end}
  .sheet{border-radius:20px 20px 0 0;max-height:92vh}
  .sheet-img{height:190px}
  .opt-row{grid-template-columns:minmax(0,1fr) 64px auto;}
  .opt-row .check{grid-column:1/2}
}
.card-page.wide{overflow:clip}
.sheet .opt-choice{flex-direction:row;align-items:center;font-weight:400;text-align:left}
.sheet .opt-choice input{flex:0 0 auto}
.sheet-pp label{font-weight:600}
@media(max-width:480px){
  .sticky-save{padding:10px 0 6px;gap:8px;flex-wrap:nowrap;align-items:center}
  .sticky-save .btn.big{padding:10px 16px;font-size:1rem}
  .sticky-save .btn.ghost{padding:9px 10px;font-size:.82rem;white-space:normal;line-height:1.2}
  .sticky-save .cart-sum{flex:1;text-align:right}
  .sticky-save > .muted.small:not(.cart-sum){display:none}
}
@media(max-width:480px){
  .sticky-save{flex-wrap:wrap;row-gap:4px}
  .sticky-save .btn{white-space:nowrap}
  .sticky-save .cart-sum{order:-1;flex:1 0 100%;text-align:left}
  .sticky-save .cart-sum:empty{display:none}
}
.opt-row .check{flex-direction:row;align-items:center;gap:6px;font-weight:400;white-space:nowrap}
.opt-row > button{justify-self:end}