/* =====================================================================
   NewSite.css – Lehrverpflichtungsportal Universität Passau
   Ergänzt Bootstrap 5.3 und Font Awesome 7; hell/dunkel; WCAG 2.2 AA.
   Gestaltung wie die Lernplattform „Lehreinheit“ (theme.css/layout.css):
   Source Sans 3, Uni-Orange #f8971c als Fläche mit dunkler Schrift,
   orangefarbener Text #9c5200 (hell) bzw. #fbb15c (dunkel), warme Flächen,
   Pill-Schaltflächen, weiche Schatten. Stand 10/2026.

   Grundsatz: Nur was von Bootstrap abweicht, steht hier; Views enthalten keine
   eigenen <style>-Blöcke. Farben und
   Abstände kommen aus den Tokens (Abschnitt 2); Komponenten werden
   möglichst über ihre --bs-*-Variablen angepasst.

   Inhalt
    1. Schriften
    2. Design-Tokens (Marke, hell, dunkel, hoher Kontrast)
    3. Grundlayout und Typografie
    4. Links, Fokus, Skip-Link
    5. Header, Navigation, Dropdown
    6. Breadcrumb
    7. Bootstrap-Komponenten (Card, Liste, Alert, Badge, Tabs …)
    8. Modal und Schließen-Schaltfläche
    9. Accordion
   10. Tabellen (inkl. Farbvarianten im Dunkelmodus)
   11. Formulare
   12. Schaltflächen
   13. Anwendungsweite Komponenten und Hilfsklassen (minh-*, maxw-* …)
   14. Seite „Erfüllung der Lehrverpflichtung“ (lv-*)
   15. Mitarbeiterlehre, Semesterplan, Verteilung, Planungsmonitor,
       Ermäßigungen, Lehrverpflichtung (ml-*, sp-*, pm-*, ez-*, lv-table)
   16. Seite „Meine Übungswünsche“ (wu-*)
   17. Barrierefreiheit (Bewegung, erzwungene Farben)
   18. Druck
   ===================================================================== */


/* ---------------------------------------------------------------------
   1. Schriften – Source Sans 3 (variabel 200–900, SIL OFL 1.1, lokal;
      Lizenz: Content/fonts/OFL-SourceSans3.txt). Pfade relativ zu
      /Content und /bundles gleichermaßen gültig.
   --------------------------------------------------------------------- */
@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 200 900; font-display: swap;
    src: url("../Content/fonts/source-sans-3-latin-wght-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 200 900; font-display: swap;
    src: url("../Content/fonts/source-sans-3-latin-ext-wght-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Source Sans 3"; font-style: italic; font-weight: 200 900; font-display: swap;
    src: url("../Content/fonts/source-sans-3-latin-wght-italic.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }


/* ---------------------------------------------------------------------
   2. Design-Tokens
   Kontraste nach WCAG 2.2 (relative Leuchtdichte). Uni-Orange erreicht
   auf Weiß nur 2,2 : 1 → im hellen Modus nur als Fläche mit dunkler
   Schrift (--upa-ink), als Textfarbe dient --upa-accent-text.
   --------------------------------------------------------------------- */

/* 2.1 Themenunabhängig */
:root {
    /* Marke */
    --upa-orange: #f8971c;
    --upa-orange-light: #faa940;
    --upa-orange-deep: #e3820a;
    --upa-grey: #8a8a8c;
    --upa-orange-icon: #c76a00;               /* Symbole/Grafik, 3,8 : 1 auf Weiß */
    --upa-ink: #1f2937;                       /* Schrift auf Orange: 6,6 : 1 */
    /* Form und Bewegung */
    --upa-radius: .875rem;                    /* Karten, Dialoge, Tabellenrahmen */
    --upa-radius-sm: .5rem;                   /* Eingaben, Menüeinträge */
    --upa-pill: 999px;                        /* Schaltflächen, Badges, Chips */
    --upa-ease: cubic-bezier(.2, .7, .2, 1);
    --upa-dur: .22s;
    /* Bootstrap-Grundwerte */
    --bs-body-font-family: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --bs-body-font-size: 1.0625rem;
    --bs-body-line-height: 1.6;
    --bs-border-radius: .5rem;
    --bs-border-radius-sm: .375rem;
    --bs-border-radius-lg: .875rem;
    --bs-border-radius-xl: 1rem;
    --bs-primary: #9c5200;                    /* Akzent als Text/Fläche mit weißer Schrift: 5,8 : 1 */
    --bs-primary-rgb: 156, 82, 0;
    /* Abstände und Laufweite (historische Namen) */
    --mg-padding-sm: 20px;
    --mg-padding-lg: 24px;
    --mg-letter-spacing: -0.01em;
}

/* 2.2 Hell */
:root,
[data-bs-theme="light"] {
    color-scheme: light;
    /* Bootstrap */
    --bs-body-bg: #faf7f2;                    /* warmes Off-White, Flächen (Weiß) heben sich ab */
    --bs-body-bg-rgb: 250, 247, 242;
    --bs-body-color: #1f2937;                 /* 14,7 : 1 */
    --bs-body-color-rgb: 31, 41, 55;
    --bs-emphasis-color: #111318;
    --bs-emphasis-color-rgb: 17, 19, 24;
    --bs-secondary-color: #5f5f61;            /* 6,1 : 1 */
    --bs-secondary-color-rgb: 95, 95, 97;
    --bs-secondary-bg: #f1ede6;
    --bs-secondary-bg-rgb: 241, 237, 230;
    --bs-tertiary-color: #5f5f61;
    --bs-tertiary-bg: #f6f2eb;
    --bs-tertiary-bg-rgb: 246, 242, 235;
    --bs-heading-color: #111318;
    --bs-link-color: #9c5200;                 /* 5,8 : 1 */
    --bs-link-color-rgb: 156, 82, 0;
    --bs-link-hover-color: #7a4100;
    --bs-link-hover-color-rgb: 122, 65, 0;
    --bs-border-color: #dcdcde;
    --bs-border-color-translucent: rgba(31, 41, 55, .12);
    --bs-highlight-bg: #ffe8cc;
    --bs-primary-text-emphasis: #7a4100;
    --bs-primary-bg-subtle: #fff1df;
    --bs-primary-border-subtle: #fbc98a;
    --bs-focus-ring-color: rgba(248, 151, 28, .55);
    /* Flächen und Linien */
    --upa-surface: #ffffff;                   /* Karten, Eingaben, Menüs */
    --upa-surface-alt: #faf7f2;
    --upa-surface-muted: #f1ede6;
    --upa-soft: #fff4e5;                      /* orange getönte Flächen (Hover, Auswahl) */
    --upa-track: #e8e8e9;                     /* Fortschritts- und Zählerhintergrund */
    --upa-line: #e4e1dc;
    --upa-header-bg: rgba(255, 255, 255, .92);
    --upa-header-solid: #ffffff;
    --upa-scroll-thumb: #c4c5c9;
    /* Eingaben */
    --upa-input-bg: #ffffff;
    --upa-input-border: #8a8a8c;              /* 3,45 : 1 (WCAG 1.4.11) */
    --upa-input-border-hover: #5f6064;
    --upa-input-disabled-bg: #f1ede6;
    /* Text und Zustände */
    --upa-accent-text: #9c5200;               /* Orange als Text: 5,8 : 1 */
    --upa-check: #9c5200;
    --upa-focus: #c76a00;                     /* Fokusrahmen 3,8 : 1 */
    --upa-focus-ring: rgba(248, 151, 28, .55);
    /* Tabellen und Hover */
    --upa-table-head-bg: #f6f2eb;
    --upa-table-head-color: #111318;
    --upa-row-alt: #fcfaf7;
    --upa-row-hover: #fff4e5;
    --upa-hover-interactive: #fff4e5;
    --upa-hover-veranstaltung: #fff4e5;
    --upa-hover-border: #e6850a;
    --upa-bg-pared: #fff4e5;
    /* Schatten (wie Lehreinheit) */
    --upa-shadow-sm: 0 1px 2px rgba(31, 41, 55, .06), 0 2px 6px rgba(31, 41, 55, .04);
    --upa-shadow: 0 1px 2px rgba(31, 41, 55, .06), 0 4px 16px rgba(31, 41, 55, .06);
    --upa-shadow-lg: 0 18px 40px -12px rgba(31, 41, 55, .22), 0 4px 10px rgba(31, 41, 55, .06);
    /* Seite „Erfüllung“ (lv-*) */
    --lv-pos: #1a7f37;                        /* 5,1 : 1 */
    --lv-neg: #b42318;                        /* 6,6 : 1 */
    --lv-pos-bg: #ecf7ef;
    --lv-warn-bg: #fff6e5;
    --lv-neg-bg: #fdecec;
    --lv-info-bg: #eef4fb;
    --lv-chip-lehre: #0b4f8a;
    --lv-chip-lehre-bg: #e6f0fa;
    --lv-chip-korr: #8a4500;
    --lv-chip-korr-bg: #fff1de;
    --lv-chip-sonst: #3d4148;
    --lv-chip-sonst-bg: #ececef;
    --lv-chip-interd: #5b2a86;
    --lv-chip-interd-bg: #f1e8fa;
}

/* 2.3 Dunkel */
[data-bs-theme="dark"] {
    color-scheme: dark;
    /* Bootstrap */
    --bs-body-bg: #16181b;
    --bs-body-bg-rgb: 22, 24, 27;
    --bs-body-color: #e6e6e7;                 /* 14,6 : 1 */
    --bs-body-color-rgb: 230, 230, 231;
    --bs-emphasis-color: #ffffff;
    --bs-emphasis-color-rgb: 255, 255, 255;
    --bs-secondary-color: #b0b0b2;            /* 8,6 : 1 */
    --bs-secondary-color-rgb: 176, 176, 178;
    --bs-secondary-bg: #2a2d32;
    --bs-secondary-bg-rgb: 42, 45, 50;
    --bs-tertiary-color: #b0b0b2;
    --bs-tertiary-bg: #1f2226;
    --bs-tertiary-bg-rgb: 31, 34, 38;
    --bs-heading-color: #ffffff;
    --bs-link-color: #fbb15c;                 /* 9,6 : 1 */
    --bs-link-color-rgb: 251, 177, 92;
    --bs-link-hover-color: #ffd29e;
    --bs-link-hover-color-rgb: 255, 210, 158;
    --bs-border-color: #3a3d42;
    --bs-border-color-translucent: rgba(255, 255, 255, .12);
    --bs-highlight-bg: #4a3315;
    --bs-highlight-color: #ffffff;
    --bs-primary-text-emphasis: #ffd29e;
    --bs-primary-bg-subtle: #3a2a14;
    --bs-primary-border-subtle: #7a4a12;
    --bs-secondary-text-emphasis: #d0d4d9;
    --bs-success-text-emphasis: #8fd6b0;
    --bs-info-text-emphasis: #8be3f5;
    --bs-warning-text-emphasis: #ffd27a;
    --bs-danger-text-emphasis: #ff9fa8;
    /* Flächen und Linien */
    --upa-surface: #1f2226;
    --upa-surface-alt: #24282d;
    --upa-surface-muted: #2a2d32;
    --upa-soft: #2b2218;
    --upa-track: #34373c;
    --upa-line: #34373c;
    --upa-header-bg: rgba(22, 24, 27, .9);
    --upa-header-solid: #16181b;
    --upa-scroll-thumb: #454b53;
    /* Eingaben */
    --upa-input-bg: #1f2226;
    --upa-input-border: #7d838c;              /* 4,2 : 1 */
    --upa-input-border-hover: #a3a9b1;
    --upa-input-disabled-bg: #24282d;
    /* Text und Zustände */
    --upa-orange-icon: #f8971c;
    --upa-ink: #16181b;
    --upa-accent-text: #fbb15c;               /* 9,6 : 1 */
    --upa-check: #fbb15c;
    --upa-focus: #f8971c;
    --upa-focus-ring: rgba(248, 151, 28, .45);
    /* Tabellen und Hover */
    --upa-table-head-bg: #24282d;
    --upa-table-head-color: #ffffff;
    --upa-row-alt: #1b1e21;
    --upa-row-hover: #2b2218;
    --upa-hover-interactive: #2b2218;
    --upa-hover-veranstaltung: #33281a;
    --upa-hover-border: #f8971c;
    --upa-bg-pared: #2b2218;
    /* Schatten */
    --upa-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
    --upa-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 16px rgba(0, 0, 0, .25);
    --upa-shadow-lg: 0 20px 44px -12px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .05);
    /* Seite „Erfüllung“ (lv-*) */
    --lv-pos: #6fdc8c;
    --lv-neg: #ff8a80;
    --lv-pos-bg: #19301f;
    --lv-warn-bg: #332b16;
    --lv-neg-bg: #3a1f22;
    --lv-info-bg: #1b2a3b;
    --lv-chip-lehre: #a8cdf7;
    --lv-chip-lehre-bg: #1d2d40;
    --lv-chip-korr: #ffc27a;
    --lv-chip-korr-bg: #3a2c18;
    --lv-chip-sonst: #d0d4d9;
    --lv-chip-sonst-bg: #2c3036;
    --lv-chip-interd: #d9b8f5;
    --lv-chip-interd-bg: #30243d;
}

/* 2.4 Nutzer wünscht mehr Kontrast: Linien und Rahmen kräftiger */
@media (prefers-contrast: more) {
    :root,
    [data-bs-theme="light"] {
        --upa-line: #8a8a8c;
        --bs-border-color: #6b6b6e;
        --upa-input-border: #4b4b4d;
        --bs-secondary-color: #3d4148;
    }

    [data-bs-theme="dark"] {
        --upa-line: #6b7179;
        --bs-border-color: #7d838c;
        --upa-input-border: #b3b8bf;
        --bs-secondary-color: #d0d4d9;
    }
}


/* ---------------------------------------------------------------------
   3. Grundlayout und Typografie
   --------------------------------------------------------------------- */
html {
    scroll-padding-top: 80px;                 /* Anker nicht unter dem Sticky-Header */
}

body {
    padding-bottom: 20px;
    accent-color: var(--upa-orange);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transition: background-color var(--upa-dur) ease, color var(--upa-dur) ease;
}

@media (min-width: 1440px) {
    :root {
        --bs-body-font-size: 1.125rem;
    }
}

::selection {
    background: #ffd29e;
    color: #1f2937;
}

* {
    scrollbar-color: var(--upa-scroll-thumb) transparent;   /* dezente Scrollbalken */
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: var(--mg-letter-spacing);
    text-wrap: balance;
}

h1 { font-size: clamp(1.6rem, 1.2rem + 1.8vw, 2.4rem); }
h2 { font-size: clamp(1.4rem, 1.2rem + .8vw, 1.7rem); }
h3 { font-size: clamp(1.25rem, 1.15rem + .5vw, 1.5rem); }
h4, h5, h6 { font-size: clamp(1.1rem, 1.05rem + .3vw, 1.3rem); }

p {
    margin-bottom: var(--mg-padding-sm);
    text-wrap: pretty;
}

hr {
    border-color: var(--upa-line);
    opacity: 1;
}

.body-content {
    min-height: 400px;
    padding-top: 1.25rem;
    padding-bottom: 20px;
}

/* <main> erhält Fokus nur programmatisch über den Skip-Link */
main:focus {
    outline: none;
}

/* Sanftes Einblenden des Hauptinhalts */
@media (prefers-reduced-motion: no-preference) {
    .body-content {
        animation: upa-fade-in .35s var(--upa-ease) both;
    }
}

@keyframes upa-fade-in {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
}


/* ---------------------------------------------------------------------
   4. Links, Fokus, Skip-Link (WCAG 1.4.1, 2.4.7, 2.4.11)
   Links bleiben unterstrichen; Bedienelemente in Link-Form nicht.
   --------------------------------------------------------------------- */
a {
    text-decoration-thickness: 1px;
    text-underline-offset: .2em;
    text-decoration-color: rgba(var(--bs-link-color-rgb), .45);
    transition: color var(--upa-dur) ease, text-decoration-color var(--upa-dur) ease;
}

a:hover {
    text-decoration-color: currentColor;
    text-decoration-thickness: 2px;
}

a:is(.btn, .nav-link, .navbar-brand, .dropdown-item, .list-group-item, .page-link, .badge, .accordion-button),
a:is(.btn, .nav-link, .navbar-brand, .dropdown-item, .list-group-item, .page-link, .badge, .accordion-button):hover {
    text-decoration: none;
}

:focus-visible {
    outline: 3px solid var(--upa-focus);
    outline-offset: 2px;
    border-radius: 4px;
}

.upa_skiplink {
    position: absolute;
    top: .5rem;
    left: .5rem;
    z-index: 2000;
    padding: .6rem 1.1rem;
    background: var(--upa-surface);
    color: var(--bs-emphasis-color);
    border: 2px solid var(--upa-focus);
    border-radius: var(--upa-radius-sm);
    box-shadow: var(--upa-shadow-lg);
    text-decoration: none;
}


/* ---------------------------------------------------------------------
   5. Header, Navigation, Dropdown
   --------------------------------------------------------------------- */
.upa_header {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: var(--upa-header-solid);
    border-bottom: 3px solid var(--upa-orange);
    line-height: 1.2;
    transition: transform .5s var(--upa-ease), background-color var(--upa-dur) ease;
}

/* Milchglas, wo unterstützt */
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
    .upa_header {
        background: var(--upa-header-bg);
        -webkit-backdrop-filter: saturate(1.4) blur(10px);
        backdrop-filter: saturate(1.4) blur(10px);
    }
}

.upa_header .navbar {
    min-height: 58px;
    --bs-navbar-padding-y: 0;
    --bs-navbar-color: var(--bs-body-color);
    --bs-navbar-hover-color: var(--bs-emphasis-color);
    --bs-navbar-active-color: var(--bs-emphasis-color);
    --bs-navbar-brand-padding-y: .6rem;
    --bs-navbar-toggler-border-color: var(--upa-input-border);
    --bs-navbar-toggler-focus-width: 3px;
}

.navbar-toggler {
    border-radius: var(--upa-radius-sm);
    padding: .4rem .6rem;
}

.navbar-toggler:focus {
    box-shadow: 0 0 0 .2rem var(--upa-focus-ring);
}

.upa_logo_short {
    display: block;
    height: 30px;
    width: auto;
}

[data-bs-theme="dark"] .upa_logo_short {
    filter: brightness(0) invert(1);
}

.navbar .nav-link {
    white-space: nowrap;
    font-weight: 600;
    transition: color var(--upa-dur) ease;
}

/* Orangefarbener Unterstrich für aktive/überfahrene Menüpunkte */
.navbar .nav-item {
    position: relative;
}

.navbar .nav-item::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 15px;
    right: 15px;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: var(--upa-orange);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .35s var(--upa-ease);
    pointer-events: none;
}

