/*
 * LOKALBOLD SKAL — komponenterne
 *
 * Retning G, moerk skal. Hver klasse her svarer til et stykke af
 * artboardet «G · Skallen, bid for bid».
 *
 * ---------------------------------------------------------------------------
 * TRE REGLER, DER GAELDER HELE FILEN
 *
 * 1. TOKENS LIGGER PAA .lb-sk, IKKE PAA :root.
 *    Skallen deler side med Hello Elementor, Elementors egne containere og
 *    244 kB design-CSS fra Customizeren. Ville vi saette --lb-sk-* paa
 *    :root, laa de og lurede paa hele sitet, ogsaa naar skallen er slaaet
 *    fra. De hoerer til blokken.
 *
 * 2. INGEN EKSTERNE HENTNINGER. Ikke én @import, ikke ét url() mod et
 *    fremmed domaene. Privatlivspolitikken siger, maalt med
 *    performance.getEntriesByType('resource'), at der er NUL eksterne kald
 *    foer samtykke — og skrifterne ligger lokalt i
 *    uploads/elementor/google-fonts. Et Google-link her ville goere den
 *    paastand usand. Se note om skriften nederst.
 *
 * 3. FARVER DER BAERER TEKST ER MAALT.
 *    Paa panelets #141D27:
 *      --lb-sk-tekst   #E8EDF3  14,6:1   broedtekst
 *      --lb-sk-daempet #8FA0B4   6,46:1  etiketter og fodnoter
 *      --lb-sk-groen   #34D17E   9,56:1  links og fremhaevede tal
 *      --lb-sk-rav     #F0B23C  10,1:1   «nu» og «haster»
 *      --lb-sk-svag    #5C6C7E   3,21:1  FALDER — maa ikke baere tekst
 *
 *    --lb-sk-svag er derfor degraderet til dekoration: streger, inaktive
 *    ikonrammer, skilletegn. Der gaelder 3:1, og den klarer det.
 *    Udkastet brugte den til fodnoter. Det var forkert.
 * ---------------------------------------------------------------------------
 */

.lb-sk {
    /* Flader */
    --lb-sk-grund: #0B1118;
    --lb-sk-skinne: #080D13;
    --lb-sk-flade: #141D27;
    --lb-sk-flade-2: #101822;
    --lb-sk-markering: #1A2735;

    /* Streger */
    --lb-sk-streg: #243041;
    --lb-sk-streg-svag: #1B2430;
    --lb-sk-kant: #2E3C4E;

    /* Tekst */
    --lb-sk-hvid: #FFFFFF;
    --lb-sk-tekst: #E8EDF3;
    --lb-sk-daempet: #8FA0B4;
    --lb-sk-svag: #5C6C7E;

    /* Signaler */
    --lb-sk-groen: #34D17E;
    /*
     * Fladen er maalt, ikke valgt paa oejemaal.
     *
     * #1E8E54 gav hvid tekst 4,16:1 — under 4,5 for de 10 px bogstaver i
     * formstriben og i Foelg-knappen. 29 af 33 resterende fejl var netop
     * den ene farve. #1A7D49 giver **5,16:1** og er stadig tydeligt groen.
     */
    --lb-sk-groen-flade: #1A7D49;
    --lb-sk-rav: #F0B23C;
    --lb-sk-roed: #A6372A;
    --lb-sk-uafgjort: #3B4A5C;

    /* Maal */
    --lb-sk-skinne-bredde: 232px;
    --lb-sk-luft: 22px;
    --lb-sk-mellem: 18px;
    --lb-sk-i-panel: 16px;

    /*
     * ARCHIVO NARROW LAA DER I FORVEJEN.
     *
     * Den ligger som seks woff2 plus en stilfil under
     * uploads/elementor/google-fonts, serveret fra sitets eget domaene i
     * vaegtene 400, 500, 600 og 700. Pluginet indlaeser den stilfil, saa
     * @font-face altid er erklaeret, naar skallen er taendt.
     *
     * Ingen hentning fra Google. Politikken siger, maalt, nul eksterne kald
     * foer samtykke — og det er stadig sandt.
     *
     * Det er ovenikoebet den rigtige skrift: logoet er sat i Archivo Narrow.
     */
    --lb-sk-display: "Archivo Narrow", Archivo, "Roboto Condensed", "Helvetica Neue", Arial, sans-serif;
    --lb-sk-broed: Inter, "Helvetica Neue", Arial, system-ui, sans-serif;

    /*
     * SITETS EGNE VARIABLER OMDEFINERES HER — DET ER HELE TRICKET
     *
     * Første udgave stylede klasse for klasse. En måling af den levende
     * klubside gav **161 ulæselige elementer**: stillingens rækker havde
     * stadig hvid baggrund (#FFF og zebraen #F6F6F6) under hvid tekst, og
     * overskrifter uden egen farveregel arvede --ink #101828 ned paa den
     * moerke flade — 1,04:1, altsaa usynligt.
     *
     * Begge dele kom fra sitets variabler. Profilsystemet, resultatcentret
     * og kortet bruger alle var(--ink), var(--paper), var(--line) og
     * var(--green-soft). Omdefineres de HER, paa .lb-sk, arver hver eneste
     * eksisterende regel den moerke udgave af sig selv — uden at en eneste
     * af dem skal roeres.
     *
     * Det er ogsaa den eneste maade at daekke det, jeg ikke har set endnu:
     * en komponent paa en sidetype, der ikke er bygget om, faar de rigtige
     * farver af sig selv.
     *
     * --green og --green-hover roeres IKKE. De er FLADER med moerk tekst
     * ovenpaa (bl.a. samtykkeknappen), og vendes de, bliver den ulaeselig.
     */
    --ink: #E8EDF3;
    --ink-muted: #8FA0B4;
    --paper: #141D27;
    --paper-soft: #101822;
    --line: #243041;
    --green-soft: #1A2735;
    --green-text: #34D17E;

    /* Det parallelle saet, faelleskomponenterne bruger. */
    --lb-blaek: #E8EDF3;
    --lb-daempet: #8FA0B4;
    --lb-flade: #101822;
    --lb-streg: #243041;
    --lb-groen-tekst: #34D17E;

    background: var(--lb-sk-grund);
    color: var(--lb-sk-tekst);
    font-family: var(--lb-sk-broed);
    font-size: 15px;
    line-height: 1.5;

    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}

