/* Admincentrets skal (accounts/admin_shell.html) – laddas av skalet självt, så att det följer med till verktyg
   med egen route-CSS (Bibliotek, Kalkylstatistik, Ordbok). Eget driftläge: mörk sidomeny i stället för appens rail,
   solid ljus yta i stället för rummets bild, ingen composer, hemdocka eller hjälphörna. Allt nycklat på :has(.adm-shell)
   så att det följer med vid boostade sidbyten. Språket (ägaren 2026-11-01) är mobilens Hem och landningssidan: papper
   #f6f5ef med stilla korn, skogsgrön sidomeny med landningsherons korn och glöd. Tokens i admin-ui.css. */
.zimla-app-shell:has(.adm-shell), html.zimla-room .zimla-app-shell:has(.adm-shell) { background: var(--adm-paper-grain), var(--adm-paper); }  /* slår rumsläget (transparent) */
.zimla-app-shell:has(.adm-shell) .zimla-desktop-sidebar,
.zimla-app-shell:has(.adm-shell) .zimla-scene,
body:has(.adm-shell) .zimla-dock { display: none !important; }
html .zimla-app-shell:has(.adm-shell) .zimla-app-main { padding-left: 0 !important; }  /* slår appens hopfällda rail (4.62rem) */
#zimla-page-content:has(.adm-shell) { padding: 0; background: transparent; }
@media (min-width: 1024px) {
  html.zimla-room:not(.zimla-ai-start):not(.zimla-room-covered) #zimla-page-content:has(.adm-shell):has(.adm-shell__main) {
    margin: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none;
    max-width: none; max-height: none; overflow: visible; padding: 0;
  }
}
/* Färgerna (--adm-*) kommer från kitet (admin-ui.css). */
.adm-shell { display: grid; grid-template-columns: 244px minmax(0, 1fr); min-height: 100vh; color: var(--adm-ink); }
.adm-shell__main { min-width: 0; padding: 30px 48px 72px; }
.adm-shell__main > * { max-width: 1180px; margin-left: auto; margin-right: auto; }
/* Verktyg som behöver hela bredden (Bibliotek, Kanban): ingen innehållsbredd, mindre luft. */
.adm-shell--wide .adm-shell__main { padding: 18px 24px 40px; }
.adm-shell--wide .adm-shell__main > * { max-width: none; }
/* Sidomenyn: skogen från landningssidans hero – djupgrön med ljust korn och en svag glöd uppe till höger. Det aktiva
   valet ett mjukt ljust piller; gruppnamnen i mint som «OFFERT #210». */
.adm-side { position: sticky; top: 0; display: flex; flex-direction: column; height: 100vh; padding: 20px 12px 0; overflow-y: auto;
  background: var(--adm-grain), radial-gradient(ellipse 140% 34% at 100% 0%, rgb(47 143 108 / 30%), transparent 62%),
    radial-gradient(ellipse 120% 30% at 0% 70%, rgb(7 131 92 / 14%), transparent 60%), var(--adm-deep);
  background-size: 240px 240px, auto, auto, auto; color: rgb(247 248 237 / 80%); scrollbar-width: none; }