.navbar .nav-item:hover::after,
.navbar .nav-item:focus-within::after,
.navbar .nav-item.active::after {
    transform: scaleX(1);
}

.navbar .nav-item.active > .nav-link {
    color: var(--bs-emphasis-color);
    font-weight: 600;
}

@media (min-width: 1200px) {
    .nav-link {
        --bs-nav-link-padding-y: 16px;
    }
}

/* Mobil: Akzent links statt unten, größere Zielflächen (WCAG 2.5.8) */
@media (max-width: 991.98px) {
    .navbar-collapse {
        padding-bottom: .75rem;
    }

    .navbar .nav-link {
        white-space: normal;
        padding-top: .7rem;
        padding-bottom: .7rem;
    }

    .navbar .nav-item > .nav-link {
        padding-left: .85rem;
    }

    .navbar .nav-item::after {
        top: .5rem;
        bottom: .5rem;
        left: 0;
        right: auto;
        width: 3px;
        height: auto;
        border-radius: 0 3px 3px 0;
        transform: scaleY(0);
        transform-origin: center;
    }

    .navbar .nav-item:hover::after,
    .navbar .nav-item:focus-within::after,
    .navbar .nav-item.active::after {
        transform: scaleY(1);
    }
}

.dropdown-menu {
    --bs-dropdown-bg: var(--upa-surface);
    --bs-dropdown-border-color: var(--upa-line);
    --bs-dropdown-border-radius: var(--upa-radius);
    --bs-dropdown-inner-border-radius: calc(var(--upa-radius) - 1px);
    --bs-dropdown-padding-y: 6px;
    --bs-dropdown-link-color: var(--bs-body-color);
    --bs-dropdown-link-hover-color: var(--bs-emphasis-color);
    --bs-dropdown-link-hover-bg: var(--upa-soft);
    --bs-dropdown-link-active-color: var(--bs-emphasis-color);
    --bs-dropdown-link-active-bg: var(--upa-soft);
    --bs-dropdown-divider-bg: var(--upa-line);
    padding-left: 6px;
    padding-right: 6px;
    box-shadow: var(--upa-shadow-lg);
}

.dropdown-menu.show {
    animation: upa-pop .18s var(--upa-ease);
}

@keyframes upa-pop {
    from { opacity: 0; transform: translateY(-4px) scale(.98); }
    to   { opacity: 1; transform: none; }
}

.dropdown-item {
    padding: .5rem 1rem;
    border-radius: var(--upa-radius-sm);
    transition: background-color .15s ease, color .15s ease;
}

.dropdown-item.active {
    box-shadow: inset 3px 0 0 var(--upa-orange);
    font-weight: 600;
}

.dropdown-header {
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--bs-secondary-color);
}

nav.navbar.upa_main_nav_desktop .dropdown-item {
    padding: .6rem 1rem;
}

.dropdown-item .fa-fw,
.dropdown-item > i:first-child {
    margin-right: .45rem;
}


/* ---------------------------------------------------------------------
   6. Breadcrumb (Icons aus icons_v2.svg, horizontal scrollbar)
   --------------------------------------------------------------------- */
.breadcrumb {
    --bs-breadcrumb-margin-bottom: 0;
    --bs-breadcrumb-font-size: 14px;
    --bs-breadcrumb-item-active-color: var(--bs-secondary-color);
    line-height: 1.8;
}

.upa_breadcrumb {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 15px 16px 13px;
    overflow: hidden;
}

/* Ausblendverlauf rechts, solange die Leiste scrollt */
.upa_breadcrumb::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 60px;
    background: linear-gradient(90deg, transparent 0%, var(--bs-body-bg) 100%);
    pointer-events: none;
}

.upa_breadcrumb .breadcrumb {
    overflow-x: auto;
    white-space: nowrap;
    flex-wrap: nowrap;
    scrollbar-width: none;
}

.upa_breadcrumb .breadcrumb::-webkit-scrollbar {
    display: none;
}

.upa_breadcrumb .breadcrumb li {
    display: inline-flex;
    position: relative;
    padding-left: 24px;
}

.upa_breadcrumb .breadcrumb li:first-child {
    padding-left: 0;
}

.upa_breadcrumb .breadcrumb a {
    text-decoration: none;
}

.upa_breadcrumb .breadcrumb a:hover {
    text-decoration: underline;
}

.upa_breadcrumb_home {
    position: relative;
    top: -2px;
}

.upa_breadcrumb_home::after {
    content: "";
    display: inline-block;
    height: 16px;
    width: 16px;
    background: url("../content/icons_v2.svg") no-repeat 0 -16px / 160px;
    transform: translateY(4px);
}

.breadcrumb-item + .breadcrumb-item::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 5px;
    width: 14px;
    height: 14px;
    background: url("../content/icons_v2.svg") no-repeat -126px 0 / 140px;
    opacity: .7;
}

[data-bs-theme="dark"] .upa_breadcrumb_home::after,
[data-bs-theme="dark"] .breadcrumb-item + .breadcrumb-item::before {
    filter: invert(1);
}

@media (min-width: 1200px) {

    .upa_breadcrumb::after {
        display: none;
    }
}


/* ---------------------------------------------------------------------
   7. Bootstrap-Komponenten – nur Variablen auf die Palette gelegt
   --------------------------------------------------------------------- */
.card {
    --bs-card-bg: var(--upa-surface);
    --bs-card-border-color: var(--upa-line);
    --bs-card-border-radius: var(--upa-radius);
    --bs-card-inner-border-radius: calc(var(--upa-radius) - 1px);
    --bs-card-cap-bg: var(--upa-surface-alt);
    --bs-card-cap-color: var(--bs-heading-color);
    box-shadow: var(--upa-shadow-sm);
}

.card-header {
    font-weight: 600;
}

.list-group {
    --bs-list-group-bg: var(--upa-surface);
    --bs-list-group-border-color: var(--upa-line);
    --bs-list-group-border-radius: var(--upa-radius);
    --bs-list-group-action-hover-bg: var(--upa-soft);
    --bs-list-group-action-hover-color: var(--bs-emphasis-color);
    --bs-list-group-active-bg: var(--upa-soft);
    --bs-list-group-active-border-color: var(--upa-orange);
    --bs-list-group-active-color: var(--bs-emphasis-color);
}

.list-group-item-action {
    transition: background-color .15s ease;
}

.alert {
    --bs-alert-border-radius: var(--upa-radius);
    border-left-width: 4px;
    box-shadow: var(--upa-shadow-sm);
}

div.alert > p:last-child,
div.alert > ul:last-child,
div.alert ul {
    margin-bottom: 0;
}

.badge {
    display: inline-flex;
    align-items: center;
    gap: .3em;
    font-weight: 600;
    letter-spacing: .01em;
    border-radius: var(--upa-pill);
    padding: .38em .7em;
}

/* Akzent-Badge wie Lehreinheit (Orange mit dunkler Schrift) */
.badge-accent {
    background: var(--upa-orange);
    color: var(--upa-ink);
}

/* Gelbe Badges: dunkle Schrift statt Weiß */
.badge.bg-warning,
.badge.text-bg-warning {
    color: var(--upa-ink) !important;
}

.pagination {
    --bs-pagination-bg: var(--upa-surface);
    --bs-pagination-border-color: var(--upa-line);
    --bs-pagination-hover-bg: var(--upa-soft);
    --bs-pagination-hover-border-color: var(--upa-line);
    --bs-pagination-active-bg: var(--upa-orange);
    --bs-pagination-active-border-color: var(--upa-orange);
    --bs-pagination-active-color: var(--upa-ink);
    --bs-pagination-focus-box-shadow: 0 0 0 .2rem var(--upa-focus-ring);
}

.nav-tabs {
    --bs-nav-tabs-border-color: var(--upa-line);
    --bs-nav-tabs-link-active-bg: var(--upa-surface);
    --bs-nav-tabs-link-active-border-color: var(--upa-line) var(--upa-line) var(--upa-surface);
    --bs-nav-tabs-border-radius: var(--upa-radius-sm);
}

.nav-tabs .nav-link.active {
    box-shadow: inset 0 3px 0 var(--upa-orange);
    font-weight: 600;
}

.nav-pills {
    --bs-nav-pills-border-radius: var(--upa-pill);
    --bs-nav-pills-link-active-bg: var(--upa-orange);
    --bs-nav-pills-link-active-color: var(--upa-ink);
}

.progress,
.progress-stacked {
    --bs-progress-bg: var(--upa-track);
    --bs-progress-bar-bg: var(--upa-orange);
    --bs-progress-bar-color: var(--upa-ink);
    --bs-progress-border-radius: var(--upa-pill);
}

.offcanvas {
    --bs-offcanvas-bg: var(--upa-surface);
}

/* Akzentfarbe als Text/Symbol (wie Lehreinheit) */
.text-accent { color: var(--upa-accent-text); }
.icon-accent { color: var(--upa-orange-icon); }

/* Dunkelmodus: Bootstrap-Hilfsklassen mit festen Hellwerten anpassen */
[data-bs-theme="dark"] .text-primary {
    color: var(--upa-accent-text) !important;   /* #9c5200 wäre auf Dunkel zu schwach */
}

[data-bs-theme="dark"] .text-bg-light {
    background-color: var(--bs-secondary-bg) !important;
    color: var(--bs-body-color) !important;
}