/*
 * Tal flugter.
 *
 * Kun paa de komponenter, der BAERER tal. En foerste udgave satte
 * tabular-nums paa alt inde i .lb-sk, og det rammer ogsaa broedtekst, hvor
 * proportionale cifre er paenere. Her er listen eksplicit i stedet.
 */
.lb-sk-tabel,
.lb-sk-tal-stribe,
.lb-sk__tal,
.lb-sk__fane-tal,
.lb-sk-form__brik,
.lb-sk-maerke,
.lb-sk__klub-meta { font-variant-numeric: tabular-nums; }

/*
 * DEN GENERELLE LINKFARVE HAR NUL SPECIFICITET — MED VILJE.
 *
 * Foerste udgave skrev `.lb-sk a { color: groen }`. Det er (0,1,1), og det
 * slaar `.lb-sk__punkt { color: daempet }` paa (0,1,0). Resultatet var, at
 * HVER ENESTE inaktive post i skinnen og i fanebladene stod groen — altsaa
 * at alt saa aktivt ud, og markeringen af det aktive ikke betoed noget.
 * Fejlen var ikke til at se i en stikproeve; den blev fundet ved at maale
 * computed color paa posterne.
 *
 * Det er den samme faelde som temaets `body:not([class*="elementor-page-"])
 * .site-main` paa (0,2,1), der tavst slog en ren `.single-lb_klub
 * .site-main` paa (0,2,0) ihjel.
 *
 * :where() bidrager altid med nul, saa reglen her matcher links inde i
 * skallen uden at kunne vinde over nogen komponent — uanset raekkefoelge.
 */
:where(.lb-sk) :where(a) { color: var(--lb-sk-groen); text-decoration: none; }
:where(.lb-sk) :where(a:hover) { color: var(--lb-sk-hvid); }
.lb-sk a:focus-visible,
.lb-sk button:focus-visible,
.lb-sk input:focus-visible {
    outline: 2px solid var(--lb-sk-groen);
    outline-offset: 2px;
}

/* ===========================================================================
   SKINNEN
   =========================================================================== */

.lb-sk__skinne {
    flex: 1 1 var(--lb-sk-skinne-bredde);
    max-width: 100%;
    background: var(--lb-sk-skinne);
    border-right: 1px solid var(--lb-sk-streg);
    padding: 18px 0 26px;
}

