/* /assets/vendor/inter.css */
/* Inter Variable Font – self-hosted */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-0.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-1.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-2.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-3.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-4.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-5.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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-6.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: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-0.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-1.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-2.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-3.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-4.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-5.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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-6.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: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-0.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-1.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-2.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-3.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-4.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-5.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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-6.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: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-0.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-1.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-2.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-3.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-4.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-5.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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://www.dw-foto.de/assets/vendor/fonts/inter-6.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;
}
/* /assets/css/style.css */
/* =============================================
   Bilddatenbank – Frontend
   Design: dark header · orange accent · white
   ============================================= */

:root {
    /* Sichtbare Breite der einspaltigen Formularkarten (Registrierung, Terminanfrage). */
    --form-card-w:    820px;
    --primary:        #f97316;
    --primary-dark:   #ea580c;
    --primary-light:  #fb923c;
    /* Orange als SCHRIFT auf hellem Grund. Das Marken-Orange selbst hat gegen Weiß nur
       2,8:1 – erforderlich sind 4,5:1 für normalen und 3:1 für großen Text. Es bleibt
       deshalb den Flächen vorbehalten (Knopf-Hintergrund, Rahmen, Auswahlmarkierung), wo
       kein Kontrastwert daran hängt; Buchstaben in Orange bekommen diesen Ton.
       #c2410c erreicht 5,2:1 auf Weiß, 4,9:1 auf --bg und 4,7:1 auf --border-light –
       also auf jedem hellen Untergrund dieser Seite genug, und es liest sich weiterhin
       als dasselbe Orange. */
    --primary-text:   #c2410c;
    --dark:           #0f172a;
    --dark-2:         #1e293b;
    --dark-3:         #334155;
    --bg:             #f8fafc;
    --surface:        #ffffff;
    --border:         #e2e8f0;
    --border-light:   #f1f5f9;
    --text:           #0f172a;
    /* War #64748b. Auf Weiß reichte das (4,8:1), auf den hellgrauen Flächen dieser Seite
       nicht mehr: auf --border-light nur 4,3:1, auf dem Fußzeilen-Grau 4,5:1 auf der
       Kippe. Eine Spur dunkler löst das überall auf einmal – 5,5:1 und besser. */
    --text-muted:     #5b6472;
    --success-bg:     #ecfdf5;
    --success-border: #a7f3d0;
    --success-text:   #065f46;
    --danger-bg:      #fef2f2;
    --danger-border:  #fecaca;
    --danger-text:    #991b1b;
    --warning-bg:     #fffbeb;
    --warning-border: #fde68a;
    --warning-text:   #92400e;
    --info-bg:        #eff6ff;
    --info-border:    #bfdbfe;
    --info-text:      #1e40af;
    --r-sm:  6px;
    --r:     10px;
    --r-lg:  16px;
    --ease:  150ms cubic-bezier(.4,0,.2,1);
    --sh-xs: 0 1px 2px 0 rgb(0 0 0/.05);
    --sh-sm: 0 1px 3px 0 rgb(0 0 0/.08), 0 1px 2px -1px rgb(0 0 0/.06);
    --sh:    0 4px 6px -1px rgb(0 0 0/.07), 0 2px 4px -2px rgb(0 0 0/.06);
    --sh-md: 0 10px 15px -3px rgb(0 0 0/.08), 0 4px 6px -4px rgb(0 0 0/.05);
    --sh-lg: 0 20px 25px -5px rgb(0 0 0/.08), 0 8px 10px -6px rgb(0 0 0/.04);
}

/* ---- Skip link ---- */
.skip-to-main {
    position: absolute;
    top: -100%;
    left: 1rem;
    z-index: 9999;
    padding: .5rem 1rem;
    background: var(--dark);
    color: #fff;
    font-weight: 600;
    border-radius: 0 0 var(--r-sm) var(--r-sm);
    text-decoration: none;
    transition: top .15s;
}
.skip-to-main:focus { top: 0; color: #fff; }

/* ---- Base ---- */
*, *::before, *::after { box-sizing: border-box; }
html {
    scroll-behavior: smooth;
    font-size: 100%;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: var(--bg);
    color: var(--text);
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    font-size: .9375rem;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-synthesis: none;
}

main { flex: 1; }

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    letter-spacing: -.025em;
    line-height: 1.3;
    color: var(--text);
}

