/* /Components/Abonnementstilbudkort.razor.rz.scp.css */
/* ABO-22: forhåndsvisningens merknad står øverst i arket, der lukkeknappen
   (.ark-lukk, absolutt plassert øverst til høyre) ligger — hold teksten unna den. */
.forhandsvisning-merknad[b-5ru6fywi3h] {
    padding-right: 2.5rem;
}
/* /Components/DatoKlokkeslettfelt.razor.rz.scp.css */
/* KND-52: dato og klokkeslett på én linje, også på 375 px. Datoen krymper,
   klokkeslettet har fast bredde (Klokkeslettfelt.razor.css). Meldingene tar
   en hel linje under feltene. */
.dato-tid[b-jctbyb1ajx] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    max-width: 480px;
    margin-bottom: var(--sp-4);
}

.dato-tid .search-input.dato-tid-dato[b-jctbyb1ajx] {
    flex: 1 1 9rem;
    min-width: 8.5rem;
    max-width: 13rem;
    margin-bottom: 0;
}

.dato-tid[b-jctbyb1ajx]  .search-input.klokkeslett-felt {
    margin-bottom: 0;
}

.dato-tid[b-jctbyb1ajx]  .validation-message,
.dato-tid .validation-message[b-jctbyb1ajx] {
    flex-basis: 100%;
}

/* KND-54: datoen skrevet ut tar en hel linje under feltene. */
.dato-tid[b-jctbyb1ajx]  .datolinje {
    flex-basis: 100%;
    margin: 0;
}
/* /Components/Fastvalgfelt.razor.rz.scp.css */
/* UI-195: lista legger seg under feltet i full bredde (.sok-forslag er absolutt
   posisjonert, app.css) — samme forelder-regel som .adresse-felt. */
.fastvalg-felt[b-fud6ctqs6k] {
    position: relative;
}

/* Trykkflate minst 44 px på mobil (DESIGNSYSTEM 8). */
.sok-forslag-rad[b-fud6ctqs6k] {
    min-height: 2.75rem;
}

/* Tastaturmarkering = hover-fargen, som i AdresseFelt.razor.css. */
.sok-forslag-rad.aktiv[b-fud6ctqs6k] {
    background: var(--mod-primar-tint);
}
/* /Components/Felles/AdresseFelt.razor.rz.scp.css */
/* KND-3: synlig markering for tastaturnavigering i forslagslista.
   Gjenbruker fargen fra husets .sok-forslag-rad:hover (app.css) — mus og
   tastatur skal se identiske ut, ikke to ulike markeringer. */
.sok-forslag-rad.aktiv[b-yjc2jyhhzm] {
    background: var(--mod-primar-tint);
}
/* /Components/Felles/Datokalender.razor.rz.scp.css */
/* ================================================================
   DESIGNSYSTEM 6.14 `dato-kalender` — felles månedskalender (UTL-13B1, løftet
   fra påmeldingen; PAM-241, designsvaret (6)).
   Tokens, aldri hex. Fargene tar merkevaren når siden har en (--mv-*,
   satt av Merkevarestil), ellers temaets — samme fallback-form som resten
   av påmeldingssiden.

   375 px: kortet har --sp-4 inni, så sju kolonner blir ≈44 px hver — det
   er akkurat trykkflaten, derfor ligger ingenting annet i rutenettet.
   Under 360 px blir cellene mindre enn 44 px: designets ene godkjente
   unntak (hele cella er trykkflaten).
   ================================================================ */

.dato-kalender[b-gywbepibbu] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    max-width: 26rem;
}

.dato-kalender-etikett[b-gywbepibbu] {
    margin: 0;
    font-weight: 600;
    color: var(--mv-tekst, var(--mod-tekst));
}

/* «‹  Desember 2026  ›» — pilene er 44 px; en pil som ikke finnes, holder plassen. */
.dato-kalender-maanedsrad[b-gywbepibbu] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.dato-kalender-maaned[b-gywbepibbu] {
    flex: 1;
    margin: 0;
    text-align: center;
    font-weight: 600;
    color: var(--mv-tekst, var(--mod-tekst));
}

.dato-kalender-pil[b-gywbepibbu],
.dato-kalender-pil-plass[b-gywbepibbu] {
    flex: none;
    width: 44px;
    height: 44px;
}

.dato-kalender-pil[b-gywbepibbu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-family: var(--mod-font);
    font-size: 1.25rem;
    line-height: 1;
    color: var(--mv-tekst, var(--mod-tekst));
    background: transparent;
    border: 1px solid var(--mv-kant, var(--mod-kant-sterk));
    border-radius: var(--mod-radius-liten);
    cursor: pointer;
}

.dato-kalender-rutenett[b-gywbepibbu] {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

/* Ukedagshodet «ma ti on to fr lø sø»: 0,75 rem, dus. */
.dato-kalender-rutenett th[b-gywbepibbu] {
    padding: 0 0 var(--sp-1);
    font-size: 0.75rem;
    font-weight: 400;
    text-align: center;
    color: var(--mv-tekst-dus, var(--mod-tekst-dus));
}

.dato-kalender-rutenett td[b-gywbepibbu] {
    height: 44px;
    padding: 0;
    text-align: center;
}

.dato-kalender-dag[b-gywbepibbu] {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    height: 44px;
    font-variant-numeric: tabular-nums;
    border: 1px solid transparent;
    border-radius: var(--mod-radius-liten);
}

/* Har avgang: en knapp, tallet 600 i teksten. */
button.dato-kalender-dag[b-gywbepibbu] {
    padding: 0;
    font-family: var(--mod-font);
    font-size: 1rem;
    font-weight: 600;
    color: var(--mv-tekst, var(--mod-tekst));
    background: transparent;
    cursor: pointer;
}

button.dato-kalender-dag:hover[b-gywbepibbu] {
    border-color: var(--mv-kant, var(--mod-kant-sterk));
}

/* Dus / fullt / opptatt (ingen avgang, før tillatt, utenfor vinduet): dust tall. */
.dato-kalender-dag.dato-kalender-dag-dus[b-gywbepibbu] {
    font-weight: 400;
    color: var(--mv-tekst-dus, var(--mod-tekst-dus));
}

/* Fullt og opptatt (samme stil, DESIGNTRÅD v29): streken gjør at fargen ikke står alene (kap. 8). */
.dato-kalender-dag-fullt[b-gywbepibbu],
.dato-kalender-dag-opptatt[b-gywbepibbu] {
    text-decoration: line-through;
}

/* I dag: 1 px kant. */
.dato-kalender-dag.dato-kalender-dag-idag[b-gywbepibbu] {
    border-color: var(--mv-tekst-dus, var(--mod-tekst-dus));
}

/* Valgt: fylt med merkevarens hovedfarge, teksten i kontrastfargen. */
.dato-kalender-dag.dato-kalender-dag-valgt[b-gywbepibbu] {
    color: var(--mv-tekst-paa-hoved, var(--mod-flate));
    background: var(--mv-hoved, var(--mod-primar));
    border-color: var(--mv-hoved, var(--mod-primar));
}
/* /Components/Felles/Maanedsvelger.razor.rz.scp.css */
/* UTL-35A: flyttet uendret fra Pages/Rapporter.razor.css (RAP-1a) — samme
   klassenavn, samme verdier. Speiler .hviletid-ukevelger (KjoreHviletidUke.razor.css):
   samme tokens, ingen farger her. */

.rapport-maanedvelger[b-cmx4waeje8] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    margin-bottom: var(--sp-4);
}

/* Trykkflate 44 × 44: .btn-tekst gir høyden, bredden må pilene få selv. */
.rapport-maanedpil[b-cmx4waeje8] {
    min-width: 44px;
    justify-content: center;
}

.rapport-maanedtekst[b-cmx4waeje8] {
    font-weight: 600;
    min-width: 9rem;
    text-align: center;
}

/* RAP-1b: i toppraden (.rapport-topp, sidas egen) gir radens gap luften. Står her
   fordi velgerens scope-attributt nå er komponentens — sidas regel ville ikke truffet. */
.rapport-topp .rapport-maanedvelger[b-cmx4waeje8] {
    margin-bottom: 0;
}
/* /Components/Felles/Tidslinjetavle.razor.rz.scp.css */
/* UTL-34A — tavla er kjøreplanens, og .kp-* er globale i app.css. Det eneste som ikke er globalt, er kravet fra
   KND-89 som står SCOPET i Kjoreplan.razor.css: trykkflaten på datoene skal være minst 40 px høy på 375 px, og
   sporet må vokse like mye (knappene er absolutt posisjonert). Uten disse to reglene ville kalenderens dagmerker
   vært 32 px på mobil mens kjøreplanens er 40 — samme tavle, ulik trykkflate. Kopiert ordrett; når bussen
   tegner med denne komponenten (UTL-34B), flytter reglene hit og forsvinner fra Kjoreplan.razor.css. */
@media (max-width: 640px) {
    .kp-hode-dager .kp-spor[b-27xk1mjkut] {
        height: 2.75rem;
    }

    .kp-hode-dager .kp-dagmerke.kp-hopp[b-27xk1mjkut] {
        min-height: 40px;
    }
}

/* UTL-34A (målt 28.10): bussens stolper får tekstfargen inline sammen med sjåførfargen; tavlas poster har ingen
   farge, så `html.tema-moderne a` (0,1,2) slo `.kp-bar-oppdrag` (0,1,0), og teksten ble mørk oransje på oransje —
   uleselig. Klassene + scope-attributtet vinner. Ikke på utildelt-stolpene: de har sin ravgule tekstfarge. */
.kp-bar.kp-bar-oppdrag:not(.kp-bar-utildelt)[b-27xk1mjkut] {
    color: var(--merkevarefarge-tekst);
}
/* /Components/GoProduktvelger.razor.rz.scp.css */
/* REV-PO-34 — velgeren for et produkt i PowerOffice Go.

   Scoped, ikke i app.css: komponenten brukes på to sider, og app.css er delt.
   Mobile-first: alt bryter på ord (og på «anywhere» for lange koder), så
   375 px aldri gir sidescroll — navnet brytes, det kuttes ikke. */
.go-velger[b-gki5e70fkt] {
    display: grid;
    gap: var(--sp-1, 4px);
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
}

.go-velger-valgt[b-gki5e70fkt] {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-1, 4px);
    margin: 0;
}

.go-velger-borte[b-gki5e70fkt] {
    color: var(--mod-rod-tekst, #991b1b);
    font-weight: 600;
}

.go-velger-hjelp[b-gki5e70fkt] {
    margin: 0;
    font-size: .85rem;
    color: var(--mod-tekst-dus, #5f6673);
}

.go-velger-knapper[b-gki5e70fkt] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2, 8px);
}

.go-velger-forslag[b-gki5e70fkt] {
    justify-self: start;
    text-align: left;
    white-space: normal;
}

.go-velger-sok[b-gki5e70fkt] {
    width: 100%;
    max-width: 28rem;
}

/* Lista: høyst ~ti rader synlig, resten rulles inne i lista — HKB har 25. */
.go-velger-liste[b-gki5e70fkt] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 2px;
    max-height: 22rem;
    overflow-y: auto;
    max-width: 36rem;
    border: 1px solid var(--mod-kant, #e5e7eb);
    border-radius: 6px;
}

/* PO-KOBL (Remi 01.10.2026): hvert valg i fire deler — kode, navn, konto, sats.
   Smal liste (375 px, eller en smal tabellcelle — Koblinger-cellen er ≈240 px
   også på 1280 px, og bredere kan den ikke bli uten at tabellen flyter ut av
   kortet): to linjer, «kode navn» over «konto 3000 · 12 %», med kode, konto og
   sats i faste, justerte kolonner. Bred liste (≥ 30rem): fire kolonner på én
   linje. Container-spørring, så det samme virker på Priser og i Koblinger. */
.go-velger-liste[b-gki5e70fkt] {
    container-type: inline-size;
}

.go-velger-valg[b-gki5e70fkt] {
    display: grid;
    /* Faste bredder, så kode, konto og sats står rett under hverandre fra rad til rad. */
    grid-template-columns: 2.75rem 6.25rem minmax(0, 1fr);
    grid-template-areas:
        "kode navn navn"
        ".    konto sats";
    align-items: baseline;
    gap: 0 var(--sp-2, 8px);
    width: 100%;
    min-height: 44px;
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    white-space: normal;
    cursor: pointer;
}

.go-velger-valg:hover[b-gki5e70fkt],
.go-velger-valg:focus-visible[b-gki5e70fkt] {
    background: var(--mod-flate-dus, #f3f4f6);
}

.go-velger-valg-valgt[b-gki5e70fkt] {
    font-weight: 600;
    background: var(--mod-blaa-bg, #e0ecff);
}

.go-velger-merke[b-gki5e70fkt] {
    font-size: .8rem;
    color: var(--mod-tekst-dus, #5f6673);
}

.go-velger-kode[b-gki5e70fkt] {
    grid-area: kode;
    font-weight: 600;
}

.go-velger-navn[b-gki5e70fkt] {
    grid-area: navn;
    min-width: 0;
}

.go-velger-konto[b-gki5e70fkt],
.go-velger-sats[b-gki5e70fkt] {
    font-size: .85rem;
    color: var(--mod-tekst-dus, #5f6673);
    font-variant-numeric: tabular-nums;
}

.go-velger-konto[b-gki5e70fkt] { grid-area: konto; }

.go-velger-sats[b-gki5e70fkt] { grid-area: sats; }

/* Midtprikken mellom konto og sats på to linjer; kolonnene trenger den ikke. */
.go-velger-sats[b-gki5e70fkt]::before {
    content: "· ";
}

@container (min-width: 30rem) {
    .go-velger-valg[b-gki5e70fkt] {
        grid-template-columns: 4.5rem minmax(0, 1fr) 7.5rem 5rem;
        grid-template-areas: "kode navn konto sats";
    }

    .go-velger-sats[b-gki5e70fkt]::before {
        content: none;
    }

    .go-velger-sats[b-gki5e70fkt] {
        text-align: right;
    }
}

/* «Samme sats (12 %)» / «Andre satser»: overskrift og skillelinje i lista. */
.go-velger-gruppe[b-gki5e70fkt] {
    padding: var(--sp-2, 8px) var(--sp-3, 12px) var(--sp-1, 4px);
    font-size: .8rem;
    font-weight: 600;
    color: var(--mod-tekst-dus, #5f6673);
    background: var(--mod-flate-dus, #f3f4f6);
}

.go-velger-gruppe:not(:first-child)[b-gki5e70fkt] {
    border-top: 1px solid var(--mod-kant, #e5e7eb);
}

/* PO-FORSLAG: «Forslag» ved et forhåndsvalgt produkt som ikke er lagret. En
   liten brikke i primærfargens tint — synlig nok til at ingen tar det for en
   lagret kobling, uten å se ut som en feil. */
.go-velger-forslagsmerke[b-gki5e70fkt] {
    flex: none;
    padding: 0 var(--sp-2, 8px);
    border-radius: 999px;
    background: var(--mod-primar-tint, #fff7ed);
    color: var(--mod-primar-mork, #9a3412);
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.6;
}

/* Husets .btn-avbryt bærer marg og full bredde for å stå alene under et
   skjema. Her står knappene side om side i velgeren — ingen marg, egen bredde. */
.go-velger .btn-avbryt[b-gki5e70fkt] {
    margin: 0;
    width: auto;
    max-width: none;
}
/* /Components/Hjelpfaner.razor.rz.scp.css */
/* NYT-6: fanene er lenker — lenkefargen og understreken viker for fanens egne
   (samme grep som SjaforFaner.razor.css; utseendet er .status-faner uendret). */
.hjelp-faner .status-fane[b-2d2b7ocg92] {
    text-decoration: none;
    color: var(--mod-tekst-dus);
}

.hjelp-faner .status-fane:hover[b-2d2b7ocg92],
.hjelp-faner .status-fane.aktiv[b-2d2b7ocg92] {
    color: var(--mod-tekst);
}

/* Supportmerket står på linje med fanenavnet, uten bunnmargen merket har i lister. */
.hjelp-faner .hjelp-fane-tall[b-2d2b7ocg92] {
    margin: 0 0 0 var(--sp-2);
}
/* /Components/Kategorisatser.razor.rz.scp.css */
/* PRI-96: kategorikortets satser. Flatene (.kort-del), aksetitlene og trappetabellen
   (.pristrinn-tabell) er app.css sine — her står bare det komponenten legger til. */

/* Deltittel med handlingene (Fjern, «+ Flere trinn») på samme linje. */
.kategori-delhode[b-e8dez8wwlw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2);
    flex-wrap: wrap;
    margin-bottom: var(--sp-2);
}

.kategori-delhode h3[b-e8dez8wwlw] {
    margin: 0;
}

.kategori-delhode-knapper[b-e8dez8wwlw] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    flex-wrap: wrap;
}

.kategori-startvalg[b-e8dez8wwlw] {
    border: 0;
    padding: 0;
    margin: 0 0 var(--sp-2);
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}

.kategori-lenker[b-e8dez8wwlw] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--sp-1) var(--sp-3);
    margin-top: var(--sp-2);
}

/* «De første [N] timene koster [X] kr» — tekst og felt i én linje som bryter på 375 px. */
.kategori-takst-rad[b-e8dez8wwlw] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    margin-bottom: var(--sp-3);
}

.kategori-takst-rad .search-input[b-e8dez8wwlw] {
    margin-bottom: 0;
    width: 8rem;
    max-width: 100%;
}

.kategori-takst-rad .kategori-smal[b-e8dez8wwlw] {
    width: 7rem;
}

.kategori-takst-rad label[b-e8dez8wwlw] {
    font-size: 0.875rem;
    font-weight: 600;
}

/* Tidstrappa har fire kolonner: fra, kr, gjelder, Fjern. */
.kategori-taksttrapp[b-e8dez8wwlw] {
    grid-template-columns: 1fr 1.2fr 1.2fr auto;
}

.kategori-hel-rad[b-e8dez8wwlw] {
    grid-column: 1 / -1;
}

.kategori-leggtil-gruppe + .kategori-leggtil-gruppe[b-e8dez8wwlw] {
    margin-top: var(--sp-3);
}

.kategori-leggtil-gruppe > p[b-e8dez8wwlw] {
    margin: 0 0 var(--sp-1);
}

/* Knappen sier hva den erstatter og hva som ligger lagret — linjene står under teksten. */
.kategori-leggtil[b-e8dez8wwlw] {
    height: auto;
    min-height: 48px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.kategori-leggtil-under[b-e8dez8wwlw] {
    display: block;
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--mod-tekst-dus);
}

.kategori-eksempellinjer[b-e8dez8wwlw] {
    list-style: none;
    margin: 0;
    padding: 0;
    font-variant-numeric: tabular-nums;
}

.kategori-eksempellinjer li[b-e8dez8wwlw] {
    display: flex;
    justify-content: space-between;
    gap: var(--sp-3);
    padding: var(--sp-1) 0;
    border-bottom: 1px solid var(--mod-kant);
}

.kategori-eksempelsum[b-e8dez8wwlw] {
    margin: var(--sp-2) 0;
    font-variant-numeric: tabular-nums;
}

.kategori-regnestykke[b-e8dez8wwlw] {
    margin: 0;
    padding-left: var(--sp-4);
    color: var(--mod-tekst-dus);
    font-size: 0.875rem;
}

@media (max-width: 640px) {
    .kategori-taksttrapp[b-e8dez8wwlw] {
        grid-template-columns: 1fr 1fr;
    }
}
/* /Components/KjoreHviletidUke.razor.rz.scp.css */
/* KND-26 B / UI-122: tabellen er husets (.data-tabell i .tabell-kort, og
   .tabell-stablet + data-etikett under 640.98 px) — her står bare det som er
   sidens eget: ukevelgeren, raden som knapp, verdi + merke i én celle og turene
   under en åpen sjåfør. Ingen farger her: merkene er status-merke med statusparene
   fra tema-moderne.css, og alt annet er tokens. Vaktpost: Ui122Vaktpost. */

.hviletid-ukevelger[b-gsosk03wnd] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    margin-bottom: var(--sp-2);
}

/* Trykkflate 44 × 44 (5): .btn-tekst gir høyden, bredden må pilene få selv. */
.hviletid-ukepil[b-gsosk03wnd] {
    min-width: 44px;
    justify-content: center;
}

.hviletid-uketekst[b-gsosk03wnd] {
    font-weight: 600;
}

.hviletid-uketekst small[b-gsosk03wnd] {
    font-weight: 400;
    color: var(--mod-tekst-dus);
    margin-left: var(--sp-1);
}

.hviletid-laster[b-gsosk03wnd] {
    opacity: 0.6;
}

/* Tall i kolonnene står under hverandre. */
.hviletid-tabell .tall[b-gsosk03wnd] {
    font-variant-numeric: tabular-nums;
}

.hviletid-rad[b-gsosk03wnd] {
    cursor: pointer;
}

/* Navnecella bærer knappen; knappen er selv 44 px høy, så cella trenger ikke
   egen luft over og under for at raden skal holde 44. */
.hviletid-tabell td.hviletid-navnecelle[b-gsosk03wnd] {
    padding-top: 0;
    padding-bottom: 0;
}

.hviletid-sjafor[b-gsosk03wnd] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    width: 100%;
    min-height: 44px;
    padding: 0;
    background: none;
    border: none;
    border-radius: var(--mod-radius-liten);
    text-align: left;
    font: inherit;
    font-weight: 600;
    color: inherit;
    cursor: pointer;
}

/* Verdien og merket står sammen — på mobil til høyre for ledeteksten. */
.hviletid-celle[b-gsosk03wnd] {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--sp-2);
}

/* Husets .status-merke har luft under seg (for kort); i en rad står den midt på linja. */
.hviletid-celle .status-merke[b-gsosk03wnd],
.hviletid-turer .status-merke[b-gsosk03wnd] {
    margin: 0;
}

/* UI-122b: «Samtidige ordrer: #1941 og #2101, …» kan bli lang — den står på
   egen linje under antallet og brytes i stedet for å skyve tabellen ut av kortet
   (cellene er nowrap på desktop). */
.hviletid-tabell .hviletid-samtidige[b-gsosk03wnd] {
    display: block;
    width: fit-content;
    margin: var(--sp-1) 0 0 auto;
    white-space: normal;
    text-align: left;
}

.hviletid-dus[b-gsosk03wnd] {
    color: var(--mod-tekst-dus);
}

/* Åpen sjåfør: turene hører til raden over, så skillestreken står under turene. */
.hviletid-apen td[b-gsosk03wnd] {
    border-bottom-color: transparent;
}

.hviletid-tabell tbody tr.hviletid-turrad:hover[b-gsosk03wnd] {
    background: none;
}

.hviletid-turrad td[b-gsosk03wnd] {
    padding-top: 0;
    padding-left: calc(var(--sp-4) + 14px + var(--sp-2));
    white-space: normal;
}

.hviletid-bruddlinje[b-gsosk03wnd] {
    margin: 0 0 var(--sp-2);
    font-weight: 600;
}

.hviletid-turer[b-gsosk03wnd] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

.hviletid-turer li[b-gsosk03wnd] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    font-variant-numeric: tabular-nums;
}

.hviletid-ingen[b-gsosk03wnd] {
    margin: 0;
}

/* UI-148: samme brytepunkt som .tabell-stablet i app.css — reglene gjelder kortvisningen. */
@media (max-width: 922.98px) {
    /* Stablet er cella en flex-rad (ledetekst · antall): merket tar en hel linje under. */
    .hviletid-tabell .hviletid-samtidige[b-gsosk03wnd] {
        flex: 1 0 100%;
        width: auto;
        margin: var(--sp-1) 0 0;
    }

    /* Husets stablede rad har grensen nederst; en åpen sjåfør deler den med turene. */
    .hviletid-apen[b-gsosk03wnd] {
        border-bottom: none;
    }

    .hviletid-turrad[b-gsosk03wnd] {
        padding-top: 0;
    }

    .hviletid-turrad td[b-gsosk03wnd] {
        display: block;
        padding: 0 0 var(--sp-2);
    }
}
/* /Components/Klokkeslettfelt.razor.rz.scp.css */
/* KND-52: fem tegn («13:45») trenger ikke 480 px. Tre klasser i selektoren
   slår både .search-input og .stopp-tider .search-input i app.css, uansett
   rekkefølgen stilarkene lastes i. Min-høyden (3rem) arves: stor treffflate. */
.search-input.klokkeslett-felt[b-q414bif64o] {
    width: 6.5rem;
    max-width: 6.5rem;
    flex: 0 0 auto;
    font-variant-numeric: tabular-nums;
    text-align: center;
}
/* /Components/KomIGangTilbake.razor.rz.scp.css */
/* PO-VEIVISER-B: veien tilbake til veiviseren, øverst på siden lenka åpnet. */
.kom-i-gang-tilbake[b-p0h6itjn6b] {
    margin: 0 0 0.5rem;
    font-size: 0.95rem;
}

.kom-i-gang-tilbake a[b-p0h6itjn6b] {
    display: inline-block;
    padding: 0.35rem 0;
    font-weight: 600;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-ksy0u6hx0k] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-ksy0u6hx0k] {
    flex: 1;
}

.top-row[b-ksy0u6hx0k] {
    background-color: var(--mod-bg);
    border-bottom: 1px solid var(--mod-kant);
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-ksy0u6hx0k]  a {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-ksy0u6hx0k]  a:hover {
        text-decoration: underline;
    }

    .top-row[b-ksy0u6hx0k]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-ksy0u6hx0k] {
        justify-content: space-between;
    }

    .top-row[b-ksy0u6hx0k]  a {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-ksy0u6hx0k] {
        flex-direction: row;
    }

    /* Uten dette arver main flexbox sin «min-width: auto» og nekter å krympe
       under innholdets naturlige bredde. Fane-stripene og belegg-tabellen er
       brede av natur, og resultatet var at HELE siden fikk horisontal scroll
       fra 641 px og oppover: 519 px på ordresiden ved nettbrettbredde.
       Elementer som skal kunne bli brede, har sine egne scroll-beholdere. */
    main[b-ksy0u6hx0k] {
        min-width: 0;
    }

    .sidebar[b-ksy0u6hx0k] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-ksy0u6hx0k] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-ksy0u6hx0k]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-ksy0u6hx0k], article[b-ksy0u6hx0k] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-ksy0u6hx0k] {
    color-scheme: light only;
    background: var(--mod-gul-bg);
    border-top: 1px solid var(--mod-gul-kant);
    color: var(--mod-gul-tekst);
    font-size: 0.95rem;
    display: none;
    align-items: center;
    gap: 1rem;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-ksy0u6hx0k] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }


#blazor-error-ui .btn-feil-reload[b-ksy0u6hx0k] {
    display: inline-block;
    margin-left: 0.75rem;
    padding: 0.25rem 1rem;
    background: var(--merkevarefarge);
    color: var(--merkevarefarge-tekst);
    border-radius: 0.375rem;
    text-decoration: none;
    font-weight: 600;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-ccavw9mp3z] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-ccavw9mp3z] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-ccavw9mp3z] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
    /* Bootstrap gir .navbar 0,5 rem padding-y. Logolenka under må ha 44 px
       trykkhøyde (UI-24), og 44 + 2×8 = 60 px ville dyttet raden forbi sine
       3,5 rem — altså en høyere header.

       4 px er valgt for at min-height skal styre høyden, ikke innholdet:
       44 + 2×4 + 1 px kantlinje = 53 px, godt under 56, så raden legger seg
       på sine 3,5 rem som før. Kantlinja kommer fra tema-moderne.css og
       teller med (box-sizing: border-box) — med 6 px ble summen 57 px, altså
       én piksel høyere header. Målt, ikke regnet. */
    --bs-navbar-padding-y: 4px;
}

.navbar-brand[b-ccavw9mp3z] {
    font-size: 1.1rem;
    /* UI-24: siste trykkflate under 44 px. Lenka målte 36,4 px (5 px padding
       over og under + 26,4 px linjehøyde) — den minste trykkflaten i appen.
       Høyden tas nå av min-height, og teksten sentreres i den, så lenka står
       visuelt der den sto; det er bare det trykkbare feltet som vokser.
       Se .top-row over for hvorfor headeren likevel blir 56 px. */
    display: flex;
    align-items: center;
    min-height: 44px;
}

.bi[b-ccavw9mp3z] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-ccavw9mp3z] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-ccavw9mp3z] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-ccavw9mp3z] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-ccavw9mp3z] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-ccavw9mp3z] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-ccavw9mp3z] {
        padding-bottom: 1rem;
    }

    .nav-item[b-ccavw9mp3z]  .nav-link {
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-ccavw9mp3z]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-ccavw9mp3z]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-ccavw9mp3z] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-ccavw9mp3z] {
    display: block;
    min-height: calc(100vh - 3.5rem);
}

@media (min-width: 641px) {
    .navbar-toggler[b-ccavw9mp3z] {
        display: none;
    }

    .nav-scrollable[b-ccavw9mp3z] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}

/* Fyller høyden så nav-bunn kan presses til bunnen med mellomrom over. */
nav.flex-column[b-ccavw9mp3z] {
    min-height: 100%;
}

/* UI-51: .nav-bunn er flex-barnet (av nav.flex-column) som faktisk bærer det
   lange selskapsnavnet — ikke .aktivt-selskap-navn selv, som bare er en
   etterkommer to nivåer ned. Målt (browser, ikke bare lest i koden): et langt
   selskapsnavn («Nordic Multiforms (intern demo)», eller lengre) dytter HELE
   menyen ut i et vannrett rullefelt, 359 px innhold i 234 px synlig bredde.

   min-width: 0 alene endret INGENTING her — verifisert med devtools:
   .nav-bunn beholdt fullt innholdsmål (358,96 px) selv med min-width: 0 og
   align-items: stretch tvunget på nav.flex-column. Årsaken er ikke undersøkt
   videre (Bootstraps .nav setter flex-wrap: wrap, som kan gjøre at
   stretch-beregningen for et rent embedded flex-barn ikke oppfører seg som i
   en isolert repro — samme klasser i en frittstående test stretchet riktig).
   Det som FAKTISK lukker gapet, testet direkte i devtools: en eksplisitt
   width: 100 %. Et blokkelement med en oppgitt bredde fylles til den bredden
   uansett innhold — det er ikke avhengig av flexboksens strekk-algoritme i
   det hele tatt. Med en bestemt bredde her arver etterkommerne den, og
   ellipsen på .aktivt-selskap-navn (app.css) løser endelig ut i stedet for
   aldri å bli aktuell (verifisert: scrollWidth > clientWidth ble sann for
   .aktivt-selskap-navn først etter denne linja). min-width: 0 står igjen som
   forsvar i dybden — koster ingenting, og dekker om noen fjerner width. */
.nav-bunn[b-ccavw9mp3z] {
    margin-top: auto;
    width: 100%;
    min-width: 0;
}

/* Ulest-teller for support (SUP-1). nav-link er display:flex, så
   margin-left:auto skyver tallet helt til høyre i raden. Fargene er valgt mot
   menyens mørke bakgrunn — samme meny brukes i den utfellbare mobilmenyen
   (#hovedmeny-bryter), så tallet må bære kontrasten selv, ikke arve lenkens. */
.nav-item[b-ccavw9mp3z]  .nav-badge {
    margin-left: auto;
    min-width: 1.4rem;
    height: 1.4rem;
    padding: 0 0.4rem;
    border-radius: 0.7rem;
    background-color: var(--mod-rod);
    color: var(--mod-flate);
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.4rem;
    text-align: center;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-30pjhefui0],
.components-reconnect-repeated-attempt-visible[b-30pjhefui0],
.components-reconnect-failed-visible[b-30pjhefui0],
.components-reconnect-rejected-visible[b-30pjhefui0],
.components-pause-visible[b-30pjhefui0],
.components-resume-failed-visible[b-30pjhefui0],
.components-rejoining-animation[b-30pjhefui0] {
    display: none;
}

#components-reconnect-modal.components-reconnect-rejected .components-reconnect-rejected-visible[b-30pjhefui0] {
    display: block;
}

#components-reconnect-modal.components-reconnect-rejected .components-rejoining-animation[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-rejected .components-reconnect-first-attempt-visible[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-rejected .components-reconnect-repeated-attempt-visible[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-rejected .components-reconnect-failed-visible[b-30pjhefui0] {
    display: none;
}

.components-oppdatert[b-30pjhefui0] {
    line-height: 1.6;
}

.components-oppdatert-hint[b-30pjhefui0] {
    font-size: 0.85rem;
    color: var(--mod-tekst-dus);
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-retrying[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-failed[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-30pjhefui0] {
    display: block;
}

/* Blazor lar «show» bli stående når den går videre til «retrying», så uten
   denne står «Et øyeblikk — kobler til igjen …» og «Prøver igjen om 5
   sekunder …» samtidig og motsier hverandre. Verifisert i browser 10.08.2026.

   :not(…) er poenget: hintlinja om oppdateringer er merket for BEGGE
   tilstandene og skal bli stående. Uten den forsvinner den også. */
#components-reconnect-modal.components-reconnect-retrying
    .components-reconnect-first-attempt-visible:not(.components-reconnect-repeated-attempt-visible)[b-30pjhefui0] {
    display: none;
}

/* Avvist økt har to helt ulike årsaker — ny versjon eller for langt brudd.
   ReconnectModal.razor.js spør serveren hvilken det er og setter klassen
   «components-utlopt» når økten bare ble for gammel. Ny versjon er
   utgangspunktet: klarer vi ikke å spørre, påstår vi ikke at noe er oppdatert.

   Merk vektingen: regelen som viser alt med «rejected-visible» teller id +
   to klasser, så det som skal skjules må minst opp i samme vekt for å bite. */
#components-reconnect-modal .components-utlopt-okt[b-30pjhefui0],
#components-reconnect-modal.components-reconnect-rejected .components-utlopt-okt[b-30pjhefui0] {
    display: none;
}

#components-reconnect-modal.components-utlopt.components-reconnect-rejected .components-ny-versjon[b-30pjhefui0] {
    display: none;
}

#components-reconnect-modal.components-utlopt.components-reconnect-rejected p.components-utlopt-okt[b-30pjhefui0] {
    display: block;
}

#components-reconnect-modal.components-utlopt.components-reconnect-rejected #components-reload-button .components-utlopt-okt[b-30pjhefui0] {
    display: inline;
}


#components-reconnect-modal[b-30pjhefui0] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-30pjhefui0 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-30pjhefui0 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-30pjhefui0 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-30pjhefui0]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-30pjhefui0 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-30pjhefui0 {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-30pjhefui0 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-30pjhefui0 {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-30pjhefui0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-30pjhefui0] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-30pjhefui0] {
    border: 0;
    background-color: var(--merkevarefarge);
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-30pjhefui0] {
        filter: brightness(0.9);
    }

    #components-reconnect-modal button:active[b-30pjhefui0] {
        background-color: var(--mod-primar-hover);
    }

.components-rejoining-animation[b-30pjhefui0] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-30pjhefui0] {
        position: absolute;
        border: 3px solid var(--mod-primar-markor);
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-30pjhefui0 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-30pjhefui0] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-30pjhefui0 {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Nytt/NyhetVisning.razor.rz.scp.css */
/* NYT-1: detaljvisningen av en produktnyhet. Lesebredde ~65 tegn (planen §Design). */
.nyhet-visning[b-2ie9fp23o1] {
    max-width: 65ch;
}

.nyhet-tittel[b-2ie9fp23o1] {
    font-size: 1.5rem;
    line-height: 1.25;
    margin: 0 0 var(--sp-2);
}

.nyhet-meta[b-2ie9fp23o1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2) var(--sp-3);
    margin: 0 0 var(--sp-4);
    font-size: 0.85rem;
    color: var(--mod-tekst-dus);
}

/* Kategorien som nøytralt omriss — status-merke merke-kategori gir form og farge (6.2). */
.nyhet-meta .nyhet-pille[b-2ie9fp23o1] {
    margin-bottom: 0;
}

/* Ingen skilletegn mellom merkene: på mobil bryter metalinja, og et «·» ville
   da startet neste linje. Avstanden (gap) skiller dem. */

.nyhet-handling h2[b-2ie9fp23o1] {
    font-size: 1.05rem;
    margin: 0 0 var(--sp-2);
}

.nyhet-handling p[b-2ie9fp23o1] {
    margin: 0;
}

.nyhet-tekst[b-2ie9fp23o1] {
    margin-bottom: var(--sp-5);
    line-height: 1.55;
}

.nyhet-tekst ul[b-2ie9fp23o1] {
    padding-left: 1.3em;
}

.nyhet-hvor h2[b-2ie9fp23o1] {
    font-size: 1.05rem;
    margin: 0 0 var(--sp-2);
}

.nyhet-hvor p[b-2ie9fp23o1] {
    margin: 0 0 var(--sp-3);
}

.nyhet-gaa-til[b-2ie9fp23o1] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    min-height: 44px;
    text-decoration: none;
}

span.nyhet-gaa-til[b-2ie9fp23o1] {
    cursor: default;
}

.nyhet-les-mer[b-2ie9fp23o1] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2) var(--sp-5);
}

.nyhet-les-mer a[b-2ie9fp23o1] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
}

@media (max-width: 480px) {
    .nyhet-gaa-til[b-2ie9fp23o1] {
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Nytt/NyttLinje.razor.rz.scp.css */
/* NYT-3: den smale «Nytt:»-linja på appenes oversikt. Aldri modal, aldri animert inn.
   Dus merkevaretint som standard; krever handling → samme gule venstrekant som
   .innstilling-kort-varsel. UI-112: firmafargen bare som flate/tint og strek
   (--mod-primar-markor), aldri som rå tekst. */
.nytt-linje[b-cxz8z5csaf] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 var(--sp-2);
    margin: 0 0 var(--sp-4);
    padding: 0 0 0 var(--sp-3);
    min-height: 44px;
    background: var(--mod-primar-tint);
    border: 1px solid var(--mod-kant);
    border-left: 3px solid var(--mod-primar-markor);
    border-radius: var(--mod-radius-liten, 0.5rem);
    color: var(--mod-tekst);
    font-size: 0.9rem;
    line-height: 1.35;
}

.nytt-linje-handling[b-cxz8z5csaf] {
    background: var(--mod-flate);
    border-color: var(--mod-gul-bg);
    border-left: 3px solid var(--mod-gul);
}

.nytt-linje-ikon[b-cxz8z5csaf] {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--mod-primar-markor);
}

.nytt-linje-handling .nytt-linje-ikon[b-cxz8z5csaf] {
    color: var(--mod-gul-tekst);
}

/* Mobil: tittelen tar hele første rad og bryter; «Les mer» og × på neste. */
.nytt-linje-tekst[b-cxz8z5csaf] {
    flex: 1 1 calc(100% - 2.5rem);
    min-width: 0;
    padding: var(--sp-2) 0;
}

.nytt-linje-lenke[b-cxz8z5csaf] {
    margin-left: auto;
    padding: var(--sp-2) 0;
    font-weight: 600;
    white-space: nowrap;
}

/* 44 px treffflate uten at linja blir høyere enn den må. */
.nytt-linje-lukk[b-cxz8z5csaf] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--mod-tekst-dus);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    border-radius: var(--mod-radius-liten, 0.5rem);
}

.nytt-linje-lukk:hover[b-cxz8z5csaf] {
    color: var(--mod-tekst);
}

.nytt-linje-lukk:focus-visible[b-cxz8z5csaf] {
    outline: 2px solid var(--mod-primar-markor);
    outline-offset: -2px;
}

/* Desktop: én linje — tittelen forkortes med … framfor å bryte. */
@media (min-width: 768px) {
    .nytt-linje[b-cxz8z5csaf] {
        flex-wrap: nowrap;
    }

    .nytt-linje-tekst[b-cxz8z5csaf] {
        flex: 1 1 auto;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .nytt-linje-lenke[b-cxz8z5csaf] {
        margin-left: var(--sp-2);
    }
}
/* /Components/Pages/AppAv.razor.rz.scp.css */
/* APP-2b: meldingssiden — sentrert og lesbar på 375 px, ingen vannrett rulling. */
.app-av[b-4b4ku6n0wn] {
    max-width: 32rem;
    margin: 0 auto;
    padding: var(--sp-6, 2rem) 0;
    text-align: center;
    overflow-wrap: anywhere;
}

.app-av h1[b-4b4ku6n0wn] {
    font-size: 1.5rem;
    line-height: 1.3;
}

.app-av-lenker[b-4b4ku6n0wn] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
}
/* /Components/Pages/Bestilling.razor.rz.scp.css */
/* KND-15 — bestillingskortet. Scoped her og ikke i wwwroot/app.css: app.css er
   Remis kjørende server (5199), og saken skal ikke røre den. Radklassene
   (.ordre-liste, .ordre-rad, .status-merke) kommer fra app.css og er felles
   med ordrelista — kortet legger bare til det som er sitt. */

.bestilling-ingress[b-h8m08tniyq] {
    margin-top: 0;
}

.bestilling-kvittering[b-h8m08tniyq] {
    padding: var(--sp-3) var(--sp-4);
    border-radius: 8px;
    background: var(--mod-gronn-bg);
    color: var(--mod-gronn-tekst);
}

/* Tellingene er «statusen» — én linje per tall, store nok til å leses på
   telefon i en bussdør. */
.bestilling-tellinger[b-h8m08tniyq] {
    list-style: none;
    margin: 0 0 var(--sp-3);
    padding: 0;
    display: grid;
    gap: var(--sp-1);
    font-size: 1.05rem;
}

.bestilling-sum[b-h8m08tniyq] {
    margin: 0 0 var(--sp-4);
}

/* Hele raden er lenka inn i ordren — samme flate som i ordrelista, der raden
   er en knapp. Arver tekstfargen så raden ikke blir blå lenketekst. */
.bestilling-radlenke[b-h8m08tniyq] {
    display: block;
    color: inherit;
    text-decoration: none;
}

.bestilling-radlenke:hover[b-h8m08tniyq],
.bestilling-radlenke:focus[b-h8m08tniyq] {
    text-decoration: none;
}

/* En kansellert kjøring står i lista (den telles i «N av M»), men dempet:
   den koster ingenting og skal ikke leses som en tur som går. */
.bestilling-kansellert .ordre-rad-navn[b-h8m08tniyq],
.bestilling-kansellert .ordre-rad-rute[b-h8m08tniyq],
.bestilling-kansellert .ordre-rad-meta[b-h8m08tniyq] {
    color: var(--mod-tekst-dus);
}

.bestilling-kansellert .ordre-rad-navn[b-h8m08tniyq] {
    text-decoration: line-through;
}

/* Fellesfeltene i lesemodus: to kolonner på desktop, én på telefon. */
.bestilling-felter[b-h8m08tniyq] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: var(--sp-2) var(--sp-4);
    margin: 0 0 var(--sp-4);
}

.bestilling-felter dt[b-h8m08tniyq] {
    color: var(--mod-tekst-dus);
    font-size: 0.9rem;
}

.bestilling-felter dd[b-h8m08tniyq] {
    margin: 0;
    overflow-wrap: anywhere;
}

.bestilling-valgt-kunde[b-h8m08tniyq] {
    margin: 0 0 var(--sp-2);
}

.bestilling-kundetreff[b-h8m08tniyq] {
    margin-top: var(--sp-2);
}

.bestilling-kundetreff li[b-h8m08tniyq] {
    padding: var(--sp-1) 0;
}

@media (max-width: 640.98px) {
    .bestilling-felter[b-h8m08tniyq] {
        grid-template-columns: 1fr;
        gap: var(--sp-1);
    }

    .bestilling-felter dd[b-h8m08tniyq] {
        margin-bottom: var(--sp-2);
    }
}
/* /Components/Pages/Hjelpesenter.razor.rz.scp.css */
/* Sida uten meny (anonym, HJE-1). `.tom-layout` er en flex-boks som sentrerer
   barna sine — den er laget for ett kort midt på skjermen, ikke for et
   oppslagsverk. Uten en ramme rundt innholdet blir h1, søkefeltet og hver
   seksjon hvert sitt flex-element PÅ RAD, og søkefeltet ender som en 34 px
   stripe. Verifisert i nettleser 05.09.2026 før rammen kom på.

   Selektoren nevner `.tom-layout` med vilje: da gjelder regelen kun den
   uinnloggede visningen, og den innloggede sida (som ligger i MainLayouts
   `.content`) er nøyaktig som før HJE-1.

   `align-self: flex-start` er samme grep som `.partnerpanel`: et flex-element
   som er høyere enn skjermen og sentrert vertikalt, får toppen sin klippet
   bort — og hjelpesenteret er alltid høyere enn skjermen. */
.tom-layout .hjelp-side[b-7cawjkrlrf] {
    align-self: flex-start;
    width: 100%;
    /* Samme bredde som `.innstilling-kort`, så kortene og teksten over dem
       står på linje. */
    max-width: 760px;
}

/* Avsenderlinja (NAV-1) på den uinnloggede visningen. Samme plassering som på
   bestillingsskjemaene, men som scoped regel i stedet for et style-attributt. */
.hjelp-byline[b-7cawjkrlrf] {
    margin-top: var(--sp-5);
    text-align: center;
}
/* /Components/Pages/Innboks.razor.rz.scp.css */
/* SIK-12: rammen rundt svar-forhåndsvisningen.

   Egen scoped fil, ikke app.css: den fila eies av en annen tråd (SMÅ-F), og
   dette er én regel som kun angår denne skjermen. Blazor kompilerer den inn i
   OrdresystemBuss.Web.styles.css ved bygg — ingenting skrives til wwwroot.

   Hvorfor ikke .epostutboks-iframe, som allerede finnes: den har egen kantlinje
   og 45vh høyde, laget for utboksens frittstående detaljark. Her ligger rammen
   INNE i .epost-forhaands, som selv er et kort med kantlinje og padding — en
   ramme til ville gitt kant i kant, og forhåndsvisningen skal se ut som før.

   Høyden: 22rem med iframens egen rulling. Samme tak som
   .epost-forhaands-brev bruker for tekstvarianten av samme forhåndsvisning, så
   svaret og ordreskjemaets forhåndsvisning står like høye.

   background: #fff fordi brevet er skrevet for lys bakgrunn
   (Epoststil.Brodtekst setter color:#1a1a1a). En gjennomsiktig iframe ville
   låne sidens flate, og teksten ville forsvunnet i et mørkt tema. Utboksen har
   samme verdi av samme grunn. */
.svar-forhaands-ramme[b-hzx67mfg2k] {
    display: block;
    width: 100%;
    height: 22rem;
    border: 0;
    border-radius: 8px;
    background: #fff;
}
/* /Components/Pages/Innstillinger.razor.rz.scp.css */
/* SJF-15a: 2-timersregelen hører til garasjestempelet over — innrykket viser
   at den bare gjelder når stempelet er på. Egen scopet fil, ikke det delte
   app.css, fordi regelen bare finnes på denne siden. */
.garasje-regel[b-91btcrfrm2] {
    margin-top: var(--sp-2);
    padding-left: var(--sp-5);
}

/* Tallfeltet trenger plass til «12,5», ikke hele kortets bredde. */
.garasje-regel[b-91btcrfrm2]  .garasje-terskel {
    max-width: 8rem;
}
/* /Components/Pages/Kjoreplan.razor.rz.scp.css */
/* KND-89 — «Ny ordre» fra en dag i kjøreplanen.

   Scopet fil og ikke app.css med vilje: app.css er et delt stilark som
   låses gjennom FELLESKO, og reglene under gjelder bare denne siden.
   Kjøreplanens øvrige regler står i app.css («KND-92», «UI-14»). */

/* Dagsvisningen: «+ Ny ordre» står i toppraden, der gap-en eier avstanden.
   Bredde etter innhold også under 480 px: husets .btn-ny blir en blokk i full
   bredde der, og en oransje stripe over hele skjermen rett over
   Kjøreoptimaliseringens egen hovedknapp ropte høyere enn tavla. */
.kjoreplan-nyordre[b-vyuhuz9rzq] {
    display: inline-block;
    width: auto;
    margin: 0;
    text-decoration: none;
}

/* Datomenyen er .rad-meny (app.css) — men står utenfor tavla og fast i
   vinduet, ved trykket. --kp-meny-x/-y settes fra klikket i Kjoreplan.razor;
   min()/clamp() holder menyen innenfor vinduet uten JS. */
.rad-meny.kp-dagmeny[b-vyuhuz9rzq] {
    position: fixed;
    top: min(calc(var(--kp-meny-y, 40vh) + 12px), calc(100vh - 8rem));
    left: clamp(0.5rem, calc(var(--kp-meny-x, 50vw) - 2rem), calc(100vw - 14rem));
    right: auto;
    bottom: auto;
}

/* Tastaturtrykk har ingen musposisjon: menyen står nederst på midten. */
.rad-meny.kp-dagmeny-ark[b-vyuhuz9rzq] {
    top: auto;
    bottom: 1rem;
    left: 50%;
    transform: translateX(-50%);
}

/* Smal skjerm: bunnark, som «•••»-menyen (app.css, max-width 640.98px).
   Reglene over har høyere spesifisitet enn app.css sitt bunnark og må
   derfor nulles her. max-width nulles i app.css sitt bunnark (UI-121) —
   reglene over setter den ikke, så den trengs ikke her. */
@media (max-width: 640.98px) {
    .rad-meny.kp-dagmeny[b-vyuhuz9rzq],
    .rad-meny.kp-dagmeny-ark[b-vyuhuz9rzq] {
        top: auto;
        left: 0;
        right: 0;
        bottom: 0;
        transform: none;
    }
}

/* Krav 5 (KND-89): trykkflaten på datoene skal være minst 40 px høy på
   375 px. app.css (UI-14/KND-92) gir 32 px i et spor på 2.4rem; knappene er
   absolutt posisjonert, så sporet må vokse like mye, ellers legger de seg
   oppå første rad. */
@media (max-width: 640px) {
    .kp-hode-dager .kp-spor[b-vyuhuz9rzq] {
        height: 2.75rem;
    }

    .kp-hode-dager .kp-dagmerke.kp-hopp[b-vyuhuz9rzq] {
        min-height: 40px;
    }
}

/* ORD-102: ukehvilmerket ved sjåførens navn. Samme utseende som
   aktiveringsmerket (app.css), men brytes i stedet for å kuttes: på mobil er
   navnefeltet 7rem, og ellipsen tok nettopp ukenummeret. */
.kp-navn small.kp-navn-ukehvil[b-vyuhuz9rzq] {
    white-space: normal;
    overflow-wrap: anywhere;
}
/* /Components/Pages/KoblePowerOffice.razor.rz.scp.css */
/* PO-LENKE: siden starter øverst, som tilbudssiden — ikke sentrert loddrett i .tom-layout. */
.koble-poweroffice[b-vjzf13vrmj] {
    align-self: flex-start;
    width: 100%;
    padding: var(--sp-4) 0 var(--sp-6);
}

/* Nøkkelfeltet og «Kopier» på én linje; feltet krymper, knappen gjør det ikke.
   Nøkkelen er lang — den skal kunne rulles i feltet, ikke sprenge bredden på 375 px. */
.koble-nokkelrad[b-vjzf13vrmj] {
    display: flex;
    gap: var(--sp-2);
    align-items: stretch;
}

.koble-nokkelrad input[b-vjzf13vrmj] {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}

/* Knappestilen er full bredde på mobil; her skal den bare være så bred som teksten. */
.koble-nokkelrad button[b-vjzf13vrmj] {
    flex: 0 0 auto;
    width: auto;
    white-space: nowrap;
}

.koble-steg[b-vjzf13vrmj] {
    margin: var(--sp-4) 0 var(--sp-3);
    padding-left: 1.25rem;
}

.koble-steg li[b-vjzf13vrmj] {
    margin-bottom: var(--sp-2);
}
/* /Components/Pages/KomIGangPowerOffice.razor.rz.scp.css */
/* PO-VEIVISER — «Kom i gang med PowerOffice Go». Mobile-first: ett steg per kort,
   vertikalt; ferdige steg er sammenfoldet med grønn hake og én statuslinje. */

.po-veiviser[b-cku4boqtz4] {
    list-style: none;
    margin: var(--sp-4, 16px) 0 0;
    padding: 0;
    display: grid;
    gap: var(--sp-3, 12px);
    max-width: 720px;
}

.po-steg[b-cku4boqtz4] {
    border: 1px solid var(--mod-kant, #e5e7eb);
    border-radius: 0.5rem;
    background: #fff;
    padding: var(--sp-3, 12px);
    min-width: 0;
}

.po-steg-apent[b-cku4boqtz4] {
    border-color: var(--mod-bla-tekst, #1d4ed8);
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08);
}

.po-steg-hode[b-cku4boqtz4] {
    display: flex;
    align-items: center;
    gap: var(--sp-2, 8px);
    width: 100%;
    padding: 0;
    border: 0;
    background: none;
    text-align: left;
    font: inherit;
    font-weight: 600;
    font-size: 1.05rem;
    color: inherit;
    cursor: pointer;
}

.po-steg-nr[b-cku4boqtz4] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--mod-bla-bg, #dbeafe);
    color: var(--mod-bla-tekst, #1d4ed8);
    font-size: 0.9rem;
}

.po-steg-ferdig .po-steg-nr[b-cku4boqtz4] {
    background: var(--mod-gronn-bg, #dcfce7);
    color: var(--mod-gronn-tekst, #166534);
}

.po-steg-tittel[b-cku4boqtz4] {
    min-width: 0;
    overflow-wrap: anywhere;
}

.po-steg-status[b-cku4boqtz4] {
    margin: var(--sp-1, 4px) 0 0 36px;
    color: var(--mod-dempet, #4b5563);
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}

.po-steg-ferdig .po-steg-status[b-cku4boqtz4] {
    color: var(--mod-gronn-tekst, #166534);
}

.po-steg-innhold[b-cku4boqtz4] {
    margin-top: var(--sp-2, 8px);
    min-width: 0;
    overflow-wrap: anywhere;
}

.po-steg-hvem[b-cku4boqtz4] {
    margin: 0 0 var(--sp-2, 8px);
    font-size: 0.85rem;
    color: var(--mod-dempet, #4b5563);
}

.po-steg-knapper[b-cku4boqtz4] {
    flex-wrap: wrap;
}

.po-ok[b-cku4boqtz4] {
    color: var(--mod-gronn-tekst, #166534);
}

.po-ferdig[b-cku4boqtz4] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
    max-width: 720px;
    padding: var(--sp-3, 12px);
    border-radius: 6px;
    background: var(--mod-gronn-bg, #dcfce7);
    color: var(--mod-gronn-tekst, #166534);
    font-weight: 600;
}

.po-sporsmal[b-cku4boqtz4] {
    font-weight: 600;
    margin-bottom: var(--sp-2, 8px);
}

/* To valg side om side — også på 375 px (to korte knapper). */
.po-valg[b-cku4boqtz4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--sp-2, 8px);
    margin-bottom: var(--sp-3, 12px);
}

.po-valgknapp[b-cku4boqtz4] {
    padding: var(--sp-3, 12px) var(--sp-2, 8px);
    border: 1px solid var(--mod-kant, #d1d5db);
    border-radius: 0.5rem;
    background: #f8fafc;
    font: inherit;
    font-weight: 600;
    color: inherit;
    cursor: pointer;
    min-width: 0;
    overflow-wrap: anywhere;
}

.po-valgknapp-valgt[b-cku4boqtz4] {
    border-color: var(--mod-bla-tekst, #1d4ed8);
    background: var(--mod-bla-bg, #dbeafe);
    color: var(--mod-bla-tekst, #1d4ed8);
}

.po-panel[b-cku4boqtz4] {
    border-left: 3px solid var(--mod-bla-bg, #dbeafe);
    padding-left: var(--sp-3, 12px);
    min-width: 0;
}

.po-gosteg[b-cku4boqtz4] {
    margin: var(--sp-3, 12px) 0;
    padding-left: 1.25rem;
}

.po-gosteg li[b-cku4boqtz4] {
    margin-bottom: var(--sp-2, 8px);
}

/* Nøkkelfeltet og «Kopier» på én linje; feltet krymper, knappen gjør det ikke
   (samme grep som lenkesiden, KoblePowerOffice). */
.po-nokkelrad[b-cku4boqtz4] {
    display: flex;
    gap: var(--sp-2, 8px);
    align-items: stretch;
    min-width: 0;
}

.po-nokkelrad input[b-cku4boqtz4] {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
}

.po-nokkelrad button[b-cku4boqtz4] {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
    white-space: nowrap;
}

.po-venter[b-cku4boqtz4] {
    display: flex;
    gap: var(--sp-2, 8px);
    align-items: flex-start;
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border-radius: 6px;
    background: var(--mod-bla-bg, #dbeafe);
    color: var(--mod-bla-tekst, #1d4ed8);
}

/* Eksempellinja i steg 4 — et fast eksempel, ikke firmaets data (PO-VEIVISER-B): vanlig
   skrift, dempet farge, liten etikett «Eksempel». Før: monospace-kodeblokk med «9 –», lest som ekte. */
.po-eksempel[b-cku4boqtz4] {
    margin: var(--sp-2, 8px) 0 var(--sp-3, 12px);
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border-left: 3px solid var(--mod-kant, #e5e7eb);
    color: var(--mod-dempet, #4b5563);
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}

.po-eksempel figcaption[b-cku4boqtz4] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
}

.po-eksempel p[b-cku4boqtz4] {
    margin: var(--sp-1, 4px) 0 0;
}

.po-eksempel-etikett[b-cku4boqtz4] {
    display: inline-block;
    padding: 0 6px;
    border-radius: 4px;
    background: #f1f5f9;
    border: 1px solid var(--mod-kant, #e5e7eb);
    font-size: 0.875rem;
    font-weight: 600;
}

/* «Venter på»-blokka (PO-VEIVISER-B): hvordan, og «Gå til steg N». */
.po-venter-paa[b-cku4boqtz4] {
    margin: var(--sp-2, 8px) 0;
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border-radius: 6px;
    background: #f8fafc;
    border: 1px solid var(--mod-kant, #e5e7eb);
    min-width: 0;
}

.po-venter-paa p[b-cku4boqtz4] {
    margin: 0 0 var(--sp-2, 8px);
}

.po-steg-laast .po-steg-hode[b-cku4boqtz4] {
    cursor: default;
    color: var(--mod-dempet, #4b5563);
}

.po-steg-laast .po-steg-nr[b-cku4boqtz4] {
    background: #f1f5f9;
    color: var(--mod-dempet, #4b5563);
}

.po-steg-laast .po-venter-paa[b-cku4boqtz4] {
    margin-left: 36px;
}

/* Spørsmålet til regnskapsføreren: et sitat, ikke et felt (Remi 01.10.2026). */
.po-sitat-ledetekst[b-cku4boqtz4] {
    margin: var(--sp-2, 8px) 0 var(--sp-1, 4px);
    font-size: 0.9rem;
    color: var(--mod-dempet, #4b5563);
}

.po-sitatrad[b-cku4boqtz4] {
    display: flex;
    gap: var(--sp-2, 8px);
    align-items: flex-start;
    min-width: 0;
}

.po-sitat[b-cku4boqtz4] {
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border-left: 3px solid var(--mod-bla-bg, #dbeafe);
    background: #fff;
    font-style: italic;
    overflow-wrap: anywhere;
}

.po-sitatrad button[b-cku4boqtz4] {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
    white-space: nowrap;
}

.po-underoverskrift[b-cku4boqtz4] {
    margin: var(--sp-3, 12px) 0 var(--sp-1, 4px);
    font-weight: 600;
}

/* «Alt stemmer» før noe er sendt: ser inaktiv ut, ikke som primærknapp. */
.po-inaktiv[b-cku4boqtz4],
.po-inaktiv:hover[b-cku4boqtz4] {
    opacity: 0.55;
    cursor: not-allowed;
}

.po-satser[b-cku4boqtz4] {
    list-style: none;
    margin: var(--sp-3, 12px) 0;
    padding: 0;
    display: grid;
    gap: var(--sp-3, 12px);
}

.po-sats[b-cku4boqtz4] {
    min-width: 0;
}

.po-sats-navn[b-cku4boqtz4] {
    margin: 0 0 var(--sp-1, 4px);
    font-weight: 600;
}

/* PO-SATS: «Står her fordi …» under tittelen, og «Bruker dere ikke dette?» under raden. */
.po-sats-aarsak[b-cku4boqtz4] {
    margin: 0 0 var(--sp-2, 8px);
    font-size: .9rem;
    color: var(--mod-tekst-dus, #5f6673);
    overflow-wrap: anywhere;
}

.po-sats-rett[b-cku4boqtz4] {
    display: flex;
    flex-wrap: wrap;
    gap: 0 var(--sp-2, 8px);
    margin: var(--sp-2, 8px) 0 0;
    font-size: .9rem;
    color: var(--mod-tekst-dus, #5f6673);
}

.po-avvik[b-cku4boqtz4] {
    display: flex;
    gap: var(--sp-2, 8px);
    align-items: flex-start;
    margin: var(--sp-1, 4px) 0 0;
    padding: var(--sp-2, 8px);
    border-radius: 6px;
    background: var(--mod-rod-bg, #fee2e2);
    color: var(--mod-rod-tekst, #991b1b);
}

.po-hjelpeboks[b-cku4boqtz4] {
    margin-top: var(--sp-3, 12px);
    padding: var(--sp-3, 12px);
    border-radius: 6px;
    background: #f8fafc;
    border: 1px solid var(--mod-kant, #e5e7eb);
    min-width: 0;
}

.po-hjelpeboks p[b-cku4boqtz4] {
    margin: 0 0 var(--sp-2, 8px);
}

.po-mer[b-cku4boqtz4] {
    margin-top: var(--sp-3, 12px);
}

.po-varsel[b-cku4boqtz4] {
    margin-top: var(--sp-3, 12px);
    padding: var(--sp-3, 12px);
    border-radius: 6px;
    border: 1px solid var(--mod-gul-kant, #fcd34d);
    background: var(--mod-gul-bg, #fef9c3);
    color: var(--mod-gul-tekst, #854d0e);
}

.po-salgsordrestatus[b-cku4boqtz4] {
    border: 0;
    padding: 0;
    margin: 0;
}

.po-sjekkliste[b-cku4boqtz4] {
    list-style: none;
    padding: 0;
    margin: var(--sp-2, 8px) 0 var(--sp-3, 12px);
}

/* PO-VEIVISER-B, Tillegg 4: forklaringen øverst, fagordene, trinnene med «I NordicM:» /
   «I PowerOffice Go:», og «Slik ser du at det er gjort». */
.po-forklaring[b-cku4boqtz4] {
    max-width: 720px;
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border-radius: 6px;
    background: #f8fafc;
    border: 1px solid var(--mod-kant, #e5e7eb);
    font-size: 0.9rem;
}

.po-forklaring p[b-cku4boqtz4] {
    margin: 0 0 var(--sp-1, 4px);
}

.po-forklaring p:last-child[b-cku4boqtz4] {
    margin-bottom: 0;
}

.po-ordliste[b-cku4boqtz4] {
    margin: 0 0 var(--sp-3, 12px);
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border-left: 3px solid var(--mod-kant, #e5e7eb);
    font-size: 0.9rem;
}

.po-ord[b-cku4boqtz4] {
    margin: 0 0 var(--sp-1, 4px);
}

.po-ord:last-child[b-cku4boqtz4] {
    margin-bottom: 0;
}

.po-trinn[b-cku4boqtz4] {
    margin: var(--sp-3, 12px) 0;
    padding-left: 1.5rem;
    min-width: 0;
}

.po-trinn > li[b-cku4boqtz4] {
    margin-bottom: var(--sp-3, 12px);
    min-width: 0;
}

.po-trinn-alternativ[b-cku4boqtz4] {
    list-style: none;
    padding-left: 0;
}

.po-trinn-tekst[b-cku4boqtz4] {
    margin: 0;
    overflow-wrap: anywhere;
}

.po-trinn-felt[b-cku4boqtz4] {
    margin-top: var(--sp-2, 8px);
    min-width: 0;
}

/* Etiketten foran hvert trinn: hvor det gjøres. To farger, så de skilles uten å lese. */
.po-hvor[b-cku4boqtz4] {
    display: inline-block;
    margin-right: 4px;
    padding: 0 6px;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: 700;
    white-space: nowrap;
}

.po-hvor-nordicm[b-cku4boqtz4] {
    background: var(--mod-bla-bg, #dbeafe);
    color: var(--mod-bla-tekst, #1d4ed8);
}

.po-hvor-go[b-cku4boqtz4] {
    background: #ede9fe;
    color: #5b21b6;
}

.po-ferdigtegn[b-cku4boqtz4] {
    display: flex;
    gap: var(--sp-2, 8px);
    align-items: flex-start;
    margin: var(--sp-2, 8px) 0;
    color: var(--mod-gronn-tekst, #166534);
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}
/* /Components/Pages/KomIGangTripletex.razor.rz.scp.css */
/* INT-2A2 — «Kom i gang med Tripletex». Samme oppbygging som /poweroffice, men bare
   tokens: ingen hex og ingen hex-fallback (DESIGNSYSTEM 3, TRAADREGLER §7a). Status
   vises med statusparet på nummersirkelen og med tekst — aldri med farget kant.
   Mobile-first: alt bryter (overflow-wrap), så 375 px aldri ruller sidelengs. */
.tx-veiviser[b-g1takv234e] {
    list-style: none;
    margin: var(--sp-4) 0 0;
    padding: 0;
    display: grid;
    gap: var(--sp-3);
    max-width: 720px;
}

.tx-steg[b-g1takv234e] {
    border: 1px solid var(--mod-kant);
    border-radius: var(--mod-radius);
    background: var(--mod-flate);
    padding: var(--sp-3) var(--sp-4);
    min-width: 0;
}

/* Det åpne steget løftes med kortskyggen (DESIGNSYSTEM 5) — ikke med farget kant. */
.tx-steg-apent[b-g1takv234e] {
    box-shadow: var(--mod-skygge);
}

.tx-steg-hode[b-g1takv234e] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    width: 100%;
    min-height: 44px;
    padding: 0;
    border: 0;
    background: none;
    text-align: left;
    font: inherit;
    font-weight: 600;
    color: inherit;
    cursor: pointer;
}

.tx-steg-laast .tx-steg-hode[b-g1takv234e] {
    cursor: not-allowed;
    color: var(--mod-tekst-dus);
}

.tx-steg-nr[b-g1takv234e] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid var(--mod-kant-sterk);
    background: var(--mod-bg);
    color: var(--mod-tekst);
    font-size: var(--tekst-hjelp);
}

.tx-steg-ferdig .tx-steg-nr[b-g1takv234e] {
    border-color: var(--mod-gronn-kant);
    background: var(--mod-gronn-bg);
    color: var(--mod-gronn-tekst);
}

.tx-steg-tittel[b-g1takv234e] {
    min-width: 0;
    overflow-wrap: anywhere;
}

.tx-steg-status[b-g1takv234e] {
    margin: 0 0 0 calc(28px + var(--sp-2));
    color: var(--mod-tekst-dus);
    font-size: var(--tekst-hjelp);
    overflow-wrap: anywhere;
}

.tx-steg-innhold[b-g1takv234e] {
    margin-top: var(--sp-2);
    display: grid;
    gap: var(--sp-3);
    min-width: 0;
    overflow-wrap: anywhere;
}

.tx-steg-innhold > p[b-g1takv234e],
.tx-steg-innhold > .innstilling-hjelp[b-g1takv234e] {
    margin: 0;
}

.tx-steg-hvem[b-g1takv234e] {
    font-size: var(--tekst-hjelp);
    color: var(--mod-tekst-dus);
}

.tx-venter[b-g1takv234e] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2) var(--sp-3);
    margin: var(--sp-2) 0 0 calc(28px + var(--sp-2));
}

.tx-venter p[b-g1takv234e] {
    margin: 0;
    font-size: var(--tekst-hjelp);
    color: var(--mod-tekst-dus);
}

.tx-knapper[b-g1takv234e] {
    flex-wrap: wrap;
}

.tx-lenkerad[b-g1takv234e] {
    margin: var(--sp-2) 0 0;
}

/* Steg 1: klikk for klikk. */
.tx-trinn[b-g1takv234e] {
    margin: 0;
    padding-left: var(--sp-5);
    display: grid;
    gap: var(--sp-3);
}

.tx-trinn p[b-g1takv234e] {
    margin: 0;
}

.tx-trinn .innstilling-hjelp[b-g1takv234e] {
    margin: var(--sp-1) 0 0;
}

.tx-rettigheter[b-g1takv234e] {
    margin: var(--sp-1) 0 0;
    padding-left: var(--sp-5);
}

.tx-felt[b-g1takv234e] {
    margin-top: var(--sp-2);
    min-width: 0;
}

/* Felt og knapp side om side: raden eier luften (DESIGNSYSTEM 6.6), feltet har ingen egen marg. */
.tx-nokkelrad[b-g1takv234e] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
}

.tx-nokkelrad .search-input[b-g1takv234e] {
    flex: 1 1 12rem;
    min-width: 0;
    max-width: 480px;
    margin-bottom: 0;
}

.tx-skjema[b-g1takv234e] {
    display: grid;
    gap: var(--sp-2);
    min-width: 0;
}

.tx-skjema .search-input[b-g1takv234e] {
    width: 100%;
    max-width: 480px;
    box-sizing: border-box;
}

/* Steg 3: hva Tripletex sier, mot det vi har. */
.tx-fakta[b-g1takv234e] {
    margin: 0;
    display: grid;
    gap: var(--sp-2);
}

.tx-fakta > div[b-g1takv234e] {
    display: grid;
    gap: 0 var(--sp-3);
}

.tx-fakta dt[b-g1takv234e] {
    font-size: var(--tekst-hjelp);
    color: var(--mod-tekst-dus);
}

.tx-fakta dd[b-g1takv234e] {
    margin: 0;
    font-weight: 600;
    overflow-wrap: anywhere;
}

@media (min-width: 641px) {
    .tx-fakta > div[b-g1takv234e] {
        grid-template-columns: 12rem minmax(0, 1fr);
        align-items: baseline;
    }
}

/* Steg 4: én rad per mva-sats. */
.tx-satser[b-g1takv234e] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--sp-4);
}

.tx-sats[b-g1takv234e] {
    display: grid;
    gap: var(--sp-2);
    padding-top: var(--sp-3);
    border-top: 1px solid var(--mod-kant);
    min-width: 0;
}

.tx-sats-navn[b-g1takv234e] {
    margin: 0;
    font-weight: 600;
}
/* /Components/Pages/Kunder.razor.rz.scp.css */
/* UI-10: krav-streken rundt navnefeltet i «+ Legg til»-raden for kontaktperson.

   .stopp-rad er en flex-kolonne med gap; .krav-felt har i tillegg sin egen
   bunnmarg, og de to legger seg oppå hverandre slik at nettopp det påkrevde
   feltet får større luft under seg enn de valgfrie. Samme rettelse som
   .orgnr-rad .krav-felt i app.css.

   Scoped fil og ikke app.css med vilje (04.09.2026): Remis egen kjøring sto på
   port 5199 under arbeidet, og wwwroot skal ikke røres mens en server kjører. */
.stopp-rad .krav-felt[b-5jvi5hzpa9] {
    margin-bottom: 0;
}

/* UI-128: «Vis»-nedtrekket i søkerada (filteret, før sju faner). Etiketten står
   ved feltet, ikke over det, så rada holder én linje på desktop (nedtrekket er
   så bredt som det lengste valget). På smal skjerm tar søkefeltet og nedtrekket
   hver sin hele linje, og filterikonet og «I dag» står under: delt med dem ble
   nedtrekket 175 px, og «Med aktiv ordre (12)» (144 px tekst) ble kuttet.
   Rekkefølgen på skjermen er den samme som i markupen, så Tab går rett ned. */
.kunde-sokerad[b-5jvi5hzpa9] {
    flex-wrap: wrap;
}

.kunde-vis[b-5jvi5hzpa9] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    min-width: 0;
}

.kunde-vis label[b-5jvi5hzpa9] {
    margin: 0;
    font-weight: 600;
}

.kunde-vis select[b-5jvi5hzpa9] {
    width: auto;
    min-width: 0;
    margin-bottom: 0;
}

@media (max-width: 640px) {
    .kunde-sokerad .sok-felt[b-5jvi5hzpa9] {
        flex-basis: 100%;
    }

    .kunde-vis[b-5jvi5hzpa9] {
        flex-basis: 100%;
    }

    .kunde-vis select[b-5jvi5hzpa9] {
        flex: 1 1 auto;
    }

    /* «I dag» har 16 px marg over og under på mobil (.btn-avbryt); på en egen
       linje under nedtrekket ga det 24 px luft der rada ellers har 8 px. */
    .kunde-sokerad .btn-avbryt[b-5jvi5hzpa9] {
        margin-top: 0;
        margin-bottom: 0;
    }
}
/* /Components/Pages/Markedsplass.razor.rz.scp.css */
/* PAM-279: valget av salgsordrestatus ved Go-tilkoblingen (firma uten Buss) — samme utseende som
   på Til regnskap (INT-11, TilRegnskap.razor.css): fieldset for skjermlesere, uten nettleserens
   ramme. min-width: 0 hindrer at fieldset-ets min-content-bredde presser siden bredere enn 375 px. */
.salgsordrestatus[b-vh4lxinqs0] {
    border: 0;
    padding: 0;
    margin: var(--sp-4) 0 0;
    min-width: 0;
}

.salgsordrestatus legend[b-vh4lxinqs0] {
    font-weight: 600;
    padding: 0;
    margin-bottom: var(--sp-2);
}
/* /Components/Pages/Merkevareside.razor.rz.scp.css */
/* MERK-1 — /merkevare. Oppsettet for selve skjermen (kolonner, prøver,
   handlingslinja). Reglene som gir en side merkevaren bor i wwwroot/merkevare.css
   og deles med de offentlige sidene; ingenting her oversetter tokens. */

.mv-topp[b-7o8nfkfe0i] {
    margin-bottom: var(--sp-4);
}

.mv-topp h1[b-7o8nfkfe0i] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin-bottom: var(--sp-1);
}

.mv-til-forhaands[b-7o8nfkfe0i] {
    display: none;
}

.mv-oppsett[b-7o8nfkfe0i] {
    display: grid;
    gap: var(--sp-5);
    align-items: start;
}

@media (min-width: 960px) {
    .mv-oppsett[b-7o8nfkfe0i] {
        grid-template-columns: 360px minmax(0, 1fr);
    }

    .mv-forhaands-kolonne[b-7o8nfkfe0i] {
        position: sticky;
        top: var(--sp-4);
    }
}

.mv-valgkort[b-7o8nfkfe0i] {
    margin-bottom: 0;
}

.mv-kort-topp[b-7o8nfkfe0i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2);
}

.mv-kort-topp h2[b-7o8nfkfe0i] {
    margin: 0;
    font-size: 1.15rem;
}

.mv-oppsummering[b-7o8nfkfe0i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 var(--sp-3);
    margin: var(--sp-2) 0 var(--sp-3);
    font-size: 0.9rem;
    color: var(--mod-tekst-dus);
}

.mv-valgsett[b-7o8nfkfe0i] {
    border: 0;
    margin: 0;
    padding: 0;
    min-width: 0;
}

.mv-valgsett:disabled[b-7o8nfkfe0i] {
    opacity: 0.8;
}

/* ---------- Hurtigmalene ---------- */

.mv-hurtigmaler[b-7o8nfkfe0i] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sp-2);
    margin-bottom: var(--sp-4);
}

.mv-hurtigmal[b-7o8nfkfe0i] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    min-height: 44px;
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid;
    border-radius: 0.5rem;
    font-size: 0.9rem;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
}

.mv-hurtigmal:disabled[b-7o8nfkfe0i] {
    cursor: default;
}

.mv-hurtigmal-prikk[b-7o8nfkfe0i] {
    flex: none;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
}

/* ---------- Hvert valg ---------- */

.mv-valg[b-7o8nfkfe0i] {
    padding: var(--sp-3) 0;
    border-top: 1px solid var(--mod-kant);
}

.mv-valg-topp[b-7o8nfkfe0i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-1) var(--sp-2);
    margin-bottom: var(--sp-2);
}

.mv-valg-topp label[b-7o8nfkfe0i],
.mv-etikett[b-7o8nfkfe0i] {
    margin: 0;
    font-weight: 600;
}

.mv-nummer[b-7o8nfkfe0i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.4rem;
    height: 1.4rem;
    margin-right: var(--sp-1);
    border-radius: 50%;
    font-size: 0.75rem;
    color: var(--merkevarefarge-tekst, white);
    background-color: var(--mod-primar);
}

.mv-endret[b-7o8nfkfe0i] {
    padding: 0.05rem 0.45rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--mod-gul-tekst);
    background-color: var(--mod-gul-bg);
}

.mv-bruk-standard[b-7o8nfkfe0i] {
    min-height: 44px;
    margin-left: auto;
}

.mv-valg .farge-velger .search-input[b-7o8nfkfe0i],
.mv-valg select.search-input[b-7o8nfkfe0i] {
    margin-bottom: var(--sp-2);
}

.mv-justert[b-7o8nfkfe0i] {
    margin: 0 0 var(--sp-2);
    font-size: 0.85rem;
    color: var(--mod-gul-tekst);
}

.mv-prover[b-7o8nfkfe0i] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
}

.mv-prove[b-7o8nfkfe0i] {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    font-size: 0.72rem;
    color: var(--mod-tekst-dus);
}

.mv-prove-flate[b-7o8nfkfe0i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 1.75rem;
    border: 1px solid var(--mod-kant);
    border-radius: 0.375rem;
}

.mv-prove-tekst[b-7o8nfkfe0i] {
    font-weight: 600;
    font-size: 0.9rem;
}

.mv-fontprove[b-7o8nfkfe0i] {
    margin: 0;
    font-size: 1.05rem;
}

.mv-radius[b-7o8nfkfe0i] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin-bottom: var(--sp-2);
}

.mv-radius input[type="range"][b-7o8nfkfe0i] {
    flex: 1 1 auto;
    min-height: 44px;
    /* UI-115 — markørfargen (≥ 3:1 mot hvitt), ikke den rå firmafargen */
    accent-color: var(--mod-primar-markor);
}

.mv-radius-tall.search-input[b-7o8nfkfe0i] {
    width: 4.5rem;
    min-width: 4.5rem;
    margin: 0;
}

.mv-enhet[b-7o8nfkfe0i] {
    color: var(--mod-tekst-dus);
}

.mv-prove-form[b-7o8nfkfe0i] {
    display: block;
    width: 2.75rem;
    height: 1.75rem;
    border: 2px solid var(--mod-kant-sterk);
    background-color: var(--mod-flate);
}

.mv-prove-knapp[b-7o8nfkfe0i] {
    border-color: var(--mod-primar);
    background-color: var(--mod-primar);
}

/* ---------- Handlingslinja ---------- */

.mv-handlingslinje[b-7o8nfkfe0i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    margin-top: var(--sp-3);
    padding-top: var(--sp-3);
    border-top: 1px solid var(--mod-kant);
}

.mv-handlingslinje .btn-ny[b-7o8nfkfe0i],
.mv-handlingslinje .btn-avbryt[b-7o8nfkfe0i] {
    width: auto;
    margin: 0;
    min-height: 44px;
}

/* ---------- Forhåndsvisningen ---------- */

.mv-forhaands-tittel[b-7o8nfkfe0i] {
    margin: 0 0 var(--sp-2);
    font-size: 1.15rem;
}

.mv-forhaands-ramme[b-7o8nfkfe0i] {
    overflow: hidden;
    border: 1px solid var(--mod-kant);
    border-radius: 0.625rem;
    /* Plattformens bakgrunn på de offentlige sidene (.tom-layout). Med merkevare
       dekker innpakningen den med --mv-bakgrunn. */
    background-color: var(--mod-bg-offentlig);
}

.mv-forhaands-innhold[b-7o8nfkfe0i] {
    display: flex;
    justify-content: center;
    padding: var(--sp-5);
}

.mv-forhaands-innhold .kontakt-side[b-7o8nfkfe0i] {
    width: 100%;
}

.mv-byline[b-7o8nfkfe0i] {
    margin-top: var(--sp-5);
    text-align: center;
}

/* Merket i eksempelet, med plattformens farger. merkevare.css bytter dem ut
   med tokenene når selskapet har valgt noe. */
.mv-merke[b-7o8nfkfe0i] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.6rem;
    border: 1px solid var(--mod-plattform);
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--mod-plattform);
    background-color: var(--mod-flate);
}

/* ---------- Malene ---------- */

.mv-maler[b-7o8nfkfe0i] {
    margin-top: var(--sp-5);
    max-width: 760px;
}

.mv-ny-mal[b-7o8nfkfe0i] {
    margin: 0;
}

.mv-malliste[b-7o8nfkfe0i] {
    list-style: none;
    margin: var(--sp-3) 0 0;
    padding: 0;
}

.mv-malrad[b-7o8nfkfe0i] {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-2) var(--sp-2);
    border-top: 1px solid var(--mod-kant);
}

.mv-malrad.valgt[b-7o8nfkfe0i] {
    background-color: var(--mod-primar-tint);
    border-radius: 0.5rem;
}

.mv-malprove[b-7o8nfkfe0i] {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border: 1px solid;
    border-radius: 0.5rem;
}

.mv-malprove span[b-7o8nfkfe0i] {
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
}

.mv-malnavn[b-7o8nfkfe0i] {
    flex: 1 1 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0 var(--sp-2);
    min-height: 44px;
    padding: var(--sp-1) 0;
    border: 0;
    background: none;
    text-align: left;
    color: inherit;
    cursor: pointer;
}

.mv-standardmerke[b-7o8nfkfe0i] {
    padding: 0.05rem 0.45rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    /* UI-112: tekst i firmafargen → -mork (≥ 4,5 : 1), aldri rå --mod-primar/--merkevarefarge. */
    color: var(--mod-primar-mork);
    background-color: var(--mod-primar-tint);
}

.mv-malinfo[b-7o8nfkfe0i] {
    width: 100%;
    font-size: 0.85rem;
    color: var(--mod-tekst-dus);
}

/* ---------- Arkene ---------- */

.mv-ark-liste[b-7o8nfkfe0i] {
    margin: 0 0 var(--sp-3);
}

.mv-sammenlign[b-7o8nfkfe0i] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sp-3);
    margin-bottom: var(--sp-3);
}

.mv-versjon h3[b-7o8nfkfe0i] {
    margin: 0 0 var(--sp-2);
    font-size: 0.95rem;
}

.mv-versjon-prove[b-7o8nfkfe0i] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-3);
    border: 1px solid;
    border-radius: 0.5rem;
}

.mv-versjon-prove span:first-child[b-7o8nfkfe0i] {
    padding: 0.2rem 0.6rem;
    font-weight: 600;
}

.mv-versjon dl[b-7o8nfkfe0i] {
    margin: var(--sp-2) 0 0;
    font-size: 0.85rem;
}

.mv-versjon dt[b-7o8nfkfe0i] {
    color: var(--mod-tekst-dus);
}

.mv-versjon dd[b-7o8nfkfe0i] {
    margin: 0 0 var(--sp-1);
    overflow-wrap: anywhere;
}

/* ---------- Mobil ---------- */

@media (max-width: 959.98px) {
    .mv-til-forhaands[b-7o8nfkfe0i] {
        display: inline-flex;
    }
}

@media (max-width: 640.98px) {
    /* Handlingslinja fast nederst, over bunnmenyen (ca. 3,6 rem høy). */
    .mv-handlingslinje[b-7o8nfkfe0i] {
        position: fixed;
        left: 0;
        right: 0;
        bottom: calc(3.6rem + env(safe-area-inset-bottom, 0px));
        z-index: 1400;
        margin: 0;
        padding: var(--sp-2) var(--sp-3);
        border-top: 1px solid var(--mod-kant);
        background-color: var(--mod-flate);
        box-shadow: 0 -2px 8px rgba(16, 24, 40, 0.08);
    }

    .mv-handlingslinje .btn-ny[b-7o8nfkfe0i],
    .mv-handlingslinje .btn-avbryt[b-7o8nfkfe0i] {
        flex: 1 1 auto;
        padding-left: var(--sp-3);
        padding-right: var(--sp-3);
    }

    .mv-maler[b-7o8nfkfe0i] {
        margin-bottom: 5rem;
    }

    .mv-forhaands-innhold[b-7o8nfkfe0i] {
        padding: var(--sp-3);
    }

    .mv-sammenlign[b-7o8nfkfe0i] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Pages/MineKjoringer.razor.rz.scp.css */
/* KND-14: nøytral merkelapp for turer i «Siste uke» som ikke er stemplet
   kjørt. Egen klasse og IKKE gjenbruk av .status-avvist (samme grå farge
   finnes der fra før) — den klassen betyr «sjåføren har meldt avbud», noe
   helt annet, og et gjenbruk her ville vært misvisende for neste utvikler
   som grep etter den for å finne avbudsvisningen. */
.siste-uke-uten-stempel[b-ookn0fvfab] {
    display: inline-block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--mod-tekst-dus);
    background-color: var(--mod-kant);
    padding: var(--sp-1) var(--sp-3);
    border-radius: 999px;
    margin-bottom: var(--sp-1);
}

/* Punkt 2 (UI-179: felles for kunde- og kontorgruppa): si fra. Overskrift i feltnavnstilen; knappene er
   vanlige knapper med ramme. Under 480 px gjør app.css dem til blokker i
   full bredde — én per linje. */
.varsel-gruppe[b-ookn0fvfab] {
    margin-top: var(--sp-4);
}

.varsel-gruppe-tittel[b-ookn0fvfab] {
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: var(--sp-2);
}

.varsel-gruppe-knapper[b-ookn0fvfab] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
}

.varsel-gruppe-knapper .btn-avbryt[b-ookn0fvfab] {
    margin: 0;
    justify-content: center;
}

.varsel-gruppe > .innboks-meta[b-ookn0fvfab] {
    display: block;
    margin-top: var(--sp-2);
}

/* SJF-22a: kilometerarket. Feltet og knappene er 44 px høye — sjåføren står
   ved bussen med hansker, og tallet tastes på mobil. Knappene brytes under
   hverandre i full bredde på smal skjerm. */
.km-etikett[b-ookn0fvfab] {
    display: block;
    margin: var(--sp-3) 0 var(--sp-1);
    font-weight: 600;
}

.km-felt[b-ookn0fvfab] {
    width: 100%;
    min-height: 44px;
    font-size: 1.25rem;
    font-variant-numeric: tabular-nums;
}

.km-knapper[b-ookn0fvfab] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
    margin: var(--sp-4) 0 var(--sp-2);
}

.km-knapp[b-ookn0fvfab] {
    min-height: 44px;
    flex: 1 1 12rem;
    justify-content: center;
    margin: 0;
}

.km-rad[b-ookn0fvfab] {
    align-items: center;
}

/* KND-70: sjåførens kommentar til kontoret. Dus blå — ikke den gule notisen
   for «Melding til sjåføren», som går den andre veien. Teksten brytes som
   sjåføren skrev den (pre-wrap). */
.sjafor-kommentar[b-ookn0fvfab] {
    margin: var(--sp-2) 0;
    padding: var(--sp-2) var(--sp-3);
    background-color: var(--mod-bla-bg);
    border: 1px solid var(--mod-kant);
    border-radius: 8px;
    font-size: 0.92rem;
}

.sjafor-kommentar-topp[b-ookn0fvfab] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-1) var(--sp-2);
}

/* KND-74: en forrige sjåførs kommentar på plassen — samme kort, men grått:
   den er ikke min, og den kan ikke endres her. */
.sjafor-kommentar-forrige[b-ookn0fvfab] {
    background-color: var(--mod-bg);
    border-color: var(--mod-kant-sterk);
}

.sjafor-kommentar-tekst[b-ookn0fvfab] {
    margin: var(--sp-1) 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.kommentar-felt[b-ookn0fvfab] {
    width: 100%;
    min-height: 7.5rem;
    font-size: 1rem;
    resize: vertical;
}

.kommentar-teller[b-ookn0fvfab] {
    margin: var(--sp-1) 0 0;
    text-align: right;
}

/* PAM-228d-c: «Skann billetter» under overskriften. Knappen er btn-avbryt (6.1 vanlig) i en knapp-rad (som dørlistas
   «Skann billetter»: raden nuller knappens venstremarg, så den flukter med overskriften) — full bredde under 480 px
   kommer fra appens mobilkonvensjon; her står bare luften under. */
.sjafor-skann[b-ookn0fvfab] {
    margin-bottom: var(--sp-4);
}
/* /Components/Pages/MineTimer.razor.rz.scp.css */
.timer-sumlinje[b-mhmf41nrvu] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
    margin-bottom: var(--sp-4);
}

/* SJF-15b: «Forslag fra turene dine». Mobil: én kolonne, knappene fyller
   bredden (≥ 44 px). Desktop: kortene i rutenett, 2–3 i bredden. */
.timeforslag[b-mhmf41nrvu] {
    margin-bottom: var(--sp-5);
}

.timeforslag-topp[b-mhmf41nrvu] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
    margin-bottom: var(--sp-3);
}

.timeforslag-topp h2[b-mhmf41nrvu] {
    margin: 0;
    font-size: 1.05rem;
}

.timeforslag-topp .timeforslag-alle[b-mhmf41nrvu] {
    margin: 0;
}

.timeforslag-liste[b-mhmf41nrvu] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--sp-3);
}

.timeforslag-kort[b-mhmf41nrvu] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    padding: var(--sp-3);
    background: var(--mod-flate);
    border: 1px solid var(--mod-kant);
    border-radius: 0.5rem;
}

.timeforslag-dato[b-mhmf41nrvu] {
    font-size: 0.9rem;
    color: var(--mod-tekst-dus);
}

.timeforslag-dato[b-mhmf41nrvu]::first-letter {
    text-transform: uppercase;
}

.timeforslag-tid[b-mhmf41nrvu] {
    display: flex;
    align-items: baseline;
    gap: var(--sp-2);
    font-size: 1.15rem;
    font-variant-numeric: tabular-nums;
}

.timeforslag-tid span[b-mhmf41nrvu] {
    font-size: 0.9rem;
    color: var(--mod-tekst-dus);
}

.timeforslag-hva[b-mhmf41nrvu] {
    overflow-wrap: anywhere;
}

.timeforslag-merknad[b-mhmf41nrvu] {
    font-size: 0.9rem;
    color: var(--mod-gul-tekst);
}

.timeforslag-knapper[b-mhmf41nrvu] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
    margin-top: var(--sp-2);
}

.timeforslag-knapper .btn-ny[b-mhmf41nrvu],
.timeforslag-knapper .btn-avbryt[b-mhmf41nrvu] {
    flex: 1 1 8rem;
    justify-content: center;
    min-height: 44px;
    margin: 0;
    max-width: none;
}

.timeforslag-uten[b-mhmf41nrvu] {
    margin: var(--sp-3) 0 0;
    padding-left: var(--sp-5);
    font-size: 0.9rem;
    color: var(--mod-tekst-dus);
}

@media (min-width: 641px) {
    .timeforslag-liste[b-mhmf41nrvu] {
        grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
    }
}
/* /Components/Pages/Nytt/Nyhet.razor.rz.scp.css */
/* NYT-2: «← Alle nyheter» over detaljvisningen (NyhetVisning). */
.nyhet-tilbake[b-j2grukngl0] {
    margin: 0 0 var(--sp-3);
}

.nyhet-tilbake a[b-j2grukngl0] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    min-height: 44px;
}
/* /Components/Pages/Nytt/Nyheter.razor.rz.scp.css */
/* NYT-2: kundens /nytt — stramme trykkbare rader (.ordre-liste), gruppert per måned. */

/* UI-126: filteret er husklassen .valg; samme luft rundt som .status-faner hadde. */
.nytt-valg[b-1inoxrdw0c] {
    margin: var(--sp-2) 0 var(--sp-5);
}
.nytt-gruppe-tittel[b-1inoxrdw0c] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--mod-tekst-dus);
    margin: var(--sp-5) 0 var(--sp-2);
}

.nytt-gruppe-tittel[b-1inoxrdw0c]:first-letter {
    text-transform: uppercase;
}

.nytt-liste[b-1inoxrdw0c] {
    max-width: 760px;
}

/* Skillelinja: .ordre-rad sin kant forsvinner (:last-child) når hver rad står i sin egen li. */
.nytt-liste > li + li[b-1inoxrdw0c] {
    border-top: 1px solid var(--mod-kant);
}

/* Hele raden er lenka. */
.nytt-rad[b-1inoxrdw0c] {
    display: block;
    color: inherit;
    text-decoration: none;
}

.nytt-rad:focus-visible[b-1inoxrdw0c] {
    outline: 2px solid var(--mod-primar-markor);
    outline-offset: -2px;
}

.nytt-rad-hode[b-1inoxrdw0c],
.nytt-rad-fot[b-1inoxrdw0c] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--sp-2) var(--sp-3);
}

.nytt-rad-fot[b-1inoxrdw0c] {
    margin-top: var(--sp-1);
}

.nytt-rad-tittel[b-1inoxrdw0c] {
    font-size: 1rem;
    font-weight: 500;
    color: var(--mod-tekst);
}

.nytt-ulest .nytt-rad-tittel[b-1inoxrdw0c] {
    font-weight: 600;
}

/* Ulest: prikk i merkevarefarge (markørtokenet holder 3 : 1 mot hvitt, UI-63). */
.nytt-prikk[b-1inoxrdw0c] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--mod-primar-markor);
    margin-right: var(--sp-2);
    vertical-align: middle;
}

.nytt-piller[b-1inoxrdw0c] {
    display: inline-flex;
    flex-wrap: wrap;
    gap: var(--sp-1);
    flex-shrink: 0;
}

/* Kategorien som nøytralt omriss — status-merke merke-kategori gir form og farge (6.2),
   samme som detaljsidens (NyhetVisning). */
.nytt-pille[b-1inoxrdw0c] {
    margin-bottom: 0;
}

.nytt-rad-kort[b-1inoxrdw0c] {
    font-size: 0.9rem;
    color: var(--mod-tekst);
}

.nytt-rad-meta[b-1inoxrdw0c] {
    font-size: 0.82rem;
    color: var(--mod-tekst-dus);
    white-space: nowrap;
}

/* Mobil: raden bryter i to linjer — tittel over pillene, kort tekst over metalinja. */
@media (max-width: 480px) {
    .nytt-rad-hode[b-1inoxrdw0c],
    .nytt-rad-fot[b-1inoxrdw0c] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/Ordre.razor.rz.scp.css */
/* ORD-33 — dagkortet som mangler opplysninger sier det selv.

   Feilen sto tidligere bare i én linje øverst i skjemaet, og på en tredagers
   tur er kortet den gjelder flere skjermhøyder lenger ned. Markeringen følger
   varselkortenes eksisterende mønster (.innstilling-kort-varsel i app.css):
   farget kant hele veien rundt, tykk strek til venstre. */

.dag-kort-feil[b-l97326q4ih] {
    border-color: var(--mod-rod-kant);
    border-left: 3px solid var(--mod-rod);
}

/* .feilmelding er laget for å henge under et skjemafelt og har derfor negativ
   toppmarg. Her står den rett under overskriften «Dag N», og da må den stå
   der den står. Fargen arves fra .feilmelding. */
.dag-kort-feiltekst[b-l97326q4ih] {
    margin: 0 0 var(--sp-4);
    font-weight: 600;
}

/* ===================== UI-18 — søk og filter bak én knapp =====================

   Ordrelistas topplokk hadde vokst så mye at første ordre lå under folden på
   mobil. Under 768 px ligger derfor søkerada, datopanelet og hurtigperiodene
   bak knappen «Søk og filter»; fanerada, «Velg ordrer» og viser-telleren står
   som før på alle bredder.

   BREDDEN ER 767.98 OG IKKE HUSETS VANLIGE 640.98 fordi Remi besluttet «under
   768 px» (BESLUTNINGER.md 06.09.2026, alternativ A). 768 px er nettbrettets
   stående bredde: der under er skjermen for kort til at fanerad + søkerad +
   filterrad kan stå samtidig over lista, mens det fra 768 og opp er plass til
   alt. Brytepunktene i app.css (640.98) endrer form på selve delene og er en
   annen sak enn dette — de er urørt.

   Alt ligger her i den scopede fila og ikke i wwwroot/app.css: app.css er
   Remis kjørende server (5199), og saken skal ikke røre den.

   Desktop er byte for byte som før: knappen er skjult, og .sok-filter-del
   får ingen regel i det hele tatt over brytepunktet. */

.sok-filter-bryter[b-l97326q4ih] {
    display: none;
}

/* KND-9 — merkelappen som sier at prislinja kom fra et produkt i katalogen.

   Den finnes fordi forskjellen ellers er usynlig: to linjer med samme tekst,
   pris og mva kan få helt ulik kode i eksportfila, avhengig av om den ene ble
   valgt fra lista. Kontoret skal kunne se hvilken av dem de har.

   Diskret med vilje — dette er en opplysning, ikke en advarsel, og den skal
   ikke konkurrere med beløpet i samme rad om oppmerksomheten.

   UI-59: nøytralt kategorimerke (flate, dus tekst, kant) som «Fast rute» — det
   sier hvor linja kom fra, ikke en tilstand. Padding er 1 px mindre hver vei,
   så kanten ikke gjør pillen større enn før. */
.prislinje-produktmerke[b-l97326q4ih] {
    display: inline-block;
    align-self: flex-start;
    margin-top: var(--sp-1);
    padding: 0 calc(var(--sp-2) - 1px);
    border: 1px solid var(--mod-kant);
    border-radius: 999px;
    background-color: var(--mod-flate);
    color: var(--mod-tekst-dus);
    font-size: 0.6875rem;
    font-weight: 600;
}

@media (max-width: 767.98px) {
    .sok-filter-bryter[b-l97326q4ih] {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: var(--sp-2);
        margin-bottom: var(--sp-3);
    }

    /* .btn-avbryt har sine egne loddrette marger (og blir full bredde under
       480 px). Her styrer rada avstanden, så knappen skal ikke legge på mer —
       hele poenget med saken er høyde. Padding og min-høyde er trimmet til
       nøyaktig 44 px: minstemålet for en treffflate, og ikke ett piksel mer,
       siden hver piksel her er en piksel av lista. */
    .sok-filter-knapp[b-l97326q4ih] {
        margin: 0;
        min-height: 2.75rem;
        padding: var(--sp-2) var(--sp-4);
        justify-content: center;
    }

    /* Delene som ligger bak knappen. Filter-chipsene er IKKE med: et filter
       som står på skal være synlig også når knappen er slått av — ellers
       skjuler man et filter som styrer lista.

       display: none og ikke @if: markupen skal være én, slik at desktop og
       mobil viser nøyaktig samme elementer (krav 3). */
    .sok-filter-del:not(.utfoldet)[b-l97326q4ih] {
        display: none;
    }
}

/* ───────────── Bom på tomkjøringen (KND-5) ─────────────
   En tynn strek over raden, slik at de to bomsummene leses som to ting og
   ikke som ett tall delt i to. Scoped, ikke i app.css: raden finnes kun her. */
.bompanel-tomkjoring[b-l97326q4ih] {
    border-top: 1px solid rgba(0, 0, 0, .08);
    padding-top: var(--sp-3);
    margin-top: var(--sp-3);
}

/* ===================== KND-15 — bestillingen i ordrelista =====================

   Kjøringer i samme bestilling står under én overskrift med navn og lenke
   til kortet. Overskriften er en <li> i samme <ul> som radene, så listas
   ramme og radskillene er urørte; den skiller seg ut med dus bakgrunn og en
   tykkere strek i venstrekanten, og radene under arver streken så gruppa
   leses som ett. Scoped her og ikke i wwwroot/app.css: app.css er Remis
   kjørende server (5199), og saken skal ikke røre den. */

.ordre-gruppe-hode[b-l97326q4ih] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2) var(--sp-3);
    padding: var(--sp-2) var(--sp-4);
    background: var(--mod-bg);
    border-bottom: 1px solid var(--mod-kant);
    border-left: 3px solid var(--mod-tekst-dus);
    font-size: 0.9rem;
    color: var(--mod-tekst);
}

/* Inline, IKKE inline-flex: som fleksbarn brøt navnet linje for seg selv på
   375 px («Bestilling:» alene til venstre, navnet i en blokk til høyre — målt
   11.09.2026). Som løpende tekst bryter «Bestilling: Demo Kunde AS – september
   2026» der linja slutter, som en setning. */
.ordre-gruppe-lenke[b-l97326q4ih] {
    display: inline;
    color: inherit;
    text-decoration: none;
}

.ordre-gruppe-lenke .merke-ikon[b-l97326q4ih] {
    vertical-align: -2px;
    margin-right: var(--sp-1);
}

.ordre-gruppe-lenke:hover[b-l97326q4ih],
.ordre-gruppe-lenke:focus[b-l97326q4ih] {
    text-decoration: underline;
}

.ordre-gruppe-teller[b-l97326q4ih] {
    color: var(--mod-tekst-dus);
    white-space: nowrap;
}

.ordre-rad.i-bestilling[b-l97326q4ih] {
    border-left: 3px solid var(--mod-kant);
}

/* Taggen på en fast rute-avgang som OGSÅ er i en bestilling — serien vant
   plassen i gruppa (OrdreListe.GrupperEtterBestilling), klammen står som ord.
   Fargene står i tema-moderne.css (UI-59: nøytralt kategorimerke). */
.bestilling-merke[b-l97326q4ih] {
    text-decoration: none;
}

.bestilling-merke:hover[b-l97326q4ih],
.bestilling-merke:focus[b-l97326q4ih] {
    text-decoration: underline;
}

/* Blokka i Turdetaljer — knappen og hjelpeteksten hører sammen. */
.bestilling-blokk[b-l97326q4ih] {
    margin-top: var(--sp-3);
}

.bestilling-blokk .btn-tekst[b-l97326q4ih] {
    margin-left: var(--sp-2);
}

/* ORD-174 (c): en kjøring i en ANNEN bestilling er «grået» i arket «Slå sammen med andre
   kjøringer». .kontakt-inaktiv har ingen regel i app.css (målt 28.10: samme tekstfarge som
   de valgbare radene, bare avkryssingen var sperret), så etiketten dempes her med husets
   dempede tekstfarge — ikke opacity, så «Legg … i stedet»-knappen står fullt lesbar. */
.bestilling-kandidater .kontakt-inaktiv label[b-l97326q4ih] {
    color: var(--mod-tekst-dus);
}

/* ===================== UI-65 — PROTOTYPE: Turdetaljer som rutenett =====================

   Remi 18.09.2026: turdetaljene ble laget som et skjema i én smal kolonne
   (.form-felt har max-width 480 px), og på PC står to tredeler av kortet tomt.
   Prototypen legger feltene i et rutenett over hele bredden — Remi tester den
   lokalt og kan forkaste grenen.

   MOBILE-FIRST: under 900 px finnes ingen regel her utover én marg (se under),
   og markupen har samme rekkefølge som før — mobil er uendret. Rutenettet er
   en ren utvidelse oppover.

   BREDDEN: redigeringsskjemaet er med vilje smalt (BredSide-unntaket øverst i
   Ordre.razor — de andre fanene er ikke vurdert på full bredde), så innholdet
   stanser på --innhold-bredde (1040 px). Det som var smalt i Turdetaljer, var
   seksjonens egen grense (.innstilling-seksjon, 760 px) og feltenes 480 px.
   Begge løftes her, bare for denne fanen og bare fra 900 px.

   TO TRINN, IKKE ETT: fra 900 px står tidene to og to, fra 1280 px fire på rad.
   Med sidemenyen (250 px) og tre nestede kort er dagkortet bare ~470 px bredt
   ved 900 px — fire datofelt på ~100 px hver klipper «dd.mm.åååå tt:mm». Fra
   ~1290 px står innholdet på full 1040 px, og fire kolonner får ~190 px.

   TAB-REKKEFØLGEN: reading-flow: grid-rows lar tastaturet følge rutenettet rad
   for rad, uten å bytte om på markupen (som ville endret mobil). Chrome/Edge
   støtter det; i nettlesere uten støtte følger Tab markupen som før. */

/* SKJ-37: selve rutenettet (.tur-rutenett, feltenes plass, pila, flynummeret)
   bor i app.css — bestillingsskjemaets Turdetaljer.razor bruker det samme.
   Her står bare det som er ordrens alene: seksjonsbredden, bussene denne
   dagen, avstand og reisetid, og stopp-radenes oppsett. */

@media (min-width: 900px) {
    .tur-seksjon[b-l97326q4ih] {
        max-width: none;
    }

    /* Rad 7 og 8 i rutenettet (app.css har rad 1–6). */
    .tur-bus[b-l97326q4ih]      { grid-row: 7; grid-column: 1 / -1; }
    .tur-avst[b-l97326q4ih]     { grid-row: 8; grid-column: 1 / -1; }

    /* Avstand og reisetid: egen rad i full bredde — status, «Beregn på nytt»
       og «Juster manuelt» på én linje. Gjelder også endagsturen, der blokka
       står under dagkortet. Feilmeldingen og kjøretidslinja (ingen av dem har
       noe å trykke på, så Tab-rekkefølgen er uberørt) legges etter linja, og
       et åpnet «Juster manuelt» får en egen linje under. */
    .tur-avst[b-l97326q4ih] {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        column-gap: var(--sp-4);
        max-width: none;
    }

    .tur-avst > .krav-felt[b-l97326q4ih] {
        margin-bottom: 0;
    }

    .tur-avst > .rute-juster[b-l97326q4ih] {
        margin-top: 0;
    }

    .tur-avst > .rute-juster[open][b-l97326q4ih] {
        flex-basis: 100%;
        margin-top: var(--sp-2);
    }

    .tur-avst > p[b-l97326q4ih] {
        order: 1;
        flex-basis: 100%;
        margin-top: var(--sp-2);
    }

    /* Stoppene får hele bredden: adresse, type og tider på én linje når det er
       plass, i samme rekkefølge som før. */
    .tur-stopp .stopp-rad[b-l97326q4ih] {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-end;
        column-gap: var(--sp-4);
    }

    .tur-stopp .stopp-rad > .minifelt[b-l97326q4ih] {
        flex: 1 1 11rem;
    }

    .tur-stopp .stopp-rad > .minifelt:first-child[b-l97326q4ih] {
        flex: 2 1 18rem;
    }

    .tur-stopp .stopp-rad > .stopp-tider[b-l97326q4ih] {
        flex: 0 1 auto;
    }

    .tur-stopp .stopp-rad > p[b-l97326q4ih] {
        flex-basis: 100%;
    }

    /* KND-122c: «Maps: …» under adressen gjør adressefeltet høyere enn
       naboene, og flex-end ville senket «Stopp eller pause» like mye. Bare
       rader med linja toppjusteres — de andre står som før. */
    .tur-stopp .stopp-rad:has(> .minifelt:first-child > p)[b-l97326q4ih] {
        align-items: flex-start;
    }
}

/* ===================== KND-49 — handlingslinja står fast på mobil =====================

   Når noe er valgt, ligger «Sett sjåfør på valgte» nederst på skjermen under
   768 px (instruksens UX-krav): utvalget gjøres ved å rulle gjennom lista, og
   knappen skal ikke forsvinne over toppen. Under 641 px står bunnmenyen der
   (app.css, .bunnmeny, 3.5rem), så linja legger seg over den — samme høyde som
   .filter-panel bruker. z-index under .bunnmeny (1500) og .ark-* (1700).
   .bulk-plass holder av høyden, så siste rad og sidevelgeren ikke dekkes. */
.bulk-plass[b-l97326q4ih] {
    display: none;
}

@media (max-width: 767.98px) {
    .bulk-linje.bulk-fast[b-l97326q4ih] {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1400;
        margin: 0;
        padding: var(--sp-2) var(--sp-4);
        background: var(--mod-flate);
        border-top: 1px solid var(--mod-kant);
        box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
        gap: var(--sp-1) var(--sp-2);
    }

    /* Kompakt: husets mobilregel (app.css, ≤ 480 px) stabler hver knapp i full
       bredde og 48 px høyde — fem slike ga en fast linje på 397 px, halve
       skjermen (målt 28.09 på 375 × 812). Her står handlingen alene øverst og
       resten deler radene. Telleren skjules: antallet står på handlingen. */
    .bulk-linje.bulk-fast .btn-ny[b-l97326q4ih],
    .bulk-linje.bulk-fast .btn-avbryt[b-l97326q4ih] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: auto;
        flex: 1 1 auto;
        min-height: 40px;
        padding: 0.35rem 0.75rem;
        font-size: 0.9rem;
    }

    .bulk-linje.bulk-fast .btn-ny[b-l97326q4ih] {
        order: -1;
        flex-basis: 100%;
    }

    .bulk-linje.bulk-fast .bulk-teller[b-l97326q4ih] {
        display: none;
    }

    .bulk-plass.bulk-fast-aktiv[b-l97326q4ih] {
        display: block;
        height: 10rem;
    }
}

@media (max-width: 640.98px) {
    .bulk-linje.bulk-fast[b-l97326q4ih] {
        bottom: calc(3.5rem + env(safe-area-inset-bottom, 0px));
    }
}

/* Massetildelingens ark: oppsummering og lister. */
.massetildeling-oppsummering[b-l97326q4ih] {
    margin: 0 0 var(--sp-3);
    padding-left: 1.2rem;
}

.massetildeling-oppsummering li[b-l97326q4ih] {
    margin-bottom: var(--sp-1);
}

.massetildeling-under[b-l97326q4ih] {
    font-size: 1rem;
    margin: var(--sp-4) 0 var(--sp-2);
}

.massetildeling-liste[b-l97326q4ih] {
    margin: 0 0 var(--sp-3);
    padding-left: 1.2rem;
}

/* SJF-22a: kilometeroversikten i statuskortet — én linje per buss/dag. */
.km-oversikt > div[b-l97326q4ih] {
    display: grid;
    gap: 2px;
}

.km-linje[b-l97326q4ih] {
    margin: 0;
    font-variant-numeric: tabular-nums;
}

.km-endre[b-l97326q4ih] {
    margin-left: var(--sp-2);
    padding-block: 0;
}

.km-felt[b-l97326q4ih] {
    width: 100%;
    min-height: 44px;
    font-variant-numeric: tabular-nums;
}

/* KND-67: fast rute på valgte datoer — feltet og «Legg til» side om side,
   datoene som brytende brikker (mobil 375 px: de legger seg i rader). */
.fastrute-dato-rad[b-l97326q4ih] {
    display: flex;
    gap: var(--sp-2);
    align-items: center;
    margin-bottom: var(--sp-2);
}

.fastrute-dato-rad .search-input[b-l97326q4ih] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 44px;
    margin-bottom: 0;
}

/* .btn-avbryt er full bredde på mobil — her står den ved siden av feltet. */
.fastrute-dato-rad .btn-avbryt[b-l97326q4ih] {
    flex: 0 0 auto;
    width: auto;
    min-height: 44px;
    margin: 0;
}

.fastrute-datoer[b-l97326q4ih] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-1);
    margin: 0 0 var(--sp-2);
    padding: 0;
    list-style: none;
}

.fastrute-dato[b-l97326q4ih] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    padding: 2px 4px 2px 10px;
    border: 1px solid var(--mod-kant-sterk);
    border-radius: 999px;
    background: var(--mod-flate);
    color: var(--mod-tekst);
    font-size: 0.9rem;
    font-variant-numeric: tabular-nums;
}

.fastrute-dato-fast[b-l97326q4ih] {
    padding-right: 6px;
    color: var(--mod-tekst-dus);
    font-size: 0.8rem;
}

.fastrute-dato-fjern[b-l97326q4ih] {
    min-width: 32px;
    min-height: 32px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--mod-tekst-dus);
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
}

.fastrute-dato-fjern:hover[b-l97326q4ih],
.fastrute-dato-fjern:focus-visible[b-l97326q4ih] {
    background: var(--mod-bg);
    color: var(--mod-tekst);
}

/* UI-154: hver buss i fanen Sjåfør er én gruppe; luft mellom gruppene. */
.sjafor-bussgruppe:not(:last-child)[b-l97326q4ih] {
    margin-bottom: var(--sp-4);
}
/* /Components/Pages/Pamelding/Arrangementer.razor.rz.scp.css */
/* ============================================================
   PAM-22 — merket «Delbar lenke» på publiserte rader i arrangementslista.

   Scoped CSS (Blazor CSS-isolasjon) og ikke app.css, av samme grunn som i
   Deltakere.razor.css: regelen gjelder ÉN side, og app.css er fila flest
   tråder skriver i samtidig.

   Fila bar fra PAM-7 én regel for delelenka inne i tabellcella
   (.delelenke .skjema-lenke). PAM-22 flyttet lenkeblokka til arrangementets
   side, der den står i et kort med hele bredden og husets egen
   .orgnr-rad .skjema-lenke holder — regelen fulgte ikke med, for den fantes
   bare for å tåle en tabellcelle.
   ============================================================ */

/* En dempet merkelapp ved navnet, ikke et statusmerke: den skal ikke rope
   høyere enn navnet den står ved. Samme form som husets «fantes fra
   før»-merke (.konflikt-merke i app.css) — kantlinje i tekstfargen, liten
   skrift, litt gjennomsiktig — men med eget navn, for klassen der hører til
   en annen apps konfliktsjekk og skal ikke lånes på tvers. */
.lenke-merke[b-9134ghk4ge] {
    display: inline-block;
    margin-left: var(--sp-2, 8px);
    padding: 0.05rem 0.4rem;
    border: 1px solid currentColor;
    border-radius: 0.7rem;
    font-size: 0.7rem;
    font-weight: 500;
    vertical-align: 1px;
    opacity: 0.75;
    white-space: nowrap;
}

/* PAM-228f del C: «N nye meldinger» (status-merke merke-info) ved navnet — Razor spiser mellomrommet etter lenka
   (kommentaren står mellom), så merket sto klistret til navnet (målt 375 px og desktop). Samme luft som .lenke-merke. */
.arr-nye-meldinger[b-9134ghk4ge] {
    margin-left: var(--sp-2, 8px);
}

/* PAM-132: arrangementet avviser påmeldinger nå — samme varselfarge som
   ikonet i .innstilling-kort-varsel (app.css), og fullt synlig. */
.lenke-merke-avviser[b-9134ghk4ge] {
    color: var(--mod-gul-tekst);
    opacity: 1;
}

/* ============================================================
   PAM-66 / PAM-223a — arket bak «Nytt arrangement»: fire felt, «Start
   påmeldingen», og lista man kopierer fra. Arket selv er husets .ark-*
   (app.css); her står bare innholdet. Feltene er husets form-felt/search-input.
   ============================================================ */

/* Dato, Fra og Til på én linje når det er plass — på 375 px brytes Fra/Til
   under datoen i stedet for å rulle sidelengs. */
.nytt-tid[b-9134ghk4ge] {
    display: flex;
    flex-wrap: wrap;
    gap: 0 var(--sp-3, 12px);
}

.nytt-tid .form-felt[b-9134ghk4ge] {
    flex: 0 1 auto;
    min-width: 0;
}

.nytt-hjelp[b-9134ghk4ge] {
    margin: var(--sp-1, 4px) 0 var(--sp-3, 12px);
}

/* «Kopier fra et tidligere arrangement» står under de fire feltene, skilt
   fra dem — en annen vei til et nytt arrangement, ikke et felt til. */
.nytt-kopi[b-9134ghk4ge] {
    margin-top: var(--sp-5, 24px);
    padding-top: var(--sp-4, 16px);
    border-top: 1px solid var(--mod-kant);
}

.nytt-kopi .innstilling-hjelp[b-9134ghk4ge] {
    margin: var(--sp-1, 4px) 0 0;
}

.nytt-kopi .btn-avbryt[b-9134ghk4ge] {
    margin: 0;
    max-width: 100%;
    white-space: normal;
}

.kilde-liste[b-9134ghk4ge] {
    list-style: none;
    margin: 0 0 var(--sp-4, 16px);
    padding: 0;
    display: grid;
    gap: var(--sp-2, 8px);
}

/* Hele raden er knappen — 44 px trykkflate, navnet får bryte, datoen står
   samlet. På 375 px legger datoen seg under navnet i stedet for å presse det. */
.kilde-valg[b-9134ghk4ge] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    gap: 0 var(--sp-3, 12px);
    width: 100%;
    min-height: 44px;
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border: 1px solid var(--mod-kant);
    border-radius: 8px;
    background: var(--mod-flate);
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.kilde-valg:hover[b-9134ghk4ge],
.kilde-valg:focus-visible[b-9134ghk4ge] {
    border-color: currentColor;
    background: var(--mod-bg);
}

.kilde-navn[b-9134ghk4ge] {
    font-weight: 500;
    overflow-wrap: anywhere;
}

.kilde-dato[b-9134ghk4ge] {
    font-size: 0.85rem;
    opacity: 0.75;
    white-space: nowrap;
}
/* /Components/Pages/Pamelding/Arrangementsbillettyper.razor.rz.scp.css */
/* PAM-225c — kortet «Billettyper» i fanen «Betaling». Navnet er lenka som åpner arket (DESIGNSYSTEM.md 6.7),
   farget som en lenke — samme regel som produktene på arrangementet (Arrangementsprodukter.razor.css). */
.billettype-navn[b-6ql763t8zu] {
    text-align: left;
    padding: 0;
    color: var(--mod-primar-mork);
    font-weight: 600;
}

/* Kortets overskrift i samme størrelse som kortet «Betaling» over (FaneBetaling.razor.css) — scoped CSS når ikke
   inn i en barnekomponent, så regelen står her. */
.arr-kort h2[b-6ql763t8zu] {
    margin: 0 0 var(--sp-3, 12px);
    font-size: 1.05rem;
}
/* /Components/Pages/Pamelding/Arrangementsinformasjon.razor.rz.scp.css */
/* PAM-256B — kortet «Informasjon til deltakerne» i fanen «Arrangement». Husets .innstilling-kort, .form-felt,
   .search-input og RadMeny uendret; her bare lista og det fanens scoped CSS ikke når inn i en barnekomponent. */

/* Kortets overskrift i samme størrelse som fanens andre kort (FaneArrangement.razor.css) — scoped CSS når ikke inn i en
   barnekomponent, så regelen står her, som i Arrangementsbillettyper.razor.css. */
.arr-kort h2[b-05roc2e9xv] {
    margin: 0 0 var(--sp-1, 4px);
    font-size: 1.05rem;
}

/* En liste (én kolonne er ikke en tabell, DESIGNSYSTEM 6.7): tittelen til venstre, «•••» i høyre kant, rader skilt
   med 1 px --mod-kant som tabellradene. */
.avsnitt-liste[b-05roc2e9xv] {
    list-style: none;
    margin: var(--sp-3, 12px) 0;
    padding: 0;
    border-top: 1px solid var(--mod-kant);
}

.avsnitt-rad[b-05roc2e9xv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3, 12px);
    min-height: 3rem;
    padding: var(--sp-1, 4px) 0;
    border-bottom: 1px solid var(--mod-kant);
}

/* Tittelen er lenka som åpner arket (6.7), farget som en lenke — samme regel som billettypene. Lange titler brytes. */
.avsnitt-tittel[b-05roc2e9xv] {
    min-width: 0;
    padding: 0;
    text-align: left;
    color: var(--mod-primar-mork);
    font-weight: 600;
    overflow-wrap: anywhere;
}

/* Tekstområdet (6.6): minst 96 px, kan dras høyere, aldri bredere. */
.avsnitt-tekst[b-05roc2e9xv] {
    min-height: 6rem;
    resize: vertical;
}
/* /Components/Pages/Pamelding/Arrangementsmodulkort.razor.rz.scp.css */
/* PAM-223b1 — kryssene for modulene. PAM-269: ett kort per modul — Tillegg i «Legg til i arrangementet»,
   Betaling som «Ta betalt for påmeldingen» øverst i fanen Betaling. Raden: checkbox-rad, hjelpelinja under
   (DESIGNSYSTEM.md 6.6), og varselet (6.3) under raden når Betaling ikke kan skjules. */
.modul-rad .statusvarsel[b-a4ryb7mu86] {
    margin-top: var(--sp-2);
}
/* /Components/Pages/Pamelding/Arrangementsprodukter.razor.rz.scp.css */
/* PAM-182a — seksjonen «Produkter» på arrangementet. Navnet er lenka som åpner arrangementets regler for
   produktet (DESIGNSYSTEM.md 6.7), farget som en lenke — samme regel som katalogen (Pameldingspriser.razor.css). */
.produkt-navn[b-dreisxcemb] {
    text-align: left;
    padding: 0;
    color: var(--mod-primar-mork);
    font-weight: 600;
}
/* /Components/Pages/Pamelding/Avbestill.razor.rz.scp.css */
/* ============================================================
   PAM-142 — avbestillingssiden. Husets .kontakt-side, .innstilling-kort,
   .ark-* og knappene uendret; her bare det siden trenger i tillegg.
   ============================================================ */

/* «Deltakere» er en underoverskrift i kortet, ikke en ny side — mindre enn arrangementets navn. */
.avbestill-kort h2[b-3muufg9dg3] {
    margin: 0 0 var(--sp-2, 8px);
    font-size: 1.05rem;
}

.avbestill-deltakere[b-3muufg9dg3] {
    margin: 0;
    padding-left: 1.3em;
}

/* Knappen er en lenke (statisk side, ingen @onclick) — samme trykkflate som en knapp, hele bredden på mobil. */
.avbestill-knapp[b-3muufg9dg3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    text-decoration: none;
}

/* PAM-167 — «Din påmelding». Husets felt (.search-input), tabell (.tabell-stablet) og knapper; her bare luften. */
.endre-deltaker[b-3muufg9dg3] {
    margin-top: var(--sp-4, 16px);
    padding-top: var(--sp-3, 12px);
    border-top: 1px solid var(--mod-kant);
}

/* Tall: høyrestilt, maks 160 px (DESIGNSYSTEM 6.6). Dato: maks 200 px. */
.endre-antall[b-3muufg9dg3] {
    max-width: 160px;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.endre-dato[b-3muufg9dg3] {
    max-width: 200px;
}

.endre-linjer .tall[b-3muufg9dg3] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.endre-sum[b-3muufg9dg3] {
    margin: var(--sp-3, 12px) 0 0;
    text-align: right;
}

/* Skrivebeskyttet (fristen er ute): etikett over verdi, som på mobil overalt. */
.endre-opplysninger[b-3muufg9dg3] {
    margin: var(--sp-3, 12px) 0 0;
}

.endre-opplysninger dt[b-3muufg9dg3] {
    font-weight: 600;
    margin-top: var(--sp-2, 8px);
}

.endre-opplysninger dd[b-3muufg9dg3] {
    margin: 0;
    overflow-wrap: anywhere;
}

/* PAM-170 — tidspunktene med hver sin frist. Bryting av tidspunktets navn og deltakernavn skjer via husets .brytbar-tekst. */
/* Merket er én tilstand — det brytes aldri (DESIGNSYSTEM 6.2). */
.endre-tidspunkter .status-merke[b-3muufg9dg3] {
    white-space: nowrap;
}

/* PAM-228a2 — «Dine billetter»: billettene under hverandre (mobil: rull), 1 px skille mellom dem. */
.dine-billetter-liste[b-3muufg9dg3] {
    margin: var(--sp-3, 12px) 0 0;
    padding: 0;
    list-style: none;
}

.dine-billett[b-3muufg9dg3] {
    padding: var(--sp-4, 16px) 0;
    text-align: center;
}

.dine-billett + .dine-billett[b-3muufg9dg3] {
    border-top: 1px solid var(--mod-kant);
}

/* «Barn · Kari» / «Voksen 1 av 2» — hvem billetten er for, rett over koden. */
.dine-billett-tittel[b-3muufg9dg3] {
    margin: 0 0 var(--sp-2, 8px);
    font-size: 1.25rem;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.dine-billett-avganger[b-3muufg9dg3] {
    margin: 0 0 var(--sp-3, 12px);
    padding: 0;
    list-style: none;
    color: var(--mod-tekst-dus);
    overflow-wrap: anywhere;
}

/* Koden: alltid svart på hvitt med stille sone, uansett merkevare og mørk modus (som billettsiden). */
.dine-billett-qr[b-3muufg9dg3] {
    display: flex;
    justify-content: center;
    width: fit-content;
    max-width: 100%;
    margin: 0 auto var(--sp-2, 8px);
    padding: var(--sp-4, 16px);
    background-color: white;
    border: 1px solid var(--mod-kant);
    border-radius: var(--mod-radius-liten);
}

.dine-billett-qr img[b-3muufg9dg3] {
    display: block;
    width: 240px;
    max-width: 100%;
    height: auto;
    image-rendering: pixelated;
}

.dine-billett-referanse[b-3muufg9dg3] {
    margin: 0 0 var(--sp-2, 8px);
    color: var(--mod-tekst-dus);
}

/* Referansen leses opp ved inngangen når kameraet svikter — sifrene like brede. */
.dine-billett-nummer[b-3muufg9dg3] {
    color: var(--mod-tekst);
    font-size: 1.25rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
}

/* PAM-287 — «Sendt til»-linja: husets .brytbar-tekst gjelder bare td, så en lang e-postadresse brytes her. */
.dine-billett p.brytbar-tekst[b-3muufg9dg3] {
    overflow-wrap: anywhere;
}

/* Lenka er en knapp (statisk side, ingen @onclick) — samme trykkflate, hele bredden på mobil. */
.dine-billetter-pdf[b-3muufg9dg3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-2, 8px);
    min-height: 48px;
    text-decoration: none;
}

@media (min-width: 768px) {
    .dine-billetter-pdf[b-3muufg9dg3] {
        display: inline-flex;
    }
}

/* PAM-259B1 — «Din timeplan»: stilen for dagene og linjene står i Timeplanvisning.razor.css (PAM-259B2), med markupen. */
/* /Components/Pages/Pamelding/Billett.razor.rz.scp.css */
/* ============================================================
   PAM-228a2 — billettsiden. Husets .kontakt-side, .kontakt-logo,
   .kontakt-avsender, .statusvarsel og knappene uendret; her bare
   det billetten trenger i tillegg. Mobil 375 px er hovedskjermen.
   ============================================================ */

.billett-side h1[b-xvcr6y2lm5] {
    margin-bottom: var(--sp-3);
}

/* Avgangene: én linje hver, dus — de forteller hvilken tur, billetten er koden under. */
.billett-avganger[b-xvcr6y2lm5] {
    margin: 0 0 var(--sp-4);
    padding: 0;
    list-style: none;
    color: var(--mod-tekst-dus);
    overflow-wrap: anywhere;
}

.billett-avganger li + li[b-xvcr6y2lm5] {
    margin-top: var(--sp-1);
}

/* «Barn · Kari» / «Voksen 1 av 2» — hvem billetten er for, rett over koden. */
.billett-tittel[b-xvcr6y2lm5] {
    margin: 0 0 var(--sp-3);
    font-size: 1.25rem;
    font-weight: 600;
    overflow-wrap: anywhere;
}

/* Koden: alltid svart på hvitt med stille sone, uansett merkevare og mørk modus (som Kode.razor).
   Kontrasten er en funksjonell egenskap her — en kode på farget flate leses dårligere. */
.billett-qr[b-xvcr6y2lm5] {
    display: flex;
    justify-content: center;
    width: fit-content;
    max-width: 100%;
    margin: 0 auto var(--sp-3);
    padding: var(--sp-4);
    background-color: white;
    border: 1px solid var(--mod-kant);
    border-radius: var(--mod-radius-liten);
}

.billett-qr img[b-xvcr6y2lm5] {
    display: block;
    width: 264px;
    max-width: 100%;
    height: auto;
    image-rendering: pixelated;
}

.billett-referanse-etikett[b-xvcr6y2lm5] {
    margin: 0;
    text-align: center;
    font-size: 0.875rem;
    color: var(--mod-tekst-dus);
}

/* Referansen leses opp ved inngangen når kameraet svikter — stor, og sifrene like brede. */
.billett-referanse[b-xvcr6y2lm5] {
    margin: 0 0 var(--sp-3);
    text-align: center;
    font-size: 1.75rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
}

.billett-hjelp[b-xvcr6y2lm5] {
    text-align: center;
}

/* Lenka er en knapp (statisk side, ingen @onclick) — samme trykkflate, hele bredden på mobil. */
.billett-last-ned[b-xvcr6y2lm5] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-2);
    min-height: 48px;
    margin-top: var(--sp-4);
    text-decoration: none;
}

.billett-varsel[b-xvcr6y2lm5] {
    margin-top: var(--sp-2);
}

@media (min-width: 768px) {
    .billett-last-ned[b-xvcr6y2lm5] {
        display: inline-flex;
    }
}
/* /Components/Pages/Pamelding/Deltakere.razor.rz.scp.css */
/* ============================================================
   PAM-4 — arrangementets side. PAM-50: bare RAMMEN står her (tilbakelenka og
   fanerada); hver fane har sin egen .razor.css ved siden av komponenten.
   Scoped CSS gjelder bare elementer komponenten selv tegner, så reglene fulgte
   markupen da den ble flyttet.

   Scoped CSS (Blazor CSS-isolasjon) og ikke app.css, med vilje: reglene her
   gjelder ÉN side, og app.css er fila flest tråder skriver i samtidig. Husets
   egne klasser (.data-tabell, .tabell-stablet, .innstilling-kort,
   .pamelding-fakta) brukes uendret.
   ============================================================ */

/* Bare avstanden under raden hører hjemme her. Selve lenka bruker husets
   `.btn-tekst` fra og med PAM-7 — den egne `.tilbake-lenke` som sto her ga
   samme farge og hover, men uten `.btn-tekst` sin min-height på 44 px, og
   dette er den eneste veien ut av siden på mobil. */
.tilbake-rad[b-2wyxz65k49] {
    margin: 0 0 var(--sp-2, 8px);
}

/* Remi 21.09.2026: «Åpne skjemaet» flyttet til høyre på tittellinja — h1 og
   knapp-rada er én flex-rad. flex-wrap gjør at knappen legger seg under
   tittelen på mobil i stedet for å presse den sammen. */
.arrangement-hode[b-2wyxz65k49] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.arrangement-hode h1[b-2wyxz65k49] {
    margin: 0;
}

.arrangement-hode .ramme-knapper[b-2wyxz65k49] {
    margin: 0;
}

/* PAM-50, tillegg 3 → PAM-49: «Åpne skjemaet slik deltakeren ser det» og merket
   «Publisert»/«Ikke publisert» på samme rad. Rada bryter, og en knapp med lang
   tekst får bryte teksten sin i stedet for å skyve sida ut — aldri horisontal
   rulling på 375 px. */
.ramme-knapper[b-2wyxz65k49] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
}

.ramme-knapper .btn-avbryt[b-2wyxz65k49] {
    max-width: 100%;
    white-space: normal;
    margin: 0;
}

/* PAM-49: merket ved knappen. Grønn når publisert, nøytral gul når ikke — ikke
   rød: et upublisert arrangement er en tilstand, ikke en feil (den røde streken
   under «Publisering» i fanerada sier alt at det gjenstår en handling). */
.publiseringsmerke[b-2wyxz65k49] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.6rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}

.publiseringsmerke-publisert[b-2wyxz65k49] {
    background: var(--mod-gronn-bg);
    color: var(--mod-gronn-tekst);
}

.publiseringsmerke-upublisert[b-2wyxz65k49] {
    background: var(--mod-gul-bg);
    color: var(--mod-gul-tekst);
}

/* PAM-223a: varselet etter «Start påmeldingen» står over fanen «Publisering» —
   luft ned til kortet under. */
.startet-varsel[b-2wyxz65k49] {
    margin-bottom: var(--sp-4, 16px);
}

@media (max-width: 640.98px) {
    /* PAM-25: husets .status-faner har 24 px (sp-5) mellom fanene; det
       strammes til sp-3 her — og bare her: Ordres sju faner skal fortsatt
       bryte over flere rader. PAM-50: med fire faner (Arrangement satt inn)
       bryter rada på 375 px uansett; det strammere gapet gir to jevne rader.
       UI-162 (27.10.2026): seks faner trenger 489 px mot 351 px på 375 px — én
       linje er umulig uten skjult rulling (husregel: ingen). Fast rutenett 3 + 3
       i stedet for tilfeldig 4 + 2; Ordres faner (app.css) er urørt. */
    .status-faner[b-2wyxz65k49] {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        column-gap: var(--sp-3, 12px);
        row-gap: 0;
    }

    /* Knappen er bare så bred som teksten, så aktiv-streken følger teksten. */
    .status-fane[b-2wyxz65k49] {
        justify-self: start;
    }
}
/* /Components/Pages/Pamelding/Designseksjon.razor.rz.scp.css */
/* ============================================================
   PAM-50 — fanen «Publisering». Reglene for kortet «Design» (PAM-38) er
   flyttet fra Deltakere.razor.css sammen med markupen. PAM-270: kortet er
   komponenten Designseksjon i fanen «Skjema», og reglene fulgte med. Husets klasser
   (.farge-velger, .fil-knapp, .checkbox-rad, .knapp-rad, .btn-tekst) brukes
   uendret.
   ============================================================ */

/* Små overskrifter over hver av de tre delene (Banner, Logo, Farger). */
.design-tittel[b-jxzaj98m32] {
    margin: var(--sp-5, 24px) 0 var(--sp-2, 8px);
    font-size: 1rem;
}

/* Forhåndsvisningen av banneret: full bredde, høyden begrenset — bildet
   skaleres inn, ikke beskjæres. */
.banner-forhaands[b-jxzaj98m32] {
    padding: var(--sp-3, 12px);
    margin-bottom: var(--sp-3, 12px);
    border: 1px solid var(--mod-kant);
    border-radius: 0.5rem;
    background: var(--mod-flate);
}

.banner-forhaands img[b-jxzaj98m32] {
    display: block;
    max-width: 100%;
    max-height: 200px;
    height: auto;
    object-fit: contain;
}

/* «Bruk standard» står i samme rad som velgeren og feltet; på 375 px bryter
   rada. Husets .farge-velger er flex uten wrap — overstyres KUN her. */
.design-kort .farge-velger[b-jxzaj98m32] {
    flex-wrap: wrap;
}

.design-kort .farge-velger .search-input[b-jxzaj98m32] {
    flex: 1 1 10rem;
    min-width: 8rem;
}

.design-se-siden[b-jxzaj98m32] {
    margin-top: var(--sp-3, 12px);
}

/* ------------------------------------------------------------------ PAM-162
   Valgene og forhåndsvisningen. Smalt: én kolonne, forhåndsvisningen under
   valgene. Fra 960 px — samme brytepunkt som /merkevare (Merkevareside.razor.css)
   — to kolonner, valgene til venstre. Reglene her oversetter ingen tokens: det gjør
   merkevare.css, på innpakningen INNE i rammen, aldri på siden rundt. */
.design-oppsett[b-jxzaj98m32] {
    display: grid;
    gap: var(--sp-5, 24px);
    align-items: start;
    margin-top: var(--sp-4, 16px);
}

.design-valg[b-jxzaj98m32] {
    min-width: 0;
}

.design-forhaands-kolonne[b-jxzaj98m32] {
    min-width: 0;
}

/* Første overskrift i hver kolonne står helt øverst — «Banner» og «Forhåndsvisning» på linje. */
.design-valg > .design-tittel:first-child[b-jxzaj98m32],
.design-forhaands-kolonne .design-tittel[b-jxzaj98m32] {
    margin-top: 0;
}

/* Rammen rundt siden slik deltakeren ser den. Uten merkevare har siden
   sidebakgrunnen bak seg; med merkevare dekker innpakningen den med
   --mv-bakgrunn (merkevare.css). */
.design-forhaands-ramme[b-jxzaj98m32] {
    overflow: hidden;
    border: 1px solid var(--mod-kant);
    border-radius: var(--mod-radius);
    background-color: var(--mod-bg);
}

/* Innpakningen (Merkevarestil) og siden er Pameldingsvisning sine — luft inni
   rammen, og siden i full bredde av den, som .mv-forhaands-innhold på /merkevare. */
.design-forhaands-ramme[b-jxzaj98m32]  .merkevare-side {
    padding: var(--sp-5, 24px);
}

.design-forhaands-ramme[b-jxzaj98m32]  .kontakt-side {
    width: 100%;
    margin: 0 auto;
}

@media (min-width: 960px) {
    .design-oppsett[b-jxzaj98m32] {
        grid-template-columns: 360px minmax(0, 1fr);
    }

    /* Valgene blir stående mens arrangøren ruller ned i skjemaet til knappen. */
    .design-valg[b-jxzaj98m32] {
        position: sticky;
        top: var(--sp-4, 16px);
    }
}

@media (max-width: 640.98px) {
    .design-forhaands-ramme[b-jxzaj98m32]  .merkevare-side {
        padding: var(--sp-3, 12px);
    }
}
/* /Components/Pages/Pamelding/Dorliste.razor.rz.scp.css */
/* PAM-228b1 del B — dørlista. Bare det husklassene ikke har: avgangsvalget side om side, og «Inne»-cella der hele
   cella er trykkflaten (designsvaret (5)(c): 44 px). Tabellen, valget og feltene er husets (6.5a, 6.6, 6.7). */

.dorliste-avgang[b-tm75wamk5s] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
    align-items: flex-end;
    margin-bottom: var(--sp-4);
}

.dorliste-avgang .form-felt[b-tm75wamk5s] {
    flex: 1 1 16rem;
    max-width: 30rem;
}

.dorliste-avgang .dorliste-dato[b-tm75wamk5s] {
    flex: 0 1 12.5rem;
}

/* Cella har ingen egen luft — etiketten tar den, så hele cella er trykkflaten. */
.dorliste-tabell td.dorliste-inne[b-tm75wamk5s] {
    padding: 0;
    width: 1%;
    white-space: nowrap;
}

.dorliste-kryss[b-tm75wamk5s] {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    min-height: 44px;
    min-width: 44px;
    padding: var(--sp-2) var(--sp-4);
    cursor: pointer;
    font-variant-numeric: tabular-nums;
}

.dorliste-kryss input[type="checkbox"][b-tm75wamk5s] {
    width: 20px;
    height: 20px;
    margin: 0;
    flex: 0 0 auto;
    accent-color: var(--mod-primar-markor);
    cursor: pointer;
}

.dorliste-kryss input[type="checkbox"]:disabled[b-tm75wamk5s] {
    cursor: progress;
}

/* Ordet («Inne» / «Ikke inne») står bare i kortet på mobil — på bred skjerm sier kolonneoverskriften det. */
.dorliste-ord[b-tm75wamk5s] {
    display: none;
    font-weight: 600;
}

.dorliste-tid[b-tm75wamk5s] {
    color: var(--mod-tekst-dus);
}

/* UI-148: samme brytepunkt som .tabell-stablet i app.css — reglene gjelder kortet. */
@media (max-width: 922.98px) {
    /* I kortet: krysset er første linje i full bredde, og hele linja er trykkflaten. */
    .dorliste-tabell td.dorliste-inne[b-tm75wamk5s] {
        display: block;
        width: auto;
        padding: 0;
    }

    .dorliste-kryss[b-tm75wamk5s] {
        padding: var(--sp-1) 0;
    }

    .dorliste-ord[b-tm75wamk5s] {
        display: inline;
    }

    .dorliste-tabell td.dorliste-billett[b-tm75wamk5s] {
        font-weight: 600;
    }
}

/* PAM-228b2: «Skann billetter» over valget. */
.dorliste-skann[b-tm75wamk5s] {
    margin-bottom: var(--sp-3);
}
/* /Components/Pages/Pamelding/FaneArrangement.razor.rz.scp.css */
/* ============================================================
   PAM-50 — fanen «Arrangement». Husets .innstilling-kort, .innstilling-feltboks
   og .form-felt uendret; her står bare det fanen trenger i tillegg.
   ============================================================ */

/* PAM-50, tillegg 2: ett kort per tema. Husets .innstilling-kort bærer rammen;
   her bare en mindre overskrift, så tre kort ikke roper like høyt som sida.
   PAM-184: «Produkter» tegnes av barnekomponenten Arrangementsprodukter, som ikke får denne filas
   scope-attributt — derfor ::deep fra .arr-fane, samme grep som «3 Når» (#tidspunkter-kort). */
.arr-kort h2[b-68bui3ulfw],
.arr-fane[b-68bui3ulfw]  #arr-produkter > h2 {
    margin: 0 0 var(--sp-3, 12px);
    font-size: 1.05rem;
}

/* PAM-39: beskrivelsen kan dras høyere. ::deep fordi <textarea> tegnes av
   InputTextArea (en komponent) og ikke får denne filas scope-attributt;
   .form-felt rundt er vårt eget element og har det. */
.form-felt[b-68bui3ulfw]  .arr-beskrivelse {
    resize: vertical;
}

/* PAM-39: Lagre-raden står NEDERST. Husets .skjema-handlinger har en
   skillelinje under seg, tegnet for en knapperad over feltene. */
.skjema-handlinger-nederst[b-68bui3ulfw] {
    padding-bottom: 0;
    border-bottom: 0;
    margin-bottom: var(--sp-3, 12px);
}

/* PAM-104: dato + klokkeslett (og antall + enhet) side om side på desktop, under
   hverandre på mobil. Feltene har hver sin etikett, derfor to <div> og ikke fire.
   PAM-184: ::deep, så salgsfristen i produktarket (Arrangementsprodukter, en barnekomponent) får
   samme rad. PAM-270: kortet «Påmeldingsfrist» står i fanen «Innstillinger», med sin egen .frist-rad
   (FaneInnstillinger.razor.css); denne er for produktarket. */
.arr-fane[b-68bui3ulfw]  .frist-rad {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3, 12px);
}

.arr-fane[b-68bui3ulfw]  .frist-rad > div {
    flex: 1 1 10rem;
    min-width: 9rem;
}

/* UI-95 — «1 Hva», «2 Hvor» og «3 Når»: nummeret i en sirkel foran overskriften, som forslaget
   (dok/design/app/forslag/pam-oppsett.html). ÉN regel: «3 Når» tegnes av FanePaameldinger inne i
   .arr-fane, derfor ::deep. Undertittelen står rett under (margin som forslagets). */
.arr-kort h2[b-68bui3ulfw],
.arr-fane[b-68bui3ulfw]  #tidspunkter-kort > h2,
.arr-fane[b-68bui3ulfw]  #arr-produkter > h2 {
    display: flex;
    align-items: center;
    gap: var(--sp-2, 8px);
    font-size: 1.05rem;
}

/* Stegkortene har undertittel rett under overskriften; fristen og prisen har det ikke. */
.arr-kort h2:has(.steg)[b-68bui3ulfw],
.arr-fane[b-68bui3ulfw]  #tidspunkter-kort > h2 {
    margin: 0 0 var(--sp-1, 4px);
}

.arr-kort > .undertittel[b-68bui3ulfw],
.arr-fane[b-68bui3ulfw]  #tidspunkter-undertittel {
    margin: 0 0 var(--sp-4, 16px);
}

/* «1 Hva»: Navn og Beskrivelse i forslagets bredde (32rem), feltene fyller den. */
.hva-felt[b-68bui3ulfw] {
    max-width: 32rem;
}

.hva-felt > .form-felt[b-68bui3ulfw] {
    max-width: none;
}

.hva-felt > .form-felt[b-68bui3ulfw]  .search-input,
.hva-felt > .form-felt input.search-input[b-68bui3ulfw] {
    width: 100%;
    max-width: none;
}

.arr-fane[b-68bui3ulfw]  .steg {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 50%;
    background: var(--mod-primar);
    color: var(--merkevarefarge-tekst, white);
    font-size: 0.85rem;
    font-weight: 600;
}

/* UI-95 — «2 Hvor»: Sted · Gateadresse · Oppmøtested i én rad på desktop, under hverandre på
   mobil — tre like kolonner over hele kortbredden (forslagets .feltrad). Radavstanden (4 px under
   feltet + 12 px gap) er husets feltavstand (.form-felt, 16 px). */
.hvor-rad[b-68bui3ulfw] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: var(--sp-3, 12px) var(--sp-4, 16px);
}

.hvor-rad > .form-felt[b-68bui3ulfw] {
    min-width: 0;
    max-width: none;
    margin-bottom: var(--sp-1, 4px);
}

.hvor-rad > .form-felt[b-68bui3ulfw]  .search-input {
    width: 100%;
    max-width: none;
}

/* Rettelse 1 (Remi 22.09.2026): «Ulikt sted per tidspunkt» rett under feltene, ikke alene med
   tomrom over. .btn-tekst er 48 px høy (trykkflaten) med teksten midt i; luften over teksten
   trekkes inn her, så avstanden over er feltavstanden. Luften under teksten + kortets padding er
   målt lik luften under beskrivelsen i «1 Hva» (±2 px). Trykkflaten er uendret. */
.hvor-bytt[b-68bui3ulfw] {
    margin: calc(-1 * var(--sp-2, 8px)) 0 0;
}

.hvor-bytt .btn-tekst[b-68bui3ulfw] {
    padding-left: 0;
    /* UI-112: tekst i firmafargen → -mork (≥ 4,5 : 1), aldri rå --mod-primar/--merkevarefarge. */
    color: var(--mod-primar-mork);
}

/* UI-95B — forslagets .per-rad-merke (dok/design/app/forslag/pam-oppsett.html): ett grått merke når
   verdien står per tidspunkt, med «Samme … for alle» inne i merket på samme linje (brytes på mobil).
   Scoped her, ingen ny global klasse. Brukt i «2 Hvor» og i «Pris» (PAM-223b1; FaneBetaling har sin kopi). */
.per-rad-merke[b-68bui3ulfw] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 var(--sp-3, 12px);
    padding: 0 var(--sp-4, 16px);
    background: var(--mod-bg);
    border: 1px dashed var(--mod-kant);
    border-radius: var(--mod-radius, 8px);
    font-size: var(--tekst-hjelp, 0.875rem);
    color: var(--mod-tekst-dus);
}

.per-rad-merke > span[b-68bui3ulfw] {
    padding: var(--sp-2, 8px) 0;
}

.per-rad-merke strong[b-68bui3ulfw] {
    color: var(--mod-tekst);
}

.per-rad-merke .btn-tekst[b-68bui3ulfw] {
    padding-left: 0;
    color: var(--mod-primar-mork);
}

/* Merket rett under overskriften: samme luft som undertittelen i «1 Hva» har under seg. */
.arr-kort h2 + .per-rad-merke[b-68bui3ulfw] {
    margin-top: var(--sp-3, 12px);
}

/* Feltene som står igjen under merket (oppmøtested med verdi, mva-satsen): vanlig feltavstand. */
.under-merke[b-68bui3ulfw] {
    margin-top: var(--sp-4, 16px);
}

/* PAM-223b1: reglene for kortet «Betaling» er flyttet med markupen til FaneBetaling.razor.css. PAM-270:
   «Avbestilling» (.betaling-underoverskrift, .avbestilling-*) er flyttet til FaneInnstillinger.razor.css. */
/* /Components/Pages/Pamelding/FaneBetaling.razor.rz.scp.css */
/* ============================================================
   PAM-223b1 — fanen «Betaling». Reglene er kortet «Betaling» sine fra FaneArrangement.razor.css
   (UI-95B), flyttet med markupen: scoped CSS følger komponenten, så de står her og ikke der.
   Husets .innstilling-kort, .form-felt og .checkbox-rad uendret.
   ============================================================ */

/* Kortets overskrift i samme størrelse som kortene i fanen «Arrangement». */
.arr-kort h2[b-0xo96mh3zl] {
    margin: 0 0 var(--sp-3, 12px);
    font-size: 1.05rem;
}

/* PAM-39: tekstområdet (betalingsinformasjonen) kan dras høyere. ::deep fordi <textarea> tegnes av InputTextArea. */
.form-felt[b-0xo96mh3zl]  .arr-beskrivelse {
    resize: vertical;
}

/* PAM-39: Lagre-raden står NEDERST. Husets .skjema-handlinger har en skillelinje under seg. */
.skjema-handlinger-nederst[b-0xo96mh3zl] {
    padding-bottom: 0;
    border-bottom: 0;
    margin-bottom: var(--sp-3, 12px);
}

/* Pris · mva · valuta i én rad på desktop, under hverandre på mobil — et felt alene fyller ikke kortet. */
.hvor-rad[b-0xo96mh3zl] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
    gap: var(--sp-3, 12px) var(--sp-4, 16px);
}

.hvor-rad > .form-felt[b-0xo96mh3zl] {
    min-width: 0;
    max-width: none;
    margin-bottom: var(--sp-1, 4px);
}

.hvor-rad > .form-felt[b-0xo96mh3zl]  .search-input {
    width: 100%;
    max-width: none;
}

/* UI-95B — forslagets .per-rad-merke: ett grått merke når prisen står per tidspunkt. */
.per-rad-merke[b-0xo96mh3zl] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 var(--sp-3, 12px);
    padding: 0 var(--sp-4, 16px);
    background: var(--mod-bg);
    border: 1px dashed var(--mod-kant);
    border-radius: var(--mod-radius, 8px);
    font-size: var(--tekst-hjelp, 0.875rem);
    color: var(--mod-tekst-dus);
}

.per-rad-merke > span[b-0xo96mh3zl] {
    padding: var(--sp-2, 8px) 0;
}

.per-rad-merke strong[b-0xo96mh3zl] {
    color: var(--mod-tekst);
}

.arr-kort h2 + .per-rad-merke[b-0xo96mh3zl] {
    margin-top: var(--sp-3, 12px);
}

/* Feltene som står under merket: vanlig feltavstand. */
.under-merke[b-0xo96mh3zl] {
    margin-top: var(--sp-4, 16px);
}

/* Husets .checkbox-rad er 44 px høy (UI-104); det eneste lokale her er marginen. */
.betaling-kort .checkbox-rad[b-0xo96mh3zl] {
    margin: 0;
}

.betaling-underoverskrift[b-0xo96mh3zl] {
    font-size: 1rem;
    margin: var(--sp-4, 16px) 0 var(--sp-1, 4px);
}

/* Betalingsinformasjonen og fakturasetningen står innrykket under sitt valg. */
.betaling-under[b-0xo96mh3zl] {
    margin-left: 1.75rem;
    max-width: 32rem;
}

.betaling-under[b-0xo96mh3zl]  .search-input {
    width: 100%;
    max-width: none;
}

.betaling-varsel[b-0xo96mh3zl] {
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    background: var(--mod-gul-bg);
    border: 1px solid var(--mod-gul-kant);
    border-radius: var(--mod-radius, 8px);
    color: var(--mod-gul-tekst);
}

/* PAM-93 — «Betaling på nett» som ikke kan velges: nedtonet, linja under sier hvorfor. */
.betaling-nedtonet[b-0xo96mh3zl] {
    color: var(--mod-tekst-dus);
}
/* /Components/Pages/Pamelding/FaneInnstillinger.razor.rz.scp.css */
/* ============================================================
   PAM-270 — fanen «Innstillinger». Reglene er kortenes egne, flyttet med markupen: «Regler for
   påmeldingen» fra FanePaameldinger.razor.css (UI-91/UI-95) og «Påmeldingsfrist»/«Avbestilling» fra
   FaneArrangement.razor.css (PAM-104/PAM-142). Scoped CSS følger komponenten, så de står her.
   Husets .innstilling-kort, .form-felt og .checkbox-rad uendret.
   ============================================================ */

/* PAM-314/PAM-304b: én kortoverskrift i hele fanen — DESIGNSYSTEM 6.4 (1,25 rem / 600). Dørliste, Medarrangører,
   Meldinger og Design er egne komponenter og fikk Bootstraps h2 (30 px); ::deep når dem. «>» holder regelen til
   kortene rett under fanen, så forhåndsvisningen av deltakersiden i Design-kortet (også .innstilling-kort) er urørt. */
.arr-kort h2[b-l4mxk3pfs4],
.regler-seksjon > h2[b-l4mxk3pfs4],
.innstillinger-fane[b-l4mxk3pfs4] >  .innstilling-kort > h2 {
    margin: 0 0 var(--sp-3, 12px);
    font-size: 1.25rem;
    font-weight: 600;
}

.innstillinger-fane > .regler-seksjon > h2[b-l4mxk3pfs4] {
    margin-bottom: var(--sp-1, 4px);
}

/* PAM-39: Lagre-raden står NEDERST. Husets .skjema-handlinger har en skillelinje under seg. */
.skjema-handlinger-nederst[b-l4mxk3pfs4] {
    padding-bottom: 0;
    border-bottom: 0;
    margin-bottom: var(--sp-3, 12px);
}

/* UI-91 — «Regler for påmeldingen»: tre kort (Tildeling → Antall tidspunkter → Når det er fullt). Side om
   side på PC, under hverandre på mobil. Kortene er fieldset-er; legend-en er kortets tittel. */
.regel-kort-rad[b-l4mxk3pfs4] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: var(--sp-3, 12px);
    align-items: start;
    margin-top: var(--sp-3, 12px);
}

.regel-kort[b-l4mxk3pfs4] {
    min-width: 0;
    margin: 0;
    padding: var(--sp-4, 16px);
    background: var(--mod-flate);
    border: 1px solid var(--mod-kant);
    border-radius: var(--mod-radius, 0.625rem);
}

/* En legend legger seg ellers oppå rammen. Float + full bredde gjør den til en vanlig
   første rad inni kortet; elementet etter nuller floaten. */
.regel-kort legend[b-l4mxk3pfs4] {
    float: left;
    width: 100%;
    padding: 0;
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--mod-tekst);
}

.regel-kort legend + *[b-l4mxk3pfs4] {
    clear: both;
}

.regel-nummer[b-l4mxk3pfs4] {
    display: block;
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--mod-tekst-dus);
}

.regel-kort .regel-sporsmal[b-l4mxk3pfs4] {
    margin: var(--sp-1, 4px) 0 var(--sp-2, 8px);
}

/* Valgene: minst 44 px høye, sirkelen midt på teksten, vanlig skriftvekt. */
.regel-kort .checkbox-rad[b-l4mxk3pfs4] {
    display: flex;
    align-items: center;
    margin: 0;
    font-weight: 400;
}

.regel-kort .checkbox-rad input[b-l4mxk3pfs4] {
    margin: 0;
}

/* «Maks [2] tidspunkter» på én linje (UI-91) — radens oppsett fra tabellens «Gjenta» (.tidspunkt-gjenta). */
.tidspunkt-gjenta[b-l4mxk3pfs4] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
    margin: var(--sp-3, 12px) 0;
}

.tidspunkt-gjenta .search-input[b-l4mxk3pfs4] {
    width: auto;
    min-height: 44px;
    margin: 0;
}

.tidspunkt-gjenta .gjenta-antall[b-l4mxk3pfs4] {
    width: 4.5rem;
}

.regel-kort .regel-maks[b-l4mxk3pfs4] {
    flex-wrap: nowrap;
    margin: 0;
}

/* Feil i tallet: samme røde kant som en celle i tabellen. */
.regel-kort .celle-ugyldig[b-l4mxk3pfs4] {
    border-color: var(--mod-rod);
}

.regel-kort #tildeling-varsel[b-l4mxk3pfs4],
.regel-kort #tildeling-feil[b-l4mxk3pfs4],
.regel-kort #tidspunktvalg-feil[b-l4mxk3pfs4],
.regel-kort #tidspunkter-venteliste-hjelp[b-l4mxk3pfs4] {
    margin: var(--sp-2, 8px) 0 0;
}

/* PAM-104: dato + klokkeslett (og antall + enhet) side om side på desktop, under hverandre på mobil.
   Feltene har hver sin etikett, derfor to <div> og ikke fire. */
.frist-rad[b-l4mxk3pfs4] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3, 12px);
}

.frist-rad > div[b-l4mxk3pfs4] {
    flex: 1 1 10rem;
    min-width: 9rem;
}

/* Underoverskriften «Avbestilling» i fristkortet. */
.betaling-underoverskrift[b-l4mxk3pfs4] {
    font-size: 1rem;
    margin: var(--sp-4, 16px) 0 var(--sp-1, 4px);
}

/* PAM-142 — «Deltakeren kan avbestille selv inntil [n] dager før»: én linje, også på 375 px.
   Trykkflaten på avkrysningen er minst 44 px, som i fanen «Betaling». */
.avbestilling-valg[b-l4mxk3pfs4] {
    min-height: 44px;
    margin: 0;
}

.avbestilling-rad[b-l4mxk3pfs4] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
    margin-left: 1.75rem;
}

.avbestilling-rad label[b-l4mxk3pfs4] {
    margin: 0;
    font-weight: normal;
}

.avbestilling-rad input.avbestilling-dager[b-l4mxk3pfs4] {
    width: 5.5rem;
    min-width: 0;
}

/* ------------------------------------------------------------------ PAM-270 del 2b
   «Deltakere», «Avganger» og «Vilkår», flyttet fra FaneSkjema.razor.css med markupen. Overskriften og «Lagret» på
   én linje (var .skjemarad-hode i skjemalista). Står etter .arr-kort h2, så marginen her vinner. */
.valgkort-hode[b-l4mxk3pfs4] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
    margin-bottom: var(--sp-2, 8px);
}

.valgkort-hode h2[b-l4mxk3pfs4] {
    margin: 0;
}

/* PAM-46: «Navn på hver deltaker» / «Bare antall». */
.navnvalg-felt[b-l4mxk3pfs4] {
    margin: var(--sp-2, 8px) 0 0;
}

/* PAM-261: «Deltakeren kan melde på andre» under navnevalget, i samme kort — luft så den ikke leses som et tredje radiovalg. */
.andre-deltakere-felt[b-l4mxk3pfs4] {
    margin: var(--sp-4, 16px) 0 0;
}

/* PAM-41: vilkår — radioknapper, adressen/feltet innrykket under det valgte. */
.vilkar-felt[b-l4mxk3pfs4] {
    margin: var(--sp-2, 8px) 0 0;
}

.vilkar-under[b-l4mxk3pfs4] {
    margin: 0 0 var(--sp-2, 8px) calc(1.25rem + var(--sp-2, 8px));
}

/* Standardadressen kan være lang og uten mellomrom — brytes, aldri sidescroll. */
.vilkar-adresse[b-l4mxk3pfs4] {
    overflow-wrap: anywhere;
}

.vilkar-under .orgnr-rad > div[b-l4mxk3pfs4] {
    flex: 1 1 14rem;
    max-width: 28rem;
}

.vilkar-under .orgnr-rad .search-input[b-l4mxk3pfs4] {
    max-width: 100%;
}

/* PAM-103: vilkårsteksten — enkle linjeskift beholdes inne i et avsnitt. */
.vilkar-avsnitt[b-l4mxk3pfs4] {
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.vilkar-under textarea[b-l4mxk3pfs4] {
    max-width: 100%;
}

.arr-beskrivelse[b-l4mxk3pfs4] {
    resize: vertical;
}

/* Feilen i et kort med luft over, som i skjemalista. */
.arr-kort .feilmelding[b-l4mxk3pfs4] {
    margin: var(--sp-2, 8px) 0 0;
}
/* /Components/Pages/Pamelding/FanePaameldinger.razor.rz.scp.css */
/* ============================================================
   PAM-50 — fanen «Påmeldinger». Reglene er flyttet fra Deltakere.razor.css
   sammen med markupen (scoped CSS gjelder bare elementer komponenten tegner).

   UI-148: blokkene som beskriver kortvisningen av de stablede tabellene (og
   «Filtrer»-knappen, som erstatter kolonnefiltrene i det skjulte tabellhodet)
   bruker samme brytepunkt som .tabell-stablet i app.css: max-width 922.98px,
   og motstykket min-width 923px. .tidspunkt-vis (640px) er ikke tabell.
   ============================================================ */

/* PAM-97: kortet «Filtrer» — nedtrekkene og søket i én rad som brytes. Mobil
   (375 px): ett felt per linje, full bredde. Bredere: så mange som får plass. */
.filter-rad[b-tz5csuy9sg] {
    display: flex;
    flex-wrap: wrap;
    gap: 0 var(--sp-4, 16px);
}

.filter-rad .form-felt[b-tz5csuy9sg] {
    flex: 1 1 100%;
    min-width: 0;
}

.filter-rad .search-input[b-tz5csuy9sg] {
    max-width: none;
    margin-bottom: 0;
}

@media (min-width: 640px) {
    .filter-rad .form-felt[b-tz5csuy9sg] {
        flex: 1 1 14rem;
        max-width: 22rem;
    }
}

.filter-status[b-tz5csuy9sg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
}

.filter-status .innstilling-hjelp[b-tz5csuy9sg] {
    margin: 0;
}

.deltaker-liste[b-tz5csuy9sg] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.deltaker-liste li + li[b-tz5csuy9sg] {
    margin-top: var(--sp-1, 4px);
}

.deltaker-epost[b-tz5csuy9sg] {
    display: block;
    font-size: 0.78rem;
    color: var(--mod-tekst-dus);
}

/* PAM-46: «3 billetter» / «1 plass» der navnene ellers står. */
.deltaker-antall[b-tz5csuy9sg] {
    display: block;
}

/* PAM-30: svarene — små linjer under påmelderen, samme tone som deltakernes e-post. */
.svar-liste[b-tz5csuy9sg] {
    list-style: none;
    margin: var(--sp-1, 4px) 0 0;
    padding: 0;
    font-size: 0.78rem;
    font-weight: normal;
    color: var(--mod-tekst-dus);
}

/* PAM-43: «Vis» ved et maskert personnummer eller passnummer. Husets
   .btn-tekst bærer trykkflaten (44 px); her er den bare gjort like liten i
   skrift som linja den står i, og understreket så den leser som en handling. */
.svar-vis[b-tz5csuy9sg] {
    margin-left: var(--sp-1, 4px);
    padding: 0 var(--sp-2, 8px);
    font-size: 0.78rem;
    text-decoration: underline;
}

/* PAM-47: opptellingen øverst — «Middag lør 19:00 — 34 av 40». */
.tilvalg-opptelling[b-tz5csuy9sg] {
    margin: 0 0 var(--sp-3, 12px);
}

.tilvalg-opptelling dt[b-tz5csuy9sg] {
    font-weight: 600;
}

.tilvalg-opptelling dd[b-tz5csuy9sg] {
    margin: 0 0 var(--sp-2, 8px);
}

@media (min-width: 540px) {
    .tilvalg-opptelling[b-tz5csuy9sg] {
        display: grid;
        grid-template-columns: auto 1fr;
        column-gap: var(--sp-2, 8px);
        row-gap: var(--sp-1, 4px);
    }

    .tilvalg-opptelling dd[b-tz5csuy9sg] {
        margin: 0;
    }
}

/* PAM-41: «Godtok vilkårene» under påmelderen — understreket så den leses som en lenke. */
.godtok-vilkar[b-tz5csuy9sg] {
    text-decoration: underline;
}

/* PAM-103: vilkårsteksten påmelderen godtok — sammenfoldet, avsnitt bevart. */
.godtok-vilkartekst[b-tz5csuy9sg] {
    margin: 0 0 var(--sp-2, 8px);
}

.godtok-avsnitt[b-tz5csuy9sg] {
    white-space: pre-line;
    overflow-wrap: anywhere;
}

/* PAM-44: summen øverst — ett tall som skal kunne leses på avstand. */
.betalingssum[b-tz5csuy9sg] {
    font-weight: 600;
    margin: 0 0 var(--sp-2, 8px);
}

/* «Betaler selv · 4 500 kr» under påmelderen — beløpet skal ikke forsvinne. */
.betalerlinje[b-tz5csuy9sg] {
    font-weight: 600;
}

/* PAM-65: «Maks deltakere per påmelding» i radens «Detaljer» i «Rediger» —
   per tidspunkt, smalt felt. */
.maks-felt[b-tz5csuy9sg] {
    margin: var(--sp-3, 12px) 0;
}

.maks-rad[b-tz5csuy9sg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
}

.maks-rad .search-input[b-tz5csuy9sg] {
    max-width: 8rem;
    margin: 0;
}

/* «Lagre tidspunkter»-raden nederst: husets .skjema-handlinger har en
   skillelinje under seg, tegnet for en knapperad over feltene. */
.skjema-handlinger-nederst[b-tz5csuy9sg] {
    padding-bottom: 0;
    border-bottom: 0;
    margin-bottom: var(--sp-3, 12px);
}

/* ------------------------------------------------------------------ PAM-52
   Tidspunkttabellen — husets .data-tabell og .tabell-stablet uendret. Remi 21.09:
   visningstabellen (klikkbar rad, den valgte) er borte; tabellen står alltid i
   redigering. Her står de som har vært (.passert under). */

/* Remi 21.09: påmeldingsraden åpner arket med påmeldingen. */
.paamelding-rad[b-tz5csuy9sg] {
    cursor: pointer;
}

.paamelding-rad:hover td[b-tz5csuy9sg] {
    background: var(--mod-bg);
}

/* Navneknappen: radens handling for tastatur og skjermleser. */
.paamelding-apne[b-tz5csuy9sg] {
    padding: 0;
    font-weight: 600;
    text-align: left;
}

.paamelding-ark-seksjon[b-tz5csuy9sg] {
    margin-top: var(--sp-4, 16px);
}

.paamelding-ark-seksjon h3[b-tz5csuy9sg] {
    margin: 0 0 var(--sp-2, 8px);
    font-size: 1rem;
}

.paamelding-ark-seksjon p[b-tz5csuy9sg] {
    margin: 0 0 var(--sp-1, 4px);
}

.paamelding-ark-felt[b-tz5csuy9sg] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: var(--sp-1, 4px) var(--sp-3, 12px);
    margin: 0 0 var(--sp-2, 8px);
}

.paamelding-ark-felt dt[b-tz5csuy9sg] {
    color: var(--mod-tekst-dus);
}

.paamelding-ark-felt dd[b-tz5csuy9sg] {
    margin: 0;
    overflow-wrap: anywhere;
}

.paamelding-ark-deltakere[b-tz5csuy9sg] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--sp-3, 12px);
}

.paamelding-ark .knapp-rad[b-tz5csuy9sg] {
    margin-top: var(--sp-5, 24px);
}

.passert td[b-tz5csuy9sg] {
    color: var(--mod-tekst-dus);
}

.tidspunkt-redigering[b-tz5csuy9sg] {
    min-width: 0;
}

.tidspunkt-redigering td[b-tz5csuy9sg] {
    vertical-align: top;
}

.tidspunkt-redigering .search-input[b-tz5csuy9sg] {
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0;
}

.tidspunkt-redigering .celle-dato[b-tz5csuy9sg] {
    width: 8.5rem;
}

.tidspunkt-redigering .celle-klokke[b-tz5csuy9sg] {
    width: 6.5rem;
}

.tidspunkt-redigering .celle-plasser[b-tz5csuy9sg] {
    width: 5.5rem;
}

/* PAM-UI (Remi 21.09): Navn hadde ingen bredde, så auto-tabellayouten ga den
   all restplassen — inputen sin egen maks-bredde (.search-input: 480px) fylte
   ikke opp kolonnen, og resten ble et tomrom mellom Navn og Plasser. Med en
   fast bredde her går restplassen i stedet til den siste, ubegrensede kolonnen
   (Handling/Detaljer), til høyre for Sted. */
.tidspunkt-redigering .celle-navn[b-tz5csuy9sg] {
    width: 12rem;
}

/* PAM-98: de valgfrie kolonnene — pris og maks smale, sted bredere; Navn krymper. */
.tidspunkt-redigering .celle-pris[b-tz5csuy9sg] {
    width: 6.5rem;
}

.tidspunkt-redigering .celle-maks[b-tz5csuy9sg] {
    width: 5.5rem;
}

/* PAM-UI (Remi 21.09): 11rem kuttet lengre stedsnavn («Løplabbet Trondheim»);
   14rem gir plass til ca. 22 tegn. */
.tidspunkt-redigering .celle-sted[b-tz5csuy9sg] {
    width: 14rem;
}

/* PAM-226: «Liste» — «Utreise», «Retur». */
.tidspunkt-redigering .celle-liste[b-tz5csuy9sg] {
    width: 9rem;
}

/* .data-tabell td har nowrap — overskriften «Maks per påmelding» får bryte. */
.tidspunkt-redigering th.celle-maks[b-tz5csuy9sg] {
    white-space: normal;
}

/* PAM-104: kolonnen «Frist» i «Plasser +» — «03.10.2026 23:59» er 16 tegn. */
.tidspunkt-redigering .celle-frist[b-tz5csuy9sg] {
    width: 12rem;
}

/* PAM-108: kolonnen «Påkrevd» — én avkrysning, smal og midtstilt. */
.tidspunkt-redigering .celle-paakrevd[b-tz5csuy9sg] {
    width: 5.5rem;
    text-align: center;
}

/* PAM-170: kolonnen «Avbestilling» — nedtrekket, og dagene under når egen frist er valgt. */
.tidspunkt-redigering .celle-avbestilling[b-tz5csuy9sg] {
    width: 16rem;
}

.tidspunkt-redigering .celle-avbestilling .celle-dager[b-tz5csuy9sg] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin-top: var(--sp-1);
}

.tidspunkt-redigering .celle-avbestilling .celle-dager input[b-tz5csuy9sg] {
    max-width: 6rem;
}

/* Advarselen under cella (frist etter start) er ikke en feil — samme plass, dempet. */
.tidspunkt-redigering .celle-advarsel[b-tz5csuy9sg] {
    white-space: normal;
    max-width: 14rem;
}

/* PAM-104: merket «Stengt» ved siden av «Fjern»/«Detaljer». */
.tidspunkt-stengt[b-tz5csuy9sg] {
    white-space: nowrap;
}

/* PAM-102: kolonnene «Pris +», «Sted +» åpner. */
.tidspunkt-redigering .celle-mvasats[b-tz5csuy9sg] {
    width: 11rem;
}

.tidspunkt-redigering .celle-adresse[b-tz5csuy9sg] {
    width: 14rem;
}

.tidspunkt-redigering .celle-kursholder[b-tz5csuy9sg] {
    width: 10rem;
}

.tidspunkt-redigering .celle-beskrivelse[b-tz5csuy9sg] {
    width: 16rem;
}

/* PAM-102: med en gruppe åpen er det opptil elleve kolonner. Tabellen krympet da cellene til
   det uleselige («10» av 10.10.2026) — feltene får en minste bredde, og tabellen ruller vannrett
   inne i kortet i stedet (.tidspunkt-rulle). */
.tidspunkt-rulle[b-tz5csuy9sg] {
    overflow-x: auto;
}

.tidspunkt-redigering .celle-dato .search-input[b-tz5csuy9sg] { min-width: 7.5rem; }
.tidspunkt-redigering .celle-klokke .search-input[b-tz5csuy9sg] { min-width: 4.5rem; }
.tidspunkt-redigering .celle-navn .search-input[b-tz5csuy9sg] { min-width: 8rem; }
.tidspunkt-redigering .celle-plasser .search-input[b-tz5csuy9sg] { min-width: 4.5rem; }
.tidspunkt-redigering .celle-maks .search-input[b-tz5csuy9sg] { min-width: 4.5rem; }
.tidspunkt-redigering .celle-pris .search-input[b-tz5csuy9sg] { min-width: 5.5rem; }
.tidspunkt-redigering .celle-mvasats .search-input[b-tz5csuy9sg] { min-width: 10rem; }
.tidspunkt-redigering .celle-frist .search-input[b-tz5csuy9sg] { min-width: 10.5rem; }
.tidspunkt-redigering .celle-sted .search-input[b-tz5csuy9sg] { min-width: 9rem; }
.tidspunkt-redigering .celle-liste .search-input[b-tz5csuy9sg] { min-width: 7rem; }
.tidspunkt-redigering .celle-adresse .search-input[b-tz5csuy9sg] { min-width: 10rem; }
.tidspunkt-redigering .celle-kursholder .search-input[b-tz5csuy9sg] { min-width: 8rem; }
.tidspunkt-redigering .celle-beskrivelse .search-input[b-tz5csuy9sg] { min-width: 10rem; }
/* PAM-170: «Som arrangementet (14 dager før)» er det lengste valget; dagene er et tall (maks 160 px, 6.6). */
.tidspunkt-redigering .celle-avbestilling select.search-input[b-tz5csuy9sg] { min-width: 15.5rem; }
.tidspunkt-redigering .celle-avbestilling .celle-dager .search-input[b-tz5csuy9sg] { min-width: 5rem; text-align: right; }

/* Beskrivelsen er en textarea (linjeskiftene overlever), men ser ut som et enlinjes felt. */
.tidspunkt-redigering .celle-enlinje[b-tz5csuy9sg] {
    display: block;
    resize: none;
    overflow: hidden;
    white-space: nowrap;
    min-height: 0;
    line-height: inherit;
}

/* PAM-102: «+»/«−» i kolonneoverskriften, til høyre for teksten. */
.kolonne-overskrift[b-tz5csuy9sg] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.kolonne-utvider[b-tz5csuy9sg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-1, 4px);
    min-width: 32px;
    min-height: 32px;
    margin: -6px 0;
    padding: 0 6px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: var(--mod-tekst-dus);
    font: inherit;
    cursor: pointer;
}

.kolonne-utvider:hover[b-tz5csuy9sg] {
    background: var(--mod-bg);
    color: var(--mod-tekst);
}

.kolonne-utvider[aria-disabled="true"][b-tz5csuy9sg] {
    cursor: default;
    opacity: 0.55;
}

.kolonne-utvider[aria-disabled="true"]:hover[b-tz5csuy9sg] {
    background: transparent;
}

/* På bred skjerm står utviderne i overskriften; raden under brukes bare på mobil. */
.kolonne-utvidere-mobil[b-tz5csuy9sg] {
    display: none;
}

@media (max-width: 922.98px) {
    .kolonne-utvidere-mobil[b-tz5csuy9sg] {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: var(--sp-1, 4px) var(--sp-2, 8px);
        margin: var(--sp-2, 8px) 0;
    }

    .kolonne-utvidere-mobil .kolonne-utvider[b-tz5csuy9sg] {
        margin: 0;
        border-color: var(--mod-kant);
        color: var(--mod-tekst);
    }
}

/* PAM-172: «Plasser» uten tidspunkt står under tabellen, med samme røde kant ved feil. */
.tidspunkt-redigering .celle-ugyldig[b-tz5csuy9sg],
.plasser-uten-tidspunkt .celle-ugyldig[b-tz5csuy9sg] {
    border-color: var(--mod-rod);
}

.celle-feil[b-tz5csuy9sg] {
    display: block;
    margin-top: 2px;
    font-size: 0.75rem;
    color: var(--mod-rod-tekst);
}

.tidspunkt-gjenta[b-tz5csuy9sg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
    margin: var(--sp-3, 12px) 0;
}

.tidspunkt-gjenta .search-input[b-tz5csuy9sg] {
    width: auto;
    min-height: 44px;
    margin: 0;
}

.tidspunkt-gjenta .gjenta-antall[b-tz5csuy9sg] {
    width: 4.5rem;
}

.tidspunkt-lim-inn[b-tz5csuy9sg] {
    margin: var(--sp-3, 12px) 0;
}

.tidspunkt-lim-inn textarea[b-tz5csuy9sg] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.85rem;
    resize: vertical;
}

/* ------------------------------------------------------------------ PAM-62
   «Detaljer» sist på raden, og panelet rett under den. Knappen er husets
   .btn-tekst (nøytral grå), ved siden av «Fjern» i redigeringen. */
.handling-knapper[b-tz5csuy9sg] {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--sp-1, 4px);
}

.detaljer-knapp[aria-expanded="true"][b-tz5csuy9sg] {
    color: var(--mod-tekst);
    font-weight: 600;
}

/* .data-tabell td har nowrap (0,1,1); scoped klasse + attributt vinner. */
.detaljer-celle[b-tz5csuy9sg] {
    padding: var(--sp-3, 12px) var(--sp-4, 16px);
    white-space: normal;
    background: var(--mod-bg);
    cursor: default;
}

/* UI-95C krav 1: én topplinje — tidspunktet, antall påmeldte som tekst, «Lukk»
   ytterst. På 375 px brytes den; «Lukk» er `.btn-tekst` (48 px høy) og er dermed
   en trykkflate over 44 px uten en egen regel her. */
.detaljer-topp[b-tz5csuy9sg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-1, 4px) var(--sp-3, 12px);
}

.detaljer-antall[b-tz5csuy9sg] {
    margin: 0;
}

/* «Lukk» står til høyre — også når topplinja brytes. */
.detaljer-lukk[b-tz5csuy9sg] {
    margin-left: auto;
}

/* ------------------------------------------------------------------- UI-95C
   Detaljpanelet i tre grupper: Påmelding · Opplysninger · Betaling.
   Kortene ER `.innstilling-kort` fra app.css — her står bare PLASSERINGEN.
   `.detaljer-grupper` er den ene nye klassen, og den er layout, ikke et kort. */
.detaljer-grupper[b-tz5csuy9sg] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: var(--sp-4, 16px);
    align-items: start;
    margin-top: var(--sp-3, 12px);
}

.detaljer-grupper > .innstilling-kort[b-tz5csuy9sg] {
    margin-bottom: 0;
    padding: var(--sp-4, 16px);
    min-width: 0;
}

/* UI-102: ikke versaler (Remi avviste den formen for tabellhodet i UI-95A) — ett
   hakk over feltnavnene (0.875rem/600), ikke lik dem. */
.detaljer-grupper h4[b-tz5csuy9sg] {
    margin: 0 0 var(--sp-3, 12px);
    font-size: 1rem;
    font-weight: 600;
    color: var(--mod-tekst);
}

/* Feltene fyller kortet: `.form-felt` har max-width 480px for et skjema i full bredde. */
.detaljer-grupper .form-felt[b-tz5csuy9sg] {
    max-width: none;
    margin-bottom: var(--sp-3, 12px);
}

.detaljer-grupper .form-felt:last-child[b-tz5csuy9sg] {
    margin-bottom: 0;
}

.detaljer-grupper .search-input[b-tz5csuy9sg] {
    width: 100%;
}

.detaljer-grupper textarea.search-input[b-tz5csuy9sg] {
    min-height: 4.5rem;
}

/* UI-95C krav 4: linja om lagringen står én gang, nederst — med luft opp. */
.detaljer-lagrehjelp[b-tz5csuy9sg] {
    margin: var(--sp-4, 16px) 0 0;
}

.detaljer-seksjon h3[b-tz5csuy9sg] {
    margin: var(--sp-2, 8px) 0 var(--sp-1, 4px);
    font-size: 1rem;
}

.detaljer-seksjon .innstilling-hjelp[b-tz5csuy9sg] {
    margin: 0 0 var(--sp-2, 8px);
}

/* ------------------------------------------------------------------ PAM-78
   Avmeldte står som historikk: nedtonet, med «Avmeldt 15.09.». */
tr.avmeldt > td[b-tz5csuy9sg],
.deltaker-liste li.avmeldt[b-tz5csuy9sg],
.paamelding-ark-deltakere li.avmeldt[b-tz5csuy9sg] {
    opacity: 0.55;
}

.avmeldt-merke[b-tz5csuy9sg] {
    display: inline-block;
    margin-left: var(--sp-1, 4px);
    padding: 0 6px;
    border-radius: 999px;
    background: var(--mod-kant);
    font-size: 0.72rem;
    font-weight: 600;
    white-space: nowrap;
}

.meld-av-knapp[b-tz5csuy9sg] {
    display: block;
    margin-top: var(--sp-1, 4px);
    padding-left: 0;
}

.meld-av-deltaker[b-tz5csuy9sg] {
    margin-left: var(--sp-1, 4px);
    font-size: 0.78rem;
}

/* ------------------------------------------------------------------ mobil

   Husets .tabell-stablet gjør hver celle til en flex-rad. Deltakerne er en
   LISTE — den skal stå under ledeteksten i full bredde. Selektorene er tyngre
   enn de ser ut som de trenger: app.css har
   «.tabell-stablet tbody td[data-etikett]::before». */
@media (max-width: 922.98px) {
    .tabell-stablet tbody td.deltaker-celle[b-tz5csuy9sg] {
        display: block;
        padding-top: var(--sp-2, 8px);
    }

    .tabell-stablet tbody td.deltaker-celle[b-tz5csuy9sg]::before {
        display: block;
        margin-bottom: var(--sp-1, 4px);
    }

    /* PAM-52: i «Rediger tidspunkter» står ledeteksten OVER feltet, i full bredde. */
    .tabell-stablet tbody td.celle-felt[b-tz5csuy9sg] {
        display: block;
        width: auto;
    }

    .tabell-stablet tbody td.celle-felt[b-tz5csuy9sg]::before {
        display: block;
        margin-bottom: 2px;
    }

    /* PAM-62: panelet er én celle i full bredde, ikke en flex-rad. */
    .tabell-stablet tbody td.detaljer-celle[b-tz5csuy9sg] {
        display: block;
        padding: var(--sp-3, 12px);
    }

    .handling-knapper[b-tz5csuy9sg] {
        justify-content: flex-start;
    }
}

/* PAM-82: «Uten plass» — lista arrangøren jobber fra mellom to «Fordel». Står tett
   under linja som teller dem, og med luft ned til «Rediger»/«Fordel». */
.uten-plass[b-tz5csuy9sg] {
    margin-top: var(--sp-2, 8px);
    margin-bottom: var(--sp-4, 16px);
}

/* ------------------------------------------------------------------ PAM-99
   Påmeldingslista som regneark (Remi 21.09): en kolonne per felt, et filterfelt
   under hver overskrift. Mange spørsmål → tabellen scroller vannrett INNE i
   .tabell-kort (husets overflow-x: auto), aldri siden. Ingen nye farger. */

/* Søket og mobilknappen «Filtrer» på samme linje over tabellen. */
.filter-rad[b-tz5csuy9sg] {
    align-items: flex-end;
}

.filter-mobilknapp[b-tz5csuy9sg] {
    margin-bottom: var(--sp-4, 16px);
}

/* PAM-100: «Del» står i samme rad — ved siden av «Filtrer (n)» på mobil, ved søket ellers. */
.del-knapp[b-tz5csuy9sg] {
    flex: 0 0 auto;
    margin-bottom: var(--sp-4, 16px);
}

.filter-liste .search-input[b-tz5csuy9sg] {
    max-width: none;
    margin-bottom: var(--sp-3, 12px);
}

/* Overskriften forkortes; full tekst står i title. */
.paamelding-tabell .kolonne-overskrift[b-tz5csuy9sg] {
    display: block;
    max-width: 14rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Filterraden: små felt, ett per kolonne. */
.paamelding-tabell .kolonnefilter-rad td[b-tz5csuy9sg] {
    padding-top: var(--sp-2, 8px);
    vertical-align: top;
}

.paamelding-tabell .kolonnefilter-rad .search-input[b-tz5csuy9sg] {
    min-width: 8rem;
    min-height: 2.25rem;
    margin-bottom: 0;
    padding: 2px var(--sp-2, 8px);
    font-size: 0.85rem;
}

/* Svarene kan være lange: de brytes, innenfor en rimelig bredde. Samme
   spesifisitetstriks som husets .data-tabell td (nowrap). */
.data-tabell.paamelding-tabell td.celle-tekst[b-tz5csuy9sg] {
    white-space: normal;
    min-width: 8rem;
    max-width: 18rem;
    overflow-wrap: anywhere;
}

@media (min-width: 923px) {
    .filter-mobilknapp[b-tz5csuy9sg],
    .filter-liste[b-tz5csuy9sg] {
        display: none;
    }

    .filter-rad .filter-sok[b-tz5csuy9sg] {
        flex: 1 1 20rem;
        max-width: 28rem;
    }

    /* UI-130: margen under er ment for mobil (knapp ved siden av «Filtrer»); over 641px
       skal «Del» stå i flukt med søkefeltets underkant, ikke 16 px over det.
       UI-148: «over 641px» er nå over 922.98px — kolonnefiltrene står i tabellhodet,
       og det vises bare når tabellen ikke er stablet. */
    .filter-rad .del-knapp[b-tz5csuy9sg] {
        margin-bottom: 0;
    }

    /* Påmelder står fast når resten scroller vannrett. */
    .paamelding-tabell .kolonne-klebrig[b-tz5csuy9sg] {
        position: sticky;
        left: 0;
        z-index: 1;
        background: var(--mod-flate);
    }
}

@media (max-width: 922.98px) {
    /* PAM-100: søket på egen linje, «Filtrer (n)» og «Del» side om side under. Husets
       mobilregel for .filter-rad (app.css) er en kolonne med 100 % brede knapper — da tok
       hver knapp sin egen linje, og søket ble skjøvet mot høyre av align-items over. */
    .filter-rad[b-tz5csuy9sg] {
        flex-direction: row;
        column-gap: var(--sp-3, 12px);
    }

    .filter-rad .filter-sok[b-tz5csuy9sg] {
        flex: 1 1 100%;
    }

    .filter-rad .filter-mobilknapp[b-tz5csuy9sg],
    .filter-rad .del-knapp[b-tz5csuy9sg] {
        flex: 1 1 0;
        width: auto;
        min-width: 0;
    }

    /* I kortet står svaret til høyre for ledeteksten, i full bredde — ingen kolonnebredder. */
    .data-tabell.paamelding-tabell td.celle-tekst[b-tz5csuy9sg] {
        min-width: 0;
        max-width: none;
    }

    .paamelding-tabell .celle-verdi[b-tz5csuy9sg] {
        min-width: 0;
        text-align: right;
    }

    /* Lange e-postadresser brytes i kortet i stedet for å skyve det sidelengs. */
    .data-tabell.paamelding-tabell tbody td[b-tz5csuy9sg] {
        white-space: normal;
    }

    .paamelding-tabell tbody td > a[b-tz5csuy9sg] {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    /* En tom celle i kortet er bare en ledetekst uten svar — den vises ikke. */
    .tabell-stablet tbody td.tom-celle[b-tz5csuy9sg] {
        display: none;
    }

    .tabell-stablet tbody td.tom-treff[b-tz5csuy9sg] {
        display: block;
    }
}

/* UI-91/UI-95 — «Regler for påmeldingen» (.regler-seksjon, .regel-*) er flyttet med markupen til
   FaneInnstillinger.razor.css (PAM-270). */

/* UI-95 — «3 Når»: overskriften med nummeret og .steg står ÉN gang, i FaneArrangement.razor.css
   (::deep — tabellen tegnes inne i .arr-fane). */

/* UI-95 (forslaget, «Enkel påmelding»): med én rad fyller Dato · Fra · Til · Plasser bredden,
   og bare «Detaljer» står til høyre. */
.tidspunkt-enkel[b-tz5csuy9sg] {
    width: 100%;
}

.tidspunkt-enkel .celle-dato[b-tz5csuy9sg],
.tidspunkt-enkel .celle-klokke[b-tz5csuy9sg],
.tidspunkt-enkel .celle-plasser[b-tz5csuy9sg] {
    width: auto;
}

.tidspunkt-enkel .handling-celle[b-tz5csuy9sg] {
    width: 1%;
}

/* UI-95, rettelse 2 (Remi 22.09.2026): kolonneoverskriftene er IKKE små versaler — samme stil
   som feltnavnene («Navn», «Sted»: html.tema-moderne .form-felt label i tema-moderne.css).
   Husets .data-tabell thead th setter text-transform/letter-spacing; de nulles her, for denne
   tabellen. Ingen ny klasse. */
.tidspunkt-redigering thead th[b-tz5csuy9sg] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--mod-tekst);
    text-transform: none;
    letter-spacing: normal;
}

/* … og på 375 px, der radene stables og ledeteksten er data-etikett (.tabell-stablet). */
@media (max-width: 922.98px) {
    .tidspunkt-redigering tbody td[data-etikett][b-tz5csuy9sg]::before {
        font-size: 0.875rem;
        font-weight: 600;
        color: var(--mod-tekst);
        text-transform: none;
        letter-spacing: normal;
    }
}

/* ------------------------------------------------------------------ PAM-140
   Kjørelista: én overskriftsrad per gruppe («Trondheim S (…) · 12 personer») over
   gruppens påmeldinger. Teksten brytes — på 375 px skal den aldri skyve siden sidelengs.
   Husets farger og kant, ingen nye. */
.paamelding-tabell .gruppe-rad th[b-tz5csuy9sg] {
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
    font-weight: 600;
    background: var(--mod-bg);
    border-bottom: 1px solid var(--mod-kant);
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
}

.paamelding-tabell .gruppe-antall[b-tz5csuy9sg] {
    font-weight: 400;
    color: var(--mod-tekst-dus);
}

@media (max-width: 922.98px) {
    /* I den stablede lista er raden et kort; overskriften står i full bredde over kortene. */
    .tabell-stablet.paamelding-tabell tbody tr.gruppe-rad[b-tz5csuy9sg] {
        padding: 0;
    }

    .tabell-stablet.paamelding-tabell tbody tr.gruppe-rad th[b-tz5csuy9sg] {
        display: block;
    }
}

/* PAM-173: tallfeltet «Plasser» høyrestilt med tabular-nums (DESIGNSYSTEM 6.6) — tidspunktrad og «Uten tidspunkt». */
.tall-felt[b-tz5csuy9sg] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* PAM-244: månedsfilteret i tidspunkttabellen (PAM-224b) — «Vis» foran nedtrekket, ikke over (DESIGNSYSTEM 6.5a, som
   .kunde-vis i Kunder.razor.css, UI-128). På smal skjerm tar nedtrekket resten av linja. */
.tidspunkt-vis[b-tz5csuy9sg] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    min-width: 0;
    margin-bottom: var(--sp-2);
}

.tidspunkt-vis label[b-tz5csuy9sg] {
    margin: 0;
    font-weight: 600;
}

.tidspunkt-vis select[b-tz5csuy9sg] {
    width: auto;
    min-width: 0;
    margin-bottom: 0;
}

@media (max-width: 640px) {
    .tidspunkt-vis select[b-tz5csuy9sg] {
        flex: 1 1 auto;
    }
}
/* /Components/Pages/Pamelding/FanePublisering.razor.rz.scp.css */
/* ============================================================
   PAM-50 — fanen «Publisering» (fra PAM-270: «Del»). Kortene «Publisering» og
   «Adresse» bruker husets klasser (.innstilling-kort, .adresse-felt, .knapp-rad)
   og har ingen egne regler. Reglene for kortet «Design» sto her; PAM-270 flyttet
   dem med kortet til Designseksjon.razor.css. Fila står fordi hver fanekomponent
   har sin scoped CSS (Pam50Tester) — egne regler for «Del» skrives her.
   ============================================================ */

/* ---- PAM-271 — kortet «Del videre» ---------------------------------------
   QR-bildet står over knappene på alle bredder: ett mønster, og på 375 px det
   eneste som får plass. Hvit flate med kant rundt bildet, som QR-koden i
   undersøkelsen (UND-11). */
.del-qr[b-zg0rpb5qew] {
    display: inline-block;
    padding: var(--sp-2, 8px);
    background-color: var(--mod-flate);
    border: 1px solid var(--mod-kant);
    border-radius: var(--mod-radius-liten, 8px);
}

.del-qr img[b-zg0rpb5qew] {
    display: block;
    width: 160px;
    height: 160px;
}

/* Kodefeltet tar hele bredden og bryter den lange linja — aldri vannrett
   rulling på 375 px. */
.del-snutt textarea[b-zg0rpb5qew] {
    display: block;
    width: 100%;
    box-sizing: border-box;
    font-family: ui-monospace, Consolas, monospace;
    font-size: 0.875rem;
    word-break: break-all;
}

.del-snutt .knapp-rad[b-zg0rpb5qew] {
    margin-bottom: 0;
}
/* /Components/Pages/Pamelding/FaneSkjema.razor.rz.scp.css */
/* ============================================================
   PAM-50 — fanen «Påmeldingsskjema»: skjemaet som ÉN liste, ovenfra og ned.
   Reglene for spørsmålene (PAM-30/47), vilkårene (PAM-41), navnvalget
   (PAM-46), betalingen (PAM-44) og nedtrekken (PAM-48) er flyttet fra
   Deltakere.razor.css sammen med markupen. PAM-270: vilkårene og navnvalget fulgte
   kortene videre til FaneInnstillinger.razor.css.
   ============================================================ */

/* Fanens overskrift over lista — kortene under har hver sin. */
.skjema-tittel[b-nmormeuccx] {
    margin: 0 0 var(--sp-3, 12px);
}

/* Lista: én rad per ting deltakeren møter — PAM-50, tillegg 2: hver rad er sitt
   eget kort (husets .innstilling-kort bærer ramme, bakgrunn og skygge). Her
   bare tettere innmat og mindre avstand enn mellom sidens store kort, så lista
   leses som én rekke. Blokkelementer: full bredde på 375 px. */
.skjemaliste[b-nmormeuccx] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.skjemarad[b-nmormeuccx] {
    padding: var(--sp-4, 16px);
    margin-bottom: var(--sp-3, 12px);
}

/* Radens navn til venstre, «Lagret» rett ved. */
.skjemarad-hode[b-nmormeuccx] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
}

.skjemarad .feilmelding[b-nmormeuccx] {
    margin: var(--sp-2, 8px) 0 0;
}

.sporsmal-meta[b-nmormeuccx] {
    margin: var(--sp-1, 4px) 0 0;
}

.sporsmal-handlinger[b-nmormeuccx] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
    margin-top: var(--sp-1, 4px);
}

/* Redigering i raden: en lys flate, så det er tydelig hvilken rad som står åpen. */
.sporsmal-redigering[b-nmormeuccx] {
    margin: var(--sp-1, 4px) 0;
    padding: var(--sp-3, 12px);
    border-radius: 0.5rem;
    background: var(--mod-bg);
}

/* Etikett over en gruppe (Alternativer). */
.sporsmal-etikett[b-nmormeuccx] {
    display: block;
    font-weight: 600;
    margin-bottom: var(--sp-1, 4px);
}

/* ------------------------------------------------------------------ PAM-47
   Ett alternativ under redigering er en RAD med tre felt — tekst, tidspunkt og
   plasser — pluss «Fjern» (eller tallet). Teksten på egen linje i full bredde. */
.alt-rader[b-nmormeuccx] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.alt-rad[b-nmormeuccx] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--sp-2, 8px);
    padding: var(--sp-2, 8px) 0;
    border-top: 1px solid var(--mod-kant);
}

.alt-rad:first-child[b-nmormeuccx] {
    border-top: 0;
    padding-top: 0;
}

.alt-felt[b-nmormeuccx] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.alt-felt label[b-nmormeuccx] {
    font-size: 0.8125rem;
    color: var(--mod-tekst-dus);
}

.alt-felt-tekst[b-nmormeuccx] {
    flex: 1 1 100%;
}

.alt-felt-tid[b-nmormeuccx] {
    flex: 1 1 260px;
}

.alt-felt-plasser[b-nmormeuccx] {
    flex: 0 1 100px;
}

/* PAM-141: pris og mva-sats per alternativ. */
.alt-felt-pris[b-nmormeuccx] {
    flex: 0 1 110px;
}

.alt-felt-mva[b-nmormeuccx] {
    flex: 1 1 170px;
}

.alt-rad .search-input[b-nmormeuccx] {
    margin-bottom: 0;
}

.alt-rad-handlinger[b-nmormeuccx] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
    padding-bottom: var(--sp-1, 4px);
}

.alt-svar[b-nmormeuccx] {
    white-space: nowrap;
}

/* Alternativene under et flervalg i lista — én linje hver, uten kulepunkt. */
.alt-oversikt[b-nmormeuccx] {
    list-style: none;
    margin: var(--sp-1, 4px) 0 0;
    padding: 0;
}

/* ------------------------------------------------------------------ PAM-44
   Betaling: det som hører til et valg innrykket under det. */
.betaling-under[b-nmormeuccx] {
    margin: 0 0 var(--sp-2, 8px) calc(1.25rem + var(--sp-2, 8px));
}

/* ------------------------------------------------------------ PAM-48 → PAM-50
   «Legg til felt»: nedtrekken og knappen på én rad. 44 px er minstemålet for
   en trykkflate, for begge. På mobil står knappen under nedtrekken. */
.standardfelt-velger[b-nmormeuccx] {
    max-width: 560px;
}

.standardfelt-rad[b-nmormeuccx] {
    display: flex;
    align-items: center;
    gap: var(--sp-2, 8px);
}

.standardfelt-rad .search-input[b-nmormeuccx] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 44px;
    margin: 0;
}

/* Husets .btn-avbryt har marg for en knapperad; her står den alene. */
.standardfelt-rad .btn-avbryt[b-nmormeuccx] {
    flex-shrink: 0;
    min-height: 44px;
    margin: 0;
    padding: var(--sp-2, 8px) var(--sp-4, 16px);
}

.standardfelt-velger .innstilling-hjelp[b-nmormeuccx] {
    margin: var(--sp-1, 4px) 0 0;
}

@media (max-width: 640.98px) {
    .standardfelt-rad[b-nmormeuccx] {
        flex-direction: column;
        align-items: flex-start;
    }

    .standardfelt-rad .search-input[b-nmormeuccx] {
        width: 100%;
    }
}
/* /Components/Pages/Pamelding/Medarrangor.razor.rz.scp.css */
/* PAM-228c1a — «Dine arrangementer». Mobil først: dørvakten står med telefonen. Én rad per arrangement, knappen under
   navnet på smal skjerm. Bare tokens; skjermdesign kommer fra DESIGNTRÅD senere. */

.medarrangor-side[b-e6z1slw2ux] {
    align-self: flex-start;
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
    padding: var(--sp-5) 0;
}

.medarrangor-side h1[b-e6z1slw2ux] {
    margin-bottom: var(--sp-4);
}

.medarrangor-liste[b-e6z1slw2ux] {
    margin: 0 0 var(--sp-5);
    padding: 0;
    list-style: none;
}

.medarrangor-rad[b-e6z1slw2ux] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
    padding: var(--sp-4) 0;
    border-bottom: 1px solid var(--mod-kant);
}

.medarrangor-tekst[b-e6z1slw2ux] {
    min-width: 0;
    flex: 1 1 12rem;
}

.medarrangor-navn[b-e6z1slw2ux] {
    margin: 0;
    overflow-wrap: anywhere;
}

/* PAM-228f (DESIGNSYSTEM 6.2, ulest): navnet i 600 bare når det er nye meldinger; ellers vanlig vekt. */
.medarrangor-navn-ulest[b-e6z1slw2ux] {
    font-weight: 600;
}

.medarrangor-nye[b-e6z1slw2ux] {
    margin: var(--sp-1) 0 0;
}

.medarrangor-dato[b-e6z1slw2ux] {
    margin: var(--sp-1) 0 0;
    color: var(--mod-tekst-dus);
}

/* PAM-228f: «Skann billetter» og «Meldinger» ved siden av hverandre; på smal skjerm under hverandre i full bredde,
   «Skann» øverst (døra er hovedjobben). */
.medarrangor-knapper[b-e6z1slw2ux] {
    flex: 0 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
}

@media (max-width: 480px) {
    .medarrangor-knapper[b-e6z1slw2ux] {
        flex: 1 1 100%;
        flex-direction: column;
    }

    .medarrangor-skann[b-e6z1slw2ux],
    .medarrangor-meldinger[b-e6z1slw2ux] {
        width: 100%;
        text-align: center;
        /* PAM-228f del C: btn-tilbud er inline-flex — text-align alene sentrerer ikke «Skann billetter» (målt 375 px). */
        justify-content: center;
    }
}

/* PAM-228d-c: sjåførens «← Mine kjøringer» over «Logg ut». */
.medarrangor-tilbake[b-e6z1slw2ux] {
    margin: 0 0 var(--sp-4);
}
/* /Components/Pages/Pamelding/Meldinger.razor.rz.scp.css */
/* PAM-228f — meldingssiden. Samme ramme som «Dine arrangementer» (Medarrangor.razor.css): mobil først, én kolonne. */

.meldinger-side[b-rrs5ntv46g] {
    align-self: flex-start;
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    padding: var(--sp-5) 0;
}

.meldinger-side h1[b-rrs5ntv46g] {
    margin-bottom: var(--sp-2);
    overflow-wrap: anywhere;
}

.meldinger-hjelp[b-rrs5ntv46g] {
    margin: 0 0 var(--sp-4);
}

.meldinger-tilbake[b-rrs5ntv46g] {
    margin: var(--sp-4) 0 0;
}
/* /Components/Pages/Pamelding/Pameldingspriser.razor.rz.scp.css */
/* PAM-182a — katalogen på /pamelding/priser. Bare tokens (DESIGNSYSTEM.md 3): inaktive produkter
   står dempet nederst, med merket «Inaktiv» ved navnet — fargen står aldri alene. */
.produkt-inaktiv td[b-xz76a4tqla] {
    color: var(--mod-tekst-dus);
}

/* Navnet er lenka som åpner raden (DESIGNSYSTEM.md 6.7) — da må det se ut som en lenke, som
   arrangementsnavnene i lista (<a>), og ikke som grå tekst. */
.produkt-navn[b-xz76a4tqla] {
    text-align: left;
    padding: 0;
    color: var(--mod-primar-mork);
    font-weight: 600;
}

.produkt-ark-status[b-xz76a4tqla] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    margin-top: var(--sp-5);
    padding-top: var(--sp-4);
    border-top: 1px solid var(--mod-kant);
}

.produkt-ark-status .btn-avbryt[b-xz76a4tqla] {
    align-self: flex-start;
}
/* /Components/Pages/Pamelding/Pameldingsregnskap.razor.rz.scp.css */
/* PAM-273b — påmeldingens «Til regnskap». Kopi av bussens regnskapssystem-linje (MRK-1) og
   de kompakte koblingsradene (PO-KOBL) fra TilRegnskap.razor.css: CSS-en er scoped, så den
   kan ikke deles, og bussens fil holdes av en annen sak. Påmeldingens rad har ingen egen
   «Endre»-knapp (velgeren bærer den selv), så rutenettet har to kolonner, ikke tre. */

/* Én linje: «Regnskapssystem: PowerOffice Go · Endre». */
.regnskapsvalg-kompakt[b-sls1a18n5s] {
    padding: var(--sp-3) var(--sp-4);
}

/* Flex, ikke inline-tekst: på 375 px bryter navnet og «Endre» til hver sin linje. */
.regnskapsvalg-linje[b-sls1a18n5s] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    margin: 0;
}

/* Én kompakt rad per sats. Bred: [sats] [produktvelger, «Endret … av»]. Smal (under 600 px):
   satsen på første linje, velgeren under — ingenting er bredere enn kortet. */
.koblingsrader[b-sls1a18n5s] {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid var(--mod-kant);
    border-radius: 12px;
    background: var(--mod-flate);
}

.koblingsrad[b-sls1a18n5s] {
    display: grid;
    grid-template-columns: 7rem minmax(0, 1fr);
    grid-template-areas: "sats innhold";
    align-items: start;
    gap: var(--sp-1) var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    min-width: 0;
}

.koblingsrad + .koblingsrad[b-sls1a18n5s] {
    border-top: 1px solid var(--mod-kant);
}

.koblingsrad-sats[b-sls1a18n5s] {
    grid-area: sats;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.koblingsrad-innhold[b-sls1a18n5s] {
    grid-area: innhold;
    display: grid;
    gap: 2px;
    min-width: 0;
    overflow-wrap: anywhere;
}

.koblingsrad-endret[b-sls1a18n5s] {
    margin: var(--sp-1) 0 0;
    font-size: .8rem;
    color: var(--mod-tekst-dus);
}

/* Koblet: grønn hake ved satsen. */
.koblingsrad-koblet[b-sls1a18n5s] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    color: var(--mod-gronn-tekst);
}

@media (max-width: 599.98px) {
    .koblingsrad[b-sls1a18n5s] {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "sats"
            "innhold";
        padding: var(--sp-3);
    }
}

/* ============================================================
   PAM-273c — lista. Tabellen er appens egen (data-tabell tabell-stablet): kolonner på bred
   skjerm, et kort per påmelding under 641 px med knappene nederst. Her bare luft og de
   små linjene inne i cellene.
   ============================================================ */
.regnskapsliste[b-sls1a18n5s] {
    display: grid;
    gap: var(--sp-3);
    margin-top: var(--sp-6);
    min-width: 0;
}

.regnskapsliste h2[b-sls1a18n5s] {
    margin: 0;
}

/* «Vis [arrangement]» — etiketten foran feltet, som filteret på Kunder (6.5a). */
.regnskap-vis[b-sls1a18n5s] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    min-width: 0;
}

.regnskap-vis label[b-sls1a18n5s] {
    margin: 0;
    font-weight: 600;
}

.regnskap-vis select[b-sls1a18n5s] {
    width: auto;
    min-width: 0;
    max-width: 100%;
    margin-bottom: 0;
}

.regnskap-kvittering[b-sls1a18n5s],
.regnskap-utvalg[b-sls1a18n5s] {
    margin: 0;
}

/* Betaleren med avkryssing: hele etiketten er trykkflate (6.6). */
.regnskap-velg[b-sls1a18n5s] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-3);
    margin: 0;
    font-weight: 600;
    cursor: pointer;
}

.regnskap-velg input[b-sls1a18n5s] {
    width: 20px;
    height: 20px;
    margin: 0;
    flex-shrink: 0;
    accent-color: var(--mod-primar-markor);
}

/* Org.nr. og «Salgsordre 77 i Go · …» under hovedteksten i cella. */
.regnskap-dus[b-sls1a18n5s] {
    display: block;
    font-size: var(--tekst-hjelp);
    font-weight: 400;
    color: var(--mod-tekst-dus);
    overflow-wrap: anywhere;
}

/* Statuscella er nowrap; uten brytning dyttet «Merket som sendt … av <navn>» «Angre» ut av kortet på desktop
   (røykprøven, 24 px). Org.nr. brytes ikke. */
.regnskap-sendtlinje[b-sls1a18n5s] {
    white-space: normal;
}

.handling-celle .statusvarsel[b-sls1a18n5s],
.handling-celle .laast[b-sls1a18n5s] {
    margin-bottom: var(--sp-2);
    text-align: left;
    white-space: normal;
}

.regnskap-knapper[b-sls1a18n5s] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
}

@media (max-width: 640.98px) {
    .regnskap-knapper > *[b-sls1a18n5s] {
        flex: 1 1 100%;
    }
}

/* ============================================================
   INT-14b2 — kortet «Vipps og kort til PowerOffice Go». Bryterne er husets checkbox-rad, kontoen et
   search-input i form-felt (6.6), lista samme data-tabell tabell-stablet som påmeldingene. Her bare luft,
   felthjelpen tett under bryteren og feilen under feltet (rød tekst, ikke varsel — 6.3/6.6).
   ============================================================ */
#dagsbilag .checkbox-rad[b-sls1a18n5s] {
    margin-top: var(--sp-3);
}

.dagsbilag-felthjelp[b-sls1a18n5s] {
    margin: 0 0 var(--sp-3);
}

.dagsbilag-felt[b-sls1a18n5s] {
    margin-top: var(--sp-3);
}

.dagsbilag-felt .search-input[b-sls1a18n5s] {
    width: 100%;
    max-width: 480px;
    margin-bottom: 0;
}

/* UI-182: forslagene står i flyten under feltet (som Partnere.razor.css), ikke svevende. */
.dagsbilag-felt .sok-forslag.dagsbilag-forslag[b-sls1a18n5s] {
    position: static;
    box-shadow: none;
    width: 100%;
    max-width: 480px;
    margin-top: var(--sp-2);
}

.dagsbilag-felt .dagsbilag-forslag .sok-forslag-rad[b-sls1a18n5s] {
    min-height: 44px;
}

.dagsbilag-felt .dagsbilag-valgt-konto[b-sls1a18n5s] {
    max-width: 480px;
}

.dagsbilag-lagret-konto[b-sls1a18n5s] {
    margin: 0;
    font-weight: 600;
}

.dagsbilag-lagre[b-sls1a18n5s] {
    align-items: center;
    margin-top: var(--sp-2);
}

.dagsbilag-lagre .koblingsrad-endret[b-sls1a18n5s] {
    margin: 0;
}

.dagsbilag-listetittel[b-sls1a18n5s] {
    margin: var(--sp-6) 0 var(--sp-3);
    font-size: 1rem;
}
/* /Components/Pages/Pamelding/Pameldingsvisning.razor.rz.scp.css */
/* ============================================================
   PAM-30 — arrangørens egne spørsmål i det offentlige skjemaet.

   Scoped CSS, ikke app.css: reglene gjelder ÉN side, og app.css er fila
   flest tråder skriver i samtidig. Husets klasser (.form-felt, .search-input,
   .checkbox-rad, .radio-rad, .krav-felt, .feilmelding) brukes uendret — det
   som står her er kun det spørsmålsfeltene trenger i tillegg.

   PAM-49: fila het Skjema.razor.css. Markupen flyttet til Pameldingsvisning
   (delt av den offentlige siden og forhåndsvisningen), og scoped CSS gjelder
   bare elementer komponenten selv tegner — så reglene fulgte med.
   ============================================================ */

/* ------------------------------------------------------------------ PAM-76
   Kolonnen har full tilgjengelig bredde på ALLE steg, uansett hva steget inneholder.

   Årsaken bor i delte filer vi ikke rører: .tom-layout (app.css) er en flex-rad, så
   Merkevarestil-innpakningen (.merkevare-side, uten merkevare-aktiv) er et flex-element
   som får bredden fra innholdets max-content — og .kontakt-side (app.css) har bare
   max-width: 560px, ingen bredde. Steg med tekstfelt fylte kolonnen; «Spørsmål» med bare
   ja/nei-radioer krympet den til ~276 px på 375 px, og knappene hoppet mellom stegene.
   Med merkevare-aktiv gir merkevare.css alt kolonnen width: 100%, så der var feilen aldri.

   Rettingen er en tom rad, ikke en bredde: et grid med ett spor minmax(0, 100vw) har
   max-content lik skjermbredden og min-content 0. Da ber kolonnen alltid om mer enn
   taket (max-width i .kontakt-side, 560 px), og krymper likevel til skjermen fordi
   min-content er 0. En fast bredde (560px; max-width: 100%) ga sidescroll på 375 px —
   prosent teller ikke når forelderen måler innholdet — og width: calc(100vw - …) kjenner
   ikke rullefeltet på desktop. Høyde 0, ingen synlig endring; i forhåndsvisningen
   (vanlig blokk-forelder) betyr den ingenting. */
.pamelding-side[b-togr4vmdrk]::after {
    content: "";
    display: grid;
    grid-template-columns: minmax(0, 100vw);
}

/* ------------------------------------------------------------------ PAM-49
   Båndet øverst i forhåndsvisningen. Egen lys flate og egen mørk tekst, så det
   er lesbart uansett designets bakgrunnsfarge — og tydelig nok til at ingen
   forveksler forhåndsvisningen med den ekte siden. Bryter på 375 px. */
.forhandsvisning-baand[b-togr4vmdrk] {
    width: 100%;
    box-sizing: border-box;
    margin: 0 0 var(--sp-4, 16px);
    padding: var(--sp-3, 12px) var(--sp-4, 16px);
    background: var(--mod-gul-bg);
    color: var(--mod-gul-tekst);
    border: 1px solid var(--mod-gul-kant);
    border-radius: 0.5rem;
    overflow-wrap: anywhere;
}

.forhandsvisning-tekst[b-togr4vmdrk] {
    margin: 0;
    font-weight: 600;
}

.forhandsvisning-rad[b-togr4vmdrk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 var(--sp-4, 16px);
    margin: var(--sp-1, 4px) 0 0;
}

.forhandsvisning-baand a[b-togr4vmdrk] {
    color: inherit;
    text-decoration: underline;
}

/* ------------------------------------------------------------------ PAM-59
   «Steg 2 av 3 · Spørsmål» øverst i steget. Den får fokus ved stegbytte
   (tabindex="-1"): ingen fokusring når fokuset er satt av koden, bare når
   deltakeren navigerer med tastatur. Knappene «Neste»/«Tilbake» bruker husets
   .skjema-handlinger, som legger dem i kolonne i full bredde på mobil. */
.steg-overskrift[b-togr4vmdrk] {
    margin: 0 0 var(--sp-3, 12px);
    font-size: 1.125rem;
}

.steg-overskrift:focus:not(:focus-visible)[b-togr4vmdrk] {
    outline: none;
}

/* Etiketten over en radio-/avkrysningsgruppe: samme vekt som .form-felt label,
   men et <span> — en <label> uten kontroll er ikke en etikett. */
.sporsmal-etikett[b-togr4vmdrk] {
    display: block;
    font-weight: 600;
    margin-bottom: var(--sp-1, 4px);
}

/* Kravstreken (.krav-felt) er laget for ett felt; her rammer den en gruppe.
   Litt luft under så streken ikke klistrer seg til neste felt. */
.sporsmal-valg[b-togr4vmdrk] {
    margin-bottom: var(--sp-3, 12px);
}

/* Husets .feilmelding trekker seg 1rem opp for å ligge inntil et
   .search-input; under en radiogruppe ville den lagt seg oppå valgene. */
.sporsmal-feil[b-togr4vmdrk] {
    margin-top: 0;
}

/* PAM-47: et fullt tilvalg står UTEN kryssrute — «Middag (fullt)». Samme
   venstrekant som valgene over og under, så lista ikke hopper, og samme
   trykkhøyde som .checkbox-rad så raden ikke kollapser til en tynn strek.
   Ingen egen farge: den er alt dempet av .innstilling-hjelp, og et rødt
   «fullt» ville lest som en feil deltakeren har gjort. */
.alternativ-fullt[b-togr4vmdrk] {
    margin: 0;
    padding: var(--sp-2, 8px) 0;
    min-height: 1.5rem;
}

/* PAM-35: «Om deg» — påmelderens egne svar på spørsmålene per deltaker, i
   samme kort som kontaktinformasjonen, uten ekstra innrykk. Liten overskrift
   over feltene, luft over så den ikke klistrer seg til avkrysningen. */
.om-deg-tittel[b-togr4vmdrk] {
    margin: var(--sp-4, 16px) 0 var(--sp-2, 8px);
    font-size: 1rem;
}

/* PAM-301: uten avkrysningen (deltakerne kan bare melde på seg selv) er overskriften først i kortet — da står
   kortets egen luft, ikke luften mot krysset. */
.om-deg-tittel:first-child[b-togr4vmdrk] {
    margin-top: 0;
}

/* ------------------------------------------------------------------ PAM-38
   Banner (+ beskrivelsen, PAM-39). PAM-67: bakgrunnsfargen og luften rundt
   siden kommer fra merkevaren (wwwroot/merkevare.css), ikke herfra. */

/* Banneret øverst: hele bredden, høyden følger bildet — ingen beskjæring,
   ingen fast høyde. Skalerer til 375 px av seg selv. */
.pamelding-banner[b-togr4vmdrk] {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: var(--sp-4, 16px);
    border-radius: 0.5rem;
}

/* Faktaboksen (12.09): rammen rundt tid, sted og beskrivelse. Utseendet er det
   .pamelding-fakta hadde i app.css — flyttet hit til rammen, og nullet på dl-en,
   så boksen er én boks også når beskrivelsen står i den. */
.pamelding-faktaboks[b-togr4vmdrk] {
    margin: 0 0 var(--sp-5, 24px);
    padding: var(--sp-4, 16px);
    background-color: var(--mod-bg);
    border: 1px solid var(--mod-kant);
    border-radius: 0.5rem;
}

.pamelding-faktaboks .pamelding-fakta[b-togr4vmdrk] {
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
}

/* Beskrivelsen (PAM-39): ren tekst med bevarte linjeskift, nederst i
   faktaboksen under en tynn strek. Lange ord brytes — aldri sidescroll på mobil. */
.pamelding-beskrivelse[b-togr4vmdrk] {
    margin: var(--sp-3, 12px) 0 0;
    padding-top: var(--sp-3, 12px);
    border-top: 1px solid var(--mod-kant);
    white-space: pre-line;
    overflow-wrap: anywhere;
}

/* PAM-163: et arrangement uten tidspunkt og uten sted har ingen fakta over beskrivelsen — da står den øverst i
   boksen, uten skillelinja over en tom liste. */
.pamelding-faktaboks .pamelding-fakta:not(:has(div)) + .pamelding-beskrivelse[b-togr4vmdrk] {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

/* PAM-256B — arrangørens informasjonsavsnitt over skjemaet: husets .hjelp-emne (app.css) uendret. Bare to ting her:
   teksten beholder arrangørens linjeskift og brytes på 375 px (som beskrivelsen over), og avstanden mellom
   avsnittene er .hjelp-emne sin egen (--sp-3) — .innstilling-kort sin --sp-5 står senere i app.css og vant, så de
   sammenslåtte titlene på mobil skal stå tett og skjemaet like under. */
.pamelding-avsnitt[b-togr4vmdrk] {
    margin-bottom: var(--sp-3, 12px);
}

.pamelding-informasjon[b-togr4vmdrk] {
    margin-bottom: var(--sp-5, 24px);
}

.pamelding-avsnitt-tekst[b-togr4vmdrk] {
    white-space: pre-line;
    overflow-wrap: anywhere;
}

/* ------------------------------------------------------------------ PAM-42
   Gateadressen i faktaboksen, med «Åpne i Google Maps» rett under. Adressen
   brytes (lange adresser på 375 px — dd-en har alt overflow-wrap fra app.css);
   lenka står på egen linje med husets trykkflate på mobil (44 px), så den kan
   trykkes uten å treffe adressen. */
.pamelding-adresse[b-togr4vmdrk] {
    display: block;
    overflow-wrap: anywhere;
}

.pamelding-mapslenke[b-togr4vmdrk] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    text-decoration: underline;
}

/* ------------------------------------------------------------------ PAM-41
   Vilkårsavkrysningen rett over «Meld på». Husets .checkbox-rad og
   .krav-felt uendret; her står bare det avkrysningen trenger i tillegg. */

/* Husets .feilmelding trekker seg 1rem opp for å ligge inntil et felt; under
   kravstreken ville den lagt seg oppå avkrysningen. */
.vilkar-feil[b-togr4vmdrk] {
    margin-top: 0;
}

/* Lenka i etiketten: understreket, så den leses som en lenke i en linje som
   ellers er vanlig tekst. */
.vilkar-felt a[b-togr4vmdrk] {
    text-decoration: underline;
}

/* PAM-103: «vilkårene» som knapp når teksten bor i appen — ser ut som lenka
   den erstatter (arver farge og skrift), men åpner arket. */
.vilkar-knapp[b-togr4vmdrk] {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    text-decoration: underline;
    cursor: pointer;
}

/* Avsnittene i arket: enkle linjeskift beholdes, lange ord brytes. */
.vilkar-avsnitt[b-togr4vmdrk] {
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.vilkar-ark-lenke a[b-togr4vmdrk] {
    text-decoration: underline;
}

.vilkar-ark:focus[b-togr4vmdrk],
.dobbelt-ark:focus[b-togr4vmdrk] {
    outline: none;
}

/* ------------------------------------------------------------------ PAM-67
   Selskapets merkevare (MERK-2, del 1). wwwroot/merkevare.css oversetter
   --mv-*-tokenene for husets klasser (kortet .kontakt-side, .innstilling-kort,
   overskrifter, etiketter, ingress, felt, .btn-ny, .btn-avbryt, lenker). Her
   står BARE det påmeldingssiden har i tillegg, og som ellers ville beholdt
   håndsatte lyse farger på en mørk merkevare.

   PAM-46-reglene for designets bakgrunn (arv på h1/ingress, mørk tekst på
   kortene, hvite flater under avkrysningen og feilmeldingen) er borte: siden står nå på
   kortflaten (--mv-flate), og --mv-tekst holder 4,5 : 1 mot både flaten og
   feltet — kontrastregelen bor i Merkevare.cs. Mørk bakgrunn → lys tekst, også
   overskriften.

   Alt står under .merkevare-side.merkevare-aktiv: uten merkevare (plattformens
   tokens) treffer ingen regel, og siden ser ut som før. Spesifisiteten
   (0,4,x med scope-attributtet) slår både app.css og merkevare.css. */

/* Faktaboksen: feltflaten og kanten, som kortene. PAM-56 (UI-44): begge rammene
   er dekorative — --mv-kant-dus, som kortene. --mv-kant (3 : 1) er for felt og
   knapper. */
.merkevare-side.merkevare-aktiv .pamelding-faktaboks[b-togr4vmdrk] {
    background-color: var(--mv-felt);
    border-color: var(--mv-kant-dus);
    border-radius: var(--mv-radius-kort);
}

.merkevare-side.merkevare-aktiv .pamelding-beskrivelse[b-togr4vmdrk] {
    border-top-color: var(--mv-kant-dus);
}

/* PAM-56: «Velg tidspunkt» inne i hvert deltakerkort — luft over, så valget ikke
   klistrer seg til feltet over. Ingen egen ramme: kortet rundt er rammen. */
.deltaker-tidspunkt[b-togr4vmdrk] {
    margin-top: 0.75rem;
}

/* PAM-81: 1. og 2. valg per økt — én gruppe per økt, uten egen ramme (kortet rundt er
   rammen). Nedtrekkene under hverandre på mobil, side om side fra 640 px. */
.deltaker-onsker[b-togr4vmdrk] {
    margin-top: 0.75rem;
}

.onske-okt[b-togr4vmdrk] {
    margin: 0 0 var(--sp-3, 12px);
    padding: 0;
    border: 0;
    min-width: 0;
}

.onske-okt-tittel[b-togr4vmdrk] {
    padding: 0;
    margin-bottom: var(--sp-2, 8px);
    font-weight: 600;
    overflow-wrap: anywhere;
}

.onske-valg[b-togr4vmdrk] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0 var(--sp-3, 12px);
}

.onske-valg .form-felt[b-togr4vmdrk] {
    margin-bottom: var(--sp-2, 8px);
    min-width: 0;
}

.onske-valg select[b-togr4vmdrk] {
    width: 100%;
    max-width: 100%;
}

.onske-beskrivelse[b-togr4vmdrk] {
    margin: var(--sp-1, 4px) 0 0;
    font-size: 0.9rem;
}

@media (min-width: 640px) {
    .onske-valg[b-togr4vmdrk] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
}

/* PAM-81: kvitteringen — hver økt på egen linje under navnet. */
.pam-kvittering-onske[b-togr4vmdrk] {
    display: block;
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}

/* Etikettene i faktaboksen og deltakerkortets «Deltaker 2» har håndsatt mørk
   farge i app.css (#374151) eller temaet, som merkevare.css ikke dekker. */
.merkevare-side.merkevare-aktiv .pamelding-fakta dt[b-togr4vmdrk],
.merkevare-side.merkevare-aktiv h4[b-togr4vmdrk],
.merkevare-side.merkevare-aktiv h5[b-togr4vmdrk] {
    color: var(--mv-tekst);
}

/* Sekundærknappene (− / + og «Legg til deltaker»): som PAM-38 — flate, farget
   tekst og kant — men i hovedfargen justert til 4,5 : 1 mot flaten, ikke rå
   knappfarge. Samme behandling som .btn-beregn-rute i merkevare.css. */
.merkevare-side.merkevare-aktiv .antall-knapp[b-togr4vmdrk],
.merkevare-side.merkevare-aktiv .rute-leggtil[b-togr4vmdrk] {
    color: var(--mv-hoved-som-tekst);
    background-color: var(--mv-flate);
    border: 1px solid var(--mv-hoved-som-tekst);
    border-radius: var(--mv-radius-knapp);
}

/* UI-50: − / + er trykkbare — kanten er --mv-kant (3 : 1-tokenet for felt og knapper,
   som .search-input i merkevare.css), ikke --mv-kant-dus. Står etter regelen over, med
   samme spesifisitet, så den vinner. */
.merkevare-side.merkevare-aktiv .antall-knapp[b-togr4vmdrk] {
    border-color: var(--mv-kant);
}

.merkevare-side.merkevare-aktiv .antall-knapp:hover[b-togr4vmdrk],
.merkevare-side.merkevare-aktiv .rute-leggtil:hover[b-togr4vmdrk],
.merkevare-side.merkevare-aktiv .rute-leggtil:focus[b-togr4vmdrk] {
    color: var(--mv-hoved-som-tekst);
    background-color: var(--mv-felt);
}

/* PAM-49-båndet har sin egen lyse gule flate og mørke tekst; lenka skal ikke
   få merkevarens lenkefarge (som kan være lys på en mørk merkevare). Sett i
   browser 14.09: med bare «.forhandsvisning-baand a» ble spesifisiteten lik
   merkevare.css sin lenkeregel (0,4,1), og merkevare.css lastes sist — lenka
   ble #d17149 på #fef3c7 (ca. 3 : 1). Klassen .btn-tekst gir (0,5,1). */
.merkevare-side.merkevare-aktiv .forhandsvisning-baand a.btn-tekst[b-togr4vmdrk] {
    color: inherit;
}

/* ------------------------------------------------------------------ PAM-46
   Kortet «Antall»: − , tallet, +. Knappene er 44 px i begge retninger — en
   billettkjøper står på mobil, og nettleserens egne piler i et tallfelt er
   ti piksler høye. Feltet er smalt (et tall fra 1 til 100), og raden bryter
   aldri: tre elementer som til sammen er ~11rem får plass på 375 px. */
.antall-rad[b-togr4vmdrk] {
    display: flex;
    align-items: center;
    gap: var(--sp-2, 8px);
}

.antall-knapp[b-togr4vmdrk] {
    flex: 0 0 auto;
    width: 44px;
    min-height: 44px;
    font-size: 1.25rem;
    line-height: 1;
    background: var(--mod-flate);
    color: var(--mod-tekst);
    /* UI-50: #6b7280 — 4,8 : 1 mot knappen (#fff), over WCAG 1.4.11s 3 : 1. Samme farge
       som UI-47 ga .search-input. #d1d5db var 1,47 : 1. */
    border: 1px solid var(--mod-tekst-dus);
    border-radius: 0.5rem;
    cursor: pointer;
}

.antall-felt[b-togr4vmdrk] {
    flex: 0 0 5rem;
    max-width: 5rem;
    /* PAM-235b: .search-input har margin-bottom — i raden løftet den feltet 8 px over − / +. */
    margin-bottom: 0;
    text-align: center;
}

/* PAM-246: tema-moderne.css har «html.tema-moderne .search-input[type="number"] { text-align: right }» (0,3,1) som slo
   .antall-felt (0,2,0) — tallet i stepperen sto høyrejustert i Chrome. Høyere spesifisitet her, i påmeldingens egen css. */
html.tema-moderne .antall-felt[type="number"][b-togr4vmdrk] {
    text-align: center;
}

/* ------------------------------------------------------------------ PAM-235b
   Billettlista («kino», DESIGNTRÅD v22 (4)): en liste, ikke en tabell (6.7: under
   tre kolonner er det en liste) — én rad per billettype, 1 px --mod-kant mellom.
   Navnet (600) med prisen dus under til venstre, stepperen (.antall-rad, ≈11rem)
   til høyre. På 375 px bryter navnet over flere linjer — det kuttes aldri med «…».
   Uten billettyper står samme rad med «Hvor mange?» som etikett. */
.billett-liste-felt[b-togr4vmdrk] {
    margin: 0 0 var(--sp-3, 12px);
}

.billett-liste[b-togr4vmdrk] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.billett-rad[b-togr4vmdrk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3, 12px);
    padding: var(--sp-2, 8px) 0;
}

.billett-rad + .billett-rad[b-togr4vmdrk] {
    border-top: 1px solid var(--mod-kant);
}

.billett-navn[b-togr4vmdrk] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--sp-1, 4px);
}

.billett-navn label[b-togr4vmdrk] {
    margin: 0;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.billett-pris[b-togr4vmdrk] {
    color: var(--mod-tekst-dus);
}

/* PAM-106c: «Inaktiv» under prisen i arrangørens ark — pillen beholder sin egen bredde i kolonnen. */
.billett-navn .status-merke[b-togr4vmdrk] {
    align-self: flex-start;
}

.billett-rad .antall-rad[b-togr4vmdrk] {
    flex: 0 0 auto;
}

/* PAM-182b: avkryssingen i «Tillegg» — 20 px som .checkbox-rad (DESIGNSYSTEM 6.6; nettleserens 13 px ble målt i del C),
   og hele raden er trykkflaten, minst 44 px: etiketten dekker raden, så et trykk hvor som helst krysser av. */
.produkt-kryss[b-togr4vmdrk] {
    width: 1.25rem;
    height: 1.25rem;
    margin: 0;
    flex-shrink: 0;
}

.billett-rad:has(.produkt-kryss)[b-togr4vmdrk] {
    position: relative;
    min-height: 2.75rem;
}

.billett-rad:has(.produkt-kryss) .billett-navn label[b-togr4vmdrk]::after {
    content: "";
    position: absolute;
    inset: 0;
}

.billett-liste-felt .oversikt-linje[b-togr4vmdrk],
.billett-liste-felt .feilmelding[b-togr4vmdrk] {
    margin-top: var(--sp-2, 8px);
}

.merkevare-side.merkevare-aktiv .billett-pris[b-togr4vmdrk] {
    color: var(--mv-tekst-dus);
}

.merkevare-side.merkevare-aktiv .billett-rad + .billett-rad[b-togr4vmdrk] {
    border-top-color: var(--mv-kant-dus);
}

/* ------------------------------------------------------------------ PAM-44
   Kortet «Betaling»: prisen, regnestykket og arrangørens egen
   betalingsinformasjon. Husets .innstilling-kort, .form-felt og .krav-felt
   uendret; her står bare det de tre linjene trenger i tillegg. */

/* Prisen er kortets svar på «hva koster det» — den skal leses først. */
.betaling-pris[b-togr4vmdrk] {
    margin: 0 0 var(--sp-1, 4px);
}

/* Regnestykket står under prisen, og er det som faktisk skal betales. */
.betaling-belop[b-togr4vmdrk] {
    font-weight: 600;
    margin: 0 0 var(--sp-3, 12px);
}

/* Arrangørens egne ord, ordrett: linjeskiftene i «Betal til konto … / merk
   med navn» er en del av meldingen, og et kontonummer uten mellomrom skal
   brytes i stedet for å gi sidescroll på 375 px. */
.betalingsinfo[b-togr4vmdrk] {
    white-space: pre-line;
    overflow-wrap: anywhere;
    margin: var(--sp-2, 8px) 0;
}

/* ------------------------------------------------------------------ PAM-52
   «Velg tidspunkt»: over tolv tidspunkter grupperes radene med en liten
   månedsoverskrift. Den skal skille gruppene, ikke konkurrere med kortets
   egen overskrift. */
.tidspunkt-maaned[b-togr4vmdrk] {
    margin: var(--sp-3, 12px) 0 var(--sp-1, 4px);
    font-size: 0.95rem;
    font-weight: 600;
}

.tidspunkt-maaned:first-child[b-togr4vmdrk] {
    margin-top: 0;
}

/* PAM-63: det som er satt for et tidspunkt, rett under valget — innrykket til
   teksten i .checkbox-rad (boks 1.25rem + gap 8px), liten og dempet. */
.tidspunkt-info[b-togr4vmdrk] {
    margin: calc(-1 * var(--sp-1, 4px)) 0 var(--sp-2, 8px) calc(1.25rem + var(--sp-2, 8px));
}

.tidspunkt-info p[b-togr4vmdrk] {
    margin: 0;
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}

.tidspunkt-info-beskrivelse[b-togr4vmdrk] {
    white-space: pre-line;
}

/* ------------------------------------------------------------------ PAM-60
   «Se over og meld på»: én gruppe per steg, overskriften og «Endre» på samme
   rad, svarene som par. Ren tekst — lange ord (e-post, referanser) brytes, aldri
   sidescroll på 375 px; under 480 px står svaret under etiketten. */
.oversikt-topp[b-togr4vmdrk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2, 8px);
    margin-bottom: var(--sp-1, 4px);
}

.oversikt-topp h3[b-togr4vmdrk],
.oversikt-topp h4[b-togr4vmdrk] {
    margin: 0;
    font-size: 1rem;
}

.oversikt-topp .btn-tekst[b-togr4vmdrk] {
    flex-shrink: 0;
}

.oversikt-personer[b-togr4vmdrk] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.oversikt-personer li + li[b-togr4vmdrk],
.oversikt-personer + #pam-oversikt-tillegg[b-togr4vmdrk] {
    margin-top: var(--sp-3, 12px);
    padding-top: var(--sp-3, 12px);
    border-top: 1px solid var(--mod-kant);
}

.oversikt-navn[b-togr4vmdrk] {
    margin: 0 0 var(--sp-1, 4px);
    font-weight: 600;
    overflow-wrap: anywhere;
}

.oversikt-linje[b-togr4vmdrk] {
    margin: 0 0 var(--sp-1, 4px);
    overflow-wrap: anywhere;
}

.oversikt-sum[b-togr4vmdrk] {
    margin: var(--sp-2, 8px) 0 var(--sp-1, 4px);
    font-weight: 600;
}

.oversikt-liste[b-togr4vmdrk] {
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
}

.oversikt-rad[b-togr4vmdrk] {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    gap: var(--sp-2, 8px);
    padding: var(--sp-1, 4px) 0;
}

.oversikt-rad dt[b-togr4vmdrk] {
    margin: 0;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.oversikt-rad dd[b-togr4vmdrk] {
    margin: 0;
    overflow-wrap: anywhere;
    white-space: pre-line;
}

@media (max-width: 480px) {
    .oversikt-rad[b-togr4vmdrk] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
    }
}

.merkevare-side.merkevare-aktiv .oversikt-topp h3[b-togr4vmdrk],
.merkevare-side.merkevare-aktiv .oversikt-topp h4[b-togr4vmdrk],
.merkevare-side.merkevare-aktiv .oversikt-rad dt[b-togr4vmdrk] {
    color: var(--mv-tekst);
}

.merkevare-side.merkevare-aktiv .oversikt-personer li + li[b-togr4vmdrk],
.merkevare-side.merkevare-aktiv .oversikt-personer + #pam-oversikt-tillegg[b-togr4vmdrk] {
    border-top-color: var(--mv-kant-dus);
}

/* ------------------------------------------------------------------ PAM-162
   Bylinen under skjemaet (som Kontakt.razor, SKJ-9): sentrert, med luft over.
   Fargen er .innstilling-hjelp sin — merkevare.css gir den --mv-tekst-dus. */
.pamelding-byline[b-togr4vmdrk] {
    margin-top: var(--sp-5, 24px);
    text-align: center;
}

/* ------------------------------------------------------------------ PAM-240
   Radio/avkrysning inne i .form-felt (spørsmål, tidspunktvalg i deltakerkortet).
   «.form-felt label» (app.css, tema-moderne.css) gjør etiketten til en fet blokk og
   vant over husets .checkbox-rad — sirkelen havnet over teksten. Scopet attributt
   gir (0,3,0) mot (0,2,2) i temaet; husets radoppførsel tilbake, farge/størrelse arves. */
.form-felt .checkbox-rad[b-togr4vmdrk] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    font-weight: normal;
    margin-bottom: 0;
}

/* ------------------------------------------------------------------ PAM-106c
   Arrangørens ark «Legg til deltaker» (FanePaameldinger): hver overskrift i skjemaet står ett nivå ned
   (Overskriftsnivaa), under arkets egen h2. Uten disse ville kortenes h3 og deltakerkortenes h5 fått
   grunnlagets størrelser (h3 1,75 rem) — nær arkets tittel. Kortets tittel er DESIGNSYSTEM 6.4 (1,25 rem / 600),
   deltakerkortets 1 rem / 600 (som deltittelen i 6.4). Bare under .ark-panel: deltakerens side har ikke arket,
   og der er nivåene og størrelsene som før. */
.ark-panel .innstilling-kort > h3[b-togr4vmdrk] {
    margin: 0 0 var(--sp-3, 12px);
    font-size: 1.25rem;
    font-weight: 600;
}

.ark-panel .dag-kort-topp h5[b-togr4vmdrk] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

/* ------------------------------------------------------------------ UI-209
   DESIGNSYSTEM 6.4 på påmeldingsskjemaets kort. Kortets tittel er 1,25 rem / 600 (grunnlagets h2 er ca. 1,9 rem
   og så stor at den ble større enn sidens h1 — PAM-106c målte 30,4 px/500). Arkets kort har h3 og er rettet
   ovenfor; her treffes deltakerens side, der Overskriftsnivaa gir h2. Kortpolstringen er --sp-4 på mobil
   (6.4); app.css (ORD-41) krymper alle kort til --sp-3 der, og det er for trangt i et skjema. Delkortene
   (.dag-kort, kort inni kort) beholder --sp-3. */
.innstilling-kort > h2[b-togr4vmdrk] {
    margin: 0 0 var(--sp-3, 12px);
    font-size: 1.25rem;
    font-weight: 600;
}

@media (max-width: 640.98px) {
    .innstilling-kort:not(.dag-kort)[b-togr4vmdrk] {
        padding: var(--sp-4, 16px);
    }
}
/* /Components/Pages/Pamelding/Skann.razor.rz.scp.css */
/* ================================================================
   PAM-228b2 — skannesiden. Lånt fra Timeregistreringens Skanner.razor.css (TIM-3): den faste, mørke flaten over hele
   skjermen (--mork-*, UI-136), topp/flate/bunn i en kolonne, og svaret som dekker alt. Forskjellen: svaret står i
   statusparene (DESIGNSYSTEM 3.3 — bakgrunn OG tekst fra samme par, aldri farge alene; ordet og ikonet står alltid), og
   knappene, feltene og avstandene er husets (6.1, 6.6, tokens), ikke egne px-mål.
   Fullskjermsvaret står ikke i systemet ennå — designtråden skriver det inn som 6.12 når PAM-228b flettes.
   ================================================================ */

.skann[b-t48susou1s] {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: column;
    background: var(--mork-bg);
    color: var(--mork-tekst);
    overflow: hidden;
}

/* ----------------------------------------------------- toppen: arrangement, teller, avgang */

.skann-topp[b-t48susou1s] {
    flex: 0 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--sp-3);
    padding: calc(var(--sp-3) + env(safe-area-inset-top, 0px)) var(--sp-4) var(--sp-3);
    background: var(--mork-flate);
}

.skann-hode[b-t48susou1s] {
    min-width: 0;
    flex: 1 1 14rem;
}

.skann-arrangement[b-t48susou1s] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--mork-tekst);
    overflow-wrap: anywhere;
}

.skann-teller[b-t48susou1s] {
    margin: var(--sp-1) 0 0;
    font-size: 1.125rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.skann-avgang[b-t48susou1s] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
    flex: 1 1 18rem;
    max-width: 32rem;
}

.skann-avgang .form-felt[b-t48susou1s] {
    flex: 1 1 14rem;
    min-width: 0;
}

.skann-avgang .skann-dato[b-t48susou1s] {
    flex: 0 1 12.5rem;
}

.skann-avgang .form-felt label[b-t48susou1s],
.skann-inntasting label[b-t48susou1s] {
    display: block;
    margin-bottom: var(--sp-1);
    font-weight: 600;
    color: var(--mork-tekst);
}

.skann-avgang .search-input[b-t48susou1s],
.skann-inntasting .search-input[b-t48susou1s] {
    width: 100%;
}

.skann-hjelp[b-t48susou1s] {
    margin: var(--sp-1) 0 0;
    color: var(--mork-tekst-dus);
}

/* ----------------------------------------------------- flaten (del B: kamerabildet) */

.skann-flate[b-t48susou1s] {
    flex: 1 1 auto;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 0;
    padding: var(--sp-4);
    background: var(--mork-bg);
}

.skann-ledetekst[b-t48susou1s] {
    margin: 0;
    text-align: center;
    font-size: 1.125rem;
    color: var(--mork-tekst-dus);
}

/* Kamerabildet fyller flaten (cover, som Timeregistreringens skanner: QR-en leses fra midten, og svarte felt på
   sidene ser ut som en feil). Usynlig til skriptet melder at kameraet går. */
.skann-video[b-t48susou1s] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
}

.skann-flate-aktiv .skann-video[b-t48susou1s] {
    opacity: 1;
}

/* Ledeteksten over kamerabildet: nederst på flaten, på mørk flate så den leses over et lyst bilde. */
.skann-sikte[b-t48susou1s] {
    position: absolute;
    left: var(--sp-4);
    right: var(--sp-4);
    bottom: var(--sp-4);
    padding: var(--sp-2) var(--sp-3);
    border-radius: var(--mod-radius-liten);
    background: var(--mork-flate);
    color: var(--mork-tekst);
}

.skann-kamerabeskjed[b-t48susou1s] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    max-width: 32rem;
    text-align: center;
}

.skann-kameratittel[b-t48susou1s] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--mork-tekst);
}

/* ----------------------------------------------------- bunnen: feltet og veien til dørlista */

.skann-bunn[b-t48susou1s] {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    padding: var(--sp-3) var(--sp-4) calc(var(--sp-3) + env(safe-area-inset-bottom, 0px));
    background: var(--mork-flate);
}

.skann-inntasting[b-t48susou1s] {
    width: 100%;
    max-width: 32rem;
    margin: 0 auto;
}

.skann-feltrad[b-t48susou1s] {
    display: flex;
    gap: var(--sp-2);
}

.skann-feltrad .search-input[b-t48susou1s] {
    flex: 1 1 auto;
    min-width: 0;
}

/* «Finn» ved siden av feltet, også på mobil: husets regel under 480 px gjør .btn-avbryt 100 % bred (UI-73) — da ble
   feltet klemt til en strek. Samme unntak som søkeraden (.sok-med-filter .btn-avbryt i app.css). */
.skann-feltrad .btn-avbryt[b-t48susou1s] {
    display: inline-block;
    width: auto;
    flex: 0 0 auto;
}

/* Lenka på mørk flate: husets btn-tekst er laget for lys flate. Understreket tekst i --mork-tekst, hele 44 px er
   trykkflaten. */
.skann-lenke[b-t48susou1s] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    color: var(--mork-tekst);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.skann-lenke:focus-visible[b-t48susou1s] {
    outline: 3px solid var(--mod-fokus);
    outline-offset: 2px;
}

/* ----------------------------------------------------- svaret, over hele skjermen */

.skann-svar[b-t48susou1s] {
    position: absolute;
    inset: 0;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--sp-3);
    padding: calc(var(--sp-5) + env(safe-area-inset-top, 0px)) var(--sp-4) calc(var(--sp-5) + env(safe-area-inset-bottom, 0px));
    text-align: center;
    overflow-y: auto;
}

/* Statusparene (3.3): flaten er parets bakgrunn, all tekst parets tekstfarge. */
.skann-svar-gronn[b-t48susou1s] {
    background: var(--mod-gronn-bg);
    color: var(--mod-gronn-tekst);
}

.skann-svar-gul[b-t48susou1s] {
    background: var(--mod-gul-bg);
    color: var(--mod-gul-tekst);
}

.skann-svar-rod[b-t48susou1s] {
    background: var(--mod-rod-bg);
    color: var(--mod-rod-tekst);
}

.skann-ikon[b-t48susou1s] {
    display: flex;
    line-height: 0;
}

/* Ordet: leses på avstand. Store bokstaver i CSS, så skjermleseren leser ordet, ikke bokstavene. */
.skann-svartittel[b-t48susou1s] {
    margin: 0;
    font-size: clamp(2rem, 9vw, 3.5rem);
    font-weight: 600;
    line-height: 1.1;
    text-transform: uppercase;
}

.skann-billett[b-t48susou1s] {
    margin: 0;
    font-size: clamp(1.5rem, 6vw, 2.25rem);
    font-weight: 600;
    overflow-wrap: anywhere;
}

.skann-svartekst[b-t48susou1s] {
    margin: 0;
    font-size: clamp(1.125rem, 4.5vw, 1.5rem);
    font-variant-numeric: tabular-nums;
}

.skann-svartekst:empty[b-t48susou1s] {
    display: none;
}

/* «2 andre billetter på samme påmelding, 1 inne» — dus, men i parets tekstfarge (grått holder ikke 4,5 : 1 på parene). */
.skann-andre[b-t48susou1s] {
    margin: 0;
    font-size: 1rem;
}

.skann-svarknapper[b-t48susou1s] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
    width: 100%;
    max-width: 32rem;
    margin-top: var(--sp-3);
}

/* «Sjekk inn» i full bredde (6.1), og «Skann neste» under. */
.skann-svarknapper .btn-ny[b-t48susou1s],
.skann-svarknapper .btn-avbryt[b-t48susou1s] {
    width: 100%;
    justify-content: center;
}
/* /Components/Pages/Pamelding/Stedskart.razor.rz.scp.css */
/* PAM-42 — kartet under faktaboksen. Rammen og høyden er husets .kart-ramme
   (app.css: 100 % bredde, 320 px høy iframe, avrundet kant); her står bare
   avstanden til skjemaet under, som faktaboksens egen. */
.stedskart[b-c6g2hrp0t3] {
    margin: 0 0 var(--sp-5, 24px);
}
/* /Components/Pages/Pamelding/Timeplanvisning.razor.rz.scp.css */
/* PAM-259B2 — flyttet uendret fra Avbestill.razor.css med markupen: «Din påmelding» og kvitteringen etter innsending.
   PAM-259B1 — «Din timeplan»: dagene stablet, linjene som liste (ingen tabell — mobil først, aldri sidelengs rulling).
   Klokkeslettet i en fast smal kolonne med like brede sifre; navn, merker og sted brytes i kolonnen ved siden av. */
.timeplan-dag[b-q9i2ay8ndr] {
    margin: var(--sp-4, 16px) 0 var(--sp-1, 4px);
    font-size: 1rem;
    font-weight: 600;
}

.timeplan-linjer[b-q9i2ay8ndr] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.timeplan-linje[b-q9i2ay8ndr] {
    display: flex;
    gap: var(--sp-3, 12px);
    padding: var(--sp-2, 8px) 0;
    border-top: 1px solid var(--mod-kant);
}

.timeplan-klokke[b-q9i2ay8ndr] {
    flex: 0 0 auto;
    min-width: 6.5em;
    font-variant-numeric: tabular-nums;
    color: var(--mod-tekst-dus);
}

.timeplan-hva[b-q9i2ay8ndr] {
    flex: 1 1 auto;
    min-width: 0;
}

/* Ønskemerket («1. valg — ikke fordelt ennå») er langt for kolonnen på 375 px: det får brytes heller enn å presse siden
   sidelengs. Det står på egen linje under navnet, så pillen aldri deles midt i en tekstlinje. */
.timeplan-navn[b-q9i2ay8ndr] {
    display: block;
}

.timeplan-hva .status-merke[b-q9i2ay8ndr] {
    display: inline-block;
    max-width: 100%;
    margin-top: var(--sp-1, 4px);
}

.timeplan-detalj[b-q9i2ay8ndr] {
    display: block;
    color: var(--mod-tekst-dus);
    font-size: 0.875rem;
}
/* /Components/Pages/Partnere.razor.rz.scp.css */
/* UI-10: krav-streken rundt «Legg til kontaktperson»-feltene.

   .stopp-rad er en flex-kolonne med gap; .krav-felt har i tillegg sin egen
   bunnmarg, og de to legger seg oppå hverandre slik at nettopp de to påkrevde
   feltene får større luft under seg enn de valgfrie. Samme rettelse som
   .orgnr-rad .krav-felt i app.css.

   Scoped fil og ikke app.css med vilje (04.09.2026): Remis egen kjøring sto på
   port 5199 under arbeidet, og wwwroot skal ikke røres mens en server kjører. */
.stopp-rad .krav-felt[b-c5r4psnrc5] {
    margin-bottom: 0;
}

/* PART-1: navnetreffene fra Enhetsregisteret under «Selskapsnavn». Samme
   utseende som kundesøkets .sok-forslag, men i flyten og ikke svevende: inne
   i arket (som ruller) ville en absolutt liste blitt klippet nederst på mobil. */
.sok-forslag.partner-navnetreff[b-c5r4psnrc5] {
    position: static;
    margin-top: var(--sp-1);
    box-shadow: none;
}
/* /Components/Pages/Plattform.razor.rz.scp.css */
/* DRIFT-4: «Innlogget nå» — kortets hjelpelinjer og lista under nøkkeltallene. */
.innlogget-tillegg[b-koe46iyzjv] {
    font-size: 0.78rem;
    color: var(--mod-tekst-dus);
    line-height: 1.3;
}

.innlogget-trygt[b-koe46iyzjv] {
    color: var(--mod-gronn-tekst);
}

.innlogget-liste[b-koe46iyzjv] {
    max-width: 900px;
    margin-bottom: var(--sp-5);
}

.innlogget-hode[b-koe46iyzjv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--sp-3);
    margin-bottom: var(--sp-3);
}

.innlogget-hode h2[b-koe46iyzjv] {
    font-size: 1.1rem;
    margin: 0;
    white-space: nowrap;
}

.innlogget-rader[b-koe46iyzjv] {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--sp-3);
    border: 1px solid var(--mod-kant);
    border-radius: 0.625rem;
}

.innlogget-rad[b-koe46iyzjv] {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 1fr);
    gap: var(--sp-1) var(--sp-3);
    padding: var(--sp-2) var(--sp-3);
    border-top: 1px solid var(--mod-kant);
    overflow-wrap: anywhere;
}

.innlogget-rad:first-child[b-koe46iyzjv] {
    border-top: none;
}

.innlogget-navn[b-koe46iyzjv] {
    font-weight: 600;
}

.innlogget-firma[b-koe46iyzjv],
.innlogget-tid[b-koe46iyzjv] {
    color: var(--mod-tekst-dus);
}

.innlogget-tid[b-koe46iyzjv] {
    text-align: right;
}

.innlogget-anonym .innlogget-navn[b-koe46iyzjv] {
    font-weight: 400;
    font-style: italic;
}

.innlogget-merke[b-koe46iyzjv] {
    margin-left: 0.35rem;
    vertical-align: middle;
}

@media (max-width: 640px) {
    .innlogget-rad[b-koe46iyzjv] {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .innlogget-firma[b-koe46iyzjv] {
        grid-column: 1;
        grid-row: 2;
    }

    .innlogget-tid[b-koe46iyzjv] {
        grid-column: 2;
        grid-row: 1;
    }
}
/* /Components/Pages/PlattformImport.razor.rz.scp.css */
/* PAM-203: et filnavn har sjelden mellomrom (kbv-tur_runde-01.json), så .brytbar
   alene lar det stå på én linje og skyve tallkolonnene ut av kortet. Bryt det hvor
   som helst — det er et navn som skal kjennes igjen, ikke leses som tekst.
   «anywhere» gjør kolonnens minste bredde til ett tegn, og da gir tabellen den
   bort til naboene (målt: 86 px, ett ordstykke per linje). Bunnen holder navnet
   lesbart; tallkolonnene får plass også med den (målt i kortet på 708 px). */
.flerimport-fil[b-qy6w5za1us] {
    overflow-wrap: anywhere;
    min-width: 11rem;
}
/* /Components/Pages/PlattformKunder.razor.rz.scp.css */
/* WEB-15: merkelappene i Status-cella skal stå venstrejustert på mobil, ikke
   bli dyttet til høyre kant alene på siste linje.

   Bryting (`flex-wrap`/`row-gap`) bor nå i mønsteret selv, `.tabell-stablet
   tbody td` i app.css (UI-64) — bare venstrejusteringen av merkelista er
   spesifikk for denne cella og står lokalt her. UI-148: samme brytepunkt som
   .tabell-stablet i app.css. */
@media (max-width: 922.98px) {
    .data-tabell.tabell-stablet tbody td[data-etikett="Status"][b-ijp4m03ls6] {
        justify-content: flex-start;
    }
}

/* UI-148b: kundelista og forespørslene er .tabell-stablet-bred og er kort til og
   med 1211.98px (app.css). Demobesøkenes tabell har også en Status-celle, men er
   ikke bred — den følger 922.98-regelen over. */
@media (max-width: 1211.98px) {
    .data-tabell.tabell-stablet-bred tbody td[data-etikett="Status"][b-ijp4m03ls6] {
        justify-content: flex-start;
    }
}

/* ONB-32: spørsmålslinja i steg to av «Avvis» og kvitteringen etter den står
   rett over knappene. Ingen egne farger (de eier designtråden) — bare luft mot
   knappene, og et langt søkernavn skal bryte, ikke gi vannrett rulling på 375 px. */
.avvis-bekreftelse[b-ijp4m03ls6] {
    margin: var(--sp-2) 0;
    overflow-wrap: anywhere;
}

/* UI-55: hovedkontaktens e-post i Abonnement-fanen («Navn — tlf — epost») har ingen
   mellomrom å bryte på og strakk hele siden til vannrett rulling på nettbrett. Avsnittet
   bryter der det står — siden ruller aldri sidelengs (DESIGNSYSTEM 6.7). Bare bryting:
   ingen farger, ingen luft. */
.innstilling-hjelp[b-ijp4m03ls6] {
    overflow-wrap: anywhere;
}
/* /Components/Pages/PlattformNytt.razor.rz.scp.css */
/* NYT-1: /plattform/nytt. Siden er [BredSide] for lista; skjemaet holdes i lesebredde.
   UI-128: «Ny nyhet» står i .valg-rad (app.css) og har ingen egen regel lenger. */
.nytt-skjema[b-gseetldqbm] {
    max-width: 760px;
}

.nytt-skjema .form-felt[b-gseetldqbm] {
    max-width: 560px;
}

.nytt-skjema .form-felt textarea[b-gseetldqbm] {
    width: 100%;
    resize: vertical;
}

.nytt-bredt[b-gseetldqbm] {
    max-width: none;
}

.nytt-teller[b-gseetldqbm] {
    display: block;
    text-align: right;
    font-size: 0.8rem;
    color: var(--mod-tekst-dus);
}

.nytt-sprakregler[b-gseetldqbm] {
    line-height: 1.5;
}

/* Avkrysningene: hele raden er trykkflaten, minst 44 px høy (mobil). */
.nytt-valg[b-gseetldqbm] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    min-height: 44px;
    cursor: pointer;
}

.nytt-valg input[type="checkbox"][b-gseetldqbm] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.nytt-valg-av[b-gseetldqbm] {
    color: var(--mod-tekst-dus);
}

.nytt-gruppe[b-gseetldqbm] {
    border: none;
    padding: 0;
    margin: 0 0 var(--sp-4);
}

.nytt-gruppe legend[b-gseetldqbm] {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: var(--sp-1);
}

.nytt-firmavalg[b-gseetldqbm],
.nytt-firmatreff[b-gseetldqbm] {
    list-style: none;
    padding: 0;
    margin: var(--sp-2) 0;
}

.nytt-firmavalg li[b-gseetldqbm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2);
    min-height: 44px;
    border-bottom: 1px solid var(--mod-kant);
}

.nytt-firmatreff li button[b-gseetldqbm] {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    text-align: left;
}

/* Listeraden: tittel og dato øverst, pillene og appene under — bryter i to linjer på mobil. */
.nytt-rad-meta[b-gseetldqbm] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-1) var(--sp-2);
}

.nytt-rad-meta .ordre-rad-meta[b-gseetldqbm] {
    margin-top: 0;
}

.nytt-pille[b-gseetldqbm] {
    margin-bottom: 0;
}

.nytt-mottakere[b-gseetldqbm] {
    font-weight: 600;
    font-size: 1.05rem;
}

.nytt-ark-knapper[b-gseetldqbm] {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.nytt-forhandsvalg[b-gseetldqbm] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
    margin-bottom: var(--sp-4);
}

.nytt-forhandsvalg .minifelt[b-gseetldqbm] {
    flex: 1 1 160px;
}

.nytt-forhandsvisning[b-gseetldqbm] {
    border-top: 1px solid var(--mod-kant);
    padding-top: var(--sp-4);
}

.ark-panel.nytt-ark-bred[b-gseetldqbm] {
    max-width: 720px;
}

/* NYT-4: utkastraden — teksten slik kunden ser den, knappene til høyre (desktop)
   eller full bredde under teksten (mobil). Raden er ikke klikkbar selv. */
.nytt-utkast[b-gseetldqbm] {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-3);
    cursor: default;
}

.nytt-utkast-tekst[b-gseetldqbm] {
    flex: 1 1 auto;
    min-width: 0;
}

.nytt-utkast-tittel[b-gseetldqbm] {
    font-size: 1.05rem;
    font-weight: 600;
    margin: var(--sp-2) 0 var(--sp-1);
    overflow-wrap: anywhere;
}

.nytt-utkast-kort[b-gseetldqbm] {
    margin: 0 0 var(--sp-1);
    overflow-wrap: anywhere;
}

.nytt-utkast-kilde[b-gseetldqbm] {
    margin: 0;
}

.nytt-utkast-knapper[b-gseetldqbm] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    flex: 0 0 auto;
    min-width: 140px;
}

/* Knappenes egne marger (fra skjemaknappene) ville doblet avstanden — gap styrer den. */
.nytt-utkast-knapper button[b-gseetldqbm] {
    min-height: 44px;
    margin: 0;
    justify-content: center;
}

@media (max-width: 640.98px) {
    /* .ordre-rad-hode brekker under 641 px fra husregelen i app.css (UI-123). */
    .nytt-utkast[b-gseetldqbm] {
        flex-direction: column;
        align-items: stretch;
    }

    .nytt-utkast-knapper[b-gseetldqbm] {
        min-width: 0;
        width: 100%;
    }

    .nytt-utkast-knapper button[b-gseetldqbm] {
        width: 100%;
    }
}
/* /Components/Pages/PlattformSupport.razor.rz.scp.css */
/* Samtalelista på plattformens support-side (SUP-1). Scoped og ikke i
   app.css — se begrunnelsen i Samtale.razor.css. */

.samtale-liste[b-g5ygao4ayt] {
    list-style: none;
    margin: 0;
    padding: 0;
    max-width: 720px;
}

.samtale-liste li + li[b-g5ygao4ayt] {
    margin-top: var(--sp-2);
}

/* Hele raden er én knapp — klikkbar og tastaturnåbar uten role/tabindex-triks. */
.samtale-rad[b-g5ygao4ayt] {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    width: 100%;
    padding: var(--sp-3) var(--sp-4);
    background-color: var(--mod-flate);
    border: 1px solid var(--mod-kant);
    border-radius: 0.5rem;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.samtale-rad:hover[b-g5ygao4ayt],
.samtale-rad:focus[b-g5ygao4ayt] {
    /* UI-112: strek i firmafargen → -markor (≥ 3 : 1), aldri rå --mod-primar/--merkevarefarge. */
    border-color: var(--mod-primar-markor);
}

.samtale-navn[b-g5ygao4ayt] {
    font-weight: 600;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.samtale-tid[b-g5ygao4ayt] {
    color: var(--mod-tekst-dus);
    font-size: 0.85rem;
    white-space: nowrap;
}

.samtale-ulest[b-g5ygao4ayt] {
    min-width: 1.5rem;
    height: 1.5rem;
    padding: 0 0.45rem;
    border-radius: 0.75rem;
    background-color: var(--mod-rod);
    color: var(--mod-flate);
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.5rem;
    text-align: center;
}

.samtale-topp[b-g5ygao4ayt] {
    margin-bottom: var(--sp-3);
}

.samtale-topp h1[b-g5ygao4ayt] {
    margin-bottom: 0;
}

.samtale-tilbake[b-g5ygao4ayt] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    padding: var(--sp-1) 0;
}

/* --- Kunngjøring til flere busselskap (SUP-2) --------------------------- */

.support-topp[b-g5ygao4ayt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
    flex-wrap: wrap;
    max-width: 720px;
}

.support-topp h1[b-g5ygao4ayt] {
    margin-bottom: 0;
}

/* app.css gir .btn-ny full bredde og ytre marg på mobil — her skal knappene
   stå kompakt ved siden av tittelen og i dialogens knapperad. */
.support-kunngjoring-knapp[b-g5ygao4ayt],
.kunngjoring-send[b-g5ygao4ayt] {
    width: auto;
    max-width: none;
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    white-space: nowrap;
}

.kunngjoring-modus[b-g5ygao4ayt] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    margin-bottom: var(--sp-3);
}

.kunngjoring-valg[b-g5ygao4ayt] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    cursor: pointer;
}

.kunngjoring-valg input[b-g5ygao4ayt] {
    width: 1.1rem;
    height: 1.1rem;
    flex-shrink: 0;
    /* UI-115 — markørfargen (≥ 3:1 mot hvitt), ikke den rå firmafargen */
    accent-color: var(--mod-primar-markor);
}

.kunngjoring-snarveier[b-g5ygao4ayt] {
    display: flex;
    gap: var(--sp-4);
    margin-bottom: var(--sp-2);
}

/* Firmalista scroller INNE i dialogen — på mobil skal ikke hele arket vokse
   utenfor skjermen når lista blir lang (9+ firma). */
.kunngjoring-liste[b-g5ygao4ayt] {
    list-style: none;
    margin: 0 0 var(--sp-3);
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--mod-kant);
    border-radius: 0.5rem;
    max-height: 13rem;
    overflow-y: auto;
}

.kunngjoring-liste li + li[b-g5ygao4ayt] {
    margin-top: var(--sp-2);
}

.kunngjoring-tekst[b-g5ygao4ayt] {
    width: 100%;
    resize: vertical;
    border: 1px solid var(--mod-kant-sterk);
    border-radius: 0.5rem;
    padding: var(--sp-2) var(--sp-3);
    font: inherit;
}

.kunngjoring-tekst:focus[b-g5ygao4ayt] {
    outline: 2px solid var(--mod-primar-markor);
    outline-offset: -1px;
}

.kunngjoring-knapper[b-g5ygao4ayt] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--sp-3);
    margin-top: var(--sp-3);
}

.kunngjoring-knapper .btn-avbryt[b-g5ygao4ayt] {
    margin: 0;
}

.kunngjoring-antall[b-g5ygao4ayt] {
    margin-right: auto;
    color: var(--mod-tekst-dus);
    font-size: 0.9rem;
}

/* Teksten slik den går ut, vist i bekreftelsessteget. Samme brytningsregler
   som meldingsboblene: linjeskift bevares, lange ord brytes. */
.kunngjoring-sitat[b-g5ygao4ayt] {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    background-color: var(--mod-kant);
    border-radius: 0.5rem;
    padding: var(--sp-2) var(--sp-3);
    max-height: 10rem;
    overflow-y: auto;
}
/* /Components/Pages/Priser.razor.rz.scp.css */
/* Priser — scoped stil (KND-9).

   Ligger her, ikke i app.css: app.css er en delt fil flere tråder står i, og
   denne regelen gjelder én rad på én fane. Scoped CSS er dessuten det som
   gjør at «produkt-kode-rad» ikke kan komme til å treffe en rad med samme
   navn et annet sted senere.

   Raden er produktets regnskapskode, og den står UNDER produktraden i stedet
   for som et femte felt i den: .produkt-rad er allerede
   `2fr 1fr 1fr auto`, og et femte felt der ga sidescroll på 375 px. Under
   raden får feltet i stedet en ekte merkelapp, som er nødvendig her — «3030»
   uten merking er ikke til å gjette seg til. */
.produkt-kode-rad[b-zzjgn9lcp9] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--sp-2);
    align-items: center;
    max-width: 56rem;
    /* Rykket inn, så koden leses som en detalj ved produktet over og ikke som
       et nytt produkt. */
    padding-left: var(--sp-3);
    margin-bottom: var(--sp-3);
}

.produkt-kode-rad label[b-zzjgn9lcp9],
.produkt-kode-etikett[b-zzjgn9lcp9] {
    margin: 0;
    font-size: 0.8125rem;
    /* Samme grå som .innstilling-hjelp — merkelappen er en forklaring, ikke
       et krav på linje med «Navn». */
    color: var(--mod-tekst-dus);
    white-space: nowrap;
}

/* REV-PO-34: velgeren står der fritekstfeltet sto. Merkelappen er ikke en
   <label> (velgeren er knapper, ikke ett felt), så den løftes til toppen av
   raden i stedet for å sentreres mot en høy liste. */
.produkt-kode-etikett[b-zzjgn9lcp9] {
    align-self: start;
    padding-top: 2px;
}

/* Mobil: merkelappen over feltet. To kolonner ville presset inputen ned mot
   ingenting når merkelappen er «PowerOffice-produktkode». */
@media (max-width: 640px) {
    .produkt-kode-rad[b-zzjgn9lcp9] {
        grid-template-columns: 1fr;
        gap: var(--sp-1);
        padding-left: 0;
    }
}

/* ───────────── «Utlegg» per produkt (PRI-84) ─────────────
   Egen rad under produktraden (som koden under den): .produkt-rad har allerede fire
   felt. Haken og ordet er trykkflaten, minst 44 px høy (mobil); forklaringen står
   én gang som synlig tekst over lista — ikke title, som ikke finnes på en
   telefon. */
.produkt-utlegg[b-zzjgn9lcp9] {
    /* inline-flex: trykkflaten er haken og ordet, ikke hele bredden — et
       trykk i det tomme feltet mellom to produkter skal ikke snu noe. */
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    min-height: 44px;
    padding-left: var(--sp-3);
    margin-bottom: var(--sp-2);
    cursor: pointer;
    font-size: .95rem;
}

.produkt-utlegg input[b-zzjgn9lcp9] {
    width: 1.15rem;
    height: 1.15rem;
    flex: 0 0 auto;
    cursor: pointer;
}

@media (max-width: 640px) {
    .produkt-utlegg[b-zzjgn9lcp9] {
        padding-left: 0;
    }
}

/* ───────────── Garasjebryterne (PRI-10) ─────────────
   Scoped, ikke i app.css: to avkrysninger som bare finnes på denne fanen.
   Mobile-first — radene stables av seg selv, og treffområdet er hele linja
   slik at et 375 px-skjermtrykk ikke må treffe selve boksen. */
.garasje-bryter[b-zzjgn9lcp9] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .55rem 0;
    cursor: pointer;
    font-size: .95rem;
}

/* ::deep fordi <InputCheckbox> tegner sitt eget <input> — det får ikke denne
   komponentens scope-attributt, og en vanlig etterkommer-selektor ville
   stille ikke truffet noe. */
.garasje-bryter[b-zzjgn9lcp9]  input {
    width: 1.15rem;
    height: 1.15rem;
    flex: 0 0 auto;
    cursor: pointer;
}

/* ───────────── «I bruk» per kategori (PRI-82) ─────────────
   Bryteren står i kortets hoderad ved «Standard»; trykkflaten er minst 44 px
   (mobil). Merket «Ikke i bruk» står i den lukkede raden, ved ★ standard. */
.kategori-ibruk[b-zzjgn9lcp9] {
    min-height: 44px;
    font-weight: 600;
    color: inherit;
}

.kategori-ikkeibruk[b-zzjgn9lcp9] {
    flex: 0 0 auto;
    font-size: 0.75rem;
    font-weight: 600;
    /* Nøytralt, dempet merke fra designsystemet (tema-moderne.css). */
    color: var(--mod-tekst-dus);
    background: var(--mod-kant);
    border-radius: 999px;
    padding: 0.1rem 0.5rem;
    white-space: nowrap;
}
/* /Components/Pages/Rapporter.razor.rz.scp.css */
/* RAP-1a: bare det som er sidens eget. Månedsvelgeren er felles
   (Components/Felles/Maanedsvelger, UTL-35A) og har reglene sine der.
   Tabellene, kortene, merkene og varselet er husets. */

.rapport-varsel[b-84t8g40br7] {
    margin-bottom: var(--sp-4);
}

.rapport-del[b-84t8g40br7] {
    margin-bottom: var(--sp-6);
}

.rapport-linjer[b-84t8g40br7] {
    list-style: none;
    padding: 0;
    margin: var(--sp-3) 0 var(--sp-4);
}

.rapport-tabell .tall[b-84t8g40br7] {
    font-variant-numeric: tabular-nums;
}

.rapport-kontroll[b-84t8g40br7] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.rapport-kontrollpunkt[b-84t8g40br7] {
    padding: var(--sp-3) 0;
    border-bottom: 1px solid var(--mod-kant);
}

.rapport-kontrollpunkt:last-child[b-84t8g40br7] {
    border-bottom: none;
}

.rapport-kontrollhode[b-84t8g40br7] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2);
}

.rapport-kontrollnavn[b-84t8g40br7] {
    font-weight: 600;
}

.rapport-kontrollpunkt .innstilling-hjelp[b-84t8g40br7] {
    margin: var(--sp-1) 0 0;
}

.rapport-ordrer summary[b-84t8g40br7] {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.rapport-ordrer ul[b-84t8g40br7] {
    margin: 0;
    padding-left: var(--sp-5);
}

.rapport-ordrer li[b-84t8g40br7] {
    padding: var(--sp-1) 0;
}

/* RAP-1b: månedsvelgeren og nedlastingsknappene deler én rad på bred skjerm
   (velgeren til venstre, knappene til høyre) og brytes under hverandre når det
   ikke er plass. */
.rapport-topp[b-84t8g40br7] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2) var(--sp-4);
    margin-bottom: var(--sp-4);
}

.rapport-nedlasting[b-84t8g40br7] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
}

/* .btn-avbryt bærer marg for å stå i en skjemarad — her gir radens gap luften. */
.rapport-nedlasting .btn-avbryt[b-84t8g40br7] {
    margin: 0;
    min-height: 44px;
    justify-content: center;
}

.rapport-kvittering[b-84t8g40br7] {
    margin: 0 0 var(--sp-4);
}

@media (max-width: 640.98px) {
    .rapport-nedlasting[b-84t8g40br7] {
        flex-direction: column;
        width: 100%;
    }

    .rapport-nedlasting .btn-avbryt[b-84t8g40br7] {
        width: 100%;
    }
}
/* /Components/Pages/SjaforTimeliste.razor.rz.scp.css */
/* SJF-16: timelista. Tabellen selv er husets .data-tabell + .tabell-stablet
   + .tabell-stablet-bred (kort til og med 1211.98px, UI-148b) — her står bare
   det som er sidens eget: verktøyraden, sorteringsknappene i overskriftene og
   kortoverskriften i kortvisningen. */

.timeliste-verktoy[b-w9yclnmbtz] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--sp-3);
    margin: var(--sp-3) 0;
}

.timeliste-filter[b-w9yclnmbtz] {
    margin: 0;
    min-width: 14rem;
    flex: 1 1 14rem;
}

.timeliste-knapper[b-w9yclnmbtz] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
}

/* Trykkflate: 44 px høyde også når knappen står alene på en telefon. */
.timeliste-knapper button[b-w9yclnmbtz] {
    min-height: 44px;
}

.timeliste-varsel[b-w9yclnmbtz] {
    margin: var(--sp-2) 0;
}

.timeliste-kvittering[b-w9yclnmbtz] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    margin: var(--sp-2) 0;
}

/* Sorteringsknappen ER kolonneoverskriften: hele overskriften skal kunne
   trykkes, ikke en liten pil ved siden av. Den arver skriften fra <th> så
   tabellen ser lik ut enten kolonnen er sorterbar eller ikke. */
.timeliste-sortknapp[b-w9yclnmbtz] {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    width: 100%;
    min-height: 44px;
    padding: 0;
    background: none;
    border: 0;
    font: inherit;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.timeliste-sortknapp:hover[b-w9yclnmbtz] {
    text-decoration: underline;
}

.timeliste-pil[b-w9yclnmbtz] {
    font-size: 0.7em;
}

/* Tallkolonnen leses nedover — like sifre skal stå under hverandre. */
.timeliste-tabell .timeliste-timer[b-w9yclnmbtz] {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

/* SJF-15c: filteret «Bare rettede og endrede» står i verktøyraden ved
   sjåførfilteret, nede på linje med feltene. */
.timeliste-bare-merkede[b-w9yclnmbtz] {
    margin: 0;
    min-height: 44px;
}

/* Husets .btn-tekst er dus grå — inne i varselet skal den leses som en lenke. */
.timeliste-vis-merkede[b-w9yclnmbtz] {
    height: auto;
    min-height: 44px;
    color: inherit;
    font-weight: 600;
    text-decoration: underline;
}

.timeliste-hint[b-w9yclnmbtz] {
    display: block;
    font-size: 0.85rem;
    color: var(--mod-tekst-dus);
}

/* Merket i raden: ikon + tekst, stempeltiden i klartekst. Egen linje under
   klokkeslettet — i tabellen og i kortet (der cella er flex og brytes). */
.timeliste-merke[b-w9yclnmbtz] {
    display: flex;
    flex-basis: 100%;
    align-items: flex-start;
    gap: 0.25rem;
    margin-top: 0.15rem;
    max-width: 16rem;
    white-space: normal;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--mod-gul-tekst);
}

.timeliste-merke[b-w9yclnmbtz]  .ikon {
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.timeliste-utentimer[b-w9yclnmbtz] {
    margin-top: var(--sp-5);
}

.timeliste-utentimer h2[b-w9yclnmbtz] {
    margin: 0 0 var(--sp-2);
    font-size: 1.05rem;
}

.timeliste-utentimer-liste[b-w9yclnmbtz] {
    margin: var(--sp-2) 0 0;
    padding-left: 1.25rem;
    font-variant-numeric: tabular-nums;
}

.timeliste-utentimer-liste li[b-w9yclnmbtz] {
    padding: var(--sp-1) 0;
    overflow-wrap: anywhere;
}

.timeliste-mangler[b-w9yclnmbtz] {
    color: var(--mod-tekst-dus);
}

/* Sjåføren i kortoverskriften finnes bare i kortvisningen; over 1211.98px har
   tabellen sin egen Sjåfør-kolonne, og navnet ville stått to ganger. Samme
   grunn til at sorteringsvelgeren bare finnes når tabellen er stablet: der er
   overskriftsraden — og dermed de sorterbare overskriftene — borte. */
.timeliste-tittelsjafor[b-w9yclnmbtz],
.timeliste-sortvelger[b-w9yclnmbtz] {
    display: none;
}

/* UI-148/UI-148b: kortvisningen — samme brytepunkt som .tabell-stablet-bred i
   app.css (timelista er målt for bred til kolonner under 1212 px). Det som
   handler om verktøylinja på telefon (feltene under hverandre, knappene i full
   bredde) står i 640.98-blokka under. */
@media (max-width: 1211.98px) {
    .timeliste-tittelsjafor[b-w9yclnmbtz] {
        display: inline;
    }

    /* I kortvisningen er overskriftsraden borte, så sorteringsknappene er
       heller ikke synlige — sorteringen settes her i stedet. margin: 0 som
       .timeliste-filter: mellom 641 og 1211 står de på én rad (align-items:
       flex-end), og form-felt sin margin-bottom løftet velgeren 16 px over
       sjåførvelgeren (målt 14.10). */
    .timeliste-sortvelger[b-w9yclnmbtz] {
        display: block;
        margin: 0;
    }

    /* Sjåføren står i kortoverskriften — cella ville gjentatt navnet rett
       under den. Den finnes fortsatt i markupen, for skjermleseren og for
       tabellsemantikken. */
    .timeliste-tabell tbody td.timeliste-sjaforcelle[b-w9yclnmbtz] {
        display: none;
    }

    /* Summen nederst står igjen som sitt eget kort. */
    .timeliste-tabell tfoot td.stablet-tittel[b-w9yclnmbtz] {
        font-size: 1rem;
    }
}

@media (max-width: 640.98px) {
    /* flex: 1 i kolonneretning ville strukket feltene i HØYDEN — målt 23.09
       som et tomt felt på ~180 px mellom sjåførvelgeren og sorteringen. */
    .timeliste-filter[b-w9yclnmbtz],
    .timeliste-sortvelger[b-w9yclnmbtz] {
        flex: 0 0 auto;
        margin: 0;
    }

    .timeliste-verktoy[b-w9yclnmbtz] {
        flex-direction: column;
        align-items: stretch;
    }

    .timeliste-knapper button[b-w9yclnmbtz] {
        flex: 1 1 auto;
    }
}

/* SJF-15d: låsemerket og «Lås opp» på én linje, som brytes på smal skjerm. */
.timeliste-laas[b-w9yclnmbtz] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    margin: var(--sp-2) 0;
}

.timeliste-laasopp[b-w9yclnmbtz] {
    min-height: 44px;
}

.timeliste-laashint[b-w9yclnmbtz] {
    margin: 0 0 var(--sp-2);
}
/* /Components/Pages/SjaforTimer.razor.rz.scp.css */
/* SJF-14: tabellen ruller sidelengs inne i rammen, aldri hele siden.
   Navnekolonnen er låst (sticky) så man ser hvem raden gjelder mens man
   ruller. Mønsteret er belegg-rutenettets (app.css, «Belegg / kjøreplan»). */
.timetabell-ramme[b-ct9f7odnsn] {
    overflow-x: auto;
    max-width: 100%;
    border: 1px solid var(--mod-kant);
    border-radius: 0.5rem;
    background: var(--mod-flate);
    -webkit-overflow-scrolling: touch;
}

.timetabell[b-ct9f7odnsn] {
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.85rem;
    font-variant-numeric: tabular-nums;
    width: max-content;
    min-width: 100%;
}

.timetabell th[b-ct9f7odnsn],
.timetabell td[b-ct9f7odnsn] {
    padding: 0;
    text-align: center;
    border-bottom: 1px solid var(--mod-kant);
    border-right: 1px solid var(--mod-kant);
    white-space: nowrap;
}

.timetabell thead th[b-ct9f7odnsn] {
    padding: var(--sp-1) 0;
    min-width: 2.6rem;
    font-weight: 600;
    background: var(--mod-bg);
}

.timetabell-ukedag[b-ct9f7odnsn] {
    display: block;
    font-weight: 400;
    font-size: 0.72rem;
    color: var(--mod-tekst-dus);
    text-transform: capitalize;
}

.timetabell .timetabell-navn[b-ct9f7odnsn] {
    position: sticky;
    left: 0;
    z-index: 1;
    min-width: 8rem;
    max-width: 11rem;
    padding: var(--sp-2) var(--sp-3);
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
    font-weight: 600;
    background: var(--mod-flate);
    border-right: 1px solid var(--mod-kant);
    box-shadow: 2px 0 3px rgba(16, 24, 40, 0.06);
}

.timetabell thead .timetabell-navn[b-ct9f7odnsn],
.timetabell tfoot .timetabell-navn[b-ct9f7odnsn] {
    background: var(--mod-bg);
}

.timetabell-celle[b-ct9f7odnsn] {
    display: block;
    width: 100%;
    min-width: 2.6rem;
    min-height: 44px;
    padding: 0 var(--sp-1);
    font: inherit;
    color: inherit;
    background: none;
    border: none;
    cursor: pointer;
}

/* SJF-15c: cella har et merke (rettet eller endret av sjåføren). Prikken er
   bare pynt for øyet — teksten står i title og aria-label, og i dagsvisningen
   cella åpner. */
.timetabell-celle[b-ct9f7odnsn] {
    position: relative;
}

.timetabell-prikk[b-ct9f7odnsn] {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--mod-gul-tekst);
}

.timetabell-celle:hover[b-ct9f7odnsn],
.timetabell-celle:focus-visible[b-ct9f7odnsn] {
    background: var(--mod-primar-tint);
}

.timetabell .timetabell-helg[b-ct9f7odnsn] {
    background: var(--mod-bg);
}

.timetabell .timetabell-idag[b-ct9f7odnsn] {
    /* UI-112: strek i firmafargen → -markor (≥ 3 : 1), aldri rå --mod-primar/--merkevarefarge. */
    box-shadow: inset 0 -2px 0 var(--mod-primar-markor);
}

.timetabell .timetabell-sum[b-ct9f7odnsn] {
    padding: var(--sp-2) var(--sp-3);
    font-weight: 600;
    background: var(--mod-bg);
}

.timetabell tfoot td[b-ct9f7odnsn],
.timetabell tfoot th[b-ct9f7odnsn] {
    padding: var(--sp-2) var(--sp-1);
    font-weight: 600;
    background: var(--mod-bg);
    border-bottom: none;
}
/* /Components/Pages/Tilbudsside.razor.rz.scp.css */
/* ABO-18: tilbudssiden er lang — den skal starte øverst, ikke sentreres
   loddrett i .tom-layout (samme grep som .partnerpanel). */
.tilbudsside[b-tkgd568pzr] {
    align-self: flex-start;
    width: 100%;
    max-width: 620px;
    padding: var(--sp-4) 0 var(--sp-6);
}
/* /Components/Pages/TilRegnskap.razor.rz.scp.css */
/* MRK-1 — den sammenslåtte regnskapssystem-linja øverst.

   Én linje er hele poenget: topplokket over ordrelista er alt for høyt fra
   før (UI-18), så seksjonen får mindre luft enn et vanlig .innstilling-kort
   når den bare bærer «Regnskapssystem: Fiken · Bytt». Er den utfoldet (ti
   kort), gjelder husets vanlige kortpolstring. */
.regnskapsvalg-kompakt[b-bi3ak9qjrb] {
    padding: var(--sp-3) var(--sp-4);
}

/* Flex, ikke inline-tekst: på 375 px skal navnet og «Bytt» bryte til hver sin
   linje i stedet for å skyve sida bredere. */
.regnskapsvalg-linje[b-bi3ak9qjrb] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    margin: 0;
}

/* Knappen står midt i en setning — den skal ikke bære med seg avstanden en
   frittstående tekstknapp har. */
.regnskapsvalg-linje button[b-bi3ak9qjrb] {
    padding: 0;
}

/* INT-8 — Gos egen sats ved hver produktkode i Koblinger. Navn og sats på én
   linje, forklaringen under; begge får bryte fritt, så 375 px ikke flyter over. */
.go-sats[b-bi3ak9qjrb] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1, 4px);
    overflow-wrap: anywhere;
}

/* Avviket er hele poenget med kolonnen — rødt og med ikon, ikke bare en
   nyanse. Samme farger som husets fare-merke. */
.go-sats-avvik[b-bi3ak9qjrb] {
    color: var(--mod-rod-tekst, #991b1b);
    font-weight: 600;
}

.go-sats-ukjent[b-bi3ak9qjrb] {
    color: var(--mod-gul-tekst, #92400e);
}

.go-sats-forklaring[b-bi3ak9qjrb] {
    display: block;
    margin-top: 2px;
    font-size: .85rem;
    color: var(--mod-tekst-dus, #5f6673);
    overflow-wrap: anywhere;
}

/* Tripletex-tabellen: dato og navn får bryte, så kolonnen ikke blir ≈190 px. */
.koblings-endret[b-bi3ak9qjrb] {
    white-space: normal;
}

/* Under 960 px blir .liste-tabell et kort med tre kolonner (app.css);
   merknadsfeltet får egen linje i stedet for kortets smale første kolonne. */
@media (max-width: 959.98px) {
    .koblings-merknad[b-bi3ak9qjrb] {
        grid-column: 1 / -1;
    }
}

/* PO-KOBL tillegg 4 (Remi 01.10.2026): én kompakt rad per sats for PowerOffice.
   Bred: [sats] [produkt, konto · sats, bompenger og ferje] [Endre], og det som
   foldes ut legger seg under midtkolonnen. Smal (375 px): sats og knapp på første
   linje, resten under — ingenting er bredere enn kortet. */
.koblingsrader[b-bi3ak9qjrb] {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid var(--mod-kant, #e5e7eb);
    border-radius: 12px;
    background: var(--mod-flate, #fff);
}

.koblingsrad[b-bi3ak9qjrb] {
    display: grid;
    grid-template-columns: 4rem minmax(0, 1fr) auto;
    grid-template-areas:
        "sats innhold knapp"
        ".    rediger rediger";
    align-items: start;
    gap: var(--sp-1, 4px) var(--sp-3, 12px);
    padding: var(--sp-3, 12px) var(--sp-4, 16px);
    min-width: 0;
}

.koblingsrad + .koblingsrad[b-bi3ak9qjrb] {
    border-top: 1px solid var(--mod-kant, #e5e7eb);
}

.koblingsrad-sats[b-bi3ak9qjrb] {
    grid-area: sats;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* PO-VEIVISER-B-M: koblet til Go står satsen med navn («Turer til utlandet (0 %)», som
   veiviserens steg 4) — 4rem rommer bare «12 %». Mobil stabler raden uansett (under). */
@media (min-width: 600px) {
    .koblingsrad:has(.koblingsrad-satsnavn)[b-bi3ak9qjrb] {
        grid-template-columns: 12rem minmax(0, 1fr) auto;
    }
}

.koblingsrad-innhold[b-bi3ak9qjrb] {
    grid-area: innhold;
    display: grid;
    gap: 2px;
    min-width: 0;
    overflow-wrap: anywhere;
}

.koblingsrad-innhold > .go-sats[b-bi3ak9qjrb] {
    font-weight: 600;
}

.koblingsrad-knapp[b-bi3ak9qjrb] {
    grid-area: knapp;
    margin: 0;
    width: auto;
    max-width: none;
    white-space: nowrap;
}

.koblingsrad-rediger[b-bi3ak9qjrb] {
    grid-area: rediger;
    display: grid;
    gap: var(--sp-1, 4px);
    min-width: 0;
    padding-top: var(--sp-2, 8px);
}

.koblingsrad-rediger > .search-input[b-bi3ak9qjrb] {
    width: 100%;
    max-width: 28rem;
    min-width: 0;
}

.koblingsrad-etikett[b-bi3ak9qjrb] {
    margin-top: var(--sp-2, 8px);
    font-size: .9rem;
    font-weight: 600;
}

.koblingsrad-endret[b-bi3ak9qjrb] {
    margin: var(--sp-1, 4px) 0 0;
    font-size: .8rem;
    color: var(--mod-tekst-dus, #5f6673);
}

.koblingsrad-ukoblet[b-bi3ak9qjrb] {
    color: var(--mod-tekst-dus, #5f6673);
}

/* Koblet: grønn hake ved satsen. */
.koblingsrad-koblet[b-bi3ak9qjrb] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1, 4px);
    color: var(--mod-gronn-tekst, #166534);
}

/* «Må kobles» / «Kan kobles nå, trengs først når satsen brukes». */
.koblingsgruppe-tittel[b-bi3ak9qjrb] {
    margin: var(--sp-4, 16px) 0 var(--sp-2, 8px);
    font-size: .9rem;
    font-weight: 600;
    color: var(--mod-tekst-dus, #5f6673);
}

.koblingsrad-innhold .status-merke[b-bi3ak9qjrb] {
    margin: 0;
}

/* PO-SATS: «Ikke i bruk nå» — en lagret kobling ingenting bruker. Nøytral, ikke en mangel. */
.status-merke.koblingsrad-ikke-i-bruk[b-bi3ak9qjrb] {
    background-color: var(--mod-flate-dus, #f1f5f9);
    color: var(--mod-tekst-dus, #5f6673);
    border: 1px solid var(--mod-kant, #e5e7eb);
    margin: 0 0 0 var(--sp-1, 4px);
}

/* PO-MIN: «Flere konti, bompenger eller andre satser» under satsene i bruk (koblet
   til Go). .rute-juster skjuler den native trekanten, og grå tekst alene ser ikke ut
   som noe som kan åpnes — samme pil som de lukkede priskategoriene (PRI-28). */
.koblinger-mer > summary[b-bi3ak9qjrb]::before {
    content: "▸";
    color: var(--mod-primar-markor);
    line-height: 1;
}

.koblinger-mer[open] > summary[b-bi3ak9qjrb]::before {
    content: "▾";
}

/* PO-FORSLAG i den kompakte raden: samme brikke som i velgeren. */
.koblingsrad-forslag[b-bi3ak9qjrb] {
    padding: 0 var(--sp-2, 8px);
    border-radius: 999px;
    background: var(--mod-primar-tint, #fff7ed);
    color: var(--mod-primar-mork, #9a3412);
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.6;
}

@media (max-width: 599.98px) {
    .koblingsrad[b-bi3ak9qjrb] {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "sats    knapp"
            "innhold innhold"
            "rediger rediger";
        padding: var(--sp-3, 12px);
    }
}

.go-sats-varsel[b-bi3ak9qjrb] {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-2, 8px);
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border-radius: 6px;
    background: var(--mod-rod-bg, #fee2e2);
    color: var(--mod-rod-tekst, #991b1b);
}

.go-produkter-tittel[b-bi3ak9qjrb] {
    margin: var(--sp-4, 16px) 0 var(--sp-1, 4px);
    font-size: 1rem;
}

/* PO-KOBL: «Alt er koblet» — samme form som avviksvarselet, i grønt. */
.go-ferdig-linje[b-bi3ak9qjrb] {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-2, 8px);
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border-radius: 6px;
    background: var(--mod-gronn-bg, #dcfce7);
    color: var(--mod-gronn-tekst, #166534);
    font-weight: 600;
}

/* PO-VEIVISER: «PowerOffice Go er ikke ferdig satt opp» + lenke til veiviseren. */
.po-oppsett-linje[b-bi3ak9qjrb] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 8px);
    margin: 0 0 var(--sp-3, 12px);
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border-radius: 6px;
    border: 1px solid var(--mod-gul-kant, #fcd34d);
    background: var(--mod-gul-bg, #fef9c3);
    color: var(--mod-gul-tekst, #854d0e);
}

.go-produktliste[b-bi3ak9qjrb] {
    list-style: none;
    margin: 0 0 var(--sp-3, 12px);
    padding: 0;
    display: grid;
    gap: var(--sp-2, 8px);
}

.go-produktliste li[b-bi3ak9qjrb] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0 var(--sp-2, 8px);
}

.go-produktliste li .go-sats-forklaring[b-bi3ak9qjrb] {
    flex-basis: 100%;
}

/* PO-KOBL (Remi 01.10.2026): «I PowerOffice Go» — produktet over kontoen og satsen. */
.go-sats-konto[b-bi3ak9qjrb] {
    display: block;
    font-size: .85rem;
    color: var(--mod-tekst-dus, #5f6673);
    font-variant-numeric: tabular-nums;
}

.go-sats-konto.go-sats-avvik[b-bi3ak9qjrb] {
    color: var(--mod-rod-tekst, #991b1b);
}

.go-produktliste li .go-sats-konto[b-bi3ak9qjrb] {
    flex-basis: 100%;
}

/* KND-58 / PO-KOBL: utleggsproduktet (bompenger og ferje) i satsens celle, under
   satsens produkt. Tomt er det vanlige: én dus linje med «Velg eget produkt». */
.utleggsvalg[b-bi3ak9qjrb] {
    display: grid;
    gap: var(--sp-1, 4px);
    margin-top: var(--sp-2, 8px);
    padding-top: var(--sp-2, 8px);
    border-top: 1px dashed var(--mod-kant, #e5e7eb);
    min-width: 0;
    /* Tabellcellene står på nowrap i huset (se .go-celle); linja må få bryte. */
    white-space: normal;
}

.utleggsvalg-linje[b-bi3ak9qjrb] {
    display: flex;
    flex-wrap: wrap;
    align-items: center; /* .btn-tekst er 48 px høy (UI-73) — teksten sentreres mot den */
    gap: 0 var(--sp-2, 8px);
    margin: 0;
    font-size: .9rem;
    color: var(--mod-tekst-dus, #5f6673);
}

.utleggsvalg-linje .btn-tekst[b-bi3ak9qjrb] {
    padding: 0;
}

/* Den kompakte raden: bompenger og ferje som én dus linje under produktet. */
.utleggsvalg-kompakt[b-bi3ak9qjrb] {
    margin-top: 0;
}

.utleggsvalg-linje .go-sats-konto[b-bi3ak9qjrb],
.utleggsvalg-linje .go-sats-forklaring[b-bi3ak9qjrb] {
    flex-basis: 100%;
}

.utleggsvalg-tittel[b-bi3ak9qjrb] {
    margin: 0;
    font-size: .9rem;
    font-weight: 600;
}

.utleggsvalg .search-input[b-bi3ak9qjrb] {
    width: 100%;
    min-width: 0;
}

.utleggsvalg .go-velger-hjelp[b-bi3ak9qjrb] {
    margin: 0;
    font-size: .85rem;
    color: var(--mod-tekst-dus, #5f6673);
}

/* INT-11: salgsordrestatusen under Koblinger — et fieldset for skjermlesere,
   uten nettleserens ramme. min-width: 0 hindrer at fieldset-ets standard
   min-content-bredde presser siden bredere enn 375 px. */
.salgsordrestatus[b-bi3ak9qjrb] {
    border: 0;
    padding: 0;
    margin: var(--sp-4) 0 0;
    min-width: 0;
}

.salgsordrestatus legend[b-bi3ak9qjrb] {
    font-weight: 600;
    padding: 0;
    margin-bottom: var(--sp-2);
}

/* UI-125: statuscella kan bære flere merker («Ikke sendt», «Kansellert», «Demo»).
   Cella bryter MELLOM merkene i stedet for å presse kolonnen bredere, og hvert
   merke holder seg på én linje (korte ett–to-ords-tekster, DESIGNSYSTEM.md 6.2). */
.celle-status[b-bi3ak9qjrb] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-1);
}

.celle-status .status-merke[b-bi3ak9qjrb] {
    white-space: nowrap;
}

/* UI-206: i kortet (under 1212 px) skal datoen alltid få plassen sin, og et langt
   merke bryte i stedet for å gå inn over den. Datoen holder min-content-bredden
   (td har ellers min-width: 0), merket får bryte inne i seg selv. Korte merker
   («Ikke sendt», «Demo») står fortsatt på én linje — de får plass. */
@media (max-width: 1211.98px) {
    .celle-dato[b-bi3ak9qjrb] {
        min-width: max-content;
    }

    .celle-status .status-merke[b-bi3ak9qjrb] {
        white-space: normal;
        border-radius: 12px;
    }
}
/* /Components/Pages/Timeregistrering/Deltakerkort.razor.rz.scp.css */
/* ================================================================
   Deltakerkortet (TIM-21). Arket selv (.ark-bakteppe/.ark-panel) kommer fra
   app.css: sentrert boks på bred skjerm, fullskjerm under 641 px.

   Etikett over verdi, én kolonne på smal skjerm og to på bred. Lange verdier
   brytes — en fritekstkolonne kan ha 1000 tegn, og kortet skal aldri rulle
   sidelengs.
   ================================================================ */

/* Bredere enn standardarket: to kolonner med etikett over verdi trenger plass. */
.tim-dk-panel[b-easj6fjyd9] {
    max-width: 760px;
}

.tim-dk-panel h2:focus[b-easj6fjyd9] {
    outline: none;
}

/* Trykkflaten til ✕ minst 44 × 44 px (designtråden). .btn-tekst gir høyden;
   bredden er ellers bare ikonet. */
.tim-dk-panel .ark-lukk[b-easj6fjyd9] {
    min-width: 44px;
    justify-content: center;
}

.tim-dk-del[b-easj6fjyd9] {
    margin: 0 0 var(--sp-4);
}

/* TIM-18: samme skille som i tabellen og kortlista — en tynn linje og en liten
   overskrift over tiltakets felt, og tiltakets svake bakgrunn. */
.tim-dk-tiltak[b-easj6fjyd9] {
    padding: var(--sp-3);
    border-top: 1px solid var(--mod-kant-sterk);
    background: var(--mod-bg);
    border-radius: 0 0 var(--mod-radius-liten, 6px) var(--mod-radius-liten, 6px);
}

.tim-dk-overskrift[b-easj6fjyd9] {
    margin: 0 0 var(--sp-2);
    font-size: .75rem;
    font-weight: 600;
    color: var(--mod-tekst-dus);
}

.tim-dk-verdier[b-easj6fjyd9] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--sp-3) var(--sp-4);
    margin: 0;
}

@media (min-width: 641px) {
    .tim-dk-verdier[b-easj6fjyd9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.tim-dk-linje[b-easj6fjyd9] {
    min-width: 0;
}

.tim-dk-linje dt[b-easj6fjyd9] {
    font-size: .75rem;
    font-weight: 600;
    color: var(--mod-tekst-dus);
}

.tim-dk-linje dd[b-easj6fjyd9] {
    margin: 0;
    overflow-wrap: anywhere;
    white-space: pre-line;
}

.tim-dk-tom[b-easj6fjyd9] {
    opacity: .35;
}

/* UI-77: husets .feilmelding har margin-top: -1rem for å henge rett under et
   skjemafelt (app.css, UI-1/MIG-9). Her står den ikke under et felt, men rett
   under navnet i arket — da ville -1rem dratt feilteksten opp i overskriften. */
.tim-dk-panel h2 + .feilmelding[b-easj6fjyd9] {
    margin-top: 0;
}
/* /Components/Pages/Timeregistrering/Deltakernotater.razor.rz.scp.css */
/* ================================================================
   Interne notater i deltakerkortet (TIM-5).

   EGEN .razor.css og ikke en blokk i Deltakerkort.razor.css: Blazors scopede
   CSS gjelder komponentens EGEN markup, så en regel skrevet hos forelderen
   ville ikke truffet noe her.

   Trykkflatene er ≥ 44 px (designtråden), og teksten beholder linjeskiftene
   sine med white-space: pre-wrap — aldri med <br>, som ville krevd at teksten
   ble satt som HTML.
   ================================================================ */

.tim-notater[b-sf738c5juk] {
    padding: var(--sp-3);
    border-top: 1px solid var(--mod-kant-sterk);
}

/* Kontrollen av TIM-5: seksjonen lånte `tim-dk-del` og `tim-dk-overskrift` fra
   Deltakerkort.razor.css. De traff aldri — scopet CSS gjelder forelderens egen
   markup. Samme verdier, skrevet her hvor de virker. */
.tim-notater[b-sf738c5juk] {
    margin: 0 0 var(--sp-4);
}

.tim-notat-overskrift[b-sf738c5juk] {
    margin: 0 0 var(--sp-2);
    font-size: .75rem;
    font-weight: 600;
    color: var(--mod-tekst-dus);
}

.tim-notat-nytt[b-sf738c5juk] {
    margin: 0 0 var(--sp-3);
}

.tim-notat-nytt textarea[b-sf738c5juk],
.tim-notat textarea[b-sf738c5juk] {
    /* Journalen skrives i avsnitt. Feltet skal vokse med teksten, men aldri
       rulle sidelengs — en linje som forsvinner ut til høyre er en linje
       veilederen ikke leser om igjen. */
    width: 100%;
    min-height: 88px;
    resize: vertical;
}

.tim-notatliste[b-sf738c5juk] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
}

.tim-notat[b-sf738c5juk] {
    padding: var(--sp-3);
    background: var(--mod-bg);
    border: 1px solid var(--mod-kant);
    border-radius: var(--mod-radius-liten, 6px);
    min-width: 0;
}

.tim-notat-hode[b-sf738c5juk] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-1) var(--sp-3);
    margin: 0 0 var(--sp-2);
    font-size: .75rem;
    color: var(--mod-tekst-dus);
}

.tim-notat-forfatter[b-sf738c5juk] {
    font-weight: 600;
}

.tim-notat-tekst[b-sf738c5juk] {
    /* ⛔ Linjeskiftene kommer HERFRA, ikke fra <br> i teksten: notatet bindes
       som ren tekst i Blazor, og skal aldri settes som HTML. */
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    margin: 0;
}

.tim-notat-knapper[b-sf738c5juk] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
    margin-top: var(--sp-2);
}

/* Designtråden: minst 44 × 44 px å treffe, også for tekstknappene. */
.tim-notat-knapper button[b-sf738c5juk],
.tim-notat-nytt button[b-sf738c5juk] {
    min-height: 44px;
}

.tim-notat-lagringstid[b-sf738c5juk] {
    margin-top: var(--sp-3);
}

/* UI-77: husets .feilmelding har margin-top: -1rem for å henge rett under et
   skjemafelt (app.css, UI-1/MIG-9). Her står den ikke under et felt, men rett
   under «Interne notater» — da ville -1rem dratt feilteksten opp i overskriften. */
.tim-notat-overskrift + .feilmelding[b-sf738c5juk] {
    margin-top: 0;
}
/* /Components/Pages/Timeregistrering/Kolonner.razor.rz.scp.css */
/* TIM-4a: kolonneoppsettet. Isolert stilark og ikke app.css — app.css er en
   delt fil andre tråder står i, og disse reglene gjelder bare her. Samme grep
   som Oppmote.razor.css og Steder.razor.css. */

/* --------------------------------------------------- eksemplene i tom tilstand

   En tom skjerm som bare sier «ingen kolonner» hjelper ingen. Eksemplene er
   kundens egne felt fra gamle NordicM, satt opp som en liste man kan kjenne
   igjen sin egen arbeidsdag i. */
.tim-eksempler[b-8z9plylexy] {
    margin: var(--sp-2) 0 0;
    padding-left: var(--sp-4);
}

.tim-eksempler li[b-8z9plylexy] {
    margin-bottom: var(--sp-1);
}

/* --------------------------------------------------- radene */

.tim-kolonnerad .ordre-rad-meta[b-8z9plylexy] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-1) var(--sp-3);
    align-items: center;
}

.tim-kolonnerad .btn-tekst[b-8z9plylexy] {
    /* Minst 44 px trykkflate, som resten av appen — pilene er små mål. */
    min-height: 44px;
    min-width: 44px;
}

/* En skjult kolonne skal se skjult ut, men fortsatt være lesbar: dempet, ikke
   usynlig. Den som leter etter «Finansiør» fra i fjor, skal finne den. */
.tim-skjult .ordre-rad-navn[b-8z9plylexy] {
    opacity: .6;
    font-style: italic;
}

/* --------------------------------------------------- «skjult»-merket

   Tekst i en pille, ikke en farget prikk: den som ikke ser forskjell på grå og
   blå skal kunne lese hva som er skjult. Samme form som merkene på
   oppmøtesiden. */
.tim-merke[b-8z9plylexy] {
    display: inline-block;
    margin-left: var(--sp-2);
    padding: 1px 8px;
    border-radius: 999px;
    border: 1px solid var(--mod-kant-sterk);
    font-size: .78rem;
    font-style: normal;
    line-height: 1.5;
    white-space: nowrap;
}

/* --------------------------------------------------- valgene i arket */

.tim-valgboks[b-8z9plylexy] {
    margin-top: var(--sp-4);
    padding-top: var(--sp-4);
    border-top: 1px solid var(--mod-kant);
}

.tim-valgboks .ordre-liste[b-8z9plylexy] {
    /* Tjue valg skal ikke skyve «Legg til» ut av arket — lista ruller for seg. */
    max-height: 45vh;
    overflow-y: auto;
}

/* UI-77: husets .feilmelding har margin-top: -1rem for å henge rett under et
   skjemafelt (app.css, UI-1/MIG-9). Her står den ikke under et felt, men under
   ingressen (sida og arket) eller under meldingskortet — -1rem ville dratt
   feilteksten opp i dem. */
.kontakt-ingress + .feilmelding[b-8z9plylexy],
.innstilling-kort + .feilmelding[b-8z9plylexy] {
    margin-top: 0;
}
/* /Components/Pages/Timeregistrering/Oppmote.razor.rz.scp.css */
/* TIM-3: Oppmøte-siden. Isolert stilark og ikke app.css — app.css er en delt
   fil andre tråder står i, og disse reglene gjelder bare her.

   Mobile-first: på 375 px er hver rad et kort man trykker på, ikke en tabell
   man ruller sidelengs i. */

/* --------------------------------------------------- fanene (TIM-6)

   «Dagens oppmøte» og «Rapport» side om side, rett under overskriften. To
   knapper og ikke en nedtrekksliste: valget er binært, og en liste med to
   verdier krever to trykk for å vise ett ord. */

.tim-faner[b-tkza07reg6] {
    display: flex;
    gap: var(--sp-2);
    flex-wrap: wrap;
    margin-bottom: var(--sp-4);
}

.tim-fane[b-tkza07reg6] {
    /* Samme trykkflate som resten av appen. */
    min-height: 44px;
    padding: var(--sp-2) var(--sp-4);
    border: 1px solid var(--mod-kant-sterk);
    border-radius: 8px;
    white-space: nowrap;
}

.tim-fane-valgt[b-tkza07reg6] {
    /* Ramme og vekt, ikke bare farge: valget skal være synlig også for den som
       ikke ser forskjell på grå og blå. */
    border-color: var(--mod-primar-markor);
    border-width: 2px;
    font-weight: 600;
}

/* --------------------------------------------------- datovelgeren */

.tim-datorad[b-tkza07reg6] {
    display: flex;
    align-items: flex-end;
    gap: var(--sp-2);
    flex-wrap: wrap;
}

.tim-datofelt[b-tkza07reg6] {
    /* Datofeltet tar plassen; pilene beholder sin. */
    flex: 1 1 160px;
    min-width: 0;
    margin: 0;
}

/* --------------------------------------------------- tallene

   «Møtt» og «Inne nå» hører sammen og leses i samme blikk. Standardoppsettet
   stablet dem i full bredde på 375 px, og da tok to tall en halv skjerm —
   arbeidsleder måtte rulle for å se den første raden. Side ved side er de
   fortsatt store nok, og lista begynner over skjermkanten. */
.tim-tallrad[b-tkza07reg6] {
    display: grid;
    /* auto-fit og ikke «2»: på en tidligere dato finnes bare «Møtt» («Inne nå»
       ville betydd «gikk uten å registrere seg ut», som er noe annet), og da
       skal det ene kortet fylle bredden i stedet for å stå halvt. */
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--sp-3);
    align-items: stretch;
}

/* --------------------------------------------------- radene */

.tim-oppmoterad[b-tkza07reg6] {
    /* Knappen under er hele raden; raden selv skal ikke legge på polstring
       oppå knappens egen. */
    padding: 0;
}

.tim-radknapp[b-tkza07reg6] {
    /* HELE raden er trykkflaten. Et lite «endre»-mål ved siden av navnet er
       vanskelig å treffe på 375 px, og det finnes ikke noe annet å gjøre med
       en rad her. */
    display: block;
    width: 100%;
    /* Minst 44 px høy, som resten av appens trykkflater. */
    min-height: 44px;
    padding: var(--sp-3);
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.tim-radknapp:hover:not(:disabled)[b-tkza07reg6] {
    background: var(--flate-hover, rgba(0, 0, 0, .03));
}

.tim-radknapp:disabled[b-tkza07reg6] {
    cursor: default;
}

.tim-radknapp .ordre-rad-navn[b-tkza07reg6] {
    display: block;
}

.tim-radknapp .ordre-rad-meta[b-tkza07reg6] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-1) var(--sp-3);
    align-items: center;
}

.tim-tid[b-tkza07reg6] {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

/* --------------------------------------------------- TIM-13: ulikt ut-sted

   Vises BARE når utsjekken skjedde et annet sted enn innsjekken — ellers står
   stedsnavnet alene, som før. Ingen pille og ingen farge: dette er ikke en
   advarsel, det er en opplysning, og pila bærer hele forskjellen. */

.tim-utsted-pil[b-tkza07reg6] {
    /* Pila er det eneste nye tegnet på rada. Litt luft rundt seg, og litt
       kraftigere enn resten av metateksten — den skal fanges opp i et blikk
       over 25 rader, uten å rope. */
    padding: 0 .15em;
    font-weight: 600;
}

/* --------------------------------------------------- merkene

   Tekst i en pille, ikke en farget prikk: «manuelt» skal kunne leses, også av
   den som ikke ser forskjell på grå og blå. */

.tim-merke[b-tkza07reg6] {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    border: 1px solid var(--mod-kant-sterk);
    font-size: .78rem;
    line-height: 1.5;
    white-space: nowrap;
}

.tim-merke-inne[b-tkza07reg6] {
    border-color: var(--mod-gronn-tekst);
    color: var(--mod-gronn-tekst);
}

/* --------------------------------------------------- deltakersøket i arket */

.tim-treffliste[b-tkza07reg6] {
    /* 20 treff skal ikke skyve knappene ut av arket — lista ruller for seg. */
    max-height: 40vh;
    overflow-y: auto;
    margin-bottom: var(--sp-3);
}

.tim-treffliste .ordre-rad[b-tkza07reg6] {
    padding: 0;
}

.tim-treffliste .btn-tekst[b-tkza07reg6] {
    display: block;
    width: 100%;
    min-height: 44px;
    text-align: left;
    padding: var(--sp-2) var(--sp-3);
}

/* --------------------------------------------------- «Fjern registreringen»

   Tydelig adskilt fra «Lagre», med én strek og ikke to: den er ikke en variant
   av å lagre, den er den eneste handlingen i arket som ikke kan angres. */
.tim-fjernboks[b-tkza07reg6] {
    margin-top: var(--sp-4);
    padding-top: var(--sp-4);
    border-top: 1px solid var(--mod-kant);
}

.tim-fjernboks .skjema-handlinger[b-tkza07reg6] {
    border-top: 0;
    padding-top: 0;
}

/* UI-77: husets .feilmelding har margin-top: -1rem for å henge rett under et
   skjemafelt (app.css, UI-1/MIG-9). Her står den ikke under et felt: i arkene
   står den under overskriften eller datolinja, og i fjernboksen er den første
   linje rett under skillestreken — -1rem ville dratt teksten opp i dem. */
.ark-panel h2 + .feilmelding[b-tkza07reg6],
.kontakt-ingress + .feilmelding[b-tkza07reg6],
.tim-fjernboks > .feilmelding:first-child[b-tkza07reg6] {
    margin-top: 0;
}
/* /Components/Pages/Timeregistrering/Oppmoterapport.razor.rz.scp.css */
/* TIM-6: oppmøterapporten. Isolert stilark og ikke app.css — app.css er en delt
   fil andre tråder står i kø for, og disse reglene gjelder bare her.

   Mobile-first: på 375 px er hver rad et kort med etiketter foran tallene, ikke
   en tabell man må rulle sidelengs i. Tabellformen slås PÅ over 700 px. */

/* --------------------------------------------------- perioden og filtrene */

.tim-rap-periode[b-dg9haezl0d],
.tim-rap-filtre[b-dg9haezl0d] {
    display: flex;
    gap: var(--sp-3);
    flex-wrap: wrap;
}

.tim-rap-periode .form-felt[b-dg9haezl0d],
.tim-rap-filtre .form-felt[b-dg9haezl0d] {
    /* Feltene deler bredden og brekker først når de ikke får plass. */
    flex: 1 1 160px;
    min-width: 0;
    margin: 0;
}

.tim-rap-hurtig[b-dg9haezl0d] {
    display: flex;
    gap: var(--sp-2);
    flex-wrap: wrap;
    margin-top: var(--sp-3);
    margin-bottom: var(--sp-3);
}

/* Alle knappene her er minst 44 px høye — samme trykkflate som resten av appen. */
.tim-rap-knapp[b-dg9haezl0d] {
    min-height: 44px;
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--mod-kant-sterk);
    border-radius: 8px;
    white-space: nowrap;
}

.tim-rap-valgt[b-dg9haezl0d] {
    border-color: var(--mod-primar-markor);
    font-weight: 600;
}

.tim-rap-regel[b-dg9haezl0d] {
    /* Regelen skal leses FØR tallene, ikke etter dem. */
    margin-top: var(--sp-3);
    margin-bottom: var(--sp-3);
}

/* --------------------------------------------------- summen øverst */

.tim-rap-tallrad[b-dg9haezl0d] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    gap: var(--sp-3);
    align-items: stretch;
    margin-bottom: var(--sp-4);
}

.tim-rap-tall[b-dg9haezl0d] {
    display: flex;
    flex-direction: column;
}

.tim-rap-verdi[b-dg9haezl0d] {
    font-size: 1.5rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.tim-rap-tekst[b-dg9haezl0d] {
    font-size: .85rem;
    opacity: .75;
}

.tim-rap-sorter[b-dg9haezl0d] {
    display: flex;
    gap: var(--sp-2);
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: var(--sp-3);
}

/* --------------------------------------------------- tabellen

   Under 700 px er hver rad et kort: cellene stables, og etiketten fra
   data-etikett står foran verdien. Da slipper en telefon vannrett rulling, og
   ingen tall står uten overskrift. */

.tim-rap-tabell[b-dg9haezl0d] {
    width: 100%;
    border-collapse: collapse;
}

.tim-rap-tabell thead[b-dg9haezl0d] {
    /* Overskriftsraden gir ingen mening når cellene er stablet — etikettene
       står på hver celle i stedet. */
    display: none;
}

.tim-rap-tabell tr[b-dg9haezl0d] {
    display: block;
    border: 1px solid var(--mod-kant);
    border-radius: 8px;
    padding: var(--sp-3);
    margin-bottom: var(--sp-3);
}

.tim-rap-tabell td[b-dg9haezl0d],
.tim-rap-tabell th[b-dg9haezl0d] {
    display: flex;
    justify-content: space-between;
    gap: var(--sp-3);
    padding: 2px 0;
    text-align: left;
    font-variant-numeric: tabular-nums;
}

.tim-rap-tabell td[b-dg9haezl0d]::before {
    content: attr(data-etikett);
    opacity: .75;
    font-variant-numeric: normal;
}

.tim-rap-navn[b-dg9haezl0d] {
    font-weight: 600;
}

.tim-rap-navn[b-dg9haezl0d]::before {
    /* Etiketten «Navn» står også foran navnet på kortet — uten den ville den
       første linja vært den eneste uten overskrift. Men den skal ikke være fet:
       det er navnet som er radens overskrift. */
    font-weight: 400;
}

.tim-rap-tabell tfoot tr[b-dg9haezl0d] {
    font-weight: 600;
    border-width: 2px;
}

.tim-rap-tabell tfoot td[colspan][b-dg9haezl0d] {
    display: none;
}

.tim-rap-nedlasting[b-dg9haezl0d] {
    display: flex;
    gap: var(--sp-3);
    align-items: center;
    flex-wrap: wrap;
    margin-top: var(--sp-3);
}

@media (min-width: 700px) {
    .tim-rap-tabellramme[b-dg9haezl0d] {
        /* Sikkerhetsnett: et langt navn skal rulle i rammen, ikke skyve sida. */
        overflow-x: auto;
    }

    .tim-rap-tabell thead[b-dg9haezl0d] {
        display: table-header-group;
    }

    .tim-rap-tabell tr[b-dg9haezl0d] {
        display: table-row;
        border: 0;
        border-bottom: 1px solid var(--mod-kant);
        border-radius: 0;
        padding: 0;
        margin: 0;
    }

    .tim-rap-tabell td[b-dg9haezl0d],
    .tim-rap-tabell th[b-dg9haezl0d] {
        display: table-cell;
        padding: var(--sp-2) var(--sp-3);
        vertical-align: top;
    }

    .tim-rap-tabell thead th[b-dg9haezl0d] {
        text-align: left;
        border-bottom: 2px solid var(--mod-kant-sterk);
        white-space: nowrap;
    }

    .tim-rap-tabell td[b-dg9haezl0d]::before {
        content: none;
    }

    .tim-rap-tabell tfoot tr[b-dg9haezl0d] {
        border-top: 2px solid var(--mod-kant-sterk);
        border-bottom: 0;
    }

    .tim-rap-tabell tfoot td[colspan][b-dg9haezl0d] {
        display: table-cell;
    }
}

/* UI-77: husets .feilmelding har margin-top: -1rem for å henge rett under et
   skjemafelt (app.css, UI-1/MIG-9). Her står den ikke under et felt, men under
   filterkortet — -1rem ville dratt feilteksten opp i kortets kant. */
.innstilling-kort + .feilmelding[b-dg9haezl0d] {
    margin-top: 0;
}
/* /Components/Pages/Timeregistrering/Oversikt.razor.rz.scp.css */
/* TIM-3: «Møtt i dag» er en LENKE, ikke bare et tall. Kortet skal se ut og
   oppføre seg som de to andre, men kunne trykkes — uten at lenkas standardstil
   (understreking, lenkefarge) river det ut av rekka. */

.tim-tall-lenke[b-un4qonu8pu] {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.tim-tall-lenke:hover[b-un4qonu8pu],
.tim-tall-lenke:focus-visible[b-un4qonu8pu] {
    /* Bare kanten svarer. Understreking her ville gjort tallet uleselig. */
    border-color: var(--mod-primar-markor);
    text-decoration: none;
    color: inherit;
}

/* ================================================================
   TIM-5: «Hvem kan se notater». Seksjonen står under lenkene, og skal skille
   seg fra dem uten å bli en ny «side» på forsiden — en tynn linje og litt
   luft holder.
   ================================================================ */

.tim-notattilgang[b-un4qonu8pu] {
    margin-top: var(--sp-5, 2rem);
    padding-top: var(--sp-4, 1.5rem);
    border-top: 1px solid var(--mod-kant-sterk);
}

/* Designtråden: hele raden er trykkflaten, og den er minst 44 px høy — en
   avkrysningsboks alene er 16 px og bommes på en telefon. */
.tim-notattilgang-valg[b-un4qonu8pu] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2, .5rem);
    min-height: 44px;
    cursor: pointer;
}

/* UI-77: husets .feilmelding har margin-top: -1rem for å henge rett under et
   skjemafelt (app.css, UI-1/MIG-9). Her står den ikke under et felt, men under
   forklaringen i «Hvem kan se notater» — -1rem ville dratt den opp i teksten. */
.tim-notattilgang .innstilling-hjelp + .feilmelding[b-un4qonu8pu] {
    margin-top: 0;
}
/* /Components/Pages/Timeregistrering/Rapport.razor.rz.scp.css */
/* TIM-4a: rapporten. Isolert stilark og ikke app.css — app.css er en delt fil
   andre tråder står i, og disse reglene gjelder bare her. Samme grep som
   Oppmote.razor.css.

   SKILLET GÅR VED 900 px, og det er ikke et tilfeldig tall: under det får en
   tabell med åtte faste kolonner pluss tiltakets egne ikke plass til å være en
   tabell i det hele tatt, og den blir en vannrett rulling uten holdepunkter.

   TIM-14: BARE ÉN VISNING TEGNES — nettleseren avgjør hvilken
   (timeregistrering-rapport.js). Radene og kortene er egne komponenter UTEN
   isolert CSS (et scope-attributt på hvert element i 2 000 celler koster), så
   reglene for innmaten deres står her under ::deep. */

/* --------------------------------------------------- verktøylinja */

.tim-verktoylinje[b-cz9glrlcj2] {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-3);
    flex-wrap: wrap;
}

.tim-sokfelt[b-cz9glrlcj2] {
    flex: 1 1 220px;
    min-width: 0;
    margin-bottom: 0;
}

.tim-kolonneknapp[b-cz9glrlcj2] {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
}

/* TIM-4c: nedtrekket «Visning» og handlingene ved siden av det. */
.tim-visningsblokk[b-cz9glrlcj2] {
    flex: 0 1 auto;
    min-width: 0;
}

.tim-visningsfelt[b-cz9glrlcj2] {
    width: 200px;
    max-width: 100%;
    margin-bottom: 0;
}

@media (max-width: 640px) {
    .tim-visningsblokk[b-cz9glrlcj2] {
        flex: 1 1 100%;
    }

    .tim-visningsfelt[b-cz9glrlcj2] {
        width: 100%;
    }
}

.tim-visningshandlinger[b-cz9glrlcj2] {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--sp-2);
}

.tim-endret[b-cz9glrlcj2] {
    margin: 0;
}

/* TIM-4c: kolonnearket — avkrysning til venstre, flyttepilene til høyre. */
.tim-kolonneliste[b-cz9glrlcj2] {
    margin: var(--sp-3) 0;
}

.tim-kolonnerad[b-cz9glrlcj2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2);
}

.tim-kolonneflytt[b-cz9glrlcj2] {
    display: inline-flex;
    gap: var(--sp-1);
}

.tim-kolonneflytt button[b-cz9glrlcj2] {
    min-width: 44px;
    min-height: 44px;
}

/* «Laster …» holder plassen til lista, så ingenting hopper når den kommer. */
.tim-laster[b-cz9glrlcj2] {
    min-height: 60vh;
}

/* --------------------------------------------------- statusfilteret

   Tre knapper, ikke et nedtrekk: de tre tallene skal kunne leses uten et klikk
   («Aktive 118 · Avsluttede 62 · Alle 180» er halve rapporten i seg selv). */

/* --------------------------------------------------- tabellen (≥ 900 px) */

.tim-tabellramme[b-cz9glrlcj2] {
    /* ⛔ Rullingen skjer HER, ikke på siden. En rapport med 40 kolonner
       skal ikke gjøre hele appen sidelengs-rullbar — menyen, overskriften
       og filterknappene skal stå stille mens tabellen flytter seg.

       TIM-20: rullefeltet lå før nederst i tabellen, under 50 rader og
       utenfor skjermen — ubrukelig. Rammen får nå en høyde som ender ved
       vinduets bunn, så rullefeltet (og siste kolonne) alltid er synlig
       uten å rulle siden. 23rem er anslått for DENNE siden: topprad
       (3.5rem, MainLayout) + overskrift + verktøylinje (kan bli to rader
       på smalere bred skjerm) + statusfilter + status-teksten over
       tabellen, med litt luft. Samme grep som Samtale.razor.css
       (16rem der — kortere fordi den siden mangler verktøylinje og
       filterrad). Sidens egen loddrette rulling er ikke fjernet: er
       vinduet lavere enn anslaget, ruller siden ned til pagineringen i
       stedet for at rammen krymper under gulvet. */
    max-height: calc(100dvh - 23rem);
    min-height: 320px;
    overflow: auto;
    border: 1px solid var(--mod-kant);
    border-radius: 8px;
}

/* ⛔ .tim-tabell er ikke bare denne klassen her — Feltgruppe.Cellestil skriver
   ut en egen <style> i Rapport.razor med samme selektor, og den stilen er
   GLOBAL (ikke CSS-isolert som denne fila). Ingen annen tabell i appen får
   bruke klassen tim-tabell — den ville arvet Cellestil sine regler. */
.tim-tabell[b-cz9glrlcj2] {
    border-collapse: separate;
    border-spacing: 0;
    width: max-content;
    min-width: 100%;
    font-size: .92rem;
}

.tim-tabell[b-cz9glrlcj2]  th,
.tim-tabell[b-cz9glrlcj2]  td {
    padding: var(--sp-2);
    border-bottom: 1px solid var(--mod-kant);
    text-align: left;
    vertical-align: top;
    white-space: nowrap;
}

.tim-tabell thead th[b-cz9glrlcj2] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--mod-flate);
    font-weight: 600;
}

/* Navnekolonnen står i ro. Uten den vet ingen hvem rad 30 gjelder når de har
   rullet til kolonne 30 — og det er nettopp der veilederen jobber. */
.tim-navnekolonne[b-cz9glrlcj2],
.tim-tabell[b-cz9glrlcj2]  tbody th {
    position: sticky;
    left: 0;
    z-index: 1;
    background: var(--mod-flate);
    font-weight: 600;
    /* Skyggen er kanten mot det som ruller under. En ren border forsvinner i
       det cellene glir forbi. */
    box-shadow: 1px 0 0 var(--mod-kant);
}

/* TIM-21: navnet åpner deltakerkortet. En <button> som ser ut som en lenke —
   i tabellen og i kortlista. Ingen klasse på knappen: posisjonen er nok, og en
   klasse ville vært et attributt til på hver rad over SignalR (TIM-19). */
.tim-tabell[b-cz9glrlcj2]  tbody th > button,
.tim-kortliste[b-cz9glrlcj2]  .ordre-rad-navn > button {
    padding: 0;
    border: 0;
    background: none;
    /* UI-112: tekst i firmafargen → -mork (≥ 4,5 : 1), aldri rå --mod-primar/--merkevarefarge. */
    color: var(--mod-primar-mork);
    font: inherit;
    text-align: left;
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
}

/* Trykkflaten minst 44 px høy (designtråden). I tabellen dekker knappen hele
   navnecellen — den negative margen spiser cellens egen luft, så raden blir
   44 px og ikke 60. I kortlista låner den luften over og under navnet. */
.tim-tabell[b-cz9glrlcj2]  tbody th > button {
    display: flex;
    align-items: center;
    width: calc(100% + 2 * var(--sp-2));
    min-height: 44px;
    margin: calc(-1 * var(--sp-2));
    padding: 0 var(--sp-2);
}

.tim-kortliste[b-cz9glrlcj2]  .ordre-rad-navn > button {
    min-height: 44px;
    margin: calc(-1 * var(--sp-2)) 0;
}

.tim-tabell[b-cz9glrlcj2]  tbody th > button:focus-visible,
.tim-kortliste[b-cz9glrlcj2]  .ordre-rad-navn > button:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.tim-tabell thead .tim-navnekolonne[b-cz9glrlcj2] {
    /* Hjørnet må ligge over BEGGE de klebrige aksene. */
    z-index: 3;
}

.tim-tabell[b-cz9glrlcj2]  .tim-rad-avsluttet > * {
    opacity: .72;
}

/* Skjermleseren trenger en overskrift over handlingskolonnen; øyet trenger den
   ikke, og ordet ville tatt bredde fra kolonnene som betyr noe. */
.tim-skjultetikett[b-cz9glrlcj2] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* --------------------------------------------------- skjemaets felt vs. tiltakets (TIM-18)

   Tiltakets kolonner er Avsluttet + tiltakets egne (Rapportfelt.Avsluttet /
   Kolonne is not null i Rapport.razor). Ingen ny farge: --mod-bg er den
   samme svake off-hviten siden allerede bruker som sidebakgrunn, og
   --mod-kant-sterk er den kraftigste av de to eksisterende kanttonene. Begge
   kommer fra tema-moderne.css, som er alltid aktiv (html.tema-moderne i
   App.razor) — appen har ingen egen mørk modus å skille fra.

   ⛔ TIM-19: bare OVERSKRIFTEN har klassene. Radcellene får det samme
   skillet fra én <style> i Rapport.razor (Feltgruppe.Cellestil), med
   kolonnens posisjon — en klasse per celle var ~80 KB over SignalR ved
   første visning. Endres fargene her, endres de der også. */

.tim-tabell thead th.tim-tiltaksfelt[b-cz9glrlcj2] {
    background: var(--mod-bg);
}

.tim-tabell thead th.tim-feltskille[b-cz9glrlcj2] {
    border-left: 2px solid var(--mod-kant-sterk);
}

/* Kolonnens gruppe: «Fra skjemaet» / «Tiltakets felt», i hver overskrift —
   billigere enn å regne ut sammenhengende blokker for en ekstra rad, og
   tåler at TIM-4c har blandet rekkefølgen. */
.tim-feltgruppe-etikett[b-cz9glrlcj2] {
    display: block;
    font-size: .68rem;
    font-weight: 400;
    white-space: nowrap;
    opacity: .6;
}

/* --------------------------------------------------- cellene

   Redigerbare celler er Avsluttet og tiltakets kolonner, men aldri den siste
   («Mer …»). TIM-19 fjernet klassen per celle (2 000 attributter over
   SignalR); TIM-22 fjernet i tillegg den faste posisjonen her (nth-child(n+8)
   antok Avsluttet alltid var 8. celle, men TIM-4c kan blande rekkefølgen).
   Paddingen for tiltakets celler ligger nå i Feltgruppe.Cellestil, samme
   rekker som skillet over. */

/* HELE cellen er trykkflaten, og den er en <button> — ikke en <div> med
   @onclick. Da kommer den med i tabulatorrekkefølgen av seg selv, og
   fredagsrunden kan gå på Tab + Enter uten at vi bygger en egen fokusmodell. */
.tim-tabell[b-cz9glrlcj2]  tbody td > button:not(.btn-tekst) {
    display: block;
    width: 100%;
    min-height: 40px;
    padding: var(--sp-2);
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: text;
}

.tim-tabell[b-cz9glrlcj2]  tbody td > button:not(.btn-tekst):hover {
    background: var(--flate-hover, rgba(0, 0, 0, .03));
}

.tim-tabell[b-cz9glrlcj2]  tbody td > button:not(.btn-tekst):focus-visible {
    outline: 2px solid currentColor;
    outline-offset: -2px;
}

/* Tom celle: en svak strek, ikke «—Velg—». En tabell full av oppfordringer er
   en tabell ingen ser mønstre i. */
[b-cz9glrlcj2] .tim-tom {
    opacity: .35;
}

[b-cz9glrlcj2] .tim-cellefelt {
    width: 100%;
    min-width: 140px;
    min-height: 40px;
    padding: var(--sp-1) var(--sp-2);
    border: 2px solid currentColor;
    border-radius: 4px;
    background: var(--mod-flate);
    color: inherit;
    font: inherit;
}

/* «Lagret» er et diskret merke, ikke et varsel: det skal kunne stå i tjue
   celler samtidig uten å rope. */
[b-cz9glrlcj2] .tim-lagret {
    display: block;
    padding: 0 var(--sp-2) var(--sp-1);
    font-size: .72rem;
    opacity: .6;
}

[b-cz9glrlcj2] .tim-cellefeil {
    display: block;
    padding: 0 var(--sp-2) var(--sp-1);
    font-size: .75rem;
    color: var(--mod-rod-tekst);
    white-space: normal;
    max-width: 220px;
}

/* Et skjult valg som står på en deltaker: kursiv, med «(skjult)» i teksten.
   Verdien er ikke feil — alternativet tilbys bare ikke lenger. */
[b-cz9glrlcj2] .tim-valg-skjult {
    font-style: italic;
    opacity: .75;
}

/* --------------------------------------------------- avkrysningslista */

[b-cz9glrlcj2] .tim-krysseliste {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

[b-cz9glrlcj2] .tim-kryss-ipanel {
    /* Panelet ligger inne i en celle og skal ikke sprenge radhøyden i tabellen
       når kolonnen har tjue finansiører. */
    max-height: 40vh;
    overflow-y: auto;
    padding: var(--sp-2);
    border: 2px solid currentColor;
    border-radius: 4px;
    background: var(--mod-flate);
    min-width: 200px;
    white-space: normal;
}

[b-cz9glrlcj2] .tim-kryss {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    min-height: 32px;
    cursor: pointer;
}

/* --------------------------------------------------- kortene (< 900 px) */

.tim-kortliste[b-cz9glrlcj2]  .tim-kortverdier {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: var(--sp-1) var(--sp-2);
    margin: var(--sp-2) 0;
    font-size: .9rem;
}

.tim-kortliste[b-cz9glrlcj2]  .tim-kortverdier dt {
    font-weight: 600;
}

.tim-kortliste[b-cz9glrlcj2]  .tim-kortverdier dd {
    margin: 0;
    overflow-wrap: anywhere;
}

/* TIM-18: tiltakets felt (Avsluttet + tiltakets kolonner) under en tynn linje,
   med en liten overskrift — samme skille som den svake bakgrunnen i tabellen. */
.tim-kortliste[b-cz9glrlcj2]  .tim-tiltaksoverskrift {
    margin: var(--sp-2) 0 0;
    padding-top: var(--sp-2);
    border-top: 1px solid var(--mod-kant);
    font-size: .75rem;
    font-weight: 600;
    opacity: .65;
}

.tim-kortliste[b-cz9glrlcj2]  .tim-kortverdier-tiltak {
    margin-top: var(--sp-1);
}

.tim-kortliste[b-cz9glrlcj2]  .tim-merke {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    border: 1px solid var(--mod-kant-sterk);
    font-size: .78rem;
    line-height: 1.5;
    white-space: nowrap;
}

/* --------------------------------------------------- sidefoten */

.tim-sidefot[b-cz9glrlcj2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
    margin-top: var(--sp-3);
    flex-wrap: wrap;
}

.tim-sidefot .btn-tekst[b-cz9glrlcj2] {
    min-height: 44px;
}

/* --------------------------------------------------- sortering og filter (TIM-4b)

   Overskriften er to knapper: navnet sorterer (stigende → synkende → av), den
   lille knappen åpner filteret. To knapper og ikke én meny, fordi sortering er
   det veilederen gjør oftest og skal være ett klikk. */

.tim-overskrift[b-cz9glrlcj2] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.tim-sortknapp[b-cz9glrlcj2] {
    padding: var(--sp-1) 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.tim-sortknapp:focus-visible[b-cz9glrlcj2],
.tim-filterknapp:focus-visible[b-cz9glrlcj2] {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.tim-pil[b-cz9glrlcj2] {
    font-size: .75em;
}

.tim-filterknapp[b-cz9glrlcj2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 4px;
    background: transparent;
    color: inherit;
    opacity: .45;
    cursor: pointer;
}

.tim-filterknapp:hover[b-cz9glrlcj2] {
    opacity: 1;
}

/* Et aktivt filter skal synes i overskriften også når brikkene er rullet bort. */
.tim-filterknapp-aktiv[b-cz9glrlcj2] {
    opacity: 1;
    border-color: currentColor;
}

.tim-filterverktoy[b-cz9glrlcj2] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    flex-wrap: wrap;
    margin-bottom: var(--sp-2);
}

/* Brikkene: ett aktivt filter hver, med ×. */
.tim-brikker[b-cz9glrlcj2] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    margin-bottom: var(--sp-2);
}

.tim-brikke[b-cz9glrlcj2] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    max-width: 100%;
    padding: 2px 4px 2px 12px;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: .85rem;
}

.tim-brikke > span[b-cz9glrlcj2] {
    overflow-wrap: anywhere;
}

.tim-brikke-info[b-cz9glrlcj2] {
    border-style: dashed;
}

.tim-brikke-x[b-cz9glrlcj2] {
    min-width: 32px;
    min-height: 32px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: inherit;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
}

.tim-merknad[b-cz9glrlcj2] {
    font-style: italic;
}

/* Arket */
.tim-filterfelt[b-cz9glrlcj2] {
    border-bottom: 1px solid var(--mod-kant);
    padding: var(--sp-2) 0;
}

.tim-filterfelt > summary[b-cz9glrlcj2] {
    min-height: 40px;
    display: flex;
    align-items: center;
    cursor: pointer;
    font-weight: 600;
}

.tim-filterredigering[b-cz9glrlcj2] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    padding: var(--sp-2) 0;
}

.tim-tomvalg[b-cz9glrlcj2] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
}

.tim-fratil[b-cz9glrlcj2] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sp-2);
}

.tim-fratil .form-felt[b-cz9glrlcj2] {
    margin-bottom: 0;
}

.tim-ugyldig[b-cz9glrlcj2] {
    border-color: var(--mod-rod-tekst);
    outline: 1px solid var(--mod-rod-tekst);
}

/* UI-77: husets .feilmelding har margin-top: -1rem for å henge rett under et
   skjemafelt (app.css, UI-1/MIG-9). Her står den ikke under et felt: i arkene
   står den under overskriften, ingressen eller hjelpeteksten, og i filteret
   under Fra/Til-paret, der .tim-fratil nuller feltenes bunnmarg (samme felle som
   .orgnr-rad i UI-1) — -1rem ville dratt teksten opp i det som står over. */
.ark-panel h2 + .feilmelding[b-cz9glrlcj2],
.ark-panel .kontakt-ingress + .feilmelding[b-cz9glrlcj2],
.ark-panel .innstilling-hjelp + .feilmelding[b-cz9glrlcj2],
.tim-fratil + .feilmelding[b-cz9glrlcj2] {
    margin-top: 0;
}
/* /Components/Pages/Timeregistrering/Registrering.razor.rz.scp.css */
/* ================================================================
   Den offentlige registreringssiden (TIM-2), TIM-23-tillegget: arket med
   taushetserklæringen.

   Arket selv (.ark-bakteppe/.ark-panel/.ark-lukk) kommer fra app.css —
   sentrert boks på bred skjerm, fullskjerm under 641 px, z-index 1700.
   Bare det som er SÆREGENT for erklæringen bor her.

   Mobil i stående format er normaltilfellet på denne siden, ikke et
   tilfelle vi også støtter: deltakeren står i gangen med sin egen telefon.
   Derfor er trykkflatene målt for tommelen, ikke for en mus.
   ================================================================ */

/* «Les taushetserklæringen» er nå en knapp der det før sto en lenke. Den
   skal SE ut som lenka gjorde — .tim-erklaeringslenke gir vekten og
   avstanden, .btn-tekst gir farge og understrek — men trykkflaten må være
   en knapps: 44 px høy, og ingen venstremarg som flytter teksten i forhold
   til lenkevarianten. */
.tim-erklaeringsknapp[b-mwlgh8vc99] {
    min-height: 44px;
    padding-left: 0;
    padding-right: 0;
    text-align: left;

    /* ⛔ Den MÅ se ut som en lenke, ikke som hjelpetekst. `.btn-tekst` gir dus
       grå (#6b7280) — og det svakeste på skjermen er nettopp ikke det den som
       skal LESE erklæringen før hen krysser av, skal lete etter. Fargen er
       firmaets egen (--mod-primar), som alle andre lenker i appen, og
       understreken sier at det er noe å trykke på. Samme grep som
       `.tomtilstand`-lenkene gjør mot samme klasse. */
    /* UI-112: tekst i firmafargen → -mork (≥ 4,5 : 1), aldri rå --mod-primar/--merkevarefarge. */
    color: var(--mod-primar-mork);
    font-size: 1rem;
    font-weight: inherit;
    text-decoration: underline;
}

.tim-erklaeringsknapp:hover[b-mwlgh8vc99],
.tim-erklaeringsknapp:focus[b-mwlgh8vc99] {
    color: var(--mod-primar-mork);
    text-decoration: underline;
}

/* ✕ i hjørnet: ikonet alene er 18 px, og en 18 px trykkflate er utenfor
   rekkevidde for en tommel. Samme mål som deltakerkortet bruker. */
.tim-arklukk[b-mwlgh8vc99] {
    min-width: 44px;
    min-height: 44px;
    justify-content: center;
}

/* Overskriften tar fokus når arket åpnes (tabindex="-1"). Uten dette ville
   den fått en fokusring et museklikk aldri ba om. */
.tim-taushetsark h2:focus[b-mwlgh8vc99] {
    outline: none;
}

/* ⛔ Selve erklæringen. pre-wrap er IKKE pynt: teksten er limt inn fra et
   dokument, og avsnittene i den finnes bare som linjeskift — uten dette
   blir hele erklæringen én vegg av tekst.

   overflow-wrap holder et langt ord eller en lang adresse inne i arket;
   erklæringen skal aldri kunne tvinge fram sidelengs rulling på 375 px. */
.tim-taushetstekst[b-mwlgh8vc99] {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    margin: 0 0 var(--sp-5);
    line-height: 1.6;
    color: var(--mod-tekst);
}

/* Knapperaden i skjemaet står med en skillelinje under seg (.skjema-handlinger
   i app.css) fordi det kommer et felt til etterpå. I arket er «Lukk» det
   siste som finnes, og linja ble en strek mot ingenting — med et hvitt felt
   under. Nøytraliseres her, ikke i app.css: streken er riktig alle de andre
   stedene klassen brukes. */
.tim-taushetsark .skjema-handlinger[b-mwlgh8vc99] {
    margin: 0;
    padding-bottom: 0;
    border-bottom: none;
}
/* /Components/Pages/Timeregistrering/Registreringsskjema.razor.rz.scp.css */
/* ================================================================
   Innstillingene for registreringsskjemaet (TIM-2), TIM-23-tillegget.

   Bare telleren under taushetsfeltet bor her. Alt annet på siden bruker
   .innstilling-* og .tim-* fra app.css, og skal fortsette med det —
   designtråden eier de klassene.
   ================================================================ */

/* Telleren er en opplysning, ikke en advarsel: samme duse grå som
   hjelpeteksten over, høyrestilt så den ikke leses som en ny setning i
   hjelpeteksten. */
.tim-tegnteller[b-z2o0zie5m8] {
    margin: var(--sp-1) 0 0;
    color: var(--mod-tekst-dus);
    font-size: 0.85rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Over grensa: samme røde som .tim-feltfeil, så telleren og feilmeldingen
   under sier det samme med samme farge. Fargen er ikke ALENE om å si det —
   feilmeldingen står i klartekst under når man prøver å lagre. */
.tim-tegnteller-over[b-z2o0zie5m8] {
    color: var(--mod-rod-tekst);
    font-weight: 600;
}
/* /Components/Pages/Timeregistrering/Resultatrapport.razor.rz.scp.css */
/* TIM-57 B: resultatrapporten klar til utskrift. Isolert stilark — app.css er en delt fil.

   Mobile-first: verktøylinja stabler på 375 px, dokumentet flyter i full bredde, og fra
   desktop står dokumentet som et A4-ark på skjermen. Dokumentet er et TRYKT dokument, ikke
   app-UI: nøktern typografi (Inter fra tokens), ingen kortskygge.

   Print: verktøylinja og feltrammene skjules; tiltakets fritekst står som tekst
   (.res-utskrift, white-space: pre-wrap). Tallgrunnlaget får egen side.

   Tallgrunnlaget er IKKE .tabell-stablet: A4 er smalere enn 923 px (UI-148), og da ville
   tabellen stablet seg som kort på papiret. Tre korte kolonner med brytbar tekst får plass
   på 375 px uten. */

/* NAVNGITT side, ikke en anonym @page: det isolerte stilarket lastes på alle sider, og en
   anonym @page ville endret utskriften av hele appen. Margboksene virker i Chrome/Edge
   (fra 131); andre nettlesere skriver ut uten sidetall, det er greit. */
@page resultatrapport {
    size: A4 portrait;
    margin: 18mm 18mm 20mm;

    @bottom-right {
        content: "Side " counter(page) " av " counter(pages);
        font-family: var(--mod-font);
        font-size: 9pt;
    }
}

.res-side[b-vzr6fmt7vj] {
    align-self: flex-start;
    width: 100%;
    max-width: 210mm;
    margin: 0 auto;
}

/* ------------------------------------------------------------ verktøylinja */

.res-verktoy[b-vzr6fmt7vj] {
    margin-bottom: var(--sp-5);
}

.res-tilbake[b-vzr6fmt7vj] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin-bottom: var(--sp-2);
}

.res-sidetittel[b-vzr6fmt7vj] {
    margin: 0 0 var(--sp-2);
}

.res-hurtigvalg[b-vzr6fmt7vj] {
    margin: var(--sp-3) 0 var(--sp-4);
}

.res-felter[b-vzr6fmt7vj] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
}

.res-felter .form-felt[b-vzr6fmt7vj] {
    flex: 1 1 160px;
    min-width: 0;
    margin: 0;
}

.res-felter .search-input[b-vzr6fmt7vj] {
    margin-bottom: 0;
}

/* Dato og år holder seg innenfor 200 px (designsystemet 6.6); nedtrekket får resten. */
.res-felter .form-felt:not(.res-kolonnefelt)[b-vzr6fmt7vj] {
    max-width: 200px;
}

.res-kolonnefelt[b-vzr6fmt7vj] {
    flex-basis: 220px;
}

.res-periodefeil[b-vzr6fmt7vj] {
    margin-top: var(--sp-3);
}

.res-varsel[b-vzr6fmt7vj] {
    margin-top: var(--sp-4);
}

.res-knapper[b-vzr6fmt7vj] {
    margin-top: var(--sp-4);
}

/* ------------------------------------------------------------ dokumentet */

.res-dokument[b-vzr6fmt7vj] {
    page: resultatrapport;
    font-family: var(--mod-font);
    color: var(--mod-tekst);
    background: var(--mod-flate);
    border: 1px solid var(--mod-kant);
    border-radius: var(--mod-radius-liten);
    padding: var(--sp-4);
    line-height: 1.5;
}

.res-dok-tittel[b-vzr6fmt7vj] {
    font-size: 1.25rem;
    font-weight: 600;
    margin: 0 0 var(--sp-2);
}

.res-dokument h3[b-vzr6fmt7vj] {
    font-size: 1rem;
    font-weight: 600;
    margin: var(--sp-5) 0 var(--sp-2);
    break-after: avoid;
}

.res-dokument p[b-vzr6fmt7vj] {
    margin: 0 0 var(--sp-2);
}

.res-andeler[b-vzr6fmt7vj] {
    margin: 0 0 var(--sp-3);
    padding-left: var(--sp-5);
}

.res-fritekstfelt[b-vzr6fmt7vj] {
    margin: var(--sp-2) 0 var(--sp-3);
}

.res-fritekstfelt label[b-vzr6fmt7vj] {
    display: block;
    font-weight: 600;
    font-size: var(--tekst-hjelp);
    margin-bottom: var(--sp-1);
}

.res-fritekstfelt textarea[b-vzr6fmt7vj] {
    width: 100%;
    max-width: none;
    min-height: 96px;
    resize: vertical;
    margin-bottom: 0;
}

.res-fritekstfelt input[b-vzr6fmt7vj] {
    width: 100%;
    max-width: 480px;
    margin-bottom: 0;
}

/* Speilet av fritekstfeltet — det som står på papiret. Skjult på skjermen, der feltet
   selv viser teksten. */
.res-utskrift[b-vzr6fmt7vj] {
    display: none;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.res-tallgrunnlag[b-vzr6fmt7vj] {
    margin-top: var(--sp-6);
}

.res-tabell[b-vzr6fmt7vj] {
    max-width: 560px;
}

.res-sum td[b-vzr6fmt7vj] {
    font-weight: 600;
}

@media (min-width: 768px) {
    .res-dokument[b-vzr6fmt7vj] {
        padding: 20mm 18mm;
    }
}

/* ------------------------------------------------------------ print */

@media print {
    /* .res-side foran: «.res-fritekstfelt label» (display: block) er mer spesifikk enn
       .res-skjerm alene, og etikettene ble stående på papiret (målt i PDF-en, TIM-57 B). */
    .res-verktoy[b-vzr6fmt7vj],
    .res-side .res-skjerm[b-vzr6fmt7vj] {
        display: none;
    }

    .res-utskrift[b-vzr6fmt7vj] {
        display: block;
    }

    .res-side[b-vzr6fmt7vj] {
        max-width: none;
    }

    /* Arket er papiret selv: ingen ramme, ingen luft utenpå margene i @page. */
    .res-dokument[b-vzr6fmt7vj] {
        border: none;
        border-radius: 0;
        padding: 0;
        font-size: 11pt;
    }

    .res-dok-tittel[b-vzr6fmt7vj] {
        font-size: 16pt;
    }

    .res-dokument h3[b-vzr6fmt7vj] {
        font-size: 12pt;
    }

    .res-tallgrunnlag[b-vzr6fmt7vj] {
        break-before: page;
        margin-top: 0;
    }

    .res-tabell tbody tr:hover[b-vzr6fmt7vj] {
        background: none;
    }

    .res-tabell tr[b-vzr6fmt7vj] {
        break-inside: avoid;
    }
}
/* /Components/Pages/Timeregistrering/Skanner.razor.rz.scp.css */
/* ================================================================
   Skanneren (TIM-3) — nettbrettet ved inngangen.

   ISOLERT STILARK (scoped CSS, bundlet inn i OrdresystemBuss.Web.styles.css)
   og ikke app.css. To grunner: denne flata har ingenting til felles med resten
   av appen — den er en kiosk, ikke en side — og app.css er en delt fil andre
   tråder står i.

   Skjermen skal leses på to meters avstand av noen i fart. Derfor store
   flater, store tall og ingenting å klikke feil på. Den skal virke både
   liggende og stående på et nettbrett, og på en gammel telefon (375×667) som
   nødløsning når nettbrettet er borte.
   ================================================================ */

.skanner[b-7kxixzvzij] {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: column;
    background: var(--mork-bg);
    color: var(--mork-tekst);
    /* Nettbrettet står i en gang. Ingenting her skal kunne markeres,
       dras eller langtrykkes fram til en kontekstmeny. */
    user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
    overflow: hidden;
}

/* ----------------------------------------------------- toppen */

.skanner-topp[b-7kxixzvzij] {
    flex: 0 0 auto;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 20px calc(12px + env(safe-area-inset-top, 0px));
    padding-top: calc(12px + env(safe-area-inset-top, 0px));
    background: var(--mork-flate);
}

.skanner-sted[b-7kxixzvzij] {
    font-size: clamp(18px, 3.2vw, 28px);
    font-weight: 600;
    /* Et langt stedsnavn skal ikke dytte klokka ut av skjermen. */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.skanner-klokke[b-7kxixzvzij] {
    font-size: clamp(22px, 4vw, 36px);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    flex: 0 0 auto;
}

/* ----------------------------------------------------- kamerabildet */

.skanner-flate[b-7kxixzvzij] {
    flex: 1 1 auto;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 0;
    background: var(--mork-bg);
}

.skanner-video[b-7kxixzvzij] {
    width: 100%;
    height: 100%;
    /* cover og ikke contain: bildet skal fylle flaten. QR-en leses fra
       midten uansett, og svarte felt på sidene ser ut som en feil. */
    object-fit: cover;
}

.skanner-ledetekst[b-7kxixzvzij] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 16px;
    margin: 0;
    text-align: center;
    font-size: clamp(16px, 2.6vw, 24px);
    /* Leselig mot et kamerabilde av hva som helst — en skygge holder
       teksten fra å forsvinne i et lyst rom. */
    text-shadow: 0 2px 6px rgba(0, 0, 0, .9);
}

.skanner-beskjed[b-7kxixzvzij] {
    position: absolute;
    left: 16px;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    margin: 0;
    padding: 20px;
    border-radius: 12px;
    background: var(--mork-flate);
    font-size: clamp(16px, 2.4vw, 22px);
    line-height: 1.5;
    text-align: center;
}

/* ----------------------------------------------------- bunnen */

.skanner-bunn[b-7kxixzvzij] {
    flex: 0 0 auto;
    display: flex;
    justify-content: center;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
    background: var(--mork-flate);
}

.skanner-knapp-liten[b-7kxixzvzij] {
    min-height: 44px;
    padding: 0 20px;
    border: 1px solid var(--mork-kant);
    border-radius: 8px;
    background: transparent;
    color: var(--mork-tekst-dus);
    font-size: 16px;
    cursor: pointer;
}

/* ----------------------------------------------------- TIM-61: PIN-tastaturet

   Står i stedet for kameraflaten til PIN-en er tastet. Feltet er appens felt
   (search-input, DESIGNSYSTEM 6.6) og knappen appens hovedknapp (btn-ny, 6.1);
   her settes bare størrelsen — nettbrettet står ved inngangen, og tallene skal
   kunne tastes uten å bøye seg ned. Ingen egne farger: teksten er kioskens. */

.skanner-pin[b-7kxixzvzij] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-height: 0;
    padding: 24px;
    background: var(--mork-bg);
}

.skanner-pin[hidden][b-7kxixzvzij],
.skanner-flate[hidden][b-7kxixzvzij],
.skanner-bunn[hidden][b-7kxixzvzij] {
    display: none;
}

.skanner-pinetikett[b-7kxixzvzij] {
    font-size: clamp(20px, 3.6vw, 32px);
    font-weight: 600;
}

/* Stort, sentrert og med luft mellom prikkene. Maks 320 px: et felt som er
   bredere enn seks siffer, ser ut som det vil ha noe annet enn en PIN. */
.skanner-pinfelt[b-7kxixzvzij] {
    width: 100%;
    max-width: 320px;
    height: 64px;
    margin-bottom: 0;
    font-size: 32px;
    letter-spacing: .3em;
    text-align: center;
    user-select: text;
    -webkit-user-select: text;
}

.skanner-pinknapp[b-7kxixzvzij] {
    width: 100%;
    max-width: 320px;
    height: 64px;
    font-size: 20px;
}

/* «Feil PIN-kode.» og «For mange forsøk …». Kioskens tekstfarge på kioskens
   flate, som beskjeden om kameraet over — ingen rød kant, ingen ny farge
   (DESIGNSYSTEM: farget kant er aldri status). role="alert" i markupen gjør at
   den leses opp. */
.skanner-pinmelding[b-7kxixzvzij] {
    margin: 0;
    padding: 12px 20px;
    border-radius: 12px;
    background: var(--mork-flate);
    font-size: clamp(18px, 3vw, 24px);
    font-weight: 600;
    text-align: center;
}

.skanner-pinmelding[hidden][b-7kxixzvzij] {
    display: none;
}

/* ----------------------------------------------------- svarskjermen

   Dekker HELE flaten, også toppen og bunnen: den som står foran skjermen skal
   ikke måtte lete etter svaret. Hver tilstand har farge OG ikon OG tekst —
   aldri farge alene (ikonet står i teksten, satt av skriptet). */

.skanner-svar[b-7kxixzvzij] {
    position: absolute;
    inset: 0;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 24px;
    text-align: center;
    background: var(--mork-flate-hover);
    color: var(--mork-tekst);
}

.skanner-svar[hidden][b-7kxixzvzij] {
    display: none;
}

/* Ikonet. En ASCII-bokstav («✓», «i», «!») i en sirkel CSS tegner — se
   kommentaren i Skanner.razor: et Unicode-symbol i teksten falt tilbake til en
   naken bokstav og gjorde overskriften til «i Du er registrert inn kl. 08:40».
   Formen kommer fra sirkelen, ikke fra fonten, og kan derfor ikke forsvinne. */
.skanner-ikon[b-7kxixzvzij] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(56px, 10vw, 104px);
    height: clamp(56px, 10vw, 104px);
    border-radius: 50%;
    border: 4px solid currentColor;
    font-size: clamp(30px, 5.5vw, 58px);
    font-weight: 600;
    line-height: 1;
    /* «i» og «!» sitter litt høyt i en sirkel; en hårfin nedjustering gjør at
       tegnet står i midten slik ✓ gjør. */
    padding-bottom: .06em;
    flex: 0 0 auto;
}

.skanner-ikon:empty[b-7kxixzvzij] {
    display: none;
}

.skanner-svartittel[b-7kxixzvzij] {
    margin: 0;
    font-size: clamp(28px, 6vw, 64px);
    font-weight: 600;
    line-height: 1.15;
}

.skanner-svartekst[b-7kxixzvzij] {
    margin: 0;
    font-size: clamp(18px, 3.2vw, 32px);
    line-height: 1.4;
}

.skanner-svartekst:empty[b-7kxixzvzij] {
    display: none;
}

/* Grønn: registrert inn / registrert ut. Kontrasten mot hvit tekst er
   over 4,5:1 på begge. */
.skanner-svar-inn[b-7kxixzvzij],
.skanner-svar-ut[b-7kxixzvzij] {
    background: var(--mod-gronn-tekst);
}

/* Blå: du er alt registrert — ingenting er endret. Bevisst IKKE gul eller
   rød: dette er ikke en feil, og en skjerm som roper når alt er i orden
   lærer folk å overse den. */
.skanner-svar-inne[b-7kxixzvzij],
.skanner-svar-ferdig[b-7kxixzvzij] {
    background: var(--mod-bla-tekst);
}

/* Rød: koden ble ikke gjenkjent, eller vi fikk ikke kontakt. */
.skanner-svar-feil[b-7kxixzvzij] {
    background: var(--mod-rod-tekst);
}

/* ----------------------------------------------------- knappene i svaret */

.skanner-svarknapper[b-7kxixzvzij] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    width: 100%;
    max-width: 640px;
}

.skanner-svarknapper[hidden][b-7kxixzvzij] {
    display: none;
}

.skanner-knapp[b-7kxixzvzij] {
    /* Kravet er minst 64 px. De trykkes i fart, av noen med hansker på. */
    min-height: 72px;
    flex: 1 1 220px;
    padding: 0 24px;
    border: 0;
    border-radius: 12px;
    font-size: clamp(18px, 2.6vw, 26px);
    font-weight: 600;
    cursor: pointer;
}

.skanner-knapp-ut[b-7kxixzvzij] {
    background: var(--mork-tekst);
    color: var(--mork-bg);
}

.skanner-knapp-avbryt[b-7kxixzvzij] {
    background: transparent;
    color: var(--mork-tekst);
    border: 2px solid var(--mork-tekst);
}

/* ----------------------------------------------------- stående nettbrett
   og gammel telefon (375×667)

   I stående format er det høyden som er knapp, ikke bredden: toppen og bunnen
   krymper så kamerabildet beholder mest mulig plass. */
@media (max-height: 700px) {
    .skanner-topp[b-7kxixzvzij] {
        padding-top: calc(8px + env(safe-area-inset-top, 0px));
        padding-bottom: 8px;
    }

    .skanner-bunn[b-7kxixzvzij] {
        padding-top: 6px;
        padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px));
    }

    .skanner-knapp[b-7kxixzvzij] {
        min-height: 64px;
    }
}
/* /Components/Pages/Timeregistrering/Steder.razor.rz.scp.css */
/* TIM-3: skannerlenka under hvert aktive sted. Isolert stilark og ikke
   app.css — app.css er en delt fil andre tråder står i, og dette er tre regler
   som bare gjelder her. */

.tim-skannerlenke[b-qrcl5vx91o] {
    /* Lenka hører til stedet over, men er en egen sak — en tynn strek er nok
       til at raden ikke leses som én lang setning. */
    margin-top: var(--sp-3);
    padding-top: var(--sp-3);
    border-top: 1px solid var(--mod-kant);
    /* Raden er en grid i ordre-liste; lenka skal ha hele bredden under. */
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
}

.tim-skannerlenke .innstilling-hjelp[b-qrcl5vx91o] {
    margin: 0 0 var(--sp-2);
}

.tim-skannerlenke .tim-lenke[b-qrcl5vx91o] {
    /* En 55 tegn lang adresse skal brytes, ikke skyve siden sidelengs på
       375 px. */
    overflow-wrap: anywhere;
    word-break: break-all;
    margin: 0 0 var(--sp-2);
}
/* /Components/Pages/Undersokelse/Detaljer.razor.rz.scp.css */
/* UND-2: én undersøkelse. Isolert stilark, ikke app.css — app.css er en delt
   fil andre tråder står i, og dette gjelder bare her. */

.und-tilbake[b-kkfkn9jae7] {
    margin: 0 0 var(--sp-2, 8px);
}

.und-tittel[b-kkfkn9jae7] {
    overflow-wrap: anywhere;
}

/* Lenka er 40–60 tegn uten mellomrom; den skal brytes, ikke skyve siden
   sidelengs på 375 px. */
.und-lenke[b-kkfkn9jae7] {
    overflow-wrap: anywhere;
    word-break: break-all;
    margin: 0 0 var(--sp-2, 8px);
}

/* UND-11: QR-koden til lenka. Bakgrunnen er HVIT uansett tema — en QR på en
   farget eller mørk flate leses dårligere av kameraet, så kontrasten er en
   funksjonell egenskap, ikke en designpreferanse (som .tim-qr). Skrevet som
   navnet «white», ikke hex: det er den ene fargen her som ikke skal følge
   tokens. Luft rundt = stille sone utover den QRCoder alt tegner. */
.und-qr[b-kkfkn9jae7] {
    display: inline-block;
    padding: var(--sp-2, 8px);
    margin: 0 0 var(--sp-3, 12px);
    background-color: white;
    border: 1px solid var(--mod-kant);
    border-radius: var(--mod-radius-liten, 8px);
}

.und-qr img[b-kkfkn9jae7] {
    display: block;
    width: 160px;
    height: 160px;
}

/* ---- Spørsmålene -------------------------------------------------------- */

.und-sporsmalsliste[b-kkfkn9jae7] {
    list-style: decimal;
    padding-left: 1.4rem;
    margin: var(--sp-3, 12px) 0 0;
}

.und-sporsmal[b-kkfkn9jae7] {
    padding: var(--sp-3, 12px) 0;
    border-bottom: 1px solid var(--mod-kant);
}

.und-sporsmal:last-child[b-kkfkn9jae7] {
    border-bottom: 0;
}

/* UND-28: skillet foran spørsmålet som åpner et steg — overskrift i lista, ikke en ny rad
   (en egen <li> ville forskjøvet nummereringen). */
/* Skillet står over spørsmålet, utenfor flyten: listenummeret skal stå ved spørsmålsteksten,
   ikke ved «Steg 2 av 3». */
.und-har-stegskille[b-kkfkn9jae7] {
    position: relative;
    padding-top: calc(var(--sp-3, 12px) + 2rem);
}

.und-stegskille[b-kkfkn9jae7] {
    position: absolute;
    top: var(--sp-3, 12px);
    left: -1.4rem;
    right: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--sp-1, 4px) var(--sp-3, 12px);
    margin-bottom: var(--sp-2, 8px);
    color: var(--mod-tekst-dus);
    font-size: 0.9rem;
    font-weight: 600;
}

.und-stegskille .btn-tekst[b-kkfkn9jae7] {
    padding-left: 0;
    padding-right: 0;
    font-weight: 400;
}

.und-starter-steg[b-kkfkn9jae7] {
    border-top: 2px solid var(--mod-kant-sterk);
}

.und-sporsmalstekst[b-kkfkn9jae7] {
    font-weight: 600;
    overflow-wrap: anywhere;
}

.und-sporsmalsmeta[b-kkfkn9jae7] {
    color: var(--mod-tekst-dus);
    font-size: 0.9rem;
    margin-top: 2px;
}

.und-sporsmalsknapper[b-kkfkn9jae7] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-1, 4px) var(--sp-3, 12px);
    margin-top: var(--sp-2, 8px);
}

.und-sporsmalsknapper .btn-tekst[b-kkfkn9jae7] {
    padding-left: 0;
    padding-right: 0;
}

.und-fjern[b-kkfkn9jae7] {
    color: var(--mod-rod-tekst);
}

.und-nytt[b-kkfkn9jae7] {
    margin-top: var(--sp-5, 20px);
    padding-top: var(--sp-4, 16px);
    border-top: 1px solid var(--mod-kant);
}

.und-nytt h3[b-kkfkn9jae7] {
    font-size: 1rem;
    margin: 0 0 var(--sp-3, 12px);
}

.und-visningsvalg[b-kkfkn9jae7] {
    border: 0;
    padding: 0;
    margin: var(--sp-3, 12px) 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2, 8px) var(--sp-5, 20px);
    align-items: center;
}

/* UND-13: samme størrelse som etiketten «Spørsmål» over (temaets .form-felt label, 0.875rem) —
   uten den arvet legend-en Bootstraps store legend-skrift, og «Type» så ut som en overskrift. */
.und-visningsvalg legend[b-kkfkn9jae7] {
    font-size: 0.875rem;
    font-weight: 600;
    padding: 0;
    margin-bottom: var(--sp-2, 8px);
    width: 100%;
}

.und-visningsvalg label[b-kkfkn9jae7] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2, 8px);
    min-height: 44px;
    cursor: pointer;
}

/* UND-15: typevalget har seks typer. Mobile-first stables de én per linje (DESIGNSYSTEM 6.6:
   radio med hele etiketten som trykkflate); fra bred skjerm står de på rad som før. */
.und-typevalg[b-kkfkn9jae7] {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
}

@media (min-width: 641px) {
    .und-typevalg[b-kkfkn9jae7] {
        flex-direction: row;
        align-items: center;
        gap: var(--sp-2, 8px) var(--sp-5, 20px);
    }
}

.und-skjult[b-kkfkn9jae7] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ---- Resultatene: stolper i en liste, ikke en tabell -------------------- */

.und-resultat[b-kkfkn9jae7] {
    margin-top: var(--sp-4, 16px);
    padding-top: var(--sp-4, 16px);
    border-top: 1px solid var(--mod-kant);
}

.und-resultat h3[b-kkfkn9jae7] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 var(--sp-1, 4px);
    overflow-wrap: anywhere;
}

.und-snitt[b-kkfkn9jae7] {
    margin: 0 0 var(--sp-2, 8px);
}

.und-snitt strong[b-kkfkn9jae7] {
    font-size: 1.25rem;
}

.und-fordeling[b-kkfkn9jae7] {
    list-style: none;
    padding: 0;
    margin: 0;
    max-width: 480px;
}

.und-fordeling li[b-kkfkn9jae7] {
    display: grid;
    grid-template-columns: 1.25rem 1fr 2.5rem;
    align-items: center;
    gap: var(--sp-2, 8px);
    padding: 2px 0;
}

.und-verdi[b-kkfkn9jae7] {
    color: var(--mod-tekst-dus);
    text-align: right;
}

.und-stolpe[b-kkfkn9jae7] {
    display: block;
    height: 12px;
    background: var(--mod-bg);
    border-radius: 6px;
    overflow: hidden;
}

.und-stolpe span[b-kkfkn9jae7] {
    display: block;
    height: 100%;
    background: var(--merkevarefarge, var(--mod-primar));
    border-radius: 6px;
}

.und-antall[b-kkfkn9jae7] {
    color: var(--mod-tekst-dus);
    font-variant-numeric: tabular-nums;
}

/* ---- UND-12: «Velg én» ------------------------------------------------------ */

/* Alternativene kort under spørsmålsteksten i lista — dus, som metalinja. */
.und-alternativliste[b-kkfkn9jae7] {
    list-style: disc;
    padding-left: 1.2rem;
    margin: var(--sp-1, 4px) 0 0;
    color: var(--mod-tekst-dus);
    font-size: 0.9rem;
}

.und-alternativliste li[b-kkfkn9jae7] {
    overflow-wrap: anywhere;
}

.und-alternativfelt[b-kkfkn9jae7] {
    margin-top: var(--sp-3, 12px);
}

.und-alternativfelt textarea[b-kkfkn9jae7] {
    min-height: 96px;
    resize: vertical;
}

/* Fordelingen per alternativ: navnet og antallet på én linje, stolpen under —
   alternativene kan være lange, og skal ikke presse stolpen smal på 375 px. */
.und-valgfordeling li[b-kkfkn9jae7] {
    grid-template-columns: 1fr auto;
    row-gap: var(--sp-1, 4px);
    padding: var(--sp-1, 4px) 0;
}

.und-valgnavn[b-kkfkn9jae7] {
    overflow-wrap: anywhere;
}

.und-valgfordeling .und-antall[b-kkfkn9jae7] {
    text-align: right;
    white-space: nowrap;
}

.und-valgfordeling .und-stolpe[b-kkfkn9jae7] {
    grid-column: 1 / -1;
}

/* UND-16: tekstsvarene på et «Kort tekst»-spørsmål — en enkel liste, ett svar per rad. */
.und-tekstsvar[b-kkfkn9jae7] {
    margin: 0;
    padding-left: var(--sp-4, 16px);
    max-width: 480px;
}

.und-tekstsvar li[b-kkfkn9jae7] {
    padding: 2px 0;
    overflow-wrap: anywhere;
    /* UND-18: linjeskiftene i en lang tekst vises; mellomrom slås sammen som ellers. */
    white-space: pre-line;
}

/* UND-31: for den som kan endre — teksten til venstre, «Skjul»/«Vis igjen» til høyre, én rad per svar. */
.und-tekstsvar-rader[b-kkfkn9jae7] {
    padding-left: 0;
    list-style: none;
}

.und-tekstsvar-rader li[b-kkfkn9jae7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3, 12px);
    border-bottom: 1px solid var(--mod-kant);
}

.und-tekstsvar-rader li:last-child[b-kkfkn9jae7] {
    border-bottom: 0;
}

.und-tekstsvar-tekst[b-kkfkn9jae7] {
    min-width: 0;
}

.und-tekstsvar-rader .btn-tekst[b-kkfkn9jae7] {
    flex-shrink: 0;
    white-space: nowrap;
}

.und-skjulte[b-kkfkn9jae7] {
    margin-top: var(--sp-3, 12px);
    max-width: 480px;
}

.und-skjulte summary[b-kkfkn9jae7] {
    cursor: pointer;
    font-weight: 600;
}
/* /Components/Pages/Undersokelse/RingMeg.razor.rz.scp.css */
/* UND-5: «ring meg»-skjemaet. Isolert stilark (scoped), ikke app.css — app.css er
   en delt fil andre tråder står i. Klassene er kopiert fra Svarside.razor.css,
   fordi scoped CSS ikke deles mellom komponenter: de to sidene skal se like ut.
   Endrer du kortet, logoen eller den store knappen der, gjør det samme her.

   Mobil 375 px er hovedskjermen. .tom-layout sentrerer; kortet fyller bredden
   opp til 560 px, som svarsida. */

.und-side[b-ntl0mlyuva] {
    width: 100%;
    max-width: 560px;
}

.und-kort[b-ntl0mlyuva] {
    background: var(--mod-flate);
    border: 1px solid var(--mod-kant);
    border-radius: 0.75rem;
    box-shadow: 0 4px 16px rgba(16, 24, 40, 0.08);
    padding: var(--sp-5, 20px) var(--sp-4, 16px);
}

.und-kort h1[b-ntl0mlyuva] {
    font-size: 1.35rem;
    line-height: 1.3;
    margin: 0 0 var(--sp-2, 8px);
    overflow-wrap: anywhere;
}

.und-navn[b-ntl0mlyuva] {
    color: var(--mod-tekst-dus);
    margin: 0 0 var(--sp-2, 8px);
    overflow-wrap: anywhere;
}

.und-ingress[b-ntl0mlyuva] {
    color: var(--mod-tekst-dus);
    margin: 0 0 var(--sp-5, 20px);
    line-height: 1.45;
}

.und-takk[b-ntl0mlyuva] {
    text-align: center;
}

.und-takk h1[b-ntl0mlyuva] {
    margin-bottom: 0;
}

/* ---- Feltene: etikett 600 over feltet, full bredde (DESIGNSYSTEM 6.6) ---- */

.und-felt[b-ntl0mlyuva] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1, 4px);
    margin: 0 0 var(--sp-4, 16px);
}

.und-felt label[b-ntl0mlyuva] {
    font-weight: 600;
}

.und-felt .search-input[b-ntl0mlyuva] {
    width: 100%;
    max-width: none;
    min-height: 48px;
    box-sizing: border-box;
    font-size: 1rem; /* 16 px: iOS zoomer ikke inn ved fokus */
}

.und-valgfritt[b-ntl0mlyuva] {
    font-weight: 400;
    color: var(--mod-tekst-dus);
    font-size: 0.9rem;
}

.und-feiltekst[b-ntl0mlyuva] {
    color: var(--mod-rod-tekst);
    margin: var(--sp-1, 4px) 0 0;
    font-size: 0.95rem;
}

.und-skjemafeil[b-ntl0mlyuva] {
    margin: 0 0 var(--sp-4, 16px);
}

/* ---- Logo, knapp og undersøkelsens farge -------------------------------- */

.und-logo[b-ntl0mlyuva] {
    display: flex;
    justify-content: center;
    margin: 0 0 var(--sp-4, 16px);
}

.und-logo img[b-ntl0mlyuva] {
    max-width: 200px;
    max-height: 72px;
    object-fit: contain;
}

.und-stor-knapp[b-ntl0mlyuva] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: none;
    min-height: 48px;
    margin-top: var(--sp-2, 8px);
    font-size: 1.05rem;
    text-align: center;
}

/* Toppstripa i undersøkelsens farge — bare når den har en (eller firmaet har
   en). Uten: plattformens utseende. */
.und-preget .und-kort[b-ntl0mlyuva] {
    border-top: 4px solid var(--mod-primar-markor);
}
/* /Components/Pages/Undersokelse/Svarside.razor.rz.scp.css */
/* UND-2: den offentlige svarsida. Isolert stilark, ikke app.css — app.css er
   en delt fil andre tråder står i, og dette gjelder bare her.

   Mobil 375 px er hovedskjermen. .tom-layout sentrerer; kortet fyller bredden
   opp til 560 px, som de andre offentlige skjemaene (.kontakt-side). */

.und-side[b-sypm8ib7xm] {
    width: 100%;
    max-width: 560px;
}

.und-kort[b-sypm8ib7xm] {
    background: var(--mod-flate);
    border: 1px solid var(--mod-kant);
    border-radius: 0.75rem;
    box-shadow: 0 4px 16px rgba(16, 24, 40, 0.08);
    padding: var(--sp-5, 20px) var(--sp-4, 16px);
}

.und-kort h1[b-sypm8ib7xm] {
    font-size: 1.35rem;
    line-height: 1.3;
    margin: 0 0 var(--sp-4, 16px);
    overflow-wrap: anywhere;
}

.und-navn[b-sypm8ib7xm] {
    color: var(--mod-tekst-dus);
    margin: 0 0 var(--sp-2, 8px);
    overflow-wrap: anywhere;
}

.und-takk[b-sypm8ib7xm] {
    text-align: center;
}

.und-takk h1[b-sypm8ib7xm] {
    margin-bottom: 0;
}

/* ---- Spørsmålene ------------------------------------------------------ */

.und-sporsmal[b-sypm8ib7xm] {
    border: 0;
    margin: 0 0 var(--sp-5, 20px);
    padding: 0;
    min-width: 0;
}

.und-sporsmal legend[b-sypm8ib7xm] {
    font-weight: 600;
    font-size: 1.05rem;
    line-height: 1.35;
    margin-bottom: var(--sp-3, 12px);
    padding: 0;
    overflow-wrap: anywhere;
}

.und-valgfritt[b-sypm8ib7xm] {
    font-weight: 400;
    color: var(--mod-tekst-dus);
    font-size: 0.9rem;
}

/* Fem like store, trykkbare valg på én rad. 375 px − 2 × 16 px gutter − kortets
   polstring gir ca. 300 px: fem valg à 52 px + mellomrom får plass. */
.und-skala[b-sypm8ib7xm] {
    display: flex;
    justify-content: space-between;
    gap: var(--sp-2, 8px);
}

.und-valg[b-sypm8ib7xm] {
    position: relative;
    flex: 1 1 0;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 56px;
    max-width: 72px;
    border-radius: 0.75rem;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

/* Radioknappen er det ekte skjemafeltet — skjult for øyet, ikke for
   skjermleseren eller tastaturet. Ledeteksten er «1 av 5» osv. */
.und-valg input[b-sypm8ib7xm] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.und-skjult[b-sypm8ib7xm] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.und-ikon[b-sypm8ib7xm] {
    display: block;
    width: 48px;
    height: 48px;
    pointer-events: none;
    transition: transform 0.12s ease, opacity 0.12s ease;
}

.und-ikon svg[b-sypm8ib7xm] {
    display: block;
    width: 100%;
    height: 100%;
}

.und-valg:has(input:focus-visible)[b-sypm8ib7xm] {
    box-shadow: 0 0 0 3px var(--mod-fokus);
    outline: none;
}

/* ---- Smilefjes: rødt til grønt; det valgte løftes fram ------------------- */

.und-fjes .und-ikon svg circle:not([class])[b-sypm8ib7xm] {
    fill: var(--mod-tekst);
}

.und-fjes .und-ikon svg path[b-sypm8ib7xm] {
    fill: none;
    stroke: var(--mod-tekst);
    stroke-width: 1.6;
    stroke-linecap: round;
}

.und-fjes-1[b-sypm8ib7xm] { fill: var(--skala-1); }
.und-fjes-2[b-sypm8ib7xm] { fill: var(--skala-2); }
.und-fjes-3[b-sypm8ib7xm] { fill: var(--skala-3); }
.und-fjes-4[b-sypm8ib7xm] { fill: var(--skala-4); }
.und-fjes-5[b-sypm8ib7xm] { fill: var(--skala-5); }

.und-fjes:has(input:checked) .und-ikon[b-sypm8ib7xm] {
    opacity: 0.4;
}

.und-fjes .und-valg:has(input:checked) .und-ikon[b-sypm8ib7xm] {
    opacity: 1;
    transform: scale(1.15);
}

.und-fjes .und-valg:has(input:checked)[b-sypm8ib7xm] {
    background: var(--mod-bg);
}

/* ---- Stjerner: fylt til og med den valgte -------------------------------- */

.und-stjerner .und-ikon svg path[b-sypm8ib7xm] {
    fill: var(--mod-kant);
    stroke: var(--mod-kant-sterk);
    stroke-width: 1;
    stroke-linejoin: round;
}

.und-stjerner:has(.und-valg:nth-child(1) input:checked) .und-valg:nth-child(-n+1) .und-ikon svg path[b-sypm8ib7xm],
.und-stjerner:has(.und-valg:nth-child(2) input:checked) .und-valg:nth-child(-n+2) .und-ikon svg path[b-sypm8ib7xm],
.und-stjerner:has(.und-valg:nth-child(3) input:checked) .und-valg:nth-child(-n+3) .und-ikon svg path[b-sypm8ib7xm],
.und-stjerner:has(.und-valg:nth-child(4) input:checked) .und-valg:nth-child(-n+4) .und-ikon svg path[b-sypm8ib7xm],
.und-stjerner:has(.und-valg:nth-child(5) input:checked) .und-valg:nth-child(-n+5) .und-ikon svg path[b-sypm8ib7xm] {
    fill: var(--skala-stjerne);
    stroke: var(--skala-stjerne-kant);
}

/* ---- Feil og knapp ------------------------------------------------------ */

.und-har-feil legend[b-sypm8ib7xm] {
    color: var(--mod-rod-tekst);
}

.und-feiltekst[b-sypm8ib7xm] {
    color: var(--mod-rod-tekst);
    margin: var(--sp-2, 8px) 0 0;
    font-size: 0.95rem;
}

.und-skjemafeil[b-sypm8ib7xm] {
    margin: 0 0 var(--sp-4, 16px);
}

.und-send[b-sypm8ib7xm],
.und-tilbake[b-sypm8ib7xm] {
    max-width: none;
    min-height: 48px;
    font-size: 1.05rem;
}

/* ---- UND-28: steg ------------------------------------------------------------
   Telleren er stegets overskrift. Uten skript står alle stegene under hverandre;
   da skiller en strek dem. Knappene: full bredde under hverandre på mobil
   (DESIGNSYSTEM § 7), hovedknappen øverst; på bred skjerm Tilbake til venstre. */

.und-stegteller[b-sypm8ib7xm] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--mod-tekst-dus);
    margin: 0 0 var(--sp-4, 16px);
    outline: none;
}

.und-steg + .und-steg[b-sypm8ib7xm] {
    border-top: 1px solid var(--mod-kant);
    padding-top: var(--sp-4, 16px);
}

.und-steg[hidden] + .und-steg[b-sypm8ib7xm],
.und-steg + .und-steg[hidden][b-sypm8ib7xm] {
    border-top: 0;
    padding-top: 0;
}

.und-knapperad[b-sypm8ib7xm] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3, 12px);
    margin-top: var(--sp-2, 8px);
}

/* Temaets marg på knappene ville doblet avstanden — gap-en eier den. Lik høyde (6.1: 48 px). */
.und-knapperad > .und-send[b-sypm8ib7xm],
.und-knapperad > .und-tilbake[b-sypm8ib7xm] {
    margin: 0;
    height: 48px;
}

.und-knapperad > [hidden][b-sypm8ib7xm],
.und-steg[hidden][b-sypm8ib7xm] {
    display: none !important;
}

@media (min-width: 560px) {
    .und-knapperad[b-sypm8ib7xm] {
        flex-direction: row-reverse;
        justify-content: space-between;
    }

    .und-knapperad > .und-send[b-sypm8ib7xm],
    .und-knapperad > .und-tilbake[b-sypm8ib7xm] {
        width: auto;
        min-width: 140px;
    }
}

/* ---- UND-5: logo, avslutning og undersøkelsens farge ---------------------- */

.und-logo[b-sypm8ib7xm] {
    display: flex;
    justify-content: center;
    margin: 0 0 var(--sp-4, 16px);
}

.und-logo img[b-sypm8ib7xm] {
    max-width: 200px;
    max-height: 72px;
    object-fit: contain;
}

.und-stor-knapp[b-sypm8ib7xm] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: none;
    min-height: 48px;
    margin-top: var(--sp-4, 16px);
    font-size: 1.05rem;
    text-align: center;
}

.und-takk h1 + .und-stor-knapp[b-sypm8ib7xm] {
    margin-top: var(--sp-5, 20px);
}

/* Toppstripa og markeringen i undersøkelsens farge — bare når den har en
   (eller firmaet har en). Uten: sida er som før UND-5. */
.und-preget .und-kort[b-sypm8ib7xm] {
    border-top: 4px solid var(--mod-primar-markor);
}

.und-preget .und-valg:has(input:checked)[b-sypm8ib7xm] {
    box-shadow: inset 0 0 0 2px var(--mod-primar-markor);
}

/* ---- UND-12: «Velg én» — én radioknapp per alternativ -------------------- */

/* Radioen er synlig (DESIGNSYSTEM 6.6: 20 px, --sp-3 til etiketten, sirkelen midt
   på teksten), og HELE raden er etiketten — stor trykkflate på mobil (§ 8). */
.und-alternativer[b-sypm8ib7xm] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2, 8px);
}

.und-alternativ[b-sypm8ib7xm] {
    display: flex;
    align-items: center;
    gap: var(--sp-3, 12px);
    min-height: 48px;
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border: 1px solid var(--mod-kant);
    border-radius: var(--mod-radius-liten, 8px);
    cursor: pointer;
    overflow-wrap: anywhere;
    -webkit-tap-highlight-color: transparent;
}

.und-alternativ input[b-sypm8ib7xm] {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin: 0;
    accent-color: var(--mod-primar-markor);
    cursor: pointer;
}

.und-alternativ:has(input:checked)[b-sypm8ib7xm] {
    border-color: var(--mod-primar-markor);
    background: var(--mod-bg);
}

.und-alternativ:has(input:focus-visible)[b-sypm8ib7xm] {
    box-shadow: 0 0 0 3px var(--mod-fokus);
}

.und-har-feil .und-alternativ[b-sypm8ib7xm] {
    border-color: var(--mod-rod-tekst);
}

/* Over fem alternativer: nedtrekk (DESIGNSYSTEM 6.6). Feltet er husets
   .search-input — kant, radius, fokus og chevron kommer derfra (tema-moderne.css).
   Etiketten ser ut som legend-en over radioknappene, så de to formene er ett sett. */
.und-etikett[b-sypm8ib7xm] {
    display: block;
    font-weight: 600;
    font-size: 1.05rem;
    line-height: 1.35;
    margin-bottom: var(--sp-3, 12px);
    overflow-wrap: anywhere;
}

.und-nedtrekk[b-sypm8ib7xm] {
    max-width: none;
    margin-bottom: 0;
    text-overflow: ellipsis;
}

.und-har-feil .und-etikett[b-sypm8ib7xm] {
    color: var(--mod-rod-tekst);
}

/* (0,3,0) — over main.tom-layout .search-input (0,2,1), som ellers vinner kanten. */
.und-har-feil .und-nedtrekk[b-sypm8ib7xm] {
    border-color: var(--mod-rod-tekst);
}

/* UND-16: «Kort tekst» — husets .search-input i full bredde, som nedtrekket. */
.und-tekstfelt[b-sypm8ib7xm] {
    max-width: none;
    margin-bottom: 0;
}

.und-har-feil .und-tekstfelt[b-sypm8ib7xm] {
    border-color: var(--mod-rod-tekst);
}

/* Anonymitetsrådet (ANONYMITET § 7) rett over feltet: dus hjelpetekst, tett under etiketten. */
.und-hjelp[b-sypm8ib7xm] {
    color: var(--mod-tekst-dus);
    font-size: 0.9rem;
    line-height: 1.4;
    margin: calc(var(--sp-2, 8px) * -1) 0 var(--sp-2, 8px);
}
/* /Components/Pages/Utleie/Foresporsler.razor.rz.scp.css */
/* UTL-13B2: forespørslene i Nordic Utleie. Kortene er .kunde-liste fra app.css
   (samme som Kunder og Kjøretøy) — ingen egen kortstil her, bare luft.
   Bare tokens; ingen nye knapp- eller merkevarianter. */

.utl-fsp-tekst[b-o2jpxvnydh] {
    overflow-wrap: anywhere;
}

/* Kortteksten i én blokk, som på Kunder: ≥ 900 px er kortet en flex-kolonne. */
@media (min-width: 900px) {
    .utl-fsp-tekst[b-o2jpxvnydh] {
        margin-bottom: var(--sp-2);
    }
}

.utl-fsp-beskrivelse[b-o2jpxvnydh],
.utl-fsp-dus[b-o2jpxvnydh] {
    display: block;
    margin-top: var(--sp-2);
}

.utl-fsp-beskrivelse[b-o2jpxvnydh] {
    white-space: pre-line;
}

.utl-fsp-dus[b-o2jpxvnydh] {
    color: var(--mod-tekst-dus);
}

.utl-fsp-bekreft[b-o2jpxvnydh] {
    width: 100%;
}

/* UTL-18: lenkeraden er påmeldingens (orgnr-rad + skjema-lenke i app.css). Den står i en .form-felt for
   etikettens skyld, og .form-felt kapper på 480 px — da går «Kopier lenke» ned under feltet og lenka kuttes.
   Påmeldingens rad står rett i kortet; denne gjør det samme mål: like bred som kortet. */
.utl-fsp-lenkefelt[b-o2jpxvnydh] {
    max-width: none;
}

/* Korttittelen er en seksjonstittel (DESIGNSYSTEM 4: 1,25 rem, 600). Uten denne
   arver den nettleserens h2 (2 rem) og blir større enn sidetittelen. */
.innstilling-kort > h2[b-o2jpxvnydh] {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: var(--sp-1);
}
/* /Components/Pages/Utleie/Kalender.razor.rz.scp.css */
/* UTL-34A — kalenderen. Toppraden og tavla er kjøreplanens globale klasser (app.css); det eneste kjøreplanen har
   SCOPET i Kjoreplan.razor.css og kalenderen trenger, er «+ Ny ordre»-regelen (KND-89), kopiert ordrett: uten den
   blir .btn-ny en blokk i full bredde under 480 px, og knappen står ikke der kjøreplanens står. */
.kjoreplan-nyordre[b-o3w5e258uf] {
    display: inline-block;
    width: auto;
    margin: 0;
    text-decoration: none;
}

/* Dobbeltbookingvarselet fra dagsplanen (UTL-4B2) står mellom toppraden og tavla. */
.kalender-varsel[b-o3w5e258uf] {
    margin-bottom: var(--sp-4);
}

.kalender-hjelp[b-o3w5e258uf] {
    margin-top: var(--sp-4);
}
/* /Components/Pages/Utleie/Kjoretoy.razor.rz.scp.css */
/* UTL-1/UTL-19: skjemakortet for kjøretøy. Isolert stilark, ikke app.css.
   UTL-14: kortene bruker .kunde-liste fra app.css — ingen egen kortstil her.
   UTL-21: tallfeltene (.utl-tall — årsmodell, timepris, minstetid) står i app.css,
   felles med ordreskjemaet; regelen sto likt her og i Oppdrag.razor.css. */

/* UTL-14: kortteksten (navn, pris, merke) står i én blokk — se kommentaren i
   Kjoretoy.razor. ≥ 900 px er kortet en flex-kolonne, og app.css setter
   «Åpne» til margin-top: auto (knappen i bunnen); i det høyeste kortet i rada
   blir den marginen 0, og knappen ligger kant i kant med teksten. Her får
   blokka tilbake den --sp-2 knappen har på mobil. Ingen ny kortstil: bare luft. */
@media (min-width: 900px) {
    .kjoretoy-tekst[b-krqvmf4j99] {
        margin-bottom: var(--sp-2);
    }
}
/* /Components/Pages/Utleie/Kunder.razor.rz.scp.css */
/* UTL-11: kundesiden i Nordic Utleie. Kortene er .kunde-liste fra app.css
   (samme som Kjøretøy) — ingen egen kortstil her, bare luft og to små lister.
   UTL-20: skjemakortet, orgnr-raden (.orgnr-rad) og knappene er husets klasser
   fra app.css; her står bare det app.css ikke har. Bare tokens; ingen nye
   knapp- eller merkevarianter. */

/* Kortteksten i én blokk — samme grep som .kjoretoy-tekst på Kjøretøy: ≥ 900 px
   er kortet en flex-kolonne med «Åpne» nederst, og blokka får tilbake luften.
   Ordbrytingen bærer app.css (.kunde-liste li, overflow-wrap). */
@media (min-width: 900px) {
    .kunde-tekst[b-csh9zdcd5e] {
        margin-bottom: var(--sp-2);
    }
}

.kunde-oppdrag[b-csh9zdcd5e] {
    color: var(--mod-tekst-dus);
}

/* Dublettvarselet står under feltboksen og trenger luft til den. «Bruk <navn>»
   står i en .knapp-rad inne i varselet; husets --sp-4 over og under er laget for
   en rad mellom avsnitt på siden, i varselet holder --sp-2. */
.utl-kunde-dublett[b-csh9zdcd5e] {
    margin-top: var(--sp-4);
}

.utl-kunde-dublett .knapp-rad[b-csh9zdcd5e] {
    margin: var(--sp-2) 0;
}

/* Kundens ordrer i kortet: en enkel liste, ikke en tabell (tre opplysninger og
   et merke — 6.7 «under tre kolonner er det en liste»). Tittelen som en deltittel
   (DESIGNSYSTEM 6.4: 1 rem / 600). */
.utl-kunde-oppdrag h3[b-csh9zdcd5e] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 var(--sp-2);
}

.utl-kunde-oppdragsliste[b-csh9zdcd5e] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.utl-kunde-oppdragsliste li[b-csh9zdcd5e] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2);
    padding: var(--sp-2) 0;
    border-bottom: 1px solid var(--mod-kant);
    overflow-wrap: anywhere;
}

/* Siste rad uten strek — feltboksens egen kant avslutter lista. */
.utl-kunde-oppdragsliste li:last-child[b-csh9zdcd5e] {
    border-bottom: 0;
}
/* /Components/Pages/Utleie/Oppdrag.razor.rz.scp.css */
/* UTL-3B: ordreskjemaet (UTL-21: på siden, ikke lenger et ark). Isolert stilark, ikke app.css.
   Bare tokens. .utl-tall (pausefeltet) står i app.css (UTL-21), felles med Kjøretøy.
   Tilleggenes tallfelt (.utl-tallfelt) får samme tallregel (DESIGNSYSTEM 6.6, «Tall»):
   høyrestilt, like brede siffer. */

.utl-tallfelt[b-gax88vvjvf] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* UTL-50: feltene står i bussens .tur-rutenett (app.css: tolv spor fra 900 px, gap,
   align-items: start, reading-flow). Rutenettet har bare bussens plasseringsklasser
   (tur-oppm, tur-dest …), og de har faste radnumre og bussens pynt (pila på
   tur-dest, margen på tur-fly) — derfor tre egne klasser her, med auto-plassering
   i markupens rekkefølge. Under 900 px er rutenettet ikke et rutenett, og feltene
   står som før. */
@media (min-width: 900px) {
    .utl-halv[b-gax88vvjvf] { grid-column: span 6; }
    .utl-tredel[b-gax88vvjvf] { grid-column: span 4; }
    .utl-hel[b-gax88vvjvf] { grid-column: 1 / -1; }

    /* Feltet fyller ruta, som i bussen. Bussens regel i app.css («.tur-rutenett .krav-felt
       .search-input», og datoen i DatoKlokkeslettfelt) gjelder bare felt med kravstrek,
       og utleien har ingen. Bare feltets eget felt (direkte barn): pausen (.utl-tall,
       160 px) og tilleggslinjene har egne bredder. */
    .tur-rutenett > .form-felt > .search-input[b-gax88vvjvf] {
        max-width: none;
    }

    .tur-rutenett[b-gax88vvjvf]  .dato-tid .search-input.dato-tid-dato {
        max-width: none;
    }
}

/* Etiketten over et felt som ikke er ett <input> (valgt kunde, tilleggene). */
.utl-etikett[b-gax88vvjvf] {
    display: block;
    font-weight: 600;
    margin-bottom: var(--sp-1);
}

.utl-valgt[b-gax88vvjvf] {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    margin: 0;
}

.utl-knapper[b-gax88vvjvf] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-3);
}

/* Én tilleggslinje: Beskrivelse · Antall · Pris · Fjern på bred skjerm.
   Raden eier luften (6.6 «Felt i en rad»): feltene har ingen egen marg. */
.utl-tillegg[b-gax88vvjvf] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 96px 128px auto;
    gap: var(--sp-2);
    align-items: end;
    padding: var(--sp-3) 0;
    border-top: 1px solid var(--mod-kant);
}

.utl-tillegg .form-felt[b-gax88vvjvf] {
    margin-bottom: 0;
}

.utl-tillegg .search-input[b-gax88vvjvf] {
    margin-bottom: 0;
}

/* Mobil: linjene stables, Fjern under feltene. */
@media (max-width: 480.98px) {
    .utl-tillegg[b-gax88vvjvf] {
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
    }

    .utl-tillegg .utl-tallfelt[b-gax88vvjvf] {
        max-width: 160px;
    }

    .utl-tillegg .btn-tekst[b-gax88vvjvf] {
        justify-self: start;
    }
}

/* Prisestimatet, rett over Lagre. */
.utl-estimat[b-gax88vvjvf] {
    margin-top: var(--sp-4);
    padding-top: var(--sp-3);
    border-top: 1px solid var(--mod-kant);
}

.utl-estimat h3[b-gax88vvjvf] {
    margin: 0 0 var(--sp-2);
    font-size: 1rem;
    font-weight: 600;
}

.utl-estimatlinje[b-gax88vvjvf] {
    margin: 0 0 var(--sp-1);
    font-variant-numeric: tabular-nums;
}

.utl-sum[b-gax88vvjvf] {
    font-weight: 600;
}

/* UTL-4B1: dobbeltbookingvarselet (6.3) mellom estimatet og knappene. */
.utl-konflikt[b-gax88vvjvf] {
    margin-top: var(--sp-4);
}

/* UTL-10a: oppdragslista ved 1280 px med menyen åpen (DESIGNSYSTEM 6.7).
   Kjøretøyet sto på én linje (.data-tabell td er nowrap) og tok plassen, så
   de brytbare kolonnene (overflow-wrap: anywhere) ble klemt til én bokstav per
   linje og Status kuttet. Nå brytes kjøretøyet på mellomrom med reg.nr. på
   egen linje, tekstkolonnene har gulv, og «Estimat eks. mva» får bryte i
   hodet. Målt med demodataene: 957 px tilgjengelig, tabellen 957 px.
   Under 1212 px stables den (tabell-stablet-bred): ved 1024 px trengte den
   901 px av 701.
   Spesifisitet: (0,2,0) med scope-attributtet slår .data-tabell td/th (0,1,1). */
.utl-kunde[b-gax88vvjvf] {
    min-width: 8rem;
}

.utl-tekst[b-gax88vvjvf] {
    min-width: 6rem;
}

.utl-kjoretoy[b-gax88vvjvf] {
    white-space: normal;
    min-width: 7rem;
}

.utl-regnr[b-gax88vvjvf] {
    display: block;
    color: var(--mod-tekst-dus);
    white-space: nowrap;
}

.utl-estimathode[b-gax88vvjvf] {
    white-space: normal;
}

/* Kort (6.7, tabell-stablet-bred: under 1212 px): cellene står i full bredde,
   gulvene gjelder ikke. Samme tall som .tabell-stablet-bred i app.css. */
@media (max-width: 1211.98px) {
    .utl-kunde[b-gax88vvjvf],
    .utl-tekst[b-gax88vvjvf],
    .utl-kjoretoy[b-gax88vvjvf] {
        min-width: 0;
    }

    .utl-regnr[b-gax88vvjvf] {
        display: inline;
        margin-left: var(--sp-1);
    }
}

/* UTL-47: «Bruk <navn>» i dublettvarselet står i en .knapp-rad (btn-avbryt), som på
   kundesiden (Kunder.razor.css, .utl-kunde-dublett): husets --sp-4 over og under er
   laget for en rad mellom avsnitt på siden, i varselet holder --sp-2. Et langt
   firmanavn bryter på 375 px av seg selv (app.css: btn-avbryt er blokk med
   høyde auto under 480 px). Erstatter UTL-3e-regelen for btn-tekst. */
.statusvarsel .knapp-rad[b-gax88vvjvf] {
    margin: var(--sp-2) 0;
}

/* UTL-45: kortet har ikke lenger .innstilling-seksjon (760-låsen), så tittelen får dens h2-regel her —
   samme størrelse som kortoverskriftene i bussens ordreskjema. */
#utl-ordre-tittel[b-gax88vvjvf] {
    font-size: 1.15rem;
    font-weight: 600;
    margin-bottom: var(--sp-1);
}
/* /Components/Pages/Utleie/Rapporter.razor.rz.scp.css */
/* UTL-35A: bare sidas ramme, med bussens klasser og verdier (Pages/Rapporter.razor.css,
   RAP-1a/1b) — app.css har dem ikke. Velgeren har sine regler i Components/Felles/
   Maanedsvelger; tabellen, kortene, merket og varselet er husets. Nedlastingsknappene
   (.rapport-nedlasting) kommer med UTL-35B. */

.rapport-topp[b-5g2aerk8us] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2) var(--sp-4);
    margin-bottom: var(--sp-4);
}

.rapport-varsel[b-5g2aerk8us] {
    margin-bottom: var(--sp-4);
}

.rapport-del[b-5g2aerk8us] {
    margin-bottom: var(--sp-6);
}

.rapport-tabell .tall[b-5g2aerk8us] {
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/Utleie/Sjaforer.razor.rz.scp.css */
/* UTL-12B2: sjåførsiden i Nordic Utleie. Kortene er .kunde-liste fra app.css
   (samme som Kjøretøy og Kunder) — ingen egen kortstil her, bare luft.
   Bare tokens; ingen nye knapp- eller merkevarianter. */

/* Kortteksten i én blokk — samme grep som .kjoretoy-tekst og .kunde-tekst: ≥ 900 px
   er kortet en flex-kolonne med «Åpne» nederst, og blokka får tilbake luften. */
@media (min-width: 900px) {
    .sjafor-tekst[b-cp7sxp6ksc] {
        margin-bottom: var(--sp-2);
    }
}

.sjafor-tekst[b-cp7sxp6ksc] {
    overflow-wrap: anywhere;
}

/* Merkene for klasser og bevis brytes som ord, med luft mellom radene. */
.sjafor-tekst .status-merke[b-cp7sxp6ksc] {
    display: inline-block;
    margin-top: var(--sp-1);
}
/* /Components/Pages/Utleie/TilRegnskap.razor.rz.scp.css */
/* ============================================================
   UTL-6B — utleiens «Til regnskap». Tabellen er bussens (tilregnskap-liste i app.css,
   kort til og med 1211.98 px); her bare det utleiens kolonner trenger, og po-oppsett-linje,
   som i bussen bor i dens egen TilRegnskap.razor.css. Tokens fra tema-moderne.css, ingen hex.
   ============================================================ */

.po-oppsett-linje[b-s7hmkero2s] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    margin: 0 0 var(--sp-3);
    padding: var(--sp-2) var(--sp-3);
    border-radius: var(--mod-radius-liten);
    border: 1px solid var(--mod-gul-kant);
    background: var(--mod-gul-bg);
    color: var(--mod-gul-tekst);
}

/* Det som mangler og den lagrede feilen står i statuscella, under merket. Cella har plass til en
   setning på PC, så linja ikke blir ett ord per rad. */
.celle-status .laast[b-s7hmkero2s],
.celle-status .statusvarsel[b-s7hmkero2s] {
    margin-top: var(--sp-2);
    white-space: normal;
    text-align: left;
}

@media (min-width: 1212px) {
    .tilregnskap-liste .celle-status[b-s7hmkero2s] {
        min-width: 13rem;
    }

    /* Bussen har ordrenummeret først; her står kunden først og ble presset til «Fjordbyg|g AS» ved 1280 px
       (brytbar bryter midt i ordet). Plass til et vanlig firmanavn på én–to linjer. */
    .tilregnskap-liste .celle-kunde[b-s7hmkero2s],
    .tilregnskap-liste .kjoretoy-celle[b-s7hmkero2s] {
        min-width: 8rem;
    }
}

/* Kort under 1212 px. Bussens rutenett har ordrenummer, velgerboks og «•••» i høyre kolonne; utleien har
   kjøretøyet og én knapp — så rutenettet settes her (samme brytepunkt, samme luft), med knappen nederst i
   kortet: på 375 px er det ikke plass til «Send til Go» ved siden av kunden. Kjøretøyet har ingen
   celle-*-klasse med vilje, så app.css setter «Kjøretøy:» foran (data-etikett). */
@media (max-width: 1211.98px) {
    .tilregnskap-liste tbody tr[b-s7hmkero2s] {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "kunde     dato"
            "status    status"
            "kjoretoy  kjoretoy"
            "strekning strekning"
            "belop     belop"
            "handling  handling";
    }

    .tilregnskap-liste .kjoretoy-celle[b-s7hmkero2s] {
        grid-area: kjoretoy;
    }

    .tilregnskap-liste .handling-celle:empty[b-s7hmkero2s] {
        display: none;
    }
}
/* /Components/RadMeny.razor.rz.scp.css */
/* UI-43: 44 × 44 px trykkflate for tommelen på smal skjerm (≤ 600 px, samme
   grense som resten av appens smal-skjerm-regler), uten at knappen SER større
   ut og uten at raden den står i blir høyere — «•••» (2.25rem = 36 px, satt i
   app.css) er et lite mål å treffe med tommelen.

   Usynlig lag rundt ikonet, samme teknikk som .velg-boks i app.css
   (til-regnskap, INT-3C): et ::before tatt ut av normalflyten med
   position: absolute, så det ikke kan gjøre raden høyere. Sentrert med
   top/left 50 % + transform i stedet for den negative marginen .velg-boks
   bruker, fordi den avhenger av knappens PRESISE mål — 44 px er ikke delelig
   med 36 px slik 44 er nesten med 13.

   Desktop og nettbrett (> 600 px) er uendret: knappen er alt stor nok for en
   pekeenhet, og appens vanlige 640.98 px-grense er ikke brukt her med vilje —
   det er tommelen, ikke skjermbredden i seg selv, som trenger det ekstra. */
@media (max-width: 600px) {
    .rad-meny-knapp[b-163oue2tzp] {
        position: relative;
    }

    .rad-meny-knapp[b-163oue2tzp]::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 44px;
        height: 44px;
        transform: translate(-50%, -50%);
    }
}
/* /Components/SalgsgrunnlagDialog.razor.rz.scp.css */
/* PO-0KR: 0-kr-varselet under summene. .statusvarsel (app.css) har ingen
   ytre marg; samme avstand som .grunnlag-mangel rett under. */
.grunnlag-nullkroner[b-yehkzcs089] {
    margin: 0 0 var(--sp-3);
}

/* INT-2d: varselet om at ordren er lastet ned som fil før — rett over knapperaden,
   som har sin egen marg over seg. */
.grunnlag-filvarsel[b-yehkzcs089] {
    margin: var(--sp-4) 0 0;
}
/* /Components/Samtale.razor.rz.scp.css */
/* Samtalen (SUP-1 support-chatten; fra PAM-228f også arrangør ↔ medarrangører). Klassene het support-* til PAM-228f —
   reglene er de samme, bare navnene er nøytrale. Scoped CSS med vilje — ikke app.css: stilene hører
   til nøyaktig denne komponenten, og en scoped fil rører ikke wwwroot (som er
   minefelt mens en dev-server kjører, se CLAUDE.md).

   Mobil først: samtalen fyller plassen under sidetittelen, meldingslista
   scroller ALENE, og skrivefeltet ligger fast nederst der tommelen når det. */

.samtale[b-mccilezmj0] {
    display: flex;
    flex-direction: column;
    max-width: 720px;
    /* 100dvh minus topprad, sidetittel/ingress og innholdspadding. dvh og ikke
       vh: på mobil krymper adresselinja, og vh ville lagt skrivefeltet under
       den. min-height som gulv så samtalen aldri blir uleselig lav. */
    height: calc(100dvh - 16rem);
    min-height: 320px;
}

.samtale-meldinger[b-mccilezmj0] {
    flex: 1;
    overflow-y: auto;
    display: flex;
    /* Nyeste melding først i DOM + column-reverse = scroll starter nederst,
       uten JS. Se kommentaren i Samtale.razor. */
    flex-direction: column-reverse;
    gap: var(--sp-3);
    padding: var(--sp-2) var(--sp-1);
}

/* PAM-228f: i et kort (fanen Innstillinger) fyller samtalen ikke skjermen — høyden følger innholdet opp til et tak, og
   meldingslista scroller alene innenfor det. */
.samtale.samtale-kompakt[b-mccilezmj0] {
    height: auto;
    min-height: 0;
    max-height: min(32rem, 70dvh);
}

.samtale-kompakt .samtale-meldinger[b-mccilezmj0] {
    flex: 0 1 auto;
    min-height: 0;
}

/* PAM-228f: «Vis eldre» står sist i DOM-en og derfor øverst (column-reverse), midt over den eldste meldingen. */
.samtale-eldre[b-mccilezmj0] {
    align-self: center;
}

.samtale-tom[b-mccilezmj0] {
    color: var(--mod-tekst-dus);
    text-align: center;
    margin: auto 0;
}

.samtale-innlegg[b-mccilezmj0] {
    display: flex;
    flex-direction: column;
    max-width: 85%;
}

.samtale-innlegg.egen[b-mccilezmj0] {
    align-self: flex-end;
    align-items: flex-end;
}

.samtale-innlegg.motpart[b-mccilezmj0] {
    align-self: flex-start;
    align-items: flex-start;
}

.samtale-meta[b-mccilezmj0] {
    font-size: 0.78rem;
    color: var(--mod-tekst-dus);
    margin-bottom: 2px;
    padding: 0 var(--sp-1);
}

.samtale-boble[b-mccilezmj0] {
    padding: var(--sp-2) var(--sp-3);
    border-radius: 0.75rem;
    /* Linjeskift i meldingen bevares, og en lang URL uten mellomrom skal
       brytes i stedet for å sprenge bobla på 375px. */
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.egen .samtale-boble[b-mccilezmj0] {
    background-color: var(--merkevarefarge, var(--mod-primar));
    color: var(--merkevarefarge-tekst, white);
    border-bottom-right-radius: 0.25rem;
}

.motpart .samtale-boble[b-mccilezmj0] {
    background-color: var(--mod-kant);
    color: var(--mod-tekst);
    border-bottom-left-radius: 0.25rem;
}

.samtale-feil[b-mccilezmj0] {
    margin: var(--sp-2) 0 0;
}

.samtale-skrivefelt[b-mccilezmj0] {
    display: flex;
    gap: var(--sp-2);
    align-items: flex-end;
    padding-top: var(--sp-3);
    border-top: 1px solid var(--mod-kant);
}

.samtale-skrivefelt textarea[b-mccilezmj0] {
    flex: 1;
    /* Remi 04.09.2026 (etter HKB-svaret): feltet MÅ kunne gjøres større — et
       supportsvar er ofte flere avsnitt. field-sizing: content lar feltet vokse
       med teksten der nettleseren kan (Chrome/Edge); resize: vertical er
       håndtaket alle får. max-height holder meldingslista synlig over feltet. */
    resize: vertical;
    field-sizing: content;
    border: 1px solid var(--mod-kant-sterk);
    border-radius: 0.5rem;
    padding: var(--sp-2) var(--sp-3);
    font: inherit;
    min-height: 2.75rem;
    max-height: 50dvh;
}

.samtale-skrivefelt textarea:focus[b-mccilezmj0] {
    /* UI-112: strek i firmafargen → -markor (≥ 3 : 1), aldri rå --mod-primar/--merkevarefarge. */
    outline: 2px solid var(--mod-primar-markor);
    outline-offset: -1px;
}

/* app.css gir .btn-ny full bredde og ytre marg på mobil — i skrivefeltet skal
   knappen stå kompakt ved siden av tekstfeltet på alle bredder. */
.samtale-skrivefelt .samtale-send[b-mccilezmj0] {
    width: auto;
    max-width: none;
    margin: 0;
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    white-space: nowrap;
}
/* /Components/Satsavviksliste.razor.rz.scp.css */
/* INT-13: samme gule varselflate som kladd-stripa (.kladd-varsel) — et
   avvik å ta stilling til, ikke en feil. Brytes på ord og aldri bredere enn
   arket, så 375 px ikke gir horisontal rulling på lange linjetekster. */
.satsavvik[b-lj5hi7wofe] {
    overflow-wrap: anywhere;
    padding: var(--sp-2) var(--sp-4);
    margin-bottom: var(--sp-3);
    background-color: var(--mod-gul-bg);
    border: 1px solid var(--mod-gul-kant);
    border-radius: 0.5rem;
    color: var(--mod-gul-tekst);
    font-size: 0.9rem;
}

.satsavvik-tittel[b-lj5hi7wofe] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin: 0 0 var(--sp-1);
}

.satsavvik-liste[b-lj5hi7wofe] {
    margin: 0;
    padding-left: 1.1rem;
}

.satsavvik-liste li + li[b-lj5hi7wofe] {
    margin-top: var(--sp-1);
}

.satsavvik-belop[b-lj5hi7wofe] {
    margin: var(--sp-2) 0 0;
}
/* /Components/SjaforFaner.razor.rz.scp.css */
/* Fanene er lenker: lenkefargen og understreken skal vike for fanens egne
   (samme utseende som knappefanene i .status-faner). */
.sjafor-faner .status-fane[b-5x8biywj4m] {
    text-decoration: none;
    color: var(--mod-tekst-dus);
}

.sjafor-faner .status-fane:hover[b-5x8biywj4m],
.sjafor-faner .status-fane.aktiv[b-5x8biywj4m] {
    color: var(--mod-tekst);
}

/* UI-126: fire faner får ikke plass på 375 px. En fanerad brekker ikke til to
   linjer (da ligner den to rader, nettopp det UI-126 fjerner) — den ruller
   vannrett i stedet. .status-faner wrapper ellers med vilje (ORD-15). */
.sjafor-faner[b-5x8biywj4m] {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: thin;
}

@media (max-width: 420px) {
    .sjafor-faner[b-5x8biywj4m] {
        column-gap: var(--sp-4);
    }
}
/* /Components/Sjaforkommentarlinje.razor.rz.scp.css */
/* KND-70: samme dus blå som sjåførens eget kort i Mine kjøringer — det er
   samme kommentar, sett fra hver sin side. */
.sjafor-kommentarlinje[b-7n2agfh8ef] {
    margin: var(--sp-2) 0 var(--sp-1);
    padding: var(--sp-2) var(--sp-3);
    background-color: var(--mod-bla-bg);
    border: 1px solid var(--mod-kant);
    border-radius: 8px;
    font-size: 0.9rem;
}

.sjafor-kommentarlinje-topp[b-7n2agfh8ef] {
    display: flex;
    align-items: center;
    gap: var(--sp-1);
}

.sjafor-kommentarlinje-tekst[b-7n2agfh8ef] {
    margin: var(--sp-1) 0 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
/* /Components/Sprakvelger.razor.rz.scp.css */
/* SPR-2: liten og diskret — dempet tekst, det valgte språket i vanlig tekstfarge.
   Treffflaten er 44 px høy (mobil), selv om teksten er liten. Designtråden eier
   uttrykket og kan justere. */
.sprakvelger[b-gt5p0eff9k] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.75rem;
    justify-content: flex-end;
    font-size: 0.875rem;
}

.sprakvelger-valg[b-gt5p0eff9k] {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    padding: 0 0.25rem;
    color: var(--mod-tekst-dus);
    text-decoration: none;
    border-radius: var(--mod-radius-liten, 0.5rem);
}

.sprakvelger-valg:hover[b-gt5p0eff9k] {
    text-decoration: underline;
}

.sprakvelger-valg:focus-visible[b-gt5p0eff9k] {
    outline: 2px solid var(--mod-fokus, rgba(194, 65, 12, 0.35));
    outline-offset: 2px;
}

.sprakvelger-valg.valgt[b-gt5p0eff9k] {
    color: var(--mod-tekst);
    font-weight: 600;
    text-decoration: none;
    cursor: default;
}
/* /Components/Tilbudsvisning.razor.rz.scp.css */
/* ABO-18: tilbudet. Mobile-first — kolonnene står under hverandre til skjermen
   er bred nok, og ingenting har fast bredde (375 px uten sideveis rulling). */
.tilbud-ekstra[b-ysq5a8hww3] {
    white-space: pre-line;
    overflow-wrap: anywhere;
    margin-bottom: var(--sp-3);
    padding: var(--sp-3);
    border-left: 3px solid var(--mod-kant-sterk);
    background: var(--mod-flate);
}

.tilbud-prislinje[b-ysq5a8hww3] {
    display: flex;
    justify-content: space-between;
    gap: var(--sp-2);
    flex-wrap: wrap;
    padding: var(--sp-1) 0;
}

.tilbud-antall[b-ysq5a8hww3] {
    margin: var(--sp-3) 0;
}

.tilbud-antall label[b-ysq5a8hww3] {
    display: block;
    font-weight: 600;
    margin-bottom: var(--sp-1);
}

.tilbud-steg[b-ysq5a8hww3] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

/* Fast bredde: husets knapper strekkes til full bredde på mobil, og da ble
   − og + to brede felt rundt et smalt tall. */
.tilbud-steg button[b-ysq5a8hww3] {
    flex: 0 0 auto;
    width: 48px;
    padding: 0;
    min-width: 44px;
    min-height: 44px;
    font-size: 1.25rem;
    line-height: 1;
    /* ABO-19: husets knapper er flex uten justify-content — tegnet lå i
       venstre kant av den faste bredden. */
    justify-content: center;
}

.tilbud-steg input[b-ysq5a8hww3] {
    width: 5.5rem;
    min-height: 44px;
}

/* ABO-19: tallet står midt mellom − og +. tema-moderne.css høyrestiller
   `html.tema-moderne .search-input[type=number]` (0,3,1) og lastes ETTER de
   scopede stilene — regelen må derfor være mer spesifikk, ikke bare like. */
.tilbud-steg input.search-input[type=number][b-ysq5a8hww3] {
    text-align: center;
}

.tilbud-sum[b-ysq5a8hww3] {
    border-top: 1px solid var(--mod-kant);
    margin-top: var(--sp-2);
    padding-top: var(--sp-2);
    font-size: 1.05rem;
}

.tilbud-overskrift[b-ysq5a8hww3] {
    font-size: 1.1rem;
    margin-top: var(--sp-4);
}

.tilbud-liste[b-ysq5a8hww3] {
    padding-left: 1.25rem;
}

/* ABO-22: fieldset bare for å låse feltene i forhåndsvisningen — uten egen ramme. */
.tilbud-godta[b-ysq5a8hww3] {
    border: 0;
    margin: var(--sp-3) 0 0;
    padding: 0;
    min-width: 0;
}
/* /Components/Timeark.razor.rz.scp.css */
/* Fra, til og pause på én rad når det er plass; tre smale felt er lettere å
   fylle enn tre fulle rader på telefonen også. */
.timeark-klokke[b-v467i6muko] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--sp-3);
}

.timeark-klokke .form-felt[b-v467i6muko] {
    min-width: 0;
}

.timeark-sum[b-v467i6muko] {
    margin-top: 0;
}
/* /Components/Timeliste.razor.rz.scp.css */
.timer-dag[b-786obkwlob] {
    margin-bottom: var(--sp-4);
}

.timer-dag-tittel[b-786obkwlob] {
    display: flex;
    justify-content: space-between;
    gap: var(--sp-3);
    margin: 0 0 var(--sp-2);
    font-size: 0.95rem;
    font-weight: 600;
}

.timer-dag-tittel span:first-child[b-786obkwlob]::first-letter {
    text-transform: uppercase;
}

.timer-rader[b-786obkwlob] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--sp-2);
}

/* Hele raden er trykkflaten — minst 44 px høy, full bredde. */
.timer-rad[b-786obkwlob] {
    display: block;
    width: 100%;
    min-height: 44px;
    padding: var(--sp-3);
    text-align: left;
    font: inherit;
    color: inherit;
    background: var(--mod-flate);
    border: 1px solid var(--mod-kant);
    border-radius: 0.5rem;
}

button.timer-rad[b-786obkwlob] {
    cursor: pointer;
}

button.timer-rad:hover[b-786obkwlob] {
    /* UI-112: strek i firmafargen → -markor (≥ 3 : 1), aldri rå --mod-primar/--merkevarefarge. */
    border-color: var(--mod-primar-markor);
}

.timer-rad-last[b-786obkwlob] {
    background: var(--mod-bg);
}

/* SJF-15c: kontorets merke på raden — tekst og ikon, ikke bare farge. */
.timer-merke[b-786obkwlob] {
    display: block;
    margin-top: var(--sp-1);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--mod-gul-tekst);
}
/* /Components/Timerad.razor.rz.scp.css */
.timerad-topp[b-bwnpr86fkq] {
    display: flex;
    justify-content: space-between;
    gap: var(--sp-3);
}

.timerad-linje[b-bwnpr86fkq] {
    display: block;
    margin-top: var(--sp-1);
    overflow-wrap: anywhere;
}

.timerad-dus[b-bwnpr86fkq] {
    color: var(--mod-tekst-dus);
    font-size: 0.9rem;
}
/* /Components/TrengerHandling.razor.rz.scp.css */
/* PO-TRENGER-HANDLING — samme kortform som kvitteringen for «Send N til Go»
   (UtvalgssendingArk.razor.css): hver ordre et lite kort, Gos melding bryter
   i stedet for å skyve siden bredere enn 375 px. */
.trenger-handling-tittel[b-8zhc3jghfg] {
    display: flex;
    align-items: center;
    gap: var(--sp-2, 8px);
}

.trenger-handling-liste[b-8zhc3jghfg] {
    list-style: none;
    margin: 0 0 var(--sp-3, 12px);
    padding: 0;
    display: grid;
    gap: var(--sp-2, 8px);
}

.trenger-handling-liste li[b-8zhc3jghfg] {
    padding: var(--sp-3, 12px);
    border: 1px solid var(--mod-kant);
    border-radius: 8px;
    min-width: 0;
}

.trenger-handling-hode[b-8zhc3jghfg] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--sp-1, 4px) var(--sp-2, 8px);
}

.trenger-handling-tid[b-8zhc3jghfg] {
    color: var(--mod-tekst-dus);
    font-size: .875rem;
}

.trenger-handling-tekst[b-8zhc3jghfg] {
    margin: var(--sp-1, 4px) 0 0;
    font-size: .9rem;
    overflow-wrap: anywhere;
}

.trenger-handling-liste .knapp-rad[b-8zhc3jghfg] {
    margin: var(--sp-2, 8px) 0 0;
}
/* /Components/TripletexProduktvelger.razor.rz.scp.css */
/* INT-2A2 — velgeren for et produkt i Tripletex. Bare tokens, ingen hex (DESIGNSYSTEM 3).
   Mobile-first: alt bryter på ord (og «anywhere» for lange nummer), så 375 px aldri
   ruller sidelengs — navnet brytes, det kuttes ikke. */
.tx-velger[b-323knj38qo] {
    display: grid;
    gap: var(--sp-2);
    min-width: 0;
    overflow-wrap: anywhere;
}

.tx-velger-valgt[b-323knj38qo] {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-1);
    margin: 0;
}

.tx-velger-borte[b-323knj38qo] {
    color: var(--mod-rod-tekst);
    font-weight: 600;
}

.tx-velger-hjelp[b-323knj38qo] {
    margin: 0;
    font-size: var(--tekst-hjelp);
    color: var(--mod-tekst-dus);
}

.tx-velger-knapper[b-323knj38qo] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
}

.tx-velger-sok[b-323knj38qo] {
    width: 100%;
    max-width: 28rem;
    margin-bottom: 0;
}

/* Høyst ~ti rader synlig, resten rulles inne i lista. */
.tx-velger-liste[b-323knj38qo] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 2px;
    max-height: 22rem;
    overflow-y: auto;
    max-width: 36rem;
    border: 1px solid var(--mod-kant);
    border-radius: var(--mod-radius-liten);
    background: var(--mod-flate);
    container-type: inline-size;
}

.tx-velger-gruppe[b-323knj38qo] {
    padding: var(--sp-2) var(--sp-3) var(--sp-1);
    font-size: var(--tekst-hjelp);
    font-weight: 600;
    color: var(--mod-tekst-dus);
}

.tx-velger-liste > .tx-velger-hjelp[b-323knj38qo] {
    padding: var(--sp-2) var(--sp-3);
}

/* Smal liste: «nummer navn» over «konto · mva». Bred (≥ 30rem): fire kolonner. */
.tx-velger-valg[b-323knj38qo],
.tx-velger-sperret[b-323knj38qo] {
    display: grid;
    grid-template-columns: 4rem minmax(0, 1fr);
    align-items: baseline;
    gap: 0 var(--sp-2);
    width: 100%;
    min-height: 44px;
    padding: var(--sp-2) var(--sp-3);
    box-sizing: border-box;
    text-align: left;
}

.tx-velger-valg[b-323knj38qo] {
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    white-space: normal;
    cursor: pointer;
}

.tx-velger-valg:hover[b-323knj38qo],
.tx-velger-valg:focus-visible[b-323knj38qo] {
    background: var(--mod-bg);
}

.tx-velger-valg-valgt[b-323knj38qo] {
    font-weight: 600;
    background: var(--mod-primar-tint);
}

/* Feil sats: vises, men kan ikke trykkes — dus tekst, ingen knapp. */
.tx-velger-sperret[b-323knj38qo] {
    color: var(--mod-tekst-dus);
}

.tx-velger-nummer[b-323knj38qo] {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.tx-velger-navn[b-323knj38qo] {
    min-width: 0;
}

.tx-velger-detalj[b-323knj38qo] {
    grid-column: 2;
    font-size: var(--tekst-hjelp);
    color: var(--mod-tekst-dus);
}

@container (min-width: 30rem) {
    .tx-velger-valg[b-323knj38qo],
    .tx-velger-sperret[b-323knj38qo] {
        grid-template-columns: 4.5rem minmax(0, 1fr) 9rem 8rem;
    }

    .tx-velger-detalj[b-323knj38qo] {
        grid-column: auto;
    }
}
/* /Components/Turdetaljer.razor.rz.scp.css */
/* Fast rute-knappen (FastRuteVelger) står i samme knapperad som + Dag / + Retur.
   Komponenten har egen form-felt + knapp-rad med marginer; null dem her så alle
   tre knappene står på samme linje. Gjelder kun inne i Turdetaljers knapperad. */
.knapp-rad[b-bnvnj4i4zo] {
    align-items: flex-start;
}

/* UI-181: på mobil (samme brekkpunkt som app.css) står knappene under hverandre;
   da skal fast rute-knappen fylle raden som + Dag / + Retur, ikke bare teksten. */
@media (max-width: 480px) {
    .knapp-rad[b-bnvnj4i4zo] {
        align-items: stretch;
    }
}

.knapp-rad[b-bnvnj4i4zo]  > .form-felt {
    margin-bottom: 0;
}

.knapp-rad[b-bnvnj4i4zo]  > .form-felt > .knapp-rad {
    margin: 0;
}
/* /Components/UtvalgssendingArk.razor.rz.scp.css */
/* INT-7 — bekreftelse, framdrift og kvittering for «Send N ordrer til
   PowerOffice Go». Lista er ingen tabell: på 375 px er hver ordre et lite
   kort med nummer og merke på én linje og Gos melding under, som får bryte. */
.utvalgssending-liste[b-0iww50f274] {
    list-style: none;
    margin: 0 0 var(--sp-4, 16px);
    padding: 0;
    display: grid;
    gap: var(--sp-2, 8px);
}

.utvalgssending-liste li[b-0iww50f274] {
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    border: 1px solid var(--mod-kant, #e5e7eb);
    border-radius: 8px;
    min-width: 0;
}

.utvalgssending-hode[b-0iww50f274] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-1, 4px) var(--sp-2, 8px);
}

/* Gos meldinger kan inneholde lange referanser (nordicm-buss-1042) og
   GUID-er — de skal bryte, ikke skyve arket bredere enn skjermen. */
.utvalgssending-tekst[b-0iww50f274] {
    margin: var(--sp-1, 4px) 0 0;
    font-size: .9rem;
    overflow-wrap: anywhere;
}

.utvalgssending-aapne[b-0iww50f274] {
    padding: 0;
    margin-top: var(--sp-1, 4px);
}

.utvalgssending-framdrift[b-0iww50f274] {
    font-weight: 600;
    margin: 0 0 var(--sp-3, 12px);
}
/* /Components/VelgGoKundeArk.razor.rz.scp.css */
/* PO-TRENGER-HANDLING — treffene i Go som en liste av radioknapper, hver
   en trykkflate på minst 44 px (mobil). */
.velg-gokunde-valg[b-d2sfs0rhr8] {
    border: 0;
    padding: 0;
    margin: 0 0 var(--sp-4, 16px);
    display: grid;
    gap: var(--sp-1, 4px);
    min-width: 0;
}

.velg-gokunde-valg legend[b-d2sfs0rhr8] {
    padding: 0;
    margin-bottom: var(--sp-2, 8px);
}

.velg-gokunde-valg .radio-knapp[b-d2sfs0rhr8] {
    min-height: 2.75rem;
    overflow-wrap: anywhere;
}