/*
 * Ingen position:sticky og ingen 100vh.
 *
 * Rail'en paa det nuvaerende site blev maalt til 2.118 px mod en skaerm paa
 * 900, og fire forsoeg paa at faa den til at klaebe mislykkedes. Skinnen
 * her er navigation og kort nok til at vaere under skaermhoejden — men den
 * faar ikke lov at klaebe alligevel, for saa er vi tilbage i den samme
 * diskussion, saa snart der tilfoejes et punkt.
 */

.lb-sk__maerke {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 0 18px 18px;
    color: var(--lb-sk-hvid);
}
.lb-sk__maerke:hover { color: var(--lb-sk-hvid); }
.lb-sk__maerke svg { display: block; }
.lb-sk__maerke-navn {
    font-family: var(--lb-sk-display);
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 0.04em;
}

/* Din klub, oeverst, over grupperne. Ét klik fra hvor som helst. */
.lb-sk__klub {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 12px 20px;
    padding: 10px 12px;
    background: var(--lb-sk-flade);
    border: 1px solid var(--lb-sk-streg);
    border-left: 3px solid var(--lb-sk-groen);
    color: var(--lb-sk-tekst);
}
.lb-sk__klub:hover { color: var(--lb-sk-hvid); }
.lb-sk__klub-navn {
    display: block;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.lb-sk__klub-meta {
    display: block;
    font-size: 10px;
    letter-spacing: 0.1em;
    color: var(--lb-sk-daempet);
}

/* Tom tilstand: ingen klub valgt endnu */
.lb-sk__klub--tom {
    display: block;
    border: 1px dashed var(--lb-sk-kant);
    border-left-width: 1px;
}
.lb-sk__klub--tom p {
    margin: 0 0 9px;
    font-size: 12px;
    color: var(--lb-sk-daempet);
    line-height: 1.45;
}

.lb-sk__gruppe { margin-bottom: 18px; }
.lb-sk__gruppe:last-child { margin-bottom: 0; }

.lb-sk__gruppenavn {
    margin: 0 0 6px;
    padding: 0 18px;
    font-family: var(--lb-sk-display);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.16em;
    color: var(--lb-sk-svag);
}

.lb-sk__punkt {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 18px 9px 15px;
    border-left: 3px solid transparent;
    color: var(--lb-sk-daempet);
    font-size: 14px;
}
.lb-sk__punkt:hover {
    background: var(--lb-sk-flade-2);
    color: var(--lb-sk-tekst);
}
/* Kanten er markoeren — ikke tekstfarven alene. */
.lb-sk__punkt--aktiv,
.lb-sk__punkt--aktiv:hover {
    border-left-color: var(--lb-sk-groen);
    background: var(--lb-sk-flade);
    color: var(--lb-sk-hvid);
    font-weight: 600;
}

/* Formen er betydningen: firkant = tabel, cirkel = liste, rombe = tal. */
.lb-sk__ikon {
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    border: 1.5px solid currentColor;
    border-radius: 3px;
}
.lb-sk__ikon--liste { border-radius: 50%; }
.lb-sk__ikon--tal { transform: rotate(45deg); border-radius: 2px; }

.lb-sk__punkt-navn { flex: 1 1 auto; min-width: 0; }

/* En optaelling, ikke en notifikation. Derfor aldrig roed. */
.lb-sk__tal {
    font-family: var(--lb-sk-display);
    font-size: 11px;
    color: var(--lb-sk-svag);
}

/* ===========================================================================
   INDHOLDSSPALTEN
   =========================================================================== */

.lb-sk__indhold {
    flex: 999 1 560px;
    min-width: 0;
}

.lb-sk__kontekst {
    border-bottom: 1px solid var(--lb-sk-streg);
    background: var(--lb-sk-skinne);
    padding: 0 var(--lb-sk-luft);
    min-height: 52px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.lb-sk__krumme {
    margin: 0;
    font-size: 13px;
    color: var(--lb-sk-daempet);
}
.lb-sk__krumme a { color: var(--lb-sk-daempet); }
.lb-sk__krumme a:hover { color: var(--lb-sk-hvid); }
.lb-sk__krumme-nu { color: var(--lb-sk-tekst); }
.lb-sk__krumme-skil { color: var(--lb-sk-kant); }

/* Hvad haster. Rav, aldrig roed — roed er et tabt resultat. */
.lb-sk__haster {
    display: flex;
    align-items: center;
    gap: 7px;
    background: var(--lb-sk-flade);
    border: 1px solid var(--lb-sk-streg);
    padding: 5px 11px;
    font-family: var(--lb-sk-display);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--lb-sk-rav);
}
.lb-sk__haster::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

.lb-sk__soeg { margin-left: auto; flex: 0 1 220px; }
.lb-sk__soeg input {
    width: 100%;
    box-sizing: border-box;
    height: 34px;
    padding: 0 11px;
    font-family: var(--lb-sk-broed);
    font-size: 13px;
    color: var(--lb-sk-tekst);
    background: var(--lb-sk-flade);
    border: 1px solid var(--lb-sk-streg);
    border-radius: 0;
}
.lb-sk__soeg input::placeholder { color: var(--lb-sk-daempet); opacity: 1; }

/* Fanerne: sidens egne afsnit. De erstatter ankerstriben. */
.lb-sk__faner {
    border-bottom: 1px solid var(--lb-sk-streg);
    padding: 0 var(--lb-sk-luft);
    display: flex;
    gap: 2px;
    overflow-x: auto;
}
.lb-sk__fane {
    padding: 12px 16px;
    font-family: var(--lb-sk-display);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--lb-sk-daempet);
    border-bottom: 2px solid transparent;
    white-space: nowrap;
}
.lb-sk__fane:hover { color: var(--lb-sk-tekst); }
.lb-sk__fane--aktiv,
.lb-sk__fane--aktiv:hover {
    color: var(--lb-sk-hvid);
    background: var(--lb-sk-flade);
    border-bottom-color: var(--lb-sk-groen);
}
.lb-sk__fane-tal {
    font-size: 11px;
    font-weight: 600;
    color: var(--lb-sk-svag);
    margin-left: 8px;
}

