/*
 * Admin-CMS — Override-Layer über Tabler (ADR-016).
 *
 * Eigene Anpassungen NUR hier (nach tabler.min.css geladen). Tabler-Vendor-Dateien nie editieren
 * → Tabler-Updates bleiben gefahrlos (neue dist reinlegen, dieser Layer bleibt).
 */

/* ── Link-Policy (CMS-weit) ───────────────────────────────────────────────────
   Links werden im CMS NIE unterstrichen (in keinem Zustand) — inkl. Tablers a:hover-Unterstrich
   (der u.a. beim aktiven list-group-item durchschlägt). Wo eine Unterstreichung GEWOLLT ist
   (Inline-Textlinks), gezielt die Klasse .cl-underline setzen → dann durchgehend unterstrichen. */
a,
a:hover,
a:focus,
a:active {
    text-decoration: none;
}
.cl-underline,
.cl-underline:hover,
.cl-underline:focus,
.cl-underline:active {
    text-decoration: underline;
}

/* Tabler-Variablen-Override: aktiver Hintergrund (Active-States) dauerhaft auf dezentes 10 % Schwarz
   statt Tablers primär-getöntem Default. In allen drei Tabler-Scopes gesetzt (gleiche Spezifität,
   später geladen → gewinnt). Hinweis: im Darkmode ist 10 % Schwarz bewusst sehr subtil. */
:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
    --tblr-active-bg: rgba(0, 0, 0, 0.1);
}

/* Theme-Settings: Farbschema-Swatches etwas kleiner (Tabler-Standard: 1.5rem). */
.form-colorinput-color {
    width: 1.25rem;
    height: 1.25rem;
}

/* … und das Auswahl-Häkchen darin kleiner (Tabler-Standard: 1.25rem background-size). */
.form-colorinput-color::before {
    background-size: 0.9rem;
}

/* Checkbox/Radio: Häkchen bzw. Punkt etwas kleiner — Tabler-Default background-size 1.25rem → 0.9rem.
   Gilt für .form-check-input, also Checkboxen UND Radios (auch die Theme-Regler). */
.form-check-input {
    background-size: 1rem;
}

/* Invertierte Checkbox/Radio: helle Box bleibt (statt primär gefüllt) + primärfarbener Rahmen,
   die Marke (Haken/Punkt) trägt die Primärfarbe. Tabler kodiert die Markenfarbe fix ins SVG →
   daher pro Farbschema ein eigenes SVG (folgt dem Farbschema-Wechsel). NUR echte Checkboxen/Radios
   (`.form-check:not(.form-switch)`), damit Switches unangetastet bleiben. */