a { color: var(--primary-text); transition: color var(--ease); text-decoration: none; }
a:hover { color: var(--primary-dark); }

/* ---- Navbar ---- */
.navbar {
    background: var(--dark) !important;
    padding-top: .7rem;
    padding-bottom: .7rem;
    min-height: 3.75rem;          /* feste Höhe → ein-/ausgeloggt identisch */
    box-shadow: 0 2px 8px rgb(0 0 0/.25);
    width: 100%;
    left: 0;
}

.navbar .navbar-nav { gap: .15rem .3rem; }

.navbar-brand {
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: -.03em;
    color: #fff !important;
    display: flex;
    align-items: center;
    gap: .5rem;
}
.navbar-brand i {
    color: var(--primary);
    font-size: 1.2rem;
}
.navbar-brand:hover { opacity: .88; }

.nav-link {
    font-size: .8375rem;
    font-weight: 500;
    color: rgba(255,255,255,.7) !important;
    padding: .4rem .75rem !important;
    border-radius: var(--r-sm);
    transition: all var(--ease);
}
.nav-link:hover, .nav-link.active {
    color: #fff !important;
    background: rgba(255,255,255,.08);
}
/* Avatar im Benutzermenü (eingeloggt) – auf Nav-Höhe begrenzt, damit die Navbar ein- wie ausgeloggt gleich hoch bleibt */
.nav-avatar-link { padding-top: .2rem !important; padding-bottom: .2rem !important; }
.nav-avatar {
    width: 28px; height: 28px;
    border-radius: var(--r-sm);
    object-fit: cover;
    display: block;
    border: 1.5px solid rgba(255,255,255,.35);
}
.nav-avatar--ph {
    display: flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,.14);
    color: #fff;
    font-size: .95rem;
    border-color: rgba(255,255,255,.22);
}

/* Register button in navbar */
/* Schrift DUNKEL auf dem Orange, nicht weiß: Weiß auf --primary ergibt nur 2,80:1 und
   verfehlt die WCAG-AA-Vorgabe von 4,5:1 für normalen Text deutlich (13 px zählen trotz
   Fettung nicht als „groß" – dafür bräuchte es 18,66 px). Google PageSpeed hat genau
   diesen Knopf als einziges Element der Startseite bemängelt.

   Gewählt wurde die dunkle Schrift statt eines dunkleren Orange, weil das die Signalfarbe
   der Marke unverändert lässt – der Knopf sieht aus wie zuvor, nur die Beschriftung ist
   dunkelblau statt weiß. Gemessen: --dark auf --primary = 6,37:1, im Hover-Zustand auf
   --primary-dark noch 5,02:1. Beides besteht mit Reserve.

   Die Alternative wäre weiße Schrift auf --primary-text (#c2410c, 5,18:1) gewesen – dann
   aber mit sichtbar dunklerem Knopf. Wer hier wieder auf #fff wechselt, muss den
   Hintergrund mit abdunkeln, sonst kehrt die Beanstandung zurück. */
.navbar .btn-outline-light {
    font-size: .8125rem;
    font-weight: 600;
    background: var(--primary);
    border: none;
    color: var(--dark);
    padding: .375rem 1rem;
    border-radius: var(--r-sm);
    transition: background var(--ease), box-shadow var(--ease);
}
.navbar .btn-outline-light:hover {
    background: var(--primary-dark);
    color: var(--dark);
    box-shadow: 0 4px 12px rgb(249 115 22/.35);
}

/* Dropdown */
.dropdown-menu {
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--sh-md);
    padding: .325rem;
    font-size: .875rem;
    min-width: 180px;
}
.dropdown-item {
    border-radius: var(--r-sm);
    padding: .45rem .8rem;
    font-weight: 500;
    color: var(--text);
    transition: background var(--ease);
}
.dropdown-item:hover { background: var(--border-light); }
.dropdown-item.active, .dropdown-item:active {
    background: var(--primary);
    color: #fff;
}
.dropdown-divider { border-color: var(--border); margin: .25rem 0; }

/* ---- Cards ---- */
.card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-xs);
    overflow: hidden;
}
.card-header {
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    padding: .875rem 1.375rem;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--text-muted);
    border-radius: 0 !important;
}
.card-body { padding: 1.5rem 1.375rem; }
.card-footer {
    background: var(--border-light);
    border-top: 1px solid var(--border);
    padding: .875rem 1.375rem;
}

