/* Avdelningar (B61/B57) — G-koppla. BARA tokens (reserv: app.html:s namn). Prefix av-. Mobil först: 300/320 px. */
.av,.av-blad{--av-skugga:0 1px 1px rgba(12,12,15,.04),0 2px 4px rgba(12,12,15,.04),0 12px 32px rgba(12,12,15,.06)}
.av{display:grid;gap:16px;min-width:0}
.av-last{display:grid;place-items:center;padding:28px}
.av-lead{margin:0;font-size:15.5px;line-height:1.55}
.av-bara{display:block;margin:0;padding:12px 14px;border:1px solid var(--linje2);border-radius:var(--r2);background:var(--yta2);color:var(--ink2);font-size:14px}
.av-rubrik{margin:0 0 16px;font-size:clamp(22px,5vw,30px);letter-spacing:-.03em;font-weight:500}
.av-lista{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.av-kort{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;padding:14px;background:linear-gradient(180deg,color-mix(in srgb,var(--acc) 3%,var(--yta)) 0,var(--yta) 60px);border:1px solid var(--linje);border-radius:var(--r3);box-shadow:var(--av-skugga);min-width:0}
.av-av{opacity:.7}
.av-ikon{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;font-weight:700;font-size:14px;color:var(--acc);background:linear-gradient(145deg,color-mix(in srgb,var(--acc) 22%,var(--yta)),var(--acc-svag));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--acc) 18%,transparent)}
.av-text{display:grid;gap:3px;min-width:0}
.av-text b{font-size:16px;overflow-wrap:anywhere}
.av-text span{font-size:13.5px;color:var(--mut);overflow-wrap:anywhere}
.av-text .pill{justify-self:start;margin-top:2px}
.av-knappar{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap}
.av-tomt{display:grid;gap:8px;justify-items:center;text-align:center;padding:28px 12px;color:var(--mut);border:1px dashed var(--linje2);border-radius:var(--r3)}
.av-tomt p{margin:0;max-width:40ch}
.av-snabb{display:grid;gap:8px}
.av-snabbtext{font-size:12.5px;font-weight:600;color:var(--mut);text-transform:uppercase;letter-spacing:.08em}
.av .chips button,.av-blad .chips button{min-height:44px}
.av-ny{min-height:48px;border-radius:14px;box-shadow:0 1px 2px rgba(12,12,15,.12),0 6px 16px color-mix(in srgb,var(--acc) 28%,transparent)}
/* Formulär i blad (glas, som Koppla) */
.av-blad{backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);background:rgba(10,10,15,.36)}
.av-blad>div{background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);border:1px solid var(--linje);box-shadow:0 2px 4px rgba(0,0,0,.06),0 24px 64px rgba(0,0,0,.28);border-radius:24px 24px 0 0;max-width:640px}
@media (min-width:700px){.av-blad>div{border-radius:24px}}
.av-form{display:grid;gap:14px;min-width:0}
.av-form h2{margin:0;overflow-wrap:anywhere}
.av-mal{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
@media (min-width:520px){.av-mal{grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr)}}
.av-mer{border:1px solid var(--linje);border-radius:var(--r2);background:var(--yta2);min-width:0}
.av-mer summary{cursor:pointer;padding:12px 14px;font-weight:600;font-size:14px;min-height:44px;display:flex;align-items:center}
.av-mer-in{display:grid;gap:14px;padding:0 14px 14px;min-width:0}
.av-val{border:0;margin:0;padding:0;display:grid;gap:8px;min-width:0}
.av-val legend{padding:0;margin-bottom:6px;font-size:13px;color:var(--mut);font-weight:500}
.av-dagar{display:grid;gap:8px;grid-template-columns:minmax(0,1fr)}
@media (min-width:520px){.av-dagar{grid-template-columns:repeat(2,minmax(0,1fr))}}
.av-dag{display:grid;gap:4px;font-size:13px;color:var(--mut);min-width:0}
.av-dag input{width:100%;min-width:0;min-height:44px;border:1px solid var(--linje2);background:var(--yta);border-radius:var(--r1);padding:8px 10px;color:var(--ink);font-size:16px}
.av-dag[hidden],.av-dagar[hidden]{display:none}
.av-tekn{display:grid;gap:4px;font-size:14px}
.av-tekn p{margin:0;overflow-wrap:anywhere}
.av-nav{display:flex;gap:10px;justify-content:space-between;flex-wrap:wrap;position:sticky;bottom:calc(-1 * (20px + env(safe-area-inset-bottom)));background:linear-gradient(to top,var(--bg) 70%,transparent);padding:8px 0 2px}
.av-nav .knapp{min-height:48px;border-radius:14px}
.av-nav .knapp.acc{flex:1 1 140px;box-shadow:0 1px 2px rgba(12,12,15,.12),0 6px 16px color-mix(in srgb,var(--acc) 28%,transparent)}
@media (prefers-reduced-motion:reduce){.av *{transition:none!important;animation:none!important}}