.adm-side::-webkit-scrollbar { display: none; }
.adm-side__brand { display: flex; align-items: center; gap: 11px; padding: 0 8px; }
.adm-side__dots { display: grid; grid-template-columns: repeat(2, 9px); gap: 3px; }
.adm-side__dots i { width: 9px; height: 9px; border-radius: 50%; background: #f7f8ed; }
.adm-side__dots i:nth-child(2), .adm-side__dots i:nth-child(4) { background: #2fb47a; }
.adm-side__brand b { display: block; color: #f7f8ed; font-family: var(--adm-serif); font-size: 19px; font-weight: 400; line-height: 1.1; letter-spacing: -.01em; }
.adm-side__brand small { display: block; margin-top: 2px; color: rgb(247 248 237 / 66%); font-size: 11.5px; }
.adm-side__back { display: flex; align-items: center; gap: 6px; min-height: 38px; margin: 18px 0 16px; padding: 0 14px 0 10px; border: 1px solid rgb(255 255 255 / 14%); border-radius: 999px; background: rgb(255 255 255 / 6%); color: #f7f8ed; font-size: 13.5px; }
.adm-side__back:hover { background: rgb(255 255 255 / 11%); color: #fff; }
.adm-side__back .material-symbols-outlined { font-size: 18px; }
.adm-side__nav { display: grid; gap: 2px; padding-bottom: 14px; }
.adm-side__group { margin: 18px 12px 6px; color: rgb(143 224 180 / 82%); font-size: 10.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.adm-side__link { display: flex; align-items: center; gap: 10px; min-height: 36px; padding: 6px 12px; border: 1px solid transparent; border-radius: 999px; color: rgb(247 248 237 / 80%); font-size: 13.5px; transition: background-color 140ms, color 140ms; }
.adm-side__link .material-symbols-outlined { color: rgb(247 248 237 / 58%); font-size: 18px; }
.adm-side__link:hover { background: rgb(255 255 255 / 6%); color: #fff; }
.adm-side__link[aria-current] { border-color: rgb(255 255 255 / 14%); background: rgb(247 248 237 / 13%); color: #fff; box-shadow: inset 0 1px 0 rgb(255 255 255 / 10%); }
.adm-side__link[aria-current] .material-symbols-outlined { color: #8fe0b4; }
.adm-side__link:focus-visible, .adm-side__back:focus-visible { outline: 2px solid #8fe0b4; outline-offset: 1px; }
.adm-side__count { margin-left: auto; display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 19px; padding: 0 7px; border-radius: 999px; background: rgb(143 224 180 / 18%); color: #d9f7e6; font-size: 11px; font-style: normal; font-weight: 600; font-variant-numeric: tabular-nums; }
.adm-side__count.is-warn { background: #f2c063; color: #2b1d00; }
/* Siffran är en egen länk till sitt urval (8 ogranskade chattar → Chattar · Ej granskade), lagd över menyradens högra ände. */
.adm-side__item { position: relative; display: block; }
.adm-side__item > .adm-side__link { padding-right: 48px; }
a.adm-side__count { position: absolute; top: 50%; right: 10px; transform: translateY(-50%); text-decoration: none; transition: box-shadow 140ms; }
a.adm-side__count:hover { box-shadow: 0 0 0 2px rgb(143 224 180 / 45%); }
a.adm-side__count.is-warn:hover { box-shadow: 0 0 0 2px rgb(242 192 99 / 50%); }
a.adm-side__count:focus-visible { outline: 2px solid #8fe0b4; outline-offset: 2px; }
@media (pointer: coarse) { a.adm-side__count { min-width: 30px; height: 26px; } }
.adm-side__out { margin-left: auto; color: rgb(247 248 237 / 50%); font-size: 12px; font-style: normal; }
.adm-side__me { position: sticky; bottom: 0; display: flex; align-items: center; gap: 10px; margin: auto -12px 0; padding: 14px 20px; border-top: 1px solid rgb(255 255 255 / 9%);
  background: var(--adm-grain), var(--adm-deep); background-size: 240px 240px, auto; }
.adm-side__avatar { position: relative; display: inline-grid; flex: 0 0 auto; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #f7f8ed; color: var(--adm-deep); font-size: 11px; font-weight: 600; }
.adm-side__avatar::after { content: ''; position: absolute; right: -1px; bottom: -1px; width: 9px; height: 9px; border: 2px solid var(--adm-deep); border-radius: 50%; background: #2fbf71; }
.adm-side__me b { display: block; color: #f7f8ed; font-size: 13px; font-weight: 500; }
.adm-side__me small { display: block; color: rgb(247 248 237 / 66%); font-size: 11.5px; }
.adm-pick { display: none; }
@media (pointer: coarse) { .adm-side__link, .adm-side__back { min-height: 44px; } }
@media (prefers-reduced-motion: reduce) { .adm-side__link { transition: none; } }
@media (max-width: 1023px) {
  .adm-shell { display: block; min-height: 0; }
  .adm-side { display: none; }
  .adm-shell__main { padding: 8px 16px calc(40px + env(safe-area-inset-bottom)); overflow-x: clip; }
  /* Väljaren som mobilens skrivrad (.zmh-compose): ett glaspiller; menyn är sidomenyns skog. */
  .adm-pick { display: block; position: relative; z-index: 20; max-width: none; margin: 4px 16px 16px; }
  .adm-pick > summary { display: flex; align-items: center; gap: 8px; min-height: 52px; padding: 0 8px 0 20px; border: 1px solid var(--adm-glass-edge); border-radius: 999px;
    background: linear-gradient(180deg, rgb(255 255 255 / 66%), rgb(255 255 255 / 40%)); cursor: pointer; list-style: none;
    -webkit-backdrop-filter: blur(18px) saturate(1.25); backdrop-filter: blur(18px) saturate(1.25);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 95%), inset 0 -1px 0 rgb(18 56 43 / 6%), 0 1px 2px rgb(20 30 25 / 5%), 0 14px 32px -20px rgb(18 56 43 / 40%); }
  .adm-pick > summary::-webkit-details-marker { display: none; }
  .adm-pick > summary:focus-visible { outline: 2px solid var(--adm-green); outline-offset: 2px; }
  .adm-pick > summary small { color: var(--adm-green); font-size: 10.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
  .adm-pick > summary b { min-width: 0; overflow: hidden; color: var(--adm-deep); font-family: var(--adm-serif); font-size: 19px; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
  .adm-pick > summary .material-symbols-outlined { display: grid; flex: none; place-items: center; width: 38px; height: 38px; margin-left: auto; border-radius: 50%; background: var(--adm-deep); color: #fff; font-size: 20px; }
  .adm-pick > summary .adm-side__count { margin-left: auto; }
  .adm-pick > summary .adm-side__count + .material-symbols-outlined { margin-left: 0; }
  .adm-pick__menu { position: absolute; z-index: 40; top: calc(100% + 8px); left: 0; right: 0; max-height: 70vh; max-height: 70dvh; padding: 8px; overflow-y: auto; border-radius: 24px;
    background: var(--adm-grain), radial-gradient(ellipse 120% 30% at 100% 0%, rgb(47 143 108 / 28%), transparent 62%), var(--adm-deep); background-size: 240px 240px, auto, auto;
    box-shadow: 0 24px 48px -20px rgb(15 58 44 / 70%); }
  .adm-pick__menu p { margin: 14px 12px 4px; color: rgb(143 224 180 / 82%); font-size: 10.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
  .adm-pick__menu a { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px; border-radius: 999px; color: rgb(247 248 237 / 86%); font-size: 14px; }
  .adm-pick__menu a b { font-weight: 400; }
  .adm-pick__menu a[aria-current] { background: rgb(247 248 237 / 13%); color: #fff; }
  .adm-pick__menu .material-symbols-outlined { color: rgb(247 248 237 / 58%); font-size: 18px; }
  .adm-pick__menu a[aria-current] .material-symbols-outlined { color: #8fe0b4; }
  .adm-pick__menu .adm-side__item > a:first-child { padding-right: 52px; }
  .adm-pick__menu a.adm-side__count { display: inline-flex; min-height: 0; padding: 0 9px; border-radius: 999px; color: #2b1d00; font-size: 11.5px; }
  .adm-pick__menu a.adm-side__count:not(.is-warn) { color: #d9f7e6; }
}

/* Samma sidhuvud på alla admincentrets sidor (partials/admin_page_head.html): brödsmulan som en liten grön versal
   (landningssidans «OFFERT #210»), rubriken i Newsreader i skogens grön, en rad under.
   Här och inte i admin-center.css, eftersom Bibliotek, Ordbok och Kalkylstatistik inte laddar den. */
.adm-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 16px; margin-top: 4px; }
.adm-title { min-width: 0; color: var(--adm-ink); }
.adm-title .adm-crumb { margin: 0 0 8px; color: var(--adm-green); font-size: 11px; font-weight: 600; letter-spacing: .09em; line-height: 1.4; text-transform: uppercase; }
.adm-title h1 { margin: 0; color: var(--adm-deep); font-family: var(--adm-serif); font-size: 36px; font-weight: 400; line-height: 1.08; letter-spacing: -.02em; }
.adm-title p { margin: 6px 0 0; color: var(--adm-mut); font-size: 13.5px; }
.adm-title .adm-crumb { margin-bottom: 8px; }
/* Rubriken och ⓘ (menypostens beskrivning som tooltip – ingen förklarande rad) på en rad; statuspillren (.adm-head__status,
   högst 3) och sidans huvudknapp står till höger på samma rad. */
.adm-title__row { display: flex; align-items: center; gap: 6px; min-width: 0; }
.adm-title__row h1 { min-width: 0; overflow-wrap: anywhere; }
.adm-title__row .adm-tip { margin-top: 4px; }
.adm-head__status { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
.adm-head > :not(.adm-title) { margin-bottom: 1px; }
.adm-crumb a { color: inherit; text-decoration: none; }
.adm-crumb a:hover { color: var(--adm-green-hover); text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 640px) {
  .adm-title h1 { font-size: 30px; }
  /* Menyväljaren säger redan var man är: brödsmula, rubrik och rad göms (kvar för skärmläsare); statuspillren står kvar.
     En undersida (en chatt som egen sida) behåller sin rubrik. */
  .adm-title:not(.adm-title--sub) > *, .adm-title--sub > .adm-crumb {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  .adm-head:not(:has(> :not(.adm-title))), .adm-head:not(:has(> :not(.adm-title))) > .adm-title { display: contents; } /* ingen tom rad */
  .adm-head { align-items: center; }
}