/* ---------------------------------------------------------------------
   8. Modal und Schließen-Schaltfläche
   --------------------------------------------------------------------- */
.modal {
    --bs-modal-bg: var(--upa-surface);
    --bs-modal-border-radius: var(--upa-radius);
    --bs-modal-inner-border-radius: calc(var(--upa-radius) - 1px);
    --bs-modal-border-width: 0;
    --bs-modal-header-border-color: var(--upa-line);
    --bs-modal-footer-border-color: var(--upa-line);
}

.modal-content {
    box-shadow: var(--upa-shadow-lg);
    overflow: hidden;
}

.modal-backdrop {
    --bs-backdrop-bg: #0b0c0e;
    --bs-backdrop-opacity: .6;
}

@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
    .modal-backdrop.show {
        -webkit-backdrop-filter: blur(3px);
        backdrop-filter: blur(3px);
    }
}

.modal.fade .modal-dialog {
    transform: translateY(16px) scale(.98);
    transition: transform .28s var(--upa-ease), opacity .2s ease;
}

.modal.show .modal-dialog {
    transform: none;
}

.modal-header {
    background: var(--upa-surface-alt);
    border-bottom: 3px solid var(--upa-orange);   /* Markenlinie wie Seitenkopf */
}

.modal-title {
    margin: 0 !important;
    font-weight: 700;
}

/* Smartphone: Dialog fast randlos */
@media (max-width: 575.98px) {
    .modal-dialog {
        margin: .5rem;
    }
}

/* Schließen-„X“ aus zwei Strichen in currentColor – passt sich jedem Modus an */
.btn-close {
    --bs-btn-close-opacity: 1;
    --bs-btn-close-hover-opacity: 1;
    --bs-btn-close-focus-shadow: 0 0 0 .25rem var(--upa-focus-ring);
    position: relative;
    width: 1.25em;
    height: 1.25em;
    background: none;
    border-radius: 50%;
    color: var(--bs-emphasis-color);
    filter: none !important;                  /* Bootstrap-Invert im Dunkelmodus aus */
}

.btn-close::before,
.btn-close::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 10%;
    width: 80%;
    height: 2px;
    margin-top: -1px;
    border-radius: 2px;
    background-color: currentColor;
    transition: transform .4s var(--upa-ease);
}

.btn-close::before { transform: rotate(45deg); }
.btn-close::after  { transform: rotate(-45deg); }
.btn-close:hover::before, .btn-close:focus-visible::before { transform: rotate(135deg); }
.btn-close:hover::after,  .btn-close:focus-visible::after  { transform: rotate(45deg); }

/* auf dunklem Untergrund */
.text-bg-dark .btn-close {
    color: #fff;
}


/* ---------------------------------------------------------------------
   9. Accordion
   --------------------------------------------------------------------- */
.accordion {
    --bs-accordion-border-radius: var(--upa-radius);
    --bs-accordion-inner-border-radius: calc(var(--upa-radius) - 1px);
    --bs-accordion-border-color: var(--upa-line);
    --bs-accordion-bg: var(--upa-surface);
    --bs-accordion-active-bg: var(--upa-surface-alt);
    --bs-accordion-active-color: var(--bs-emphasis-color);
    --bs-accordion-btn-bg: var(--upa-surface);
    --bs-accordion-btn-color: var(--bs-body-color);
    --bs-accordion-color: var(--bs-body-color);
    --bs-accordion-btn-padding-x: 16px;
    --bs-accordion-btn-padding-y: 14px;
    --bs-accordion-body-padding-x: 16px;
    --bs-accordion-body-padding-y: 0;
    --bs-accordion-btn-icon-width: 22px;
    --bs-accordion-btn-icon-transform: rotate(180deg);
    --bs-accordion-btn-icon-transition: transform .3s var(--upa-ease);
    --bs-accordion-btn-focus-box-shadow: inset 0 0 0 3px var(--upa-focus);
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%231f2937' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m3.5 6 4.5 4.5L12.5 6'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%239c5200' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m3.5 6 4.5 4.5L12.5 6'/%3e%3c/svg%3e");
    border-radius: var(--upa-radius);
    box-shadow: var(--upa-shadow-sm);
}

/* Bootstrap 5.3 setzt die Dunkel-Icons direkt auf ::after → dort überschreiben */
[data-bs-theme="dark"] .accordion,
[data-bs-theme="dark"] .accordion-button::after {
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23e6e6e7' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m3.5 6 4.5 4.5L12.5 6'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fbb15c' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m3.5 6 4.5 4.5L12.5 6'/%3e%3c/svg%3e");
}

.accordion-header {
    margin-bottom: 0 !important;
}

.accordion-button {
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.3;
    transition: background-color var(--upa-dur) ease, color var(--upa-dur) ease, box-shadow var(--upa-dur) ease;
}

.accordion-button span {
    transform: translateY(1px);
}

.accordion-button:not(.collapsed) {
    box-shadow: inset 4px 0 0 var(--upa-orange);
}

.accordion-item:hover .accordion-button.collapsed {
    background-color: var(--upa-soft);
}

.accordion-body .frame {
    padding: var(--mg-padding-sm) 0;
}

@media (min-width: 1200px) {
    .accordion-button {
        font-size: 1.25rem;
    }

    .accordion-body .frame {
        padding: var(--mg-padding-lg) 0;
    }
}


/* ---------------------------------------------------------------------
   10. Tabellen
   Gilt auch für Tabellen ohne .table (Stud.IP-Inhalte, ältere Views).
   --------------------------------------------------------------------- */
.table-responsive {
    background: var(--upa-surface);
    border: 1px solid var(--upa-line);
    border-radius: var(--upa-radius);
    box-shadow: var(--upa-shadow-sm);
    margin-bottom: calc(var(--mg-padding-sm) * 2);
}

.table-responsive > .table {
    margin-bottom: 0;
}

table {
    border: none;
    width: 100%;
    min-width: 100%;
}

.table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--bs-body-color);
    --bs-table-border-color: var(--upa-line);
    --bs-table-striped-bg: var(--upa-row-alt);
    --bs-table-striped-color: var(--bs-body-color);
    --bs-table-hover-bg: var(--upa-row-hover);
    --bs-table-hover-color: var(--bs-emphasis-color);
    --bs-table-active-bg: var(--upa-surface-muted);
}

table caption {
    caption-side: top;
    padding: 10px 0;
    line-height: 1.2;
    font-weight: 600;
    color: var(--bs-heading-color);
}

table td {
    padding: 10px 12px;
    vertical-align: top;
    overflow-wrap: anywhere;
}

table td a {
    word-break: normal;
}

/* zweiter Selektor nötig, weil Bootstrap .table-Zellen den Hintergrund setzt */
table th,
.table > :not(caption) > * > th {
    padding: 10px 12px;
    text-align: left;
    vertical-align: bottom;
    font-weight: 600;
    background-color: var(--upa-table-head-bg);
    color: var(--upa-table-head-color);
    border-top: 0;
}

table thead th,
.table > thead > tr > th {
    border-bottom: 3px solid var(--upa-orange);
    font-size: .875em;
    font-weight: 700;
    letter-spacing: .02em;
}

table th p,
table td p:last-child {
    margin-bottom: 0;
}

/* Zeilenkopf-Spalte so schmal wie möglich – außer in der Kopfzeile */
table tr th:first-child {
    width: 1%;
}

table tr:first-child th:first-child {
    width: auto;
}

/* Zebrastreifen für alle Tabellen; weiche Hover-Übergänge */
table tr:nth-child(even) {
    background-color: var(--upa-row-alt);
}

table tbody tr {
    transition: background-color .15s ease;
}

@media (min-width: 1200px) {
    .table-responsive {
        margin-bottom: calc(var(--mg-padding-lg) * 2);
    }

    table {
        font-size: 1.0625rem;
    }
}

/* Anklickbare Zeilen und Zellen */
.table.table-hover > tbody > tr.editAngehoerige *,
.table.table-hover > tbody > tr.editErfuellung *,
.table.table-hover > tbody > tr.addErfuellung *,
.table.table-hover > tbody > tr.lvPersonVorm * {
    cursor: pointer;
}

.table.table-hover > tbody > tr.no-hover * {
    --bs-table-hover-bg: transparent;
    --bs-table-active-bg: transparent;
}

td.interactive {
    transition: background-color .15s ease, box-shadow .15s ease;
}

td.interactive:hover {
    background-color: var(--upa-hover-interactive);
    box-shadow: inset 0 0 0 1px var(--upa-hover-border);
    cursor: pointer;
}

/* Wochenraster mit senkrechten Tagesköpfen */
tr.myRow td {
    font-size: 60%;
    vertical-align: middle;
}

tr.myRow th {
    writing-mode: vertical-lr;
    font-size: 100%;
    vertical-align: middle;
    text-align: center;
    border-bottom: 0;
}

tr.myRow div.blocker {
    min-height: 90px;
}

tr.myRow div.saveblocker {
    min-height: 65px;
}

/* Dunkelmodus: Bootstrap-Tabellenvarianten haben feste Hellwerte →
   auf die *-subtle-Farben des Dunkelmodus umlegen */
[data-bs-theme="dark"] :is(.table-primary, .table-secondary, .table-success, .table-info, .table-warning, .table-danger, .table-light) {
    --bs-table-color: var(--bs-body-color);
    --bs-table-striped-color: var(--bs-table-color);
    --bs-table-active-color: var(--bs-emphasis-color);
    --bs-table-hover-color: var(--bs-emphasis-color);
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}

[data-bs-theme="dark"] .table-primary   { --bs-table-bg: var(--bs-primary-bg-subtle);   --bs-table-border-color: var(--bs-primary-border-subtle);   --bs-table-color: var(--bs-primary-text-emphasis); }
[data-bs-theme="dark"] .table-secondary { --bs-table-bg: var(--bs-secondary-bg-subtle); --bs-table-border-color: var(--bs-secondary-border-subtle); --bs-table-color: var(--bs-secondary-text-emphasis); }
[data-bs-theme="dark"] .table-success   { --bs-table-bg: var(--bs-success-bg-subtle);   --bs-table-border-color: var(--bs-success-border-subtle);   --bs-table-color: var(--bs-success-text-emphasis); }
[data-bs-theme="dark"] .table-info      { --bs-table-bg: var(--bs-info-bg-subtle);      --bs-table-border-color: var(--bs-info-border-subtle);      --bs-table-color: var(--bs-info-text-emphasis); }
[data-bs-theme="dark"] .table-warning   { --bs-table-bg: var(--bs-warning-bg-subtle);   --bs-table-border-color: var(--bs-warning-border-subtle);   --bs-table-color: var(--bs-warning-text-emphasis); }
[data-bs-theme="dark"] .table-danger    { --bs-table-bg: var(--bs-danger-bg-subtle);    --bs-table-border-color: var(--bs-danger-border-subtle);    --bs-table-color: var(--bs-danger-text-emphasis); }
[data-bs-theme="dark"] .table-light     { --bs-table-bg: var(--bs-tertiary-bg);         --bs-table-border-color: var(--bs-border-color); }


/* ---------------------------------------------------------------------
   11. Formulare
   Eingaben: klare Fläche statt Grau, Rahmen im Uni-Grau (≥ 3 : 1),
   weicher Fokusring in Orange.
   --------------------------------------------------------------------- */
.form-control,
.form-select {
    background-color: var(--upa-input-bg);
    border: 1px solid var(--upa-input-border);
    border-radius: var(--upa-radius-sm);
    color: var(--bs-body-color);
    padding: .55rem .8rem;
    box-shadow: inset 0 1px 2px rgba(16, 18, 22, .04);
    transition: border-color var(--upa-dur) ease, box-shadow var(--upa-dur) ease, background-color var(--upa-dur) ease;
}

.form-select {
    padding-right: 2.25rem;                   /* Platz für den Pfeil */
}

.form-control:hover:not(:disabled):not([readonly]),
.form-select:hover:not(:disabled) {
    border-color: var(--upa-input-border-hover);
}

.form-control::placeholder {
    color: var(--bs-secondary-color);
    opacity: .85;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    background-color: var(--upa-input-bg);
    border-color: var(--upa-orange);
    box-shadow: 0 0 0 .25rem var(--upa-focus-ring);
    outline: none;
}

.form-control:disabled,
.form-select:disabled {
    background-color: var(--upa-input-disabled-bg);
    color: var(--bs-secondary-color);
    border-style: dashed;
    opacity: 1;
    cursor: not-allowed;
}

/* readonly: Fläche bleibt, nur der Rahmen wird dezenter */
.form-control[readonly] {
    background-color: var(--upa-input-bg);
    border-color: var(--bs-border-color);
    box-shadow: none;
}

.form-control.is-invalid:focus,
.form-select.is-invalid:focus,
.form-check-input.is-invalid:focus {
    box-shadow: 0 0 0 .25rem rgba(var(--bs-danger-rgb), .3);
}

.form-control-lg,
.form-select-lg {
    font-size: 1.1rem;
    border-radius: .625rem;
}

.form-label {
    font-weight: 600;
    color: var(--bs-heading-color);
    margin-bottom: .35rem;
}

.input-group-text {
    background-color: var(--upa-surface-alt);
    border-color: var(--upa-input-border);
    color: var(--upa-orange-icon);
    border-radius: var(--upa-radius-sm);
}

.input-group > .form-control,
.input-group > .form-select {
    box-shadow: none;
}

/* iOS: kein Auto-Zoom bei Fokus (Schrift ≥ 16 px) */
@media (max-width: 575.98px) {
    .form-control,
    .form-select {
        font-size: 16px;
    }
}

/* Autofill im Dunkelmodus nicht hellgelb */
[data-bs-theme="dark"] input:-webkit-autofill,
[data-bs-theme="dark"] input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--bs-body-color);
    -webkit-box-shadow: 0 0 0 100px #22303f inset;
    caret-color: var(--bs-body-color);
}

/* Checkboxen, Radios, Schalter: Akzentfarbe; hell weißer, dunkel dunkler Haken */
.form-check {
    line-height: 1.4;
    min-height: 1.6rem;
}

