/* ==========================================================================
NERVE Finance — programskiftet i rail'en.
Kladden og debitor/kreditor er ÉT program på ÉN port (8112), men to
dokumenter. Skiftet mellem dem er rail'ens øverste to ikoner, og de skal se
ens ud og sidde samme sted i begge — ellers er det ikke det samme program,
det er to der ligner hinanden.
Reglen står derfor i EN fil som begge sider henter, ikke som en kopi i
`kladde.css` og en i `debitor-kreditor.css`. To kopier af en styleregel
divergerer; det er den samme grund som at de to servere deler læseruter i
stedet for at have hver sin.
⛔ ../design/*.css rettes aldrig (ADR-0005). Grundlaget styler `.rail button`;
programskiftet er et ``, fordi målet er et andet dokument, og et link
der er bygget som en knap kan hverken åbnes i en ny fane, kopieres eller
ses i browserens statuslinje inden man klikker.
========================================================================== */
.rail .raillink {
display: grid;
place-items: center;
width: 38px;
height: 34px;
border: none;
border-radius: 9px;
background: transparent;
color: var(--txt-3);
text-decoration: none;
cursor: pointer;
}
.rail .raillink svg { width: 19px; height: 19px; }
.rail .raillink:hover { background: var(--graa-flade); color: var(--txt-2); }
.rail .raillink:focus-visible { outline: 2px solid var(--fokus, #0059B3); outline-offset: 2px; }
/* Berøringsmål — samme regel som rail'ens knapper har i fladelagene. */
@media (pointer: coarse) {
.rail .raillink { min-height: 44px; height: 44px; }
}
/* ──────────────────────────────────────────────────────────────────────────
Det aktive punkt (20-08-2026, ADR-0013).
Rail'ens fire punkter er ALLE `` nu, også det man står på — markuppen skal
være ordret ens på hver flade, målt byte for byte med `curl`. Grundlagets
`.rail button.aktiv` rammer derfor ikke længere, og reglen står her i stedet,
med samme farver som knappen havde.
⚠ Specificitet, ikke smag: `.rail .raillink` er (0,2,0), og en bar
`.raillink.aktiv` er (0,2,0) — samme vægt, og så afgør rækkefølgen. Reglen
står derfor efter, OG bærer `.rail` foran, så den vinder uanset hvor nogen
flytter den hen. En CSS-regel der taber, er tavs (UI-UX-STANDARD § 14).
────────────────────────────────────────────────────────────────────────── */
.rail .raillink.aktiv { background: var(--acc-soft); color: var(--acc); }
.rail .raillink.aktiv:hover { background: var(--acc-soft); color: var(--acc); }
/* ──────────────────────────────────────────────────────────────────────────
Skillelinjen mellem det daglige arbejde og Opsætning (20-08-2026, ADR-0013).
Christian: »Der er ikke nogen grund til at vi laver faner for alle disse
ting.« Skillelinjen er den sætning tegnet: over den ligger Regnskab, Kladde,
Debitor/kreditor og Rykkere — det man laver hver dag. Under den ligger det
systemmæssige, samlet i ét punkt.
Den er `aria-hidden` og bærer ingen betydning en skærmlæser mister: rail'ens
punkter har hver sit `aria-label`, og Opsætning siger sit eget navn.
────────────────────────────────────────────────────────────────────────── */
.rail .railskel {
display: block;
width: 22px;
height: 1px;
margin: 6px 0;
background: var(--line);
}
/* Man står i et UNDERPUNKT under dette punkt — fx kladdetyper under Opsætning.
Mærket er svagere end »du står her«, for det er en anden oplysning: det siger
hvilket afsnit man er i, ikke hvilken side man ser. Farven står aldrig alene
(§ 10) — scriptet sætter også `aria-current`, og `title` bærer ordet. */
.rail .raillink.aktiv.afsnit { background: var(--graa-flade); color: var(--acc); }
.rail .raillink.aktiv.afsnit:hover { background: var(--acc-soft); }
/* ==========================================================================
MILJØMÆRKET — hvilket system man står i, og vejen til det andet.
Christian, 20-08-2026: »vigtigt vi kan skifte mellem selskaber altså test og
drift inde på selve NERVE FINANCE så vi ikke skal logge on og ud«.
Markuppen indsættes af `ui/miljoe.py` i topbjælken på hver flade — den står
IKKE i de 23 .html-filer, af samme grund som rail'en ikke gør (ADR-0013): en
ny flade ville mangle den, og en flade uden miljømærke er den ene flade hvor
nogen bogfører i drift i den tro at det var test.
⛔ Farven står ALDRIG alene. Ordet TEST er skrevet ud. Et farvet felt uden
tekst er ubrugeligt for den der ikke skelner orange fra gråt, og det er
netop den bruger der har mest brug for at vide hvor hun er.
Rollerne er grundlagets egne — `--warn`/`--warn-bg` er samme par som `.pill`
allerede bruger, og de er kontrastmålt dér. ../design/*.css rettes aldrig.
========================================================================== */
.miljoemaerke {
display: flex;
align-items: center;
gap: 6px;
flex: 0 0 auto;
}
.miljoemaerke-navn {
font-size: 10.5px;
font-weight: 700;
letter-spacing: .06em;
padding: 3px 8px;
border-radius: 11px;
white-space: nowrap;
cursor: default;
}
.miljoemaerke-skift {
font-size: 11px;
font-weight: 500;
color: var(--txt-3);
text-decoration: none;
padding: 3px 7px;
border-radius: 8px;
border: 1px solid var(--line);
white-space: nowrap;
}
.miljoemaerke-skift:hover { background: var(--graa-flade); color: var(--txt); }
.miljoemaerke-skift:focus-visible { outline: 2px solid var(--acc); outline-offset: 1px; }
/* DRIFT er den normale tilstand og skal ikke råbe. Råber begge miljøer, holder
man op med at se forskel — og så er mærket blevet til tapet. */
.miljoemaerke--drift .miljoemaerke-navn {
background: var(--graa-flade);
color: var(--txt-2);
}
/* TEST råber. Det er hele mærkets eksistensberettigelse. */
.miljoemaerke--test .miljoemaerke-navn {
background: var(--warn-bg);
color: var(--warn);
}
.miljoemaerke--udvikling .miljoemaerke-navn {
background: var(--acc-soft);
color: var(--acc);
}
/* Loginfladen har ingen topbjælke; dér indsættes mærket øverst i dokumentet.
Man skal kunne se hvilket system man er ved at logge ind i — forvekslingen
begynder netop dér, før nogen har set en eneste konto. */
.miljoemaerke--frit {
justify-content: center;
padding: 8px 0;
border-bottom: 1px solid var(--line);
background: var(--chrome);
}