.lb-sk__krop { padding: var(--lb-sk-luft); }

.lb-sk__raekke {
    display: flex;
    flex-wrap: wrap;
    gap: var(--lb-sk-mellem);
}
.lb-sk__raekke + .lb-sk__raekke { margin-top: var(--lb-sk-mellem); }

/*
 * Spalten: en beholder for flere paneler.
 *
 * Den har sin egen klasse og laaner IKKE .lb-sk-panel--smal. En beholder,
 * der baerer et panels modifier, er en loegn om hvad elementet er — og den
 * slags opdager man foerst, naar panelet faar en baggrund, og beholderen
 * pludselig ogsaa har én.
 */
.lb-sk__spalte {
    display: flex;
    flex-direction: column;
    gap: var(--lb-sk-mellem);
}
.lb-sk__spalte--bred { flex: 999 1 460px; min-width: 0; }
.lb-sk__spalte--smal { flex: 1 1 300px; min-width: 280px; }
/* Paneler i en spalte har allerede gap; drop deres egen margin. */
.lb-sk__spalte .lb-sk-panel + .lb-sk-panel { margin-top: 0; }

/* ===========================================================================
   PANELET
   =========================================================================== */

.lb-sk-panel {
    background: var(--lb-sk-flade);
    border: 1px solid var(--lb-sk-streg);
}
.lb-sk-panel--bred { flex: 999 1 460px; min-width: 0; }
.lb-sk-panel--smal { flex: 1 1 300px; min-width: 280px; }
.lb-sk-panel--haster { border-left: 3px solid var(--lb-sk-rav); }
.lb-sk-panel + .lb-sk-panel { margin-top: var(--lb-sk-mellem); }

.lb-sk-panel__hoved {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px var(--lb-sk-i-panel);
    border-bottom: 1px solid var(--lb-sk-streg);
    background: var(--lb-sk-flade-2);
}
.lb-sk-panel__ikon {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    border: 1.5px solid var(--lb-sk-groen);
    border-radius: 3px;
}
.lb-sk-panel__ikon--liste { border-radius: 50%; }
.lb-sk-panel__ikon--haster { border-color: var(--lb-sk-rav); }