.form-check-input {
    background-color: var(--upa-input-bg);
    border: 1.5px solid var(--upa-input-border);
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.form-check-input[type="checkbox"] {
    border-radius: .3em;
}

.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate {
    background-color: var(--upa-check);
    border-color: var(--upa-check);
}

.form-switch .form-check-input {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%238a8a8c'/%3e%3c/svg%3e");
}

.form-switch .form-check-input:focus:not(:checked) {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23c76a00'/%3e%3c/svg%3e");
}

/* Dunkel: helle Akzentfläche → dunkle Symbole (Kontrast ≥ 7 : 1) */
[data-bs-theme="dark"] .form-check-input:checked[type="checkbox"] {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2316181b' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .form-check-input:checked[type="radio"] {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%2316181b'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .form-check-input[type="checkbox"]:indeterminate {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2316181b' stroke-linecap='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .form-switch .form-check-input:checked {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2316181b'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .form-switch .form-check-input:not(:checked) {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23a3a9b1'/%3e%3c/svg%3e");
}

/* Ungültige Checkbox: Label bleibt lesbar, nur das Feld wird rot */
.form-check-input.is-invalid ~ .form-check-label {
    color: var(--bs-body-color);
}

/* Floating Labels: Label-Hintergrund = Feldfläche (verhindert Überlagerung) */
.form-floating > label {
    font-weight: 500;
    color: var(--bs-secondary-color);
}

.form-floating > .form-control:not(textarea),
.form-floating > .form-select {
    height: calc(3.75rem + 2px);
    min-height: calc(3.75rem + 2px);
}

.form-floating > .form-control:focus,
.form-floating > .form-control:not(:placeholder-shown) {
    padding-top: 1.9rem;
    padding-bottom: .5rem;
}

.form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.form-floating > .form-select ~ label::after {
    background-color: var(--upa-input-bg) !important;
}

.form-floating > .form-control:disabled ~ label::after {
    background-color: var(--upa-input-disabled-bg) !important;
}

.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-select ~ label {
    color: var(--upa-accent-text);
}


/* ---------------------------------------------------------------------
   12. Schaltflächen – Pill-Form wie Lehreinheit; Hauptaktion in Uni-Orange
       mit dunkler Schrift (6,6 : 1), in beiden Modi gleich.
   --------------------------------------------------------------------- */
.btn {
    --bs-btn-padding-y: .5rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-border-radius: var(--upa-pill);
    --bs-btn-font-weight: 600;
    --bs-btn-focus-box-shadow: 0 0 0 .25rem var(--upa-focus-ring);
    line-height: 1.25;
    transition: color .15s ease, background-color .15s ease, border-color .15s ease, box-shadow .2s ease, transform .15s var(--upa-ease);
}

.btn:not(:disabled):not(.disabled):active {
    transform: translateY(1px);
}

.btn-sm {
    --bs-btn-padding-y: .3rem;
    --bs-btn-padding-x: .75rem;
    --bs-btn-border-radius: var(--upa-pill);
}

.btn-lg {
    --bs-btn-padding-y: .7rem;
    --bs-btn-padding-x: 1.4rem;
    --bs-btn-border-radius: var(--upa-pill);
}

/* In Eingabegruppen bündig mit den Feldern */
.input-group > .btn {
    --bs-btn-border-radius: var(--upa-radius-sm);
}

/* Hauptaktion (.btn-primary, historisch auch .btn-passau) */
.btn-primary,
.btn-passau {
    --bs-btn-color: var(--upa-ink);
    --bs-btn-bg: var(--upa-orange);
    --bs-btn-border-color: var(--upa-orange);
    --bs-btn-hover-color: var(--upa-ink);
    --bs-btn-hover-bg: var(--upa-orange-light);
    --bs-btn-hover-border-color: var(--upa-orange-light);
    --bs-btn-active-color: var(--upa-ink);
    --bs-btn-active-bg: var(--upa-orange-deep);
    --bs-btn-active-border-color: var(--upa-orange-deep);
    --bs-btn-disabled-color: var(--upa-ink);
    --bs-btn-disabled-bg: var(--bs-primary-border-subtle);
    --bs-btn-disabled-border-color: var(--bs-primary-border-subtle);
    --bs-btn-focus-shadow-rgb: 248, 151, 28;
}

.btn-outline-primary {
    --bs-btn-color: var(--upa-accent-text);
    --bs-btn-border-color: var(--upa-orange);
    --bs-btn-hover-color: var(--upa-ink);
    --bs-btn-hover-bg: var(--upa-orange);
    --bs-btn-hover-border-color: var(--upa-orange);
    --bs-btn-active-color: var(--upa-ink);
    --bs-btn-active-bg: var(--upa-orange-deep);
    --bs-btn-active-border-color: var(--upa-orange-deep);
    --bs-btn-disabled-color: var(--bs-secondary-color);
    --bs-btn-disabled-border-color: var(--upa-grey);
    --bs-btn-focus-shadow-rgb: 248, 151, 28;
}

/* Sekundär */
.btn-secondary {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: #5f6064;
    --bs-btn-border-color: #5f6064;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #4b4b4d;
    --bs-btn-hover-border-color: #4b4b4d;
    --bs-btn-active-bg: #3d3d3f;
    --bs-btn-active-border-color: #3d3d3f;
}

.btn-outline-secondary {
    --bs-btn-color: var(--bs-body-color);
    --bs-btn-bg: var(--upa-surface);
    --bs-btn-border-color: var(--upa-input-border);
    --bs-btn-hover-color: var(--bs-emphasis-color);
    --bs-btn-hover-bg: var(--upa-soft);
    --bs-btn-hover-border-color: var(--upa-orange);
    --bs-btn-active-color: var(--bs-emphasis-color);
    --bs-btn-active-bg: var(--upa-soft);
    --bs-btn-active-border-color: var(--upa-orange);
    --bs-btn-disabled-color: var(--bs-secondary-color);
    --bs-btn-disabled-border-color: var(--bs-border-color);
}

/* Ruhige Schaltfläche ohne Rahmen (wie .btn-quiet der Lehreinheit) */
.btn-quiet {
    --bs-btn-color: var(--bs-body-color);
    --bs-btn-border-color: transparent;
    --bs-btn-hover-color: var(--bs-emphasis-color);
    --bs-btn-hover-bg: var(--upa-soft);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-bg: var(--upa-soft);
}

.btn-warning {
    --bs-btn-color: var(--upa-ink);
    --bs-btn-hover-color: var(--upa-ink);
    --bs-btn-active-color: var(--upa-ink);
}

[data-bs-theme="dark"] .btn-outline-dark {
    --bs-btn-color: #e6e6e7;
    --bs-btn-border-color: #7d838c;
    --bs-btn-hover-color: #16181b;
    --bs-btn-hover-bg: #e6e6e7;
}

.btn-link {
    --bs-btn-font-weight: 600;
    --bs-btn-color: var(--bs-link-color);
    --bs-btn-hover-color: var(--bs-link-hover-color);
}


/* ---------------------------------------------------------------------
   13. Anwendungsweite Komponenten und Hilfsklassen
   --------------------------------------------------------------------- */

/* Anklickbare Veranstaltungen (Fahrplan, Planungsmonitor) */
div.Veranstaltung {
    cursor: pointer;
    transition: background-color var(--upa-dur) ease, border-color var(--upa-dur) ease, box-shadow var(--upa-dur) ease;
}

div.Veranstaltung:hover,
div.Veranstaltung:focus-within {
    background-color: var(--upa-hover-veranstaltung) !important;
    border-color: var(--upa-hover-border) !important;
    box-shadow: var(--upa-shadow);
}

footer.footer-bottom {
    font-size: 14px;
    color: var(--bs-secondary-color);
    border-top: 1px solid var(--upa-line);
    padding-top: 1rem;
    margin-top: 2rem;
}

/* Hilfsklassen statt style-Attributen (minh = Mindesthöhe, maxw/minw = Breite) */
.minh-6  { min-height: 6rem; }
.minh-8  { min-height: 8rem; }
.minh-12 { min-height: 12rem; }
.minh-15 { min-height: 15rem; }
.minh-19 { min-height: 19rem; }
.minw-14 { min-width: 14rem; }
.maxw-4  { max-width: 4rem; }
.maxw-18 { max-width: 18rem; }

.scroll-box {
    max-height: 16rem;
    overflow-y: auto;
}

.progress-thin {
    height: .6rem;
}


/* ---------------------------------------------------------------------
   14. Seite „Erfüllung der Lehrverpflichtung“ (lv-*)
   Farben: --lv-* in Abschnitt 2.
   --------------------------------------------------------------------- */

/* 14.1 Grundgerüst und Zahlen */
.lv-page {
    max-width: 1180px;
    margin: 0 auto;
}

.lv-num {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.is-pos { color: var(--lv-pos) !important; }
.is-neg { color: var(--lv-neg) !important; }

/* 14.2 Seitenkopf */
.lv-pagehead {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem 1.25rem;
    margin: .5rem 0 1.25rem;
}

.lv-pagehead-icon {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 14px;
    font-size: 1.5rem;
    color: var(--upa-ink);
    background: linear-gradient(135deg, var(--upa-orange-light), var(--upa-orange));
    box-shadow: 0 6px 16px -6px rgba(248, 151, 28, .65);
}

.lv-pagehead-text {
    flex: 1 1 18rem;
    min-width: 0;
}

.lv-pagehead-text h1 {
    margin: 0;
    font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2rem);
}

.lv-eyebrow {
    margin: 0 0 .1rem;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--upa-accent-text);
}

.lv-pagehead-sub {
    margin: .15rem 0 0;
    color: var(--bs-secondary-color);
    font-size: .95rem;
}

.lv-pagehead-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

/* 14.3 Filterleiste: 1 → 2 → 3 Spalten */
.lv-toolbar {
    display: grid;
    grid-template-columns: 1fr;
    gap: .75rem 1rem;
    padding: 1rem;
    margin-bottom: 1.5rem;
    background: var(--upa-surface);
    border: 1px solid var(--upa-line);
    border-radius: var(--upa-radius);
    box-shadow: var(--upa-shadow-sm);
}

@media (min-width: 768px) {
    .lv-toolbar {
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
    }

    .lv-toolbar > .lv-toolbar-field:last-child:nth-child(3) {
        grid-column: 1 / -1;
    }
}

@media (min-width: 1200px) {
    .lv-toolbar {
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1.3fr);
    }

    .lv-toolbar > .lv-toolbar-field:last-child:nth-child(3) {
        grid-column: auto;
    }
}

.lv-toolbar-label {
    display: block;
    margin-bottom: .3rem;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}

.lv-toolbar .form-select {
    text-overflow: ellipsis;
}

.lv-person-nav .btn {
    --bs-btn-padding-x: .75rem;
}

.lv-person-nav .btn:disabled {
    opacity: .4;
}

/* 14.4 Hinweisboxen und Status */
.lv-callout {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    padding: .85rem 1rem;
    border-radius: var(--upa-radius);
    border: 1px solid var(--upa-line);
    border-left-width: 4px;
    background: var(--upa-surface);
    color: var(--bs-body-color);
}

.lv-callout p:last-child {
    margin-bottom: 0;
}

.lv-callout-icon {
    flex: 0 0 auto;
    margin-top: .15rem;
    font-size: 1.25rem;
}

.lv-callout--accent {
    align-items: center;
    flex-wrap: wrap;
    border-left-color: var(--upa-orange);
    background: var(--upa-bg-pared);
}

.lv-callout--accent .lv-callout-icon { color: var(--upa-accent-text); }

.lv-callout--info {
    border-left-color: var(--bs-link-color);
    background: var(--lv-info-bg);
}

.lv-callout--info .lv-callout-icon { color: var(--bs-link-color); }

.lv-callout--muted {
    border-left-color: var(--upa-grey);
    background: var(--upa-surface-alt);
}

.lv-callout--muted .lv-callout-icon { color: var(--bs-secondary-color); }

.lv-callout--danger {
    border-left-color: var(--lv-neg);
    background: var(--lv-neg-bg);
}

.lv-callout--danger .lv-callout-icon { color: var(--lv-neg); }

.lv-status {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .25rem .7rem;
    border-radius: 999px;
    font-size: .85rem;
    font-weight: 600;
    white-space: nowrap;
}

.lv-status.is-done {
    color: var(--lv-pos);
    background: var(--lv-pos-bg);
}

.lv-status.is-open {
    color: var(--bs-secondary-color);
    background: var(--upa-surface);
    border: 1px dashed var(--upa-input-border);
}

/* 14.5 Einheiten-Auswahl */
.lv-units {
    display: grid;
    gap: .5rem;
    grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
}

.lv-unit {
    display: flex;
    flex-direction: column;
    padding: .6rem .8rem;
    border-radius: var(--upa-radius-sm);
    border: 1px solid var(--upa-line);
    background: var(--upa-surface);
    color: var(--bs-body-color);
    text-decoration: none !important;
    transition: border-color var(--upa-dur) ease, box-shadow var(--upa-dur) ease;
}

.lv-unit:hover {
    border-color: var(--upa-orange);
    box-shadow: var(--upa-shadow);
    color: var(--bs-emphasis-color);
}

.lv-unit-name {
    font-weight: 600;
    line-height: 1.3;
}

.lv-unit-meta {
    font-size: .85rem;
    color: var(--bs-secondary-color);
}

/* 14.6 Kennzahlen (KPI-Kacheln mit Fortschrittsbalken) */
.lv-kpis {
    display: grid;
    gap: .75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 992px) {
    .lv-kpis {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1rem;
    }
}

.lv-kpi {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: .2rem;
    padding: 1rem 1.1rem;
    background: var(--upa-surface);
    border: 1px solid var(--upa-line);
    border-radius: var(--upa-radius);
    box-shadow: var(--upa-shadow-sm);
    overflow: hidden;
}

.lv-kpi--accent::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: var(--upa-orange);
}

.lv-kpi-label {
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
    line-height: 1.3;
}

.lv-kpi-value {
    font-size: clamp(1.35rem, 1.1rem + 1vw, 1.85rem);
    font-weight: 700;
    line-height: 1.15;
    color: var(--bs-emphasis-color);
}