/* Auth-/Registrierungs-Cards: einheitliches flaches Design – kein Schatten, feine graue
   Linie, durchgehend eckig, schlanker dunkler Header mit weißem Icon links.
   (Login, Passwort vergessen/zurücksetzen und Registrierung.) */
.auth-card .card,
.card.auth-card,
.register-card .card {
    border: 1px solid var(--border);
    border-radius: 0 !important;
    box-shadow: none;
}
.auth-card .card-header,
.auth-card .card-footer,
.register-card .card-header,
.register-card .card-footer { border-radius: 0 !important; }
.auth-card .card-header,
.register-card .card-header {
    background: var(--dark);
    color: #fff;
    display: flex;
    align-items: center;
    gap: .5rem;
    text-align: left;
    text-transform: uppercase;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .09em;
    padding: .7rem 1.25rem;
}
.auth-card .card-header i,
.register-card .card-header i {
    display: inline-flex;
    font-size: .95rem;
    margin-bottom: 0;
    color: #fff;
    opacity: .9;
}
/* ======== Dezente Card-Fußzeile ========
   Schmale Zeile mit einem weiterführenden Link: heller Grund, feine Trennlinie, kleine
   gedämpfte Schrift, Hover in Akzentfarbe. Maßgeblich ist der Fuß der Startseiten-Cards
   („Neu im Archiv"); denselben Aufbau haben Anmeldung/Registrierung und das Profil-Dashboard.
   Diese Optik stand vorher dreimal getrennt herum (index.css, hier, profile.php) und wäre
   beim nächsten Feinschliff auseinandergelaufen – deshalb genau einmal, hier.
   .home-card__foot steht mit im Selektor, damit index.php unverändert bleibt. */
.card-foot-soft,
.home-card__foot,
.auth-card .card-footer,
.register-card .card-footer {
    padding: .3rem 1rem;
    border-top: 1px solid var(--border);
    background: var(--border-light);
}
.card-foot-soft a,
.home-card__foot a,
.auth-card .card-footer a,
.register-card .card-footer a {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .7rem;
    font-weight: 400;
    color: var(--text-muted);
    text-decoration: none;
}
.card-foot-soft a:hover,
.home-card__foot a:hover,
.auth-card .card-footer a:hover,
.register-card .card-footer a:hover {
    color: var(--primary);
    text-decoration: underline;
}

/* ---- Buttons ---- */
.btn {
    font-weight: 600;
    font-size: .875rem;
    letter-spacing: .01em;
    border-radius: var(--r-sm);
    transition: all var(--ease);
    padding: .46rem 1.125rem;
    border-width: 1.5px;
}
.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}
.btn-primary:hover, .btn-primary:focus-visible {
    background: var(--primary-dark);
    border-color: var(--primary-dark);
    box-shadow: 0 4px 14px rgb(249 115 22/.35);
}
.btn-secondary {
    background: var(--dark-2);
    border-color: var(--dark-2);
    color: #fff;
}
.btn-secondary:hover {
    background: var(--dark-3);
    border-color: var(--dark-3);
}
.btn-lg { padding: .65rem 1.625rem; font-size: .9375rem; }
.btn-sm { padding: .3rem .75rem; font-size: .8rem; }

/* Gesperrter Knopf: ausgegraut, nicht bloß blass. Bootstrap nimmt einem deaktivierten Knopf nur
   35 % Deckkraft – ein oranger Knopf sieht danach immer noch nach „geht schon" aus, und genau
   das soll er nicht. Dieselbe Optik hat die gesperrte Download-Kachel (.dl-square:disabled)
   schon länger; hier gilt sie für alle Bootstrap-Knöpfe im Frontend, damit „deaktiviert"
   überall dasselbe Bild ergibt. */