/* 11 px versaler. Ikke 28 px spaerret blaagraat, som i dag. */
.lb-sk-panel__titel {
    margin: 0;
    font-family: var(--lb-sk-display);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    color: var(--lb-sk-tekst);
}
/* Handlingen staar i hovedet, hoejrestillet — aldrig som knap i bunden. */
.lb-sk-panel__handling {
    margin-left: auto;
    font-size: 12px;
    font-weight: 600;
}
.lb-sk-panel__note {
    font-size: 12px;
    color: var(--lb-sk-daempet);
}

.lb-sk-panel__krop { padding: var(--lb-sk-i-panel); }

/* Fodnoten baerer forbeholdet. Daempet, ikke svag — 6,46:1. */
.lb-sk-panel__fod {
    margin: 0;
    padding: 11px var(--lb-sk-i-panel);
    border-top: 1px solid var(--lb-sk-streg-svag);
    font-size: 12px;
    color: var(--lb-sk-daempet);
    line-height: 1.5;
}

/* ===========================================================================
   TALSTRIBEN
   =========================================================================== */

.lb-sk-tal-stribe {
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid var(--lb-sk-streg);
}
.lb-sk-tal-stribe__felt {
    flex: 1 1 120px;
    padding: 13px 18px;
    border-right: 1px solid var(--lb-sk-streg);
    background: var(--lb-sk-flade-2);
}
.lb-sk-tal-stribe__felt:last-child { border-right: 0; }
.lb-sk-tal-stribe__tal {
    margin: 0;
    font-family: var(--lb-sk-display);
    font-size: 23px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--lb-sk-hvid);
}
.lb-sk-tal-stribe__tal--groen { color: var(--lb-sk-groen); }
.lb-sk-tal-stribe__tal--mangler { color: var(--lb-sk-daempet); }
.lb-sk-tal-stribe__navn {
    margin: 6px 0 0;
    font-family: var(--lb-sk-display);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.14em;
    color: var(--lb-sk-daempet);
}

/* ===========================================================================
   TABELLEN
   =========================================================================== */