.lv-kpi-value small {
    font-size: .55em;
    font-weight: 600;
    color: var(--bs-secondary-color);
}

.lv-kpi-sub {
    font-size: .85rem;
    color: var(--bs-secondary-color);
    line-height: 1.35;
}

.lv-meter {
    position: relative;
    height: 8px;
    margin: .35rem 0 .1rem;
    border-radius: 999px;
    background: var(--upa-surface-muted);
}

.lv-meter-bar {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--upa-orange-light), var(--upa-orange));
    transition: width .6s var(--upa-ease);
}

.lv-meter.is-full .lv-meter-bar { background: var(--lv-pos); }
.lv-meter.is-low .lv-meter-bar  { background: var(--lv-neg); }

/* Markierung des Mindestwerts */
.lv-meter-min {
    position: absolute;
    top: -3px;
    bottom: -3px;
    width: 2px;
    margin-left: -1px;
    border-radius: 2px;
    background: var(--bs-emphasis-color);
    opacity: .55;
}

/* 14.7 Karten */
.lv-card {
    overflow: hidden;
}

.lv-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: .25rem 1rem;
    padding: .85rem 1.1rem;
    background: var(--upa-surface);
    border-bottom: 1px solid var(--upa-line);
}

.lv-card-title {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
}

.lv-card-title > i {
    color: var(--upa-accent-text);
}

.lv-card-meta {
    font-size: .85rem;
    color: var(--bs-secondary-color);
}

/* 14.8 Liste der Eintragungen */
.lv-items {
    list-style: none;
    margin: 0;
    padding: 0;
}

.lv-item {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: .9rem 1.1rem;
    border-bottom: 1px solid var(--upa-line);
    transition: background-color var(--upa-dur) ease, box-shadow var(--upa-dur) ease;
}

.lv-item.is-editable {
    cursor: pointer;
}

.lv-item.is-editable:hover,
.lv-item.is-editable:focus-within {
    background: var(--upa-row-hover);
    box-shadow: inset 4px 0 0 var(--upa-orange);
}

.lv-item.is-zero {
    box-shadow: inset 4px 0 0 var(--lv-neg);
}

.lv-item-main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.lv-item-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem;
}

.lv-item-nr {
    font-size: .8rem;
    color: var(--bs-secondary-color);
    font-variant-numeric: tabular-nums;
}

/* Titel ist ein <button class="stretched-link">: Fokusrahmen um die ganze Zeile */
.lv-item-title {
    display: block;
    padding: 0;
    margin: 0;
    border: 0;
    background: none;
    text-align: left;
    font: inherit;
    font-weight: 600;
    line-height: 1.35;
    color: var(--bs-emphasis-color);
}

button.lv-item-title:focus-visible {
    outline: none;
}

button.lv-item-title.stretched-link:focus-visible::after {
    outline: 3px solid var(--upa-focus);
    outline-offset: -3px;
    border-radius: 2px;
}

.lv-item.is-editable:hover .lv-item-title {
    text-decoration: underline;
    text-decoration-color: var(--upa-orange);
    text-underline-offset: .2em;
}

.lv-item-sub,
.lv-item-notes {
    font-size: .875rem;
    color: var(--bs-secondary-color);
}

.lv-item-notes {
    display: flex;
    flex-direction: column;
    gap: .1rem;
}

.lv-note--neg  { color: var(--lv-neg); }
.lv-note--warn { color: var(--lv-chip-korr); }

.lv-item-calc {
    font-size: .85rem;
    color: var(--bs-secondary-color);
}

.lv-item-calc b,
.lv-item-calc .text-primary {
    color: var(--bs-body-color) !important;
    font-weight: 600;
}

.lv-item-warn {
    font-size: .85rem;
    font-weight: 600;
    color: var(--lv-neg);
}

.lv-item-amount {
    flex: 0 0 auto;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--bs-emphasis-color);
}

.lv-item-amount small {
    font-size: .75em;
    font-weight: 600;
    color: var(--bs-secondary-color);
}

/* Kategorie-Chips */
.lv-chip {
    display: inline-flex;
    align-items: center;
    padding: .1rem .55rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .01em;
    line-height: 1.6;
    white-space: nowrap;
}

.lv-chip--lehre     { color: var(--lv-chip-lehre);  background: var(--lv-chip-lehre-bg); }
.lv-chip--korrektur { color: var(--lv-chip-korr);   background: var(--lv-chip-korr-bg); }
.lv-chip--sonst     { color: var(--lv-chip-sonst);  background: var(--lv-chip-sonst-bg); }
.lv-chip--interd    { color: var(--lv-chip-interd); background: var(--lv-chip-interd-bg); }
.lv-chip--pos       { color: var(--lv-pos);         background: var(--lv-pos-bg); }

/* Wochentage */
.lv-days {
    display: inline-flex;
    flex-wrap: wrap;
    gap: .25rem;
    margin-top: .1rem;
}

.lv-day {
    display: inline-grid;
    place-items: center;
    min-width: 1.9rem;
    height: 1.35rem;
    padding: 0 .3rem;
    border-radius: 6px;
    border: 1px solid var(--upa-line);
    background: var(--upa-surface-alt);
    font-size: .72rem;
    font-weight: 700;
    color: var(--bs-body-color);
}

/* Leerzustand und „Hinzufügen“-Fläche */
.lv-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    padding: 2rem 1rem 1rem;
    text-align: center;
    color: var(--bs-secondary-color);
}

.lv-empty > i {
    font-size: 2rem;
    opacity: .7;
}

.lv-add {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: .25rem .6rem;
    width: 100%;
    padding: .85rem 1rem;
    border: 2px dashed var(--upa-input-border);
    border-radius: var(--upa-radius);
    background: transparent;
    color: var(--bs-body-color);
    font-weight: 600;
    transition: border-color var(--upa-dur) ease, background-color var(--upa-dur) ease, color var(--upa-dur) ease;
}

.lv-add > i {
    color: var(--upa-accent-text);
    font-size: 1.15rem;
}

.lv-add small {
    font-weight: 400;
    color: var(--bs-secondary-color);
}

.lv-add:hover,
.lv-add:focus-visible {
    border-color: var(--upa-orange);
    border-style: solid;
    background: var(--upa-bg-pared);
    color: var(--bs-emphasis-color);
}

/* 14.9 Abrechnung (Kontoauszug) */
.lv-ledger {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    font-size: 1rem;
}

.lv-ledger tr,
.lv-ledger tr:nth-child(even) {
    background: transparent;                  /* globale Zebrastreifen aus */
}

.lv-ledger td {
    padding: .8rem 1.1rem;
    vertical-align: top;
    border-bottom: 1px solid var(--upa-line);
    overflow-wrap: break-word;
}

.lv-ledger tr:last-child td {
    border-bottom: 0;
}

.lv-ledger td.lv-amt {
    width: 1%;
    text-align: right;
    white-space: nowrap;
    font-weight: 700;
    color: var(--bs-emphasis-color);
}

.lv-ledger--sub {
    font-size: .95rem;
    background: var(--upa-surface-alt);
    border-top: 1px solid var(--upa-line);
}

.lv-ledger--sub td {
    padding-top: .55rem;
    padding-bottom: .55rem;
}

.lv-row--total td {
    background: var(--upa-surface-alt);
    font-weight: 600;
    color: var(--bs-emphasis-color);
}

.lv-ledger--sub .lv-row--total td {
    background: var(--upa-surface-muted);
}

.lv-row--grand td {
    background: var(--upa-surface-alt);
    border-top: 2px solid var(--upa-orange);
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--bs-emphasis-color);
}

.lv-row--grand td.lv-amt {
    font-size: 1.2rem;
}

/* Zeilenzustände: Fläche + farbiger Balken links */
.lv-row--pos td    { background: var(--lv-pos-bg); }
.lv-row--warn td   { background: var(--lv-warn-bg); }
.lv-row--danger td { background: var(--lv-neg-bg); }
.lv-row--pos td:first-child    { box-shadow: inset 4px 0 0 var(--lv-pos); }
.lv-row--warn td:first-child   { box-shadow: inset 4px 0 0 var(--upa-orange); }
.lv-row--danger td:first-child { box-shadow: inset 4px 0 0 var(--lv-neg); }

/* Rechenzeichen, Kappungshinweis, Erläuterung, Differenz */
.lv-op {
    display: inline-block;
    margin-right: .35rem;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}

.lv-op--neg { color: var(--lv-neg); }
.lv-op--pos { color: var(--lv-pos); }

.lv-cap {
    display: inline-block;
    margin-left: .4rem;
    padding: 0 .5rem;
    border-radius: 999px;
    border: 1px solid var(--upa-line);
    background: var(--upa-surface);
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.6;
    color: var(--bs-secondary-color);
    white-space: nowrap;
    vertical-align: .1em;
}

.lv-cap--neg {
    color: var(--lv-neg);
    border-color: currentColor;
}

.lv-hint {
    margin-top: .2rem;
    font-size: .85rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-secondary-color);
}

.lv-hint b {
    color: var(--bs-body-color);
}

.lv-delta {
    display: inline-block;
    margin-left: .4rem;
    font-size: .85rem;
    font-weight: 600;
}

.lv-sws-field {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    margin: 0;
    font-weight: 700;
}

.lv-sws-field .form-control {
    width: 6.5rem;
    padding: .3rem .5rem;
    text-align: right;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: inherit;
}

.lv-details {
    border-top: 1px solid var(--upa-line);
    padding: .75rem 1.1rem;
    font-size: .9rem;
    color: var(--bs-secondary-color);
}

.lv-details summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--bs-link-color);
    list-style-position: inside;
}

.lv-details summary:hover {
    text-decoration: underline;
}

.lv-details[open] summary {
    margin-bottom: .5rem;
}

/* 14.10 Begründung und Bestätigung */
.lv-textarea    { min-height: 9rem !important; }
.lv-textarea-sm { min-height: 6.5rem !important; }

.lv-confirm {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.lv-confirm .form-check {
    padding: .85rem 1rem .85rem 3.6rem;
    border-radius: var(--upa-radius);
    border: 1px solid var(--upa-line);
    background: var(--upa-surface-alt);
    transition: border-color var(--upa-dur) ease, background-color var(--upa-dur) ease;
}

.lv-confirm .form-check:has(.form-check-input:checked) {
    border-color: var(--lv-pos);
    background: var(--lv-pos-bg);
}

.lv-confirm .form-check-input {
    margin-left: -2.85rem;
    width: 2.4em;
    height: 1.3em;
    margin-top: .15em;
}

.lv-confirm .form-check-label {
    line-height: 1.5;
}

/* 14.11 Bearbeitungsdialog */
.lv-dlg {
    padding: 1.25rem;
}

@media (min-width: 768px) {
    .lv-dlg {
        padding: 1.5rem 1.75rem;
    }
}

.lv-dlg-title {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-width: 0;
}

.lv-dlg-title > i {
    font-size: 1.35rem;
    color: var(--upa-accent-text);
}

.lv-dlg-title .modal-title {
    line-height: 1.25;
}

/* Untertitel auf zwei Zeilen begrenzt */
.lv-dlg-sub {
    margin: .1rem 0 0;
    font-size: .875rem;
    color: var(--bs-secondary-color);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.lv-type-select {
    font-weight: 600;
}

/* Zwischenüberschrift mit auslaufender Linie */
.lv-dlg-section {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin: .5rem 0 .75rem;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}

.lv-dlg-section::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--upa-line);
}

/* auch als <legend> nutzbar (float/width zurückgesetzt) */
.lv-dlg-label {
    display: block;
    float: none;
    width: auto;
    margin-bottom: .35rem;
    padding: 0;
    font-size: .875rem;
    font-weight: 600;
    color: var(--bs-heading-color);
}

/* berechneter Wert neben Eingabefeldern */
.lv-calc {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    align-content: center;
    gap: .35rem;
    height: 100%;
    min-height: calc(3.75rem + 2px);
    padding: .6rem .9rem;
    border-radius: var(--upa-radius-sm);
    background: var(--upa-surface-alt);
    border: 1px dashed var(--upa-line);
}

.lv-calc-label {
    flex-basis: 100%;
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--bs-secondary-color);
}

.lv-calc-value {
    font-size: 1.25rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--bs-emphasis-color);
}

/* Wochentagsauswahl (btn-check als Pillen) */
.lv-weekdays {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.lv-weekdays .btn {
    --bs-btn-padding-x: 0;
    min-width: 3rem;
    border: 1px solid var(--upa-input-border);
    background: var(--upa-input-bg);
    color: var(--bs-body-color);
    border-radius: 999px;
}

.lv-weekdays .btn:hover {
    border-color: var(--upa-input-border-hover);
    background: var(--upa-surface-muted);
}

.lv-weekdays .btn-check:checked + .btn {
    background: var(--upa-orange);
    border-color: var(--upa-orange);
    color: var(--upa-ink);
}

.lv-weekdays .btn-check:focus-visible + .btn,
.lv-segmented .btn-check:focus-visible + .btn {
    outline: 3px solid var(--upa-focus);
    outline-offset: 2px;
}

.lv-panel {
    padding: 1rem 1.1rem 1.1rem;
    border: 1px solid var(--upa-line);
    border-radius: var(--upa-radius);
    background: var(--upa-surface-alt);
}

.lv-panel-legend {
    float: none;
    width: auto;
    margin: 0 0 .75rem;
    padding: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--bs-heading-color);
}

.lv-panel-legend > i {
    color: var(--upa-accent-text);
}

/* Segmentierte Auswahl (btn-group mit btn-check) */
.lv-segmented {
    padding: 3px;
    border-radius: 10px;
    background: var(--upa-surface-muted);
    gap: 3px;
}

.lv-segmented > .btn {
    --bs-btn-padding-y: .45rem;
    flex: 1 1 0;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent;
    color: var(--bs-secondary-color);
    font-size: .9rem;
    white-space: nowrap;
}

.lv-segmented > .btn:hover {
    color: var(--bs-emphasis-color);
}