.form-check:not(.form-switch) .form-check-input:checked {
    background-color: var(--tblr-form-check-bg);
    border-color: var(--tblr-primary);
}
/* Fallback = Default-Schema cyan (#17a2b8), falls kein data-bs-theme-primary gesetzt ist */
.form-check:not(.form-switch) .form-check-input:checked[type=checkbox] {
    --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%2317a2b8' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e");
}
.form-check:not(.form-switch) .form-check-input:checked[type=radio] {
    --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%2317a2b8' cx='8' cy='8' /%3e%3c/svg%3e");
}
/* je Farbschema: Marke in der jeweiligen Primärfarbe */
[data-bs-theme-primary=blue] .form-check:not(.form-switch) .form-check-input:checked[type=checkbox] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%23066fd1' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e"); }
[data-bs-theme-primary=blue] .form-check:not(.form-switch) .form-check-input:checked[type=radio] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%23066fd1' cx='8' cy='8' /%3e%3c/svg%3e"); }
[data-bs-theme-primary=azure] .form-check:not(.form-switch) .form-check-input:checked[type=checkbox] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%234299e1' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e"); }
[data-bs-theme-primary=azure] .form-check:not(.form-switch) .form-check-input:checked[type=radio] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%234299e1' cx='8' cy='8' /%3e%3c/svg%3e"); }
[data-bs-theme-primary=indigo] .form-check:not(.form-switch) .form-check-input:checked[type=checkbox] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%234263eb' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e"); }
[data-bs-theme-primary=indigo] .form-check:not(.form-switch) .form-check-input:checked[type=radio] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%234263eb' cx='8' cy='8' /%3e%3c/svg%3e"); }
[data-bs-theme-primary=purple] .form-check:not(.form-switch) .form-check-input:checked[type=checkbox] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%23ae3ec9' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e"); }
[data-bs-theme-primary=purple] .form-check:not(.form-switch) .form-check-input:checked[type=radio] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%23ae3ec9' cx='8' cy='8' /%3e%3c/svg%3e"); }
[data-bs-theme-primary=pink] .form-check:not(.form-switch) .form-check-input:checked[type=checkbox] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%23d6336c' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e"); }
[data-bs-theme-primary=pink] .form-check:not(.form-switch) .form-check-input:checked[type=radio] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%23d6336c' cx='8' cy='8' /%3e%3c/svg%3e"); }
[data-bs-theme-primary=red] .form-check:not(.form-switch) .form-check-input:checked[type=checkbox] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%23d63939' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e"); }
[data-bs-theme-primary=red] .form-check:not(.form-switch) .form-check-input:checked[type=radio] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%23d63939' cx='8' cy='8' /%3e%3c/svg%3e"); }
[data-bs-theme-primary=orange] .form-check:not(.form-switch) .form-check-input:checked[type=checkbox] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%23f76707' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e"); }
[data-bs-theme-primary=orange] .form-check:not(.form-switch) .form-check-input:checked[type=radio] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%23f76707' cx='8' cy='8' /%3e%3c/svg%3e"); }
[data-bs-theme-primary=yellow] .form-check:not(.form-switch) .form-check-input:checked[type=checkbox] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%23f59f00' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e"); }
[data-bs-theme-primary=yellow] .form-check:not(.form-switch) .form-check-input:checked[type=radio] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%23f59f00' cx='8' cy='8' /%3e%3c/svg%3e"); }
[data-bs-theme-primary=lime] .form-check:not(.form-switch) .form-check-input:checked[type=checkbox] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%2374b816' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e"); }
[data-bs-theme-primary=lime] .form-check:not(.form-switch) .form-check-input:checked[type=radio] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%2374b816' cx='8' cy='8' /%3e%3c/svg%3e"); }
[data-bs-theme-primary=green] .form-check:not(.form-switch) .form-check-input:checked[type=checkbox] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%232fb344' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e"); }
[data-bs-theme-primary=green] .form-check:not(.form-switch) .form-check-input:checked[type=radio] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%232fb344' cx='8' cy='8' /%3e%3c/svg%3e"); }
[data-bs-theme-primary=teal] .form-check:not(.form-switch) .form-check-input:checked[type=checkbox] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3e%3cpath fill='none' stroke='%230ca678' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8.5l2.5 2.5l5.5 -5.5'/%3e%3c/svg%3e"); }
[data-bs-theme-primary=teal] .form-check:not(.form-switch) .form-check-input:checked[type=radio] { --tblr-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3ccircle r='3' fill='%230ca678' cx='8' cy='8' /%3e%3c/svg%3e"); }

/* Input-Group „flat" (z.B. Passwort-Feld mit Auge-Icon): Tabler setzt das linke Padding des
   Icons auf 0 (klebt am Text) — Standard-Padding (1rem) wiederherstellen für etwas Luft. */
.input-group-flat .input-group-text:last-child {
    padding-left: 1rem;
}

/* Kontoeinstellungen-Sektionsnav (.list-group-transparent): aktiver Punkt OHNE Tabler-Hintergrund —
   stattdessen, wie die Sidebar, ein 2px-Akzentstrich links in der Primär-/Aktivfarbe (fett bleibt).
   box-shadow inset statt border → kein 2px-Versatz; die Items haben ohnehin border:0 und keinen Radius. */
.list-group-transparent .list-group-item.active {
    box-shadow: inset 2px 0 0 var(--tblr-primary);
}

/* Footer-Links: Farbe bleibt in ALLEN Zuständen gleich (wie der Footer-Text, kein Abdunkeln).
   `!important`, weil Tabler die Hover-Farbe von .link-* selbst mit !important setzt. Die
   Unterstreichung regelt die globale Link-Policy oben (.link-secondary setzt selbst keinen Strich). */
.footer a,
.footer a:hover,
.footer a:focus,
.footer a:active {
    color: var(--tblr-secondary) !important;
}

/* alert-autohide: wird in ein Bootstrap-Collapse gewickelt → reguläres, weiches Zuklappen.
   overflow:hidden, damit der Innen-Abstand (margin) Teil der animierten Höhe ist (kein Rest-Sprung). */
.alert-autohide {
    overflow: hidden;
}

/* Dezenter Text-Link — auch für <button> (kein Hintergrund/Rahmen/Box beim Hover). Sekundärfarbe
   in allen Zuständen, NIE unterstrichen (CMS-Link-Policy; für gewollte Unterstreichung .cl-underline). */
.cl-link,
.cl-link:hover,
.cl-link:focus,
.cl-link:active {
    color: var(--tblr-secondary) !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
.cl-link {
    padding: 0;
    font: inherit;
    cursor: pointer;
}

/* .btn-link dauerhaft entschärfen: NIE unterstreichen und die Textfarbe bei Hover/Focus/Active
   unverändert lassen (kein Abdunkeln). Tabler setzt beides teils per !important. */
.btn-link {
    /* greift für .btn-link OHNE link-*-Variante: Hover-/Active-Farbe = Ruhefarbe */
    --tblr-btn-hover-color: var(--tblr-btn-color);
    --tblr-btn-active-color: var(--tblr-btn-color);
}
.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:focus-visible,
.btn-link:active {
    text-decoration: none !important;
}
/* Mit link-*-Variante setzt Tabler die Hover-Farbe per !important → für die genutzte link-secondary
   zurück auf deren Ruhefarbe (höhere Spezifität + !important gewinnt). */
.btn-link.link-secondary:hover,
.btn-link.link-secondary:focus {
    color: color-mix(in srgb, var(--tblr-secondary) calc(var(--tblr-link-opacity, 1) * 100%), transparent) !important;
}

/* Frosted-Glass / Glassmorphism: transparenter Hintergrund + Backdrop-Blur. Zentrale Hilfsklasse,
   z.B. auf der Login-Card → der Body-Hintergrund scheint verschwommen durch. */
html:not([data-bs-theme-background="off"])[data-bs-theme="dark"] .bg-blur {
    background-color: transparent !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
}


/* Marken-Hintergrund fürs gesamte Admin-Tool: Foto + Overlay darüber. Body-Klasse aus layout.php
   unterscheidet die Zustände — eingeloggt (cl-app, Basis-Regel) vs. Anmelde-Screen (cl-login). */

/* Eingeloggt (App): dezenter THEME-Farbtint (folgt Hell/Dunkel), Foto leicht sichtbar. */
body {
    background-image:
        radial-gradient(color-mix(in srgb, var(--tblr-gray-900) 99%, transparent) 100%, transparent),
        url(/assets/shared/img/bg-carlution.jpg);
        background-image: linear-gradient(
269deg, color-mix(in srgb, var(--tblr-gray-900) 85%, transparent) 20% 70%, transparent), radial-gradient(color-mix(in srgb, var(--tblr-gray-900) 90%, transparent) 100%, transparent), url(/assets/shared/img/bg-carlution.jpg);
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* Anmelde-Screens (zentriert): diagonaler dunkler Verlauf über dem Foto.
   Farbe = --tblr-gray-900 → ändert sich mit der THEMEBASIS (Slate/Zinc/Stone/…); color-mix
   gibt ihr den Alpha-Wert (95 %), da die Grau-Variablen keinen -rgb-Wert haben. */
body.cl-login {
    background-image:
        linear-gradient(12deg, color-mix(in srgb, var(--tblr-gray-900) 95%, transparent) 20% 50%, transparent),
        radial-gradient(color-mix(in srgb, var(--tblr-gray-900) 50%, transparent) 100%, transparent),
        url(/assets/shared/img/bg-carlution.jpg);
}

/* Foto/Overlay-Mix: im Light-Mode „screen" (hellt auf), im Dark-Mode aus.
   Wichtig: Light-Mode bedeutet oft, dass `data-bs-theme` GAR NICHT gesetzt ist (nur Dark setzt es) —
   daher Default = screen und Dark explizit abschalten (statt nur [data-bs-theme=light] zu matchen). */
body {
    background-blend-mode: screen;
}
[data-bs-theme="dark"] body {
    background-blend-mode: normal;
}

/* Hintergrund-Schalter (Settings „Hintergrund": Ja/Nein → data-bs-theme-background auf <html>).
   „Nein" (off) = Marken-Foto + Overlay aus; es bleibt der schlichte Tabler-Theme-Hintergrund
   (folgt Farbmodus/Themebasis). Default „an" = Attribut nicht gesetzt → Basis-Regeln greifen. */
[data-bs-theme-background="off"] body,
[data-bs-theme-background="off"] body.cl-login {
    background-image: none;
}

/* ── Vertikale Sidebar (Chrome, immer dunkel) ────────────────────────────────
   Die Sidebar ist via data-bs-theme="dark" fix dunkel — daher hier bewusst feste
   Weiß-Alphawerte (unabhängig vom Content-Farbmodus), nicht die Theme-Variablen. */

/* Einheitlicher horizontaler Innenabstand: Logo, User-Block, Überschriften und Menütext starten
   alle am selben Innenrand (1rem) — links wie rechts, nichts klebt am Rand. Referenz ist das
   ohnehin vorhandene 1rem-Padding der nav-links; das äußere Container-Padding daher auf 0.
   NUR auf Desktop (lg+) — mobil (Top-Bar mit Burger + Logo) bleibt Tablers Standard-Padding. */
@media (min-width: 992px) {
    .navbar-vertical > .container-fluid {
        padding-left: 0;
        padding-right: 0;
    }
}
/* Marke (Logo + App-Name): links ausgerichtet, mit größerem vertikalem + etwas horizontalem Abstand.
   Gleiche Spezifität wie die Vendor-Regel (.navbar-vertical.navbar-expand-lg .navbar-brand) → gewinnt
   per Ladereihenfolge (custom.css nach tabler.min.css), kein !important nötig. */
@media (min-width: 992px) {
    .navbar-vertical.navbar-expand-lg .navbar-brand {
        padding: 2rem 0.75rem;
        justify-content: flex-start;
    }
}
/* Erzwungene Scrollbar-Rinne (Tabler: overflow-y:scroll) abschalten → rechts kein Dauerabstand,
   Scrollbar nur bei Bedarf. So bleibt links = rechts. */
.navbar-vertical {
    overflow-y: auto !important;
}



/* Sektionsüberschrift im Menü. Horizontales Padding = var(--tblr-page-padding) wie bei den
   nav-links → bündig auf ALLEN Breakpoints (Tabler verkleinert die Variable mobil auf 0.5rem). */
.cl-nav-header {
    display: block;
    padding: 0 var(--tblr-page-padding);
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .55);
}

/* User-Bereich oben (Platzhalter für späteren Avatar-Dropdown).
   Abgrenzung bewusst NUR über Abstand — kein Trennstrich. */
.cl-sidebar-user {
    padding: .25rem var(--tblr-page-padding);
    margin-bottom: .75rem;
}

/* Initialen-Avatar — flex-shrink:0, sonst quetscht ihn ein langer Name (er bliebe nicht quadratisch). */
.cl-sidebar-avatar {
    background: rgba(255, 255, 255, .14);
    color: #fff;
    font-weight: 600;
    flex-shrink: 0;
}

/* Klickbarer „Einstellungen"-Link im User-Block: dezent, bei Hover nur heller (kein Unterstrich,
   CMS-Link-Policy). Auf der dunklen Sidebar → heller statt dunkler. */
.cl-user-link {
    color: rgba(255, 255, 255, .55);
}
.cl-user-link:hover,
.cl-user-link:focus {
    color: #fff;
}

/* Menüpunkte: ALLE hell (wie zuvor nur der aktive). Der aktive Punkt wird allein durch fett
   markiert — nicht über Farbe oder Trennlinien. */
.navbar-vertical .navbar-nav .nav-link {
    color: rgba(255, 255, 255, .9);
}
.navbar-vertical .navbar-nav .nav-link:hover,
.navbar-vertical .navbar-nav .nav-link:focus {
    color: #fff;
}
.navbar-vertical .navbar-nav .nav-item.active > .nav-link,
.navbar-vertical .navbar-nav .nav-link.active {
    color: #fff;
    font-weight: 600;
}
/* Aktiv-Indikator (linke Kante) schmaler: Tabler nutzt 3px → auf 2px. Gleicher Selektor/Media-Query
   wie die Vendor-Regel → gewinnt per Ladereihenfolge. */
@media (min-width: 992px) {
    .navbar-vertical.navbar-expand-lg .navbar-collapse .nav-item.active:after {
        border-left-width: 2px;
    }
}

/* Untermenü-Einträge analog (hell; aktiv = fett). */
.navbar-vertical .dropdown-menu .dropdown-item {
    color: rgba(255, 255, 255, .8);
}
.navbar-vertical .dropdown-menu .dropdown-item:hover,
.navbar-vertical .dropdown-menu .dropdown-item:focus,
.navbar-vertical .dropdown-menu .dropdown-item.active {
    color: #fff;
}
.navbar-vertical .dropdown-menu .dropdown-item.active {
    font-weight: 600;
}
/* Untermenü-Einrückung verkleinern: Tabler rückt die dropdown-items um +1.75rem ein → auf +0.5rem.
   Gleicher Selektor/Media-Query wie die Vendor-Regel → gewinnt per Ladereihenfolge. */
@media (min-width: 992px) {
    .navbar-vertical.navbar-expand-lg .navbar-collapse .dropdown-menu .dropdown-item {
        padding-left: calc(calc(calc(var(--tblr-page-padding) * 2) / 2) + 0.5rem);
    }
}
/* … und dasselbe mobil (Tabler hat dafür eine eigene <lg-Regel ohne .navbar-vertical). */
@media (max-width: 991.98px) {
    .navbar-expand-lg .navbar-collapse .dropdown-menu .dropdown-item {
        padding-left: calc(calc(calc(var(--tblr-page-padding) * 2) / 2) + 0.5rem);
    }
}

/* ── Layout-Breite (Theme-Settings „Layout") ─────────────────────────────────
   boxed = Default (Begrenzung via .container-xl). fluid = volle Breite: das Attribut
   data-cl-layout="fluid" auf <html> hebt nur die Content-Begrenzung auf; die Sidebar
   und die seitlichen Gutter bleiben gleich (kein Padding-Sprung). */
[data-cl-layout="fluid"] .page-wrapper .container-xl {
    max-width: none;
}

/* ── Fehler-/Leerseiten (404/403): Inhalt vertikal zentrieren (Body-Klasse cl-center) ──────────
   .page-body ist bei Tabler bereits flex-column + flex:1 (füllt zwischen Header/Footer) — daher
   genügt es, die Hauptachse (vertikal) zu zentrieren. */
.cl-center .page-body {
    justify-content: center;
}