.lb-sk-tabel {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.lb-sk-tabel th {
    background: var(--lb-sk-flade-2);
    text-align: right;
    padding: 8px 5px;
    font-family: var(--lb-sk-display);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: var(--lb-sk-daempet);
}
/* Navnet staar i kolonne 2 og faar pladsen. Resten holdes smalle. */
.lb-sk-tabel th:first-child,
.lb-sk-tabel th:nth-child(2) { text-align: left; }
.lb-sk-tabel th:first-child { padding-left: var(--lb-sk-i-panel); }
.lb-sk-tabel th:last-child {
    padding-right: var(--lb-sk-i-panel);
    color: var(--lb-sk-hvid);
}

.lb-sk-tabel td {
    padding: 10px 5px;
    text-align: right;
    color: var(--lb-sk-daempet);
    border-top: 1px solid var(--lb-sk-streg-svag);
}
.lb-sk-tabel td:first-child,
.lb-sk-tabel td:nth-child(2) { text-align: left; }
.lb-sk-tabel td:first-child { padding-left: 13px; border-left: 3px solid transparent; }
.lb-sk-tabel td:last-child {
    padding-right: var(--lb-sk-i-panel);
    font-family: var(--lb-sk-display);
    font-weight: 700;
    font-size: 14px;
    color: var(--lb-sk-hvid);
}
.lb-sk-tabel td a { color: var(--lb-sk-hvid); }

/* Ingen zebrastriber. Kun 1 px linjer. */

/* Zonerne er en kant, ikke en baggrund — saa de ikke slaas med markeringen. */
.lb-sk-tabel__op > td:first-child { border-left-color: var(--lb-sk-groen-flade); }
.lb-sk-tabel__ned > td:first-child { border-left-color: var(--lb-sk-roed); }

/* Din egen klub */
.lb-sk-tabel__egen { background: var(--lb-sk-markering); }
.lb-sk-tabel__egen > td:first-child { color: var(--lb-sk-groen); font-weight: 700; }
.lb-sk-tabel__egen > td:nth-child(2) a { font-weight: 700; }

.lb-sk-tabel__nr { font-family: var(--lb-sk-display); font-weight: 700; color: var(--lb-sk-svag); }
.lb-sk-tabel__plus { color: var(--lb-sk-groen); }
.lb-sk-tabel__minus { color: #C85A4A; }

/* Bred tabel i en smal spalte faar sin egen vandrette rulning. */
.lb-sk-rulle { overflow-x: auto; }
.lb-sk-rulle .lb-sk-tabel { min-width: 620px; }

/* ===========================================================================
   SMAA KOMPONENTER
   =========================================================================== */

/* Monogram: én farve. Groen betyder «din klub». */
.lb-sk-maerke {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    background: var(--lb-sk-grund);
    border: 1px solid var(--lb-sk-streg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--lb-sk-display);
    font-size: 8px;
    font-weight: 700;
    color: var(--lb-sk-hvid);
}
.lb-sk-maerke--din { background: var(--lb-sk-groen-flade); border-color: var(--lb-sk-groen-flade); }
.lb-sk-maerke--stor { width: 40px; height: 40px; flex-basis: 40px; font-size: 12px; }
.lb-sk-maerke--kaempe { width: 56px; height: 56px; flex-basis: 56px; font-size: 18px; border-color: var(--lb-sk-kant); }

/* Formstriben: firkanter, taettere, og U er lys — saa V-U-T ogsaa
   adskiller sig paa lyshed og ikke kun paa kuloer. */
.lb-sk-form { display: flex; gap: 4px; }
.lb-sk-form__brik {
    width: 20px;
    height: 20px;
    font-family: var(--lb-sk-display);
    font-size: 10px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--lb-sk-uafgjort);
    color: var(--lb-sk-hvid);
}
.lb-sk-form__brik--v { background: var(--lb-sk-groen-flade); }
.lb-sk-form__brik--t { background: var(--lb-sk-roed); }
.lb-sk-form__brik--lille { width: 17px; height: 17px; font-size: 9px; }

/* Tomtilstand: siger hvorfor, og peger videre. Nul er ikke et resultat. */
.lb-sk-tom {
    background: var(--lb-sk-flade);
    border: 1px dashed var(--lb-sk-kant);
    padding: 14px var(--lb-sk-i-panel);
}
.lb-sk-tom__etiket {
    margin: 0 0 7px;
    font-family: var(--lb-sk-display);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    color: var(--lb-sk-rav);
}
.lb-sk-tom__titel { margin: 0 0 8px; font-size: 14px; color: var(--lb-sk-hvid); }
.lb-sk-tom__note { margin: 0; font-size: 12px; color: var(--lb-sk-daempet); line-height: 1.45; }

/*
 * ANNONCEN SOM LYS OE
 *
 * En fremmed kreativ er tegnet til hvid baggrund. Oeen er mindre end
 * panelet og har 14 px luft hele vejen rundt, saa den laeses som en
 * reserveret plads og ikke som en side, der gik i stykker. Etiketten
 * staar UDEN FOR oeen, paa den moerke flade.
 *
 * Og: en tom plads er ikke det samme som ingen plads. Er der intet at
 * vise, skal hele .lb-sk-annonce udelades i PHP — ikke skjules her.
 */
.lb-sk-annonce { background: var(--lb-sk-flade); border: 1px solid var(--lb-sk-streg); }
.lb-sk-annonce__hoved {
    margin: 0;
    padding: 7px 14px;
    border-bottom: 1px solid var(--lb-sk-streg);
    background: var(--lb-sk-flade-2);
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-family: var(--lb-sk-display);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.16em;
    color: var(--lb-sk-daempet);
}
.lb-sk-annonce__maal { font-size: 10px; letter-spacing: 0; color: var(--lb-sk-svag); }
.lb-sk-annonce__oe {
    margin: 14px;
    background: #FFFFFF;
    border: 1px solid var(--lb-sk-kant);
}
/* Egen kampagne: vi ejer markuppen, saa den bruger skallens farver. */
.lb-sk-annonce--egen .lb-sk-annonce__oe {
    margin: 0;
    background: transparent;
    border: 0;
    padding: 20px 18px;
}

/* ===========================================================================
   SMALLE SKAERME
   ===========================================================================
   Skinnen stabler over indholdet i stedet for at klemme tabellerne.
   Paa telefon bliver den til faneblade i bunden — det er en egen opgave,
   og den ligger i G-Mobil. Indtil da stabler den, og det er laesbart.
   =========================================================================== */

/*
 * FANEBLADENE I BUNDEN
 *
 * Paa desktop findes de ikke. Under 860 px erstatter de skinnen helt.
 *
 * HVORFOR IKKE BARE STABLE SKINNEN:
 * Det stod der foerst, med en kommentar om at det «er laesbart». Maalt paa
 * 375 px fyldte de elleve punkter plus klubblokken HELE den foerste skaerm,
 * foer stillingen overhovedet begyndte. Det er ikke laesbart, det er en mur.
 *
 * Z-INDEX ER MAALT, IKKE GAETTET:
 *   .cmplz-cookiebanner   fixed, bottom, z-index 99999
 *   .cmplz-manage-consent fixed, bottom -35px, 0x0 naar afvist
 *   sitets eget design    hoejeste z-index 99, INGEN position:fixed
 *
 * Baren ligger derfor paa 120: over alt vores eget, og langt under
 * cookiebanneret. Det er med vilje. Samtykket er en engangsbeslutning, der
 * skal traeffes foerst — navigationen kan vente de faa sekunder, og en
 * navigationsbar, der daekkede banneret, ville vaere et samtykkeproblem og
 * ikke et designvalg.
 */

.lb-sk__faneblade { display: none; }

@media (max-width: 860px) {
    /* Skinnen forsvinder helt. Dens indhold ligger i «Mere». */
    .lb-sk__skinne { display: none; }

    .lb-sk__krop { padding: 14px; }
    .lb-sk__kontekst,
    .lb-sk__faner { padding-left: 14px; padding-right: 14px; }
    .lb-sk__soeg { margin-left: 0; flex-basis: 100%; }

    /* Plads til baren, saa den ikke daekker sidens sidste raekke. */
    .lb-sk {
        padding-bottom: calc(58px + env(safe-area-inset-bottom, 0px));
    }

    .lb-sk__faneblade {
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 120;
        background: var(--lb-sk-skinne);
        border-top: 1px solid var(--lb-sk-streg);
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }

    .lb-sk__faneblad {
        flex: 1 1 0;
        min-width: 0;
        min-height: 58px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        border-top: 2px solid transparent;
        color: var(--lb-sk-daempet);
        font-size: 10px;
        font-weight: 600;
        text-align: center;
    }
    .lb-sk__faneblad:hover { color: var(--lb-sk-tekst); }
    .lb-sk__faneblad--aktiv,
    .lb-sk__faneblad--aktiv:hover {
        border-top-color: var(--lb-sk-groen);
        color: var(--lb-sk-groen);
    }
    .lb-sk__faneblad svg { display: block; }

    /*
     * «Mere» er en <details>, ikke JavaScript.
     *
     * Den er tastaturtilgaengelig af sig selv, den virker uden scripts, og
     * den har ikke brug for en tilstand nogen steder. Panelet aabner opad,
     * over baren.
     */
    .lb-sk__mere { flex: 1 1 0; min-width: 0; }
    .lb-sk__mere > summary {
        list-style: none;
        cursor: pointer;
    }
    .lb-sk__mere > summary::-webkit-details-marker { display: none; }
    .lb-sk__mere[open] > summary {
        border-top-color: var(--lb-sk-groen);
        color: var(--lb-sk-groen);
    }

    /*
     * Panelet faar sin egen rulning. Det er IKKE den samme fejl som den
     * scrollende sidebar: dér var det indhold, man skulle laese, og to
     * rulleflader gjorde bunden usynlig. Her er det en menu, man aabner,
     * vaelger i og lukker igen — og den maa gerne vaere hoejere end skaermen.
     */
    .lb-sk__mere-panel {
        display: none;
        position: fixed;
        left: 0;
        right: 0;
        bottom: calc(58px + env(safe-area-inset-bottom, 0px));
        max-height: 62vh;
        overflow-y: auto;
        background: var(--lb-sk-skinne);
        border-top: 1px solid var(--lb-sk-streg);
        padding: 8px 0 12px;
    }
    .lb-sk__mere[open] .lb-sk__mere-panel { display: block; }
}

/* ===========================================================================
   SKALLEN SKAL UD AF TEMAETS INDHOLDSSPALTE
   ===========================================================================
   Maalt paa den levende klubside: `main.site-main` har `max-width: 800px`.
   Skallen laa derfor i en 752 px spalte, og skinnen (232) plus indholdet
   (560) kunne ikke staa side om side — de ombroed, og skinnen blev 752 px
   bred paa en desktopskaerm.

   SPECIFICITETEN ER IKKE TILFAELDIG. Temaets egen regel er
   `body:not([class*="elementor-page-"]) .site-main` = (0,2,1). En ren
   `body.lb-sk-aktiv .site-main` er ogsaa (0,2,1), og et uafgjort afgoeres
   af raekkefoelgen — altsaa af hvilken stilfil der tilfaeldigvis indlaeses
   sidst. Klassen gentages derfor: (0,3,1). Den vinder uanset raekkefoelge.

   Det er samme greb, som da profilsidernes bredde skulle rettes, og den
   rene `.single-lb_klub .site-main` paa (0,2,0) tabte tavst.
   =========================================================================== */

/*
 * DEN HVIDE STRIBE VAR BODY'EN.
 *
 * `main.site-main` er gennemsigtig, og `body` er hvid. Mellem temaets
 * titelbaand og skallens foerste panel var der derfor en hvid stribe
 * tvaers over siden. Den skyldes ikke skallen — den skyldes, at skallen
 * ikke daekker hele hoejden, og at det, der ligger bagved, er hvidt.
 */
body.lb-sk-aktiv.lb-sk-aktiv { background: #0B1118; }

/*
 * TITELBAANDET HOERER MED TIL SKALLEN.
 *
 * Paa holdsider (/klub/<klub>/<raekke>/) er temaets titel BEVIDST sidens
 * eneste h1 — holdsiden har ingen egen. Den maa derfor ikke skjules, men
 * den skal heller ikke staa som en loesrevet reklamesoejle over skallen.
 * Her bindes den sammen med skinnens flade og faar skallens typografi.
 */
body.lb-sk-aktiv.lb-sk-aktiv .page-header {
    background: var(--lb-sk-skinne, #080D13);
    border-bottom: 1px solid var(--lb-sk-streg, #243041);
    margin: 0;
    padding: 20px 22px;
}
body.lb-sk-aktiv.lb-sk-aktiv .page-header .entry-title,
body.lb-sk-aktiv.lb-sk-aktiv .page-header h1 {
    margin: 0;
    font-family: "Archivo Narrow", Archivo, "Roboto Condensed", Arial, sans-serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: #FFFFFF;
}

body.lb-sk-aktiv.lb-sk-aktiv .site-main {
    max-width: none;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
}
body.lb-sk-aktiv.lb-sk-aktiv .page-content,
body.lb-sk-aktiv.lb-sk-aktiv .entry-content {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}

/* Respekter at nogen har slaaet bevaegelse fra. Der er ingen animationer
   i filen i dag, men reglen staar, saa den ikke glemmes, naar der kommer. */
@media (prefers-reduced-motion: reduce) {
    .lb-sk *,
    .lb-sk *::before,
    .lb-sk *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}

/* ===========================================================================
   AABENT PUNKT: SKRIFTEN
   ===========================================================================
   Artboardsene hentede Archivo og Inter fra fonts.googleapis.com. Det kan
   sitet ikke: politikken siger, maalt, at der er NUL eksterne kald foer
   samtykke, og skrifterne ligger lokalt under
   uploads/elementor/google-fonts.

   Indtil Archivo er lagt samme sted og erklaeret med @font-face, falder
   --lb-sk-display tilbage paa Roboto Condensed eller Helvetica. Skallen
   er laesbar, men overskrifter og tal staar bredere end tegnet.

   Det er ét skridt, ikke en forhindring — og det skal goeres med et
   lokalt @font-face her i filen, aldrig med et link.
   =========================================================================== */

/* ===========================================================================
   TEMAETS SPRINGLINK

   Hello Elementors «Skip to main content» staar i #CC3366. Maalt mod skallens
   #0B1118 giver den 3,82:1 og falder for 4,5:1. Den er skjult, indtil man
   tabber til den — og netop dér skal den vaere laesbar, for det er hele dens
   formaal.

   Linket bor i temaets header, uden for .lb-sk, saa det kan ikke naa
   --lb-sk-*-variablerne. Farverne staar derfor direkte.
   =========================================================================== */
.lb-sk-aktiv .hfe-skip-link {
    color: #EAF2F8;
    background: #0B1118;
}

.lb-sk-aktiv .hfe-skip-link:focus {
    color: #0B1118;
    background: #EAF2F8;
    outline: 2px solid #1A7D49;
    outline-offset: 2px;
}