.lv-segmented > .btn-check:checked + .btn {
    background: var(--upa-surface);
    color: var(--bs-emphasis-color);
    box-shadow: var(--upa-shadow-sm);
}

/* Ergebnis der Anteilsberechnung */
.lv-anteil-result {
    margin-top: .85rem;
    padding: .55rem .8rem;
    border-radius: var(--upa-radius-sm);
    background: var(--upa-surface);
    border: 1px solid var(--upa-line);
    font-size: .9rem;
}

.lv-anteil-result:empty {
    display: none;
}

.lv-anteil-result.is-error {
    color: var(--lv-neg);
    border-color: currentColor;
    background: var(--lv-neg-bg);
}

.lv-anteil-total {
    color: var(--upa-accent-text);
}

/* Infobox im Dialog – nur sichtbar, wenn sie Inhalt hat */
.lv-dlg-info {
    margin: 0 0 1rem;
    padding: .75rem 1rem;
    border-radius: var(--upa-radius);
    background: var(--lv-info-bg);
    font-size: .9rem;
}

.lv-dlg-info:not(:has(li)):not(:has(#infoTitle:not(:empty))) {
    display: none;
}

.lv-dlg-info #infolist {
    --bs-list-group-bg: transparent;
    --bs-list-group-border-radius: 0;
    margin-top: .5rem;
    max-height: 14rem;
    overflow: auto;
}

.lv-dlg-footer {
    gap: .5rem;
    background: var(--upa-surface-alt);
}

.lv-dlg-footer > * {
    margin: 0;
}

/* 14.12 Smartphone */
@media (max-width: 575.98px) {
    .lv-item {
        gap: .6rem;
        padding: .8rem .85rem;
    }

    .lv-item-amount {
        font-size: .95rem;
    }

    .lv-ledger td {
        padding-left: .75rem;
        padding-right: .75rem;
    }

    .lv-ledger td.lv-amt {
        padding-left: .25rem;
        font-size: .95rem;
    }

    .lv-sws-field {
        gap: .2rem;
    }

    .lv-sws-field .form-control {
        width: 4.6rem;
        padding: .25rem .35rem;
    }

    .lv-cap {
        margin-left: 0;
    }

    .lv-pagehead-actions {
        width: 100%;
    }

    .lv-pagehead-actions .btn {
        flex: 1 1 auto;
    }

    .lv-segmented {
        flex-direction: column;
    }

    .lv-dlg-footer #deleteErfuellung {
        width: 100%;
        order: 3;
    }
}


/* ---------------------------------------------------------------------
   15. Mitarbeiterlehre, Semesterplan, Verteilung und weitere Verwaltungsseiten
   --------------------------------------------------------------------- */

/* 15.1 Wochenraster (Terminwahl): Zellfarben und Belegungen */
.ml-raster td {
    min-width: 6.5rem;
    padding: .35rem;
}

.ml-raster .btn-check + .btn {
    min-height: 2.25rem;
}

.ml-zelle-sperre        { background-color: var(--bs-danger-bg-subtle) !important; }
.ml-zelle-veranstaltung { background-color: var(--bs-secondary-bg-subtle) !important; }
.ml-zelle-uebung        { background-color: var(--bs-success-bg-subtle) !important; }
.ml-zelle-empfohlen     { background-color: var(--bs-info-bg-subtle) !important; }
.ml-zelle-eigen         { background-color: var(--bs-warning-bg-subtle) !important; }

.ml-beleg {
    font-size: .8rem;
    line-height: 1.25;
    text-align: left;
    padding: .2rem .35rem;
    margin: .1rem 0;
    border-left: 3px solid var(--bs-secondary-border-subtle);
    border-radius: .25rem;
    background-color: color-mix(in srgb, var(--bs-body-bg) 55%, transparent);
    color: var(--bs-body-color);
}

.ml-beleg-sperre        { border-left-color: var(--bs-danger); }
.ml-beleg-veranstaltung { border-left-color: var(--bs-secondary); }
.ml-beleg-uebung        { border-left-color: var(--bs-success); }
.ml-beleg-empfohlen     { border-left-color: var(--bs-info); }
.ml-beleg-eigen         { border-left-color: var(--bs-warning); }

/* Legendenkästchen: .ml-legende (Farbe per bg-Klasse), .sp-wunsch-legende (gestrichelt) */
.ml-legende,
.sp-wunsch-legende {
    display: inline-block;
    width: .9rem;
    height: .9rem;
    vertical-align: -.1rem;
    border-radius: .2rem;
}

.ml-legende {
    border: 1px solid var(--bs-border-color);
}

/* 15.2 Semesterplan: Terminwunsch (gestrichelt) vs. verbindliche Festlegung */
.sp-wunsch,
.sp-wunsch-legende {
    outline: 1px dashed var(--bs-secondary-color);
    outline-offset: -1px;
}

.sp-wunsch {
    opacity: .9;
}

.sp-plan a.d-block {
    color: var(--bs-body-color);
    text-decoration: none;
    padding: .15rem .3rem;
}

.sp-plan td[rowspan] {
    vertical-align: middle;
}

/* Fortsetzung mehrstündiger Termine im Folgeblock */
.sp-fortsetzung {
    border: 1px dashed var(--bs-border-color);
    background: var(--bs-tertiary-bg);
    padding: .15rem .3rem;
}

/* 15.3 Aufklappbare Karten und Kriterien */
details.card > summary,
.ml-kriterien > summary {
    cursor: pointer;
}

details.card > summary {
    list-style: revert;
}

.ml-kriterien > form {
    color: var(--bs-body-color);
}

/* 15.4 Verteilung (person/verteilung) */
#uebersichtTabelle tr.ueAuswahl {
    cursor: pointer;
}

#uebersichtTabelle tr.ueAuswahl:focus-visible {
    outline: 2px solid var(--upa-focus);
    outline-offset: -2px;
}

/* zugeteilte Zeilen: grüner Balken links */
#wunschTabelle tr.ml-zugeteilt > * {
    box-shadow: inset 4px 0 0 var(--bs-success);
}

#wunschTabelle tr.ml-zugeteilt > td:first-child {
    font-weight: 700;
    color: var(--bs-success-text-emphasis);
}

/* Wunschtabelle: kompakt, Kopf bleibt beim Scrollen stehen */
.ml-wunschtabelle {
    --bs-table-bg: transparent;
    font-size: .875rem;
}

.ml-wunschtabelle > :not(caption) > * > * {
    vertical-align: top;
    padding: .45rem .5rem;
    border-color: var(--bs-border-color-translucent);
}

.ml-wunschtabelle thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--bs-tertiary-bg);
    color: var(--bs-emphasis-color);
    font-weight: 600;
    white-space: nowrap;
    border-bottom: 2px solid var(--bs-border-color);
}

/* sortierbare Kriterienspalte (Pfeil ↕ davor) */
.ml-wunschtabelle thead th.ml-krit {
    background: var(--bs-warning-bg-subtle);
    color: var(--bs-warning-text-emphasis);
}

.ml-wunschtabelle thead th.ml-krit::before {
    content: "\2195\00a0";
    opacity: .7;
}

.ml-wunschtabelle tbody tr:nth-child(even) > * {
    background-color: color-mix(in srgb, var(--bs-tertiary-bg) 55%, transparent);
}

.ml-wunschtabelle td.ml-text {
    min-width: 14rem;
    max-width: 26rem;
    white-space: normal;
}

.ml-wunschtabelle td.ml-text p {
    margin-bottom: .35rem;
}

.ml-wunschtabelle .ml-anmerkung {
    color: var(--bs-secondary-color);
    font-style: italic;
}

.ml-wunschtabelle .btn-group-vertical .btn {
    text-align: start;
}

.ml-wunschliste {
    margin: 0;
    padding-left: 1.1rem;
}

.ml-wunschliste li {
    margin-bottom: .15rem;
}

/* Übereinstimmung mit einem Kriterium */
.ml-treffer {
    background: var(--bs-success-bg-subtle);
    color: var(--bs-success-text-emphasis);
    border-radius: .2rem;
    padding: 0 .25rem;
    font-weight: 600;
}


/* 15.5 Planungsmonitor (admin/planungsmonitor): Tabellenvarianten folgen dem Theme;
        table-light/-primary/-success/-danger setzt auch Planungsmonitor.js */
.pm-table thead tr      { --bs-table-bg: var(--bs-secondary-bg);      --bs-table-color: var(--bs-emphasis-color); --bs-table-border-color: var(--bs-border-color); }
.pm-table .table-light   { --bs-table-bg: var(--bs-tertiary-bg);       --bs-table-color: var(--bs-body-color);     --bs-table-border-color: var(--bs-border-color); }
.pm-table .table-primary { --bs-table-bg: var(--bs-primary-bg-subtle); --bs-table-color: var(--bs-emphasis-color); --bs-table-border-color: var(--bs-primary-border-subtle); }
.pm-table .table-success { --bs-table-bg: var(--bs-success-bg-subtle); --bs-table-color: var(--bs-emphasis-color); --bs-table-border-color: var(--bs-success-border-subtle); }
.pm-table .table-danger  { --bs-table-bg: var(--bs-danger-bg-subtle);  --bs-table-color: var(--bs-emphasis-color); --bs-table-border-color: var(--bs-danger-border-subtle); }
.pm-table .Veranstaltung.text-danger    { color: var(--bs-danger-text-emphasis) !important; }
.pm-table .Veranstaltung.text-success   { color: var(--bs-success-text-emphasis) !important; }
.pm-table .Veranstaltung.text-secondary { color: var(--bs-secondary-color) !important; }

/* 15.6 Freisemester/Ermäßigungen (admin/Ermaessigungen) */
.ez-tabelle {                                   /* wie .table-responsive, aber ohne overflow: sticky Kopfzeile */
    background: var(--upa-surface);
    border: 1px solid var(--upa-line);
    border-radius: var(--upa-radius);
    box-shadow: var(--upa-shadow-sm);
}
.ez-tabelle > .table { border-radius: var(--upa-radius); }
#ErmaessigungenTabelle { table-layout: fixed; }
#ErmaessigungenTabelle thead th {
    position: sticky;
    top: var(--ez-top, 0px);
    z-index: 3;
    background: var(--upa-table-head-bg);
    color: var(--upa-table-head-color);
    box-shadow: inset 0 -2px 0 var(--upa-orange);
}
#ErmaessigungenTabelle .ez-spalte-semester { width: 11rem; }
@media (max-width: 575.98px) { #ErmaessigungenTabelle .ez-spalte-semester { width: 7.5rem; } }

tr.ez-start { border-top: 2px solid var(--bs-emphasis-color); }
tr.ez-ende  { border-bottom: 2px solid var(--bs-emphasis-color); }

/* Semesterkopf */
.ez-semester .btn-link { color: var(--upa-accent-text); text-decoration: none; padding-inline: .25rem; }
.ez-semester .btn-link:hover, .ez-semester .btn-link:focus-visible { text-decoration: underline; }
tr.ez-vergangen > td, tr.ez-vergangen > th { opacity: .62; }
tr.ez-vergangen:hover > td, tr.ez-vergangen:hover > th { opacity: 1; }
tr.ez-aktuell > th.ez-semester { box-shadow: inset 4px 0 0 var(--upa-orange); }
.ez-badge-aktuell { background: var(--upa-orange); color: var(--upa-ink); display: inline-block; margin-top: .15rem; }

/* Zellen */
td.ez-zelle { transition: background-color var(--upa-dur) ease, opacity var(--upa-dur) ease; }
.ez-name { font-weight: 500; margin-right: .25rem; }
.ez-badge { background: var(--upa-surface-muted); color: var(--bs-body-color); font-weight: 500; }
.ez-badge-tausch { background: var(--bs-primary-bg-subtle); color: var(--bs-primary-text-emphasis); font-weight: 500; }
.ez-erlaeuterung { color: var(--bs-secondary-color); font-size: .875em; margin-top: .15rem; white-space: pre-line; }
td.interactive:focus-visible,
td.projektion:focus-visible { outline: 3px solid var(--upa-focus); outline-offset: -3px; }

/* Tausch per Drag & Drop (Firefox: Drag statt Textauswahl) */
td.interactive[draggable="true"] { cursor: grab; -webkit-user-select: none; user-select: none; }
.ez-griff { color: var(--bs-tertiary-color); margin-right: .15rem; opacity: 0; transition: opacity var(--upa-dur) ease; }
td.interactive:hover .ez-griff, td.interactive:focus-visible .ez-griff { opacity: 1; }
@media (hover: none) { .ez-griff { display: none; } }
td.interactive.dragging { opacity: .4; }
.ez-ziehen-F td[data-col="E"], .ez-ziehen-E td[data-col="F"] { opacity: .35; }
.ez-ziehen-F td.interactive[data-col="F"]:not(.dragging),
.ez-ziehen-E td.interactive[data-col="E"]:not(.dragging) { box-shadow: inset 0 0 0 1px var(--bs-primary-border-subtle); }
td.interactive.drop-target {
    outline: 3px dashed var(--bs-primary);
    outline-offset: -3px;
    background-color: var(--bs-primary-bg-subtle) !important;
}

/* Turnus-Vorschläge (nicht gespeichert) */
td.projektion {
    cursor: pointer;
    font-style: italic;
    color: var(--bs-secondary-color);
    background-image: repeating-linear-gradient(135deg, transparent 0 8px, var(--bs-tertiary-bg) 8px 16px);
}
td.projektion:hover { color: var(--bs-body-color); outline: 2px dashed var(--bs-secondary); outline-offset: -2px; }
/* Nur-Ansicht (ohne Schreibrechte): Vorschläge ohne Klickfunktion, Semester ohne Menü */
td.ez-vorschlag {
    font-style: italic;
    color: var(--bs-secondary-color);
    background-image: repeating-linear-gradient(135deg, transparent 0 8px, var(--bs-tertiary-bg) 8px 16px);
}
.ez-semester-name { font-weight: 700; color: var(--upa-accent-text); padding-inline: .25rem; }

/* Person hervorheben */
.ez-filter { width: auto; max-width: 100%; }
.ez-filter .form-select { min-width: 14rem; }
.ez-filter-aktiv td.ez-zelle:not(.ez-treffer) { opacity: .3; }
.ez-filter-aktiv tr.ez-vergangen > td.ez-treffer { opacity: 1; }
td.ez-treffer { box-shadow: inset 4px 0 0 var(--upa-orange); background-color: color-mix(in srgb, var(--upa-orange) 12%, transparent); }

/* Legende */
.ez-chip {
    display: inline-flex; align-items: center; justify-content: center;
    width: 1.5rem; height: 1.25rem; border-radius: var(--upa-radius-sm);
    border: 1px solid var(--upa-line); background: var(--upa-surface);
}
.ez-chip-projektion { background-image: repeating-linear-gradient(135deg, transparent 0 4px, var(--bs-tertiary-bg) 4px 8px); }
.ez-chip-doppelt { background: var(--bs-danger-bg-subtle); color: var(--bs-danger-text-emphasis); }

/* Turnus ändern: Vorschau */
.ez-vorschau {
    padding: .6rem .75rem;
    border: 1px dashed var(--upa-line);
    border-radius: var(--upa-radius-sm);
    background: var(--upa-surface-alt);
}

/* Rückgängig-Leiste */
.ez-rueckgaengig {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 1040;
    display: flex;
    align-items: center;
    gap: .75rem;
    max-width: min(34rem, calc(100vw - 2rem));
    padding: .6rem .75rem .6rem 1rem;
    background: var(--upa-surface);
    border: 1px solid var(--upa-line);
    border-left: 4px solid var(--upa-orange);
    border-radius: var(--upa-radius);
}
.ez-rueckgaengig-text { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 575.98px) { .ez-rueckgaengig { left: 1rem; right: 1rem; } }
.ez-seite { padding-bottom: 5rem !important; }

@media (prefers-reduced-motion: reduce) {
    td.ez-zelle, .ez-griff { transition: none; }
}

/* 15.6b Fachsäulenplanung: Seitenstil in fachsaeule.css (nur auf /fachsaeule geladen). */
/* Fahrplan: Kennzeichnung aus der Fachsäulenplanung */
.fs-fp-marke { margin-left: .35rem; font-weight: 500; }
tr:has(.fs-fp-entfaellt) > td { opacity: .6; }
tr:has(.fs-fp-entfaellt) .Veranstaltung b { text-decoration: line-through; }


/* 15.7 Lehrverpflichtung überwachen (admin/lehrverpflichtung) */
.lv-table {
    font-variant-numeric: tabular-nums;
}

.lv-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--bs-body-bg);
    vertical-align: bottom;
}