.btn:disabled,
.btn.disabled {
    background: var(--border-light);
    border-color: var(--border);
    color: var(--text-muted);
    opacity: 1;
    box-shadow: none;
    cursor: not-allowed;
}
.btn-outline-primary { border-color: var(--primary); color: var(--primary-text); background: transparent; }
.btn-outline-primary:hover { background: var(--primary); color: #fff; border-color: var(--primary); }
/* Bootstrap rechnet Hover-, Aktiv- und Fokuszustand über diese Variablen (u. a.
   `.btn-check + .btn:hover` und `.btn:active` mit höherer Spezifität) – ohne die
   Overrides blitzte dort das Bootstrap-Standardblau auf. */
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--primary);
    --bs-btn-border-color: var(--primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--primary-dark);
    --bs-btn-hover-border-color: var(--primary-dark);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--primary-dark);
    --bs-btn-active-border-color: var(--primary-dark);
    --bs-btn-focus-shadow-rgb: 249, 115, 22;
}
.btn-outline-primary {
    --bs-btn-color: var(--primary-text);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--primary);
    --bs-btn-hover-border-color: var(--primary);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--primary);
    --bs-btn-active-border-color: var(--primary);
    --bs-btn-focus-shadow-rgb: 249, 115, 22;
}
.btn-outline-secondary { border-color: var(--border); color: var(--text-muted); background: transparent; }
.btn-outline-secondary:hover { background: var(--border-light); color: var(--text); border-color: #cbd5e1; }
.btn-outline-danger { border-color: #fecaca; color: #dc2626; background: transparent; }
.btn-outline-danger:hover { background: #fef2f2; color: #991b1b; border-color: #fca5a5; }

/* ---- Form controls ---- */
.form-control,
.form-select {
    border: 1.5px solid var(--border);
    border-radius: var(--r-sm);
    font-size: .875rem;
    padding: .5rem .9rem;
    color: var(--text);
    background-color: #fff;
    transition: border-color var(--ease), box-shadow var(--ease);
    box-shadow: none;
}
/* Auswahl-Pfeil (Chevron) für alle <select> – klar erkennbar, dass auswählbar */
.form-select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 2.25rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%236c757d' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 16px 12px;
}
.form-select-sm { padding-right: 1.75rem; background-position: right .5rem center; }
.form-floating > .form-select { padding-right: 2.25rem; }
.form-control:focus,
.form-select:focus {
    border-color: var(--dark);
    background-color: #fff;
    box-shadow: 0 0 0 3px rgb(15 23 42/.12);
    outline: none;
}
.form-label {
    font-size: .8125rem;
    font-weight: 600;
    color: var(--text);
    margin-bottom: .35rem;
    letter-spacing: .01em;
}
.form-text { font-size: .75rem; color: var(--text-muted); margin-top: .3rem; }
.input-group-text {
    background: var(--border-light);
    border: 1.5px solid var(--border);
    color: var(--text-muted);
    font-size: .875rem;
}
.input-group > .form-control:not(:first-child) { border-left: none; }
.input-group > .input-group-text + .form-control { border-left: none; }

/* Checkboxes */
.form-check-input:checked {
    background-color: var(--primary);
    border-color: var(--primary);
}
.form-check-input:focus {
    box-shadow: 0 0 0 3px rgb(249 115 22/.15);
    border-color: var(--primary);
}
.form-check-label { font-size: .875rem; }

/* ---- Alerts ---- */
.alert {
    border-radius: var(--r);
    border-width: 1px;
    font-size: .875rem;
    padding: .875rem 1.125rem;
    display: flex;
    gap: .625rem;
    align-items: flex-start;
}
.alert-success { background: var(--success-bg); border-color: var(--success-border); color: var(--success-text); }
.alert-danger  { background: var(--danger-bg);  border-color: var(--danger-border);  color: var(--danger-text); }
.alert-warning { background: var(--warning-bg); border-color: var(--warning-border); color: var(--warning-text); }
.alert-info    { background: var(--info-bg);    border-color: var(--info-border);    color: var(--info-text); }
.alert .btn-close { margin-left: auto; opacity: .5; }
.alert ul { margin: .35rem 0 0; padding-left: 1.25rem; }
.alert ul li + li { margin-top: .2rem; }

/* ---- Badges ---- */
.badge {
    font-size: .675rem;
    font-weight: 600;
    letter-spacing: .04em;
    padding: .3em .65em;
    border-radius: 4px;
}

/* ---- Tables ---- */
.table {
    font-size: .875rem;
    color: var(--text);
}
.table th {
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--text-muted);
    border-bottom: 1.5px solid var(--border) !important;
    padding: .75rem 1rem;
    background: var(--border-light);
    white-space: nowrap;
}
.table td {
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--bord