.lv-table td.num,
.lv-table th.num {
    text-align: end;
    white-space: nowrap;
}

.lv-table tr.lv-group > td {
    --bs-table-bg: var(--bs-secondary-bg);
    color: var(--bs-emphasis-color);
    font-weight: 600;
}

.lv-table td.lv-warn   { --bs-table-bg: var(--bs-warning-bg-subtle); }
.lv-table td.lv-danger { --bs-table-bg: var(--bs-danger-bg-subtle); }
.lv-table tr.lv-person { cursor: pointer; }
.lv-pos { color: var(--bs-success-text-emphasis); }
.lv-neg { color: var(--bs-danger-text-emphasis); }

.lv-legend span {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    margin-right: .3rem;
    vertical-align: -.15rem;
    border: 1px solid var(--bs-border-color);
    border-radius: .2rem;
}

/* 15.8 Maildialog und Versandprotokoll */
.ml-vorschau {
    height: 22rem;
}

.ml-pre {
    max-width: 40rem;
    white-space: pre-wrap;
}

/* Filter-Chips (wie .seg der Lehreinheit) – gemeinsam für Fachsäulenplanung und Lehraufträge */
.fs-filter { display: flex; flex-wrap: wrap; align-items: center; gap: .375rem; }
.fs-chip {
    --ton: var(--upa-grey);
    display: inline-flex; align-items: center; gap: .35rem;
    min-height: 2.25rem; padding: .2rem .8rem;
    font: inherit; font-size: .9375rem; font-weight: 600; color: var(--bs-body-color);
    background: none; border: 1px solid var(--bs-border-color); border-radius: 999px;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
}
.fs-chip[data-ton=danger] { --ton: var(--bs-danger); }
.fs-chip[data-ton=warning] { --ton: var(--upa-orange); }
.fs-chip[data-ton=success] { --ton: var(--bs-success); }
.fs-chip[data-ton=info] { --ton: var(--bs-info); }
.fs-chip .fad { color: var(--ton); }
.fs-chip:hover { background: var(--upa-soft); border-color: var(--ton); }
.fs-chip.active { background: var(--upa-orange); border-color: var(--upa-orange); color: var(--upa-ink); }
.fs-chip.active .fad { color: inherit; }
.fs-chip-zahl {
    min-width: 1.5rem; padding: 0 .4rem;
    font-size: .8125rem; line-height: 1.5rem; text-align: center;
    background: var(--upa-track); border-radius: 999px;
}
.fs-chip.active .fs-chip-zahl { background: rgba(255, 255, 255, .55); }

.fs-chip:focus-visible { outline: 2px solid var(--upa-orange); outline-offset: 2px; }

/* 15.13 Vollmachten, Vertretungshinweis, Änderungsprotokoll */
.vm-banner {
    /* below the header (1030), so its dropdowns stay on top */
    position: sticky; top: 0; z-index: 1020; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .5rem 1rem;
    padding: .5rem 1rem; font-size: .9375rem; color: var(--upa-ink); background: var(--upa-orange);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
}
.vm-seite { max-width: 72rem; padding-bottom: 3rem; }
.vm-karte { margin-bottom: 1.25rem; padding: 1rem 1.25rem; background: var(--upa-surface); border: 1px solid var(--bs-border-color); border-radius: var(--upa-radius); box-shadow: var(--upa-shadow); }
.vm-karte h2 .fad { color: var(--upa-orange-icon); }
.pk-filter { padding: .75rem 1rem; background: var(--upa-surface-alt); border: 1px solid var(--bs-border-color); border-radius: var(--upa-radius); }
.pk-tabelle td { border-color: var(--upa-track); }
.pk-vertretung { color: var(--upa-accent-text); }
.pk-badge-i { color: #fff; background: var(--bs-success); }
.pk-badge-u { color: var(--upa-ink); background: var(--upa-orange); }
.pk-badge-d { color: #fff; background: var(--bs-danger); }
.pk-badge-s, .pk-badge-e { color: #fff; background: var(--bs-secondary); }
.pk-felder { width: 100%; margin: .15rem 0; border-collapse: collapse; }
.pk-felder th, .pk-felder td { padding: .15rem .5rem .15rem 0; vertical-align: top; border-bottom: 1px solid var(--upa-track); word-break: break-word; }
.pk-felder thead th { font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: var(--bs-secondary-color); }
.pk-felder tbody th { width: 12rem; font-weight: 600; }
.pk-felder tr.pk-geaendert td:nth-child(2) { color: var(--bs-danger-text-emphasis); text-decoration: line-through; text-decoration-thickness: 1px; }
.pk-felder tr.pk-geaendert td:nth-child(3) { color: var(--bs-success-text-emphasis); font-weight: 600; }
.pk-leer { font-style: italic; color: var(--bs-secondary-color); }
.pk-alle > summary { cursor: pointer; color: var(--upa-accent-text); }

/* 15.12 E-Mail versenden (admin/rundschreiben) */
.rs-seite { max-width: 110rem; padding-bottom: 6rem; }
.rs-karte { height: 100%; padding: 1rem 1.25rem; background: var(--upa-surface); border: 1px solid var(--bs-border-color); border-radius: var(--upa-radius); box-shadow: var(--upa-shadow); }
.rs-zwischen { margin: 1.25rem 0 .5rem; font-size: .8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--bs-secondary-color); }
.rs-text { min-height: 22rem; font-family: var(--bs-font-monospace); font-size: .875rem; line-height: 1.5; }
.rs-platzhalter { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; }
.rs-platzhalter .btn { --bs-btn-padding-y: 0; --bs-btn-padding-x: .4rem; font-family: var(--bs-font-monospace); font-size: .75rem; }
.rs-chips { display: flex; flex-wrap: wrap; gap: .3rem; }
.rs-chips .btn { --bs-btn-padding-y: .15rem; --bs-btn-padding-x: .6rem; border-radius: var(--upa-pill); font-size: .8125rem; }
.rs-chips .btn-check:checked + .btn { color: var(--upa-ink); background: var(--upa-orange); border-color: var(--upa-orange); }
.rs-empfaenger { max-height: 22rem; overflow-y: auto; border: 1px solid var(--bs-border-color); border-radius: .375rem; }
.rs-e-zeile { display: grid; grid-template-columns: auto 1fr auto; align-items: start; gap: .5rem; padding: .35rem .6rem; border-top: 1px solid var(--upa-track); font-size: .875rem; }
.rs-e-zeile:first-child { border-top: 0; }
.rs-e-zeile .form-check-input { margin-top: .2rem; }
.rs-e-zeile label { cursor: pointer; }
.rs-vorschau { display: block; width: 100%; height: 28rem; background: #fff; border: 1px solid var(--bs-border-color); border-radius: .375rem; }
.rs-aktionen {
    position: sticky; bottom: 0; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .5rem;
    margin-top: 1rem; padding: .75rem 1rem;
    background: color-mix(in srgb, var(--bs-body-bg) 92%, transparent); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    border: 1px solid var(--bs-border-color); border-radius: var(--upa-radius); box-shadow: var(--upa-shadow);
}
.rs-meta { display: grid; grid-template-columns: max-content 1fr; gap: .2rem 1rem; margin-bottom: 1rem; }
.rs-meta dt { font-weight: 600; color: var(--bs-secondary-color); }
.rs-meta dd { margin: 0; }
.rs-text-ansicht { max-height: 26rem; overflow: auto; padding: .75rem; white-space: pre-wrap; font-size: .8125rem; background: var(--upa-surface-alt); border: 1px solid var(--bs-border-color); border-radius: .375rem; }
.rs-empf-tabelle { max-height: 26rem; overflow-y: auto; font-size: .875rem; }

/* 15.11 Personalverzeichnis (person/personalverzeichnis) */
.pv-seite { max-width: 90rem; margin-inline: auto; padding: 0 1rem 3rem; }
.pv-suche {
    margin: 0 -1rem 1.5rem; padding: 2.25rem 1rem 2rem; text-align: center;
    background: linear-gradient(160deg, var(--upa-soft), transparent 75%);
    border-bottom: 1px solid var(--bs-border-color);
}
.pv-suche h1 { margin: 0 0 .35rem; font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.3rem); }
.pv-hinweis { margin: 0 auto 1.1rem; max-width: 40rem; color: var(--bs-secondary-color); }
.pv-suchfeld { position: relative; max-width: 44rem; margin-inline: auto; }
.pv-suchfeld > .fad { position: absolute; left: 1.1rem; top: 50%; transform: translateY(-50%); color: var(--upa-orange-icon); font-size: 1.15rem; pointer-events: none; }
.pv-suchfeld input { padding-left: 3rem; border-radius: var(--upa-pill); border-width: 2px; box-shadow: var(--upa-shadow); }
.pv-suchfeld input:focus { border-color: var(--upa-orange); }
.pv-ac .dropdown-item { display: grid; gap: .1rem; }
.pv-ac-name { font-weight: 600; }
.pv-ac-zusatz { font-size: .8125rem; color: var(--bs-secondary-color); }
.pv-ac .dropdown-item.active .pv-ac-zusatz { color: inherit; }

.pv-karte {
    max-width: 60rem; margin: 0 auto 2rem; padding: 1.25rem 1.5rem;
    background: var(--upa-surface); border: 1px solid var(--bs-border-color); border-top: 4px solid var(--upa-orange);
    border-radius: var(--upa-radius); box-shadow: var(--upa-shadow);
}
.pv-leer { text-align: center; color: var(--bs-secondary-color); border-top-width: 1px; }
.pv-kopf { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.pv-kopf h2 { margin: 0; font-size: 1.5rem; }
.pv-unter { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .9rem; margin: .35rem 0 0; font-size: .9375rem; color: var(--bs-secondary-color); }
.pv-badge-aktiv { color: var(--upa-ink); background: var(--upa-orange); }
.pv-zwischen { margin: 1.25rem 0 .5rem; font-size: .8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--bs-secondary-color); }
.pv-zeitleiste { list-style: none; margin: 0; padding: 0 0 0 1rem; border-left: 2px solid var(--upa-track); }
.pv-zeitleiste li { position: relative; display: grid; grid-template-columns: minmax(11rem, auto) 1fr; gap: .25rem 1.25rem; padding: .55rem 0 .55rem .5rem; }
.pv-zeitleiste li::before {
    content: ""; position: absolute; left: calc(-1rem - 6px); top: .95rem;
    width: 10px; height: 10px; border-radius: 50%; background: var(--upa-surface); border: 2px solid var(--upa-grey);
}
.pv-zeitleiste li.pv-laufend::before { background: var(--upa-orange); border-color: var(--upa-orange); }
.pv-zeit { font-weight: 600; white-space: nowrap; }
.pv-dauer { display: inline-block; margin-left: .35rem; padding: 0 .45rem; font-size: .75rem; font-weight: 600; color: var(--bs-secondary-color); background: var(--upa-track); border-radius: 999px; }
.pv-rollen { font-size: .875rem; }
.pv-details { margin-top: 1rem; }
.pv-details > summary { cursor: pointer; font-weight: 600; color: var(--upa-accent-text); }
.pv-details[open] > summary { margin-bottom: .5rem; }

.pv-semester-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; padding-bottom: .75rem; border-bottom: 2px solid var(--upa-orange); }
.pv-semester-kopf select { width: auto; }
.pv-semester-kopf input { max-width: 16rem; }
.pv-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr)); gap: 1rem; margin-top: 1rem; }
.pv-einrichtung { padding: .85rem 1rem; background: var(--upa-surface); border: 1px solid var(--bs-border-color); border-radius: var(--upa-radius); }
.pv-einrichtung h3 { display: flex; justify-content: space-between; gap: .5rem; margin: 0 0 .5rem; font-size: 1rem; }
.pv-einrichtung h3 a { color: inherit; text-decoration: none; }
.pv-einrichtung h3 a:hover { color: var(--upa-accent-text); text-decoration: underline; }
.pv-zahl { flex: none; min-width: 1.6rem; padding: 0 .45rem; font-size: .8125rem; line-height: 1.6rem; text-align: center; background: var(--upa-track); border-radius: 999px; }
.pv-einrichtung ul { list-style: none; margin: 0; padding: 0; }
.pv-einrichtung li { display: flex; justify-content: space-between; gap: .75rem; padding: .2rem 0; border-top: 1px solid var(--upa-track); font-size: .9375rem; }
.pv-einrichtung li:first-child { border-top: 0; }
.pv-person { padding: 0; font: inherit; text-align: left; color: var(--bs-body-color); background: none; border: 0; }
.pv-person:hover, .pv-person:focus-visible { color: var(--upa-accent-text); text-decoration: underline; }
.pv-rolle { flex: none; font-size: .8125rem; color: var(--bs-secondary-color); text-align: right; }
@media (max-width: 575.98px) {
    .pv-zeitleiste li { grid-template-columns: 1fr; }
    .pv-semester-kopf input { max-width: none; flex: 1 1 100%; }
}

/* 15.10 Lehraufträge (admin/lehrauftraege) */
.la-ober { margin: 0 0 .15rem; font-size: .8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--upa-accent-text); }
.la-semester { min-width: 15rem; }
.la-hinzufuegen-zeile { display: flex; flex-wrap: wrap; gap: .5rem; }
.la-suche-feld { flex: 1 1 22rem; position: relative; }
.la-filter { display: flex; flex-wrap: wrap; gap: .375rem; }
.la-tabelle {                               /* kein overflow: Vorschlagslisten sollen nicht abgeschnitten werden */
    padding: .75rem;
    background: var(--upa-surface);
    border: 1px solid var(--upa-line);
    border-radius: var(--upa-radius);
    box-shadow: var(--upa-shadow-sm);
}
#LaTabelle td { vertical-align: top; }
#LaTabelle td:first-child { min-width: 14rem; }
#LaTabelle td:last-child { min-width: 18rem; }
.la-name .btn-link { text-align: start; text-decoration: none; }
.la-marken { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; margin-top: .25rem; }
.la-marken:empty { display: none; }
.la-badge-antrag { color: var(--upa-ink); background: var(--upa-orange); }
.la-badge-ohne { color: var(--bs-danger-text-emphasis); background: var(--bs-danger-bg-subtle); border: 1px dashed var(--bs-danger); }
.la-veranstaltungen { margin: 0 0 .35rem; padding-left: 1.1rem; }
/* Vorschlagsliste „Veranstaltung hinzufügen“ (am body verankert, Position per Skript) */
.la-ac { z-index: 1080; overflow-y: auto; margin: 0; padding: .25rem 0; box-shadow: var(--upa-shadow); }
.la-ac .dropdown-item { white-space: normal; line-height: 1.3; padding-block: .4rem; }
.la-ac .dropdown-item mark { padding: 0; color: inherit; background: var(--upa-soft); font-weight: 700; }
.la-ac .dropdown-item.active mark { background: transparent; text-decoration: underline; }
.la-ac .dropdown-item-text { display: block; padding: .4rem 1rem; }
.la-veranstaltungen li { margin-bottom: .15rem; }
.la-veranstaltungen li .btn { --bs-btn-padding-y: 0; --bs-btn-padding-x: .35rem; }
.la-v-antrag > span:first-child { font-style: italic; }
.la-lehrstuhl { text-decoration: none; }

/* Markierungen: Antrag (orange, durchgezogen) bzw. ohne Veranstaltung (rot, gestrichelt) */
#LaTabelle tbody tr.la-antrag > td:first-child { box-shadow: inset 4px 0 0 var(--upa-orange); }
#LaTabelle tbody tr.la-antrag > td { background-color: var(--upa-soft); }
#LaTabelle tbody tr.la-ohne > td:last-child { box-shadow: inset 0 0 0 2px var(--bs-danger-border-subtle); }
#LaTabelle tbody tr.la-ohne:not(.la-antrag) > td:first-child { border-left: 4px dashed var(--bs-danger); }
.la-legende-linie { display: inline-block; width: 1.5rem; height: .9rem; vertical-align: -.1rem; margin-right: .25rem; border-radius: 3px; }
.la-legende-antrag { background: var(--upa-soft); box-shadow: inset 4px 0 0 var(--upa-orange); }
.la-legende-ohne { border: 2px dashed var(--bs-danger); }

/* DataTables im Portalstil */
#LaTabelle_wrapper .dt-search input { border-color: var(--upa-input-border); border-radius: var(--upa-radius-sm); }
#LaTabelle_wrapper .dt-info { color: var(--bs-secondary-color); font-size: .875rem; }

/* 15.9 Rechtstexte (Impressum, Datenschutz, Barrierefreiheit) */
.lv-accent { color: var(--upa-accent-text); }

.lv-prose { max-width: 75ch; }

.lv-toc {
    position: sticky;
    top: 6rem;
}

.lv-toc .nav-link {
    padding: .25rem 0;
    color: var(--bs-secondary-color);
}

.lv-toc .nav-link.active {
    color: var(--upa-accent-text);
    font-weight: 600;
}

dl.lv-proc {
    display: grid;
    grid-template-columns: minmax(7rem, max-content) 1fr;
    gap: .35rem 1rem;
}

dl.lv-proc dt { color: var(--bs-secondary-color); }
dl.lv-proc dd { margin: 0; }

@media (max-width: 575.98px) {
    dl.lv-proc { grid-template-columns: 1fr; gap: 0; }
    dl.lv-proc dd { margin-bottom: .5rem; }
}


/* ---------------------------------------------------------------------
   16. Seite „Meine Übungswünsche“ (wu-*)
   --------------------------------------------------------------------- */
.wu-page {
    max-width: 1280px;
    margin: 0 auto;
}

.wu-page details.card > summary {
    padding: .75rem 1rem;
}

/* Kennzahlen: farbiger Rand links je nach Bedeutung */
.wu-kpi        { border-left: 4px solid var(--bs-primary-border-subtle); }
.wu-kpi-pflicht,
.wu-kpi-minus  { border-left-color: var(--bs-danger); }
.wu-kpi-plus   { border-left-color: var(--bs-success); }

.wu-kpi-label {
    font-size: .85rem;
    font-weight: 600;
    color: var(--bs-secondary-color);
    text-transform: uppercase;
    letter-spacing: .03em;
}

.wu-kpi-wert {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.2;
    margin: .15rem 0;
    font-variant-numeric: tabular-nums;
}

.wu-kpi-plus .wu-kpi-wert  { color: var(--lv-pos); }
.wu-kpi-minus .wu-kpi-wert { color: var(--lv-neg); }

.wu-kpi-info {
    font-size: .85rem;
    color: var(--bs-secondary-color);
}

/* große Ordnungszahl links neben jedem Wunsch */
.wu-nummer {
    position: absolute;
    top: 20px;
    left: 6px;
    font-size: 72px;
    line-height: 1;
    color: var(--bs-primary);
}

.wu-schritte li {
    margin-bottom: .45rem;
}

.wu-schritte li:last-child {
    margin-bottom: 0;
}


/* ---------------------------------------------------------------------
   17. Barrierefreiheit: reduzierte Bewegung, erzwungene Farben
   (hoher Kontrast: Abschnitt 2.4)
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

@media (forced-colors: active) {
    :focus-visible {
        outline-color: Highlight;
    }

    .navbar .nav-item::after {
        background: Highlight;
    }

    .btn-close::before,
    .btn-close::after {
        background-color: ButtonText;
    }

    .upa_header::before,
    .modal-header::before {
        background: CanvasText;
    }
}


/* ---------------------------------------------------------------------
   18. Druck
   --------------------------------------------------------------------- */
@media print {
    :root {
        --bs-body-bg: #ffffff;
        --upa-shadow-sm: none;
        --upa-shadow: none;
        --upa-shadow-lg: none;
    }

    body {
        padding: 0;
        background: transparent;
        color: #000;
    }

    .body-content {
        animation: none;
    }

    .upa_header,
    footer.footer-bottom,
    .lv-toolbar,
    .lv-add,
    .lv-pagehead-actions,
    .lv-details summary {
        display: none !important;
    }

    div.card,
    .lv-kpi,
    .lv-card {
        break-inside: avoid;
    }

    .lv-kpi,
    .lv-card {
        box-shadow: none !important;
    }
}

/* CSP: no inline styles – small utility classes instead of style attributes */
.minw-16 { min-width: 16rem; }
.maxw-24 { max-width: 24rem; }
.w-4r { width: 4rem; }
.w-8r { width: 8rem; }
.w-9r { width: 9rem; }
.w-16r { width: 16rem; }
.minh-6 { min-height: 6rem; }
.minh-4-5 { min-height: 4.5rem; }
#bemerkungen { height: 100px; }
#bsconfirm { z-index: 1065; }

/* KPI tiles as filter buttons (admin/lehrverpflichtung) */
button.lv-kpi { width: 100%; text-align: start; color: inherit; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
button.lv-kpi:hover:not(:disabled), button.lv-kpi:focus-visible { border-color: var(--upa-orange); }
button.lv-kpi.active { border-color: var(--upa-orange); box-shadow: inset 0 0 0 1px var(--upa-orange), var(--upa-shadow-sm); }
button.lv-kpi:disabled { opacity: .55; cursor: default; }
.lv-kpi--danger .lv-kpi-value { color: var(--lv-neg); }
.lv-kpi--warn .lv-kpi-value { color: var(--bs-warning-text-emphasis); }
.lv-lvsettings > summary { cursor: pointer; list-style: none; }
.lv-lvsettings > summary::-webkit-details-marker { display: none; }
.lv-lvsettings-body { margin-top: .6rem; }

/* "oder" divider (login: password / passkey) */
.lv-oder { display: flex; align-items: center; gap: .75rem; color: var(--bs-secondary-color); font-size: .875rem; }
.lv-oder::before, .lv-oder::after { content: ""; flex: 1; border-top: 1px solid var(--bs-border-color); }

/* two add buttons side by side (person/erfuellung) */
.lv-add-pair { display: grid; gap: .75rem; }
@media (min-width: 576px) { .lv-add-pair { grid-template-columns: 1fr 1fr; } }

/* ---- Eintragungsdialog (person/EditErfuellung): steps, type cards, result panel ---- */
.lv-dlg { counter-reset: lvstep; }
.lv-step { margin: 0 0 1.25rem; padding: 1rem 1.1rem 1.1rem; border: 1px solid var(--upa-line); border-radius: var(--upa-radius); background: var(--upa-surface); }
.lv-step-title { display: flex; align-items: center; gap: .6rem; float: none; width: auto; margin: 0 0 .85rem; padding: 0; font-size: 1rem; font-weight: 700; color: var(--bs-heading-color); }
fieldset.lv-step > legend.lv-step-title { float: left; width: 100%; }
fieldset.lv-step > legend.lv-step-title + * { clear: left; }
.lv-step-nr::before { counter-increment: lvstep; content: counter(lvstep); display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--upa-orange); color: var(--upa-ink); font-size: .85rem; font-weight: 700; }
details.lv-step > summary.lv-step-title { margin: 0; cursor: pointer; list-style: none; }
details.lv-step > summary.lv-step-title::-webkit-details-marker { display: none; }
details.lv-step > summary.lv-step-title::after { content: "\203A"; margin-left: auto; font-size: 1.4rem; line-height: 1; color: var(--bs-secondary-color); transition: transform .2s ease; }
details.lv-step[open] > summary.lv-step-title::after { transform: rotate(90deg); }
.lv-step--optional { background: var(--upa-surface-alt); }
.lv-typen { display: grid; grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr)); gap: .5rem; }
.lv-typen--4 { grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); }
.lv-typ { display: grid; grid-template-columns: auto 1fr; column-gap: .6rem; align-items: center; height: 100%; margin: 0; padding: .65rem .75rem; border: 1px solid var(--upa-input-border); border-radius: var(--upa-radius-sm); background: var(--upa-input-bg); cursor: pointer; transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease; }
.lv-typ > i { grid-row: span 2; font-size: 1.3rem; color: var(--upa-accent-text); }
.lv-typ-titel { font-weight: 600; line-height: 1.2; }
.lv-typ-note { font-size: .78rem; line-height: 1.25; color: var(--bs-secondary-color); }
.lv-typ:hover { border-color: var(--upa-input-border-hover); background: var(--upa-surface-muted); }
.btn-check:checked + .lv-typ { border-color: var(--upa-orange); background: var(--upa-bg-pared); box-shadow: inset 0 0 0 1px var(--upa-orange); }
.btn-check:focus-visible + .lv-typ { outline: 3px solid var(--upa-focus); outline-offset: 2px; }
.lv-more > summary { cursor: pointer; font-size: .875rem; font-weight: 600; color: var(--bs-link-color); }
.lv-w-sm { max-width: 20rem; }
.lv-dlg-aside { position: sticky; top: 0; display: grid; gap: 1rem; }
.lv-result { display: grid; gap: .15rem; padding: 1rem 1.1rem; border-radius: var(--upa-radius); background: var(--upa-bg-pared); border: 1px solid var(--upa-orange); }
.lv-result-label { font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--bs-secondary-color); }
.lv-result-value { font-size: 2rem; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; color: var(--bs-emphasis-color); }
.lv-result-value small { font-size: 1rem; font-weight: 600; color: var(--bs-secondary-color); }
.lv-result-hint { font-size: .85rem; color: var(--bs-secondary-color); }
.lv-result-hint:empty { display: none; }
.lv-dlg-aside .lv-dlg-info, .lv-dlg-aside #infobox .lv-callout { margin: 0; }
#infobox:empty { display: none; }
@media (max-width: 991.98px) { .lv-dlg-aside { position: static; } }