/* ═══════════════════════════════════════════════════════════════════════
   lara-md – Custom Bootstrap Theme  [generiert via Theme-Editor]
   ───────────────────────────────────────────────────────────────────────
   Rückgängig machen:
     1. Diese Datei löschen (oder lassen – sie schadet nicht)
     2. In app.blade.php den <link>-Tag mit "theme.css" entfernen
     3. In app.blade.php das frühe Theme-Init-<script> entfernen
     4. In app.blade.php das THEME-<script> am Seitenende entfernen
     5. In nav.blade.php den #themeToggle-Button entfernen
   ═══════════════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────────────────
   BLOCK 1 – FARB-PALETTE: Light-Mode
   Alle Bootstrap-Semantikfarben als eigene CSS-Variablen.
   Nur hier ändern – alle abhängigen Blöcke nutzen diese Variablen.
   ─────────────────────────────────────────────────────────────────────── */
:root,
[data-bs-theme="light"] {

    /* Primary */
    --bs-primary:              #0d6efd;
    --bs-primary-rgb:          13, 110, 253;

    /* Secondary */
    --bs-secondary:              #6c757d;
    --bs-secondary-rgb:          108, 117, 125;

    /* Success */
    --bs-success:              #198754;
    --bs-success-rgb:          25, 135, 84;

    /* Danger */
    --bs-danger:              #dc3545;
    --bs-danger-rgb:          220, 53, 69;

    /* Warning */
    --bs-warning:              #ffc107;
    --bs-warning-rgb:          255, 193, 7;

    /* Info */
    --bs-info:              #0dcaf0;
    --bs-info-rgb:          13, 202, 240;

    /* Light */
    --bs-light:              #f8f9fa;
    --bs-light-rgb:          248, 249, 250;

    /* Dark */
    --bs-dark:              #212529;
    --bs-dark-rgb:          33, 37, 41;

    /* Links / Text */
    --bs-link-color:           #0d6efd;
    --bs-link-color-rgb:       13, 110, 253;
    --bs-link-hover-color:     #0a58ca;
    --bs-link-hover-color-rgb: 10, 88, 202;

    /* App-Layout */
    --lm-navbar-bg:            #212529;
}

/* ───────────────────────────────────────────────────────────────────────
   BLOCK 2 – FARB-PALETTE: Dark-Mode
   Nur abweichende Werte gegenüber dem Light-Mode definieren.
   ─────────────────────────────────────────────────────────────────────── */
[data-bs-theme="dark"] {

    /* Primary */
    --bs-primary:              #6ea8fe;
    --bs-primary-rgb:          110, 168, 254;

    /* Secondary */
    --bs-secondary:              #a0a6ac;
    --bs-secondary-rgb:          160, 166, 172;

    /* Success */
    --bs-success:              #75b798;
    --bs-success-rgb:          117, 183, 152;

    /* Danger */
    --bs-danger:              #ea868f;
    --bs-danger-rgb:          234, 134, 143;

    /* Warning */
    --bs-warning:              #ffda6a;
    --bs-warning-rgb:          255, 218, 106;

    /* Info */
    --bs-info:              #6edff6;
    --bs-info-rgb:          110, 223, 246;

    /* Light */
    --bs-light:              #343a40;
    --bs-light-rgb:          52, 58, 64;

    /* Dark */
    --bs-dark:              #e9ecef;
    --bs-dark-rgb:          233, 236, 239;

    /* Links / Text */
    --bs-link-color:           #6ea8fe;
    --bs-link-color-rgb:       110, 168, 254;
    --bs-link-hover-color:     #8bb9fe;
    --bs-link-hover-color-rgb: 139, 185, 254;

    /* App-Layout */
    --lm-navbar-bg:            #111827;
}

/* ───────────────────────────────────────────────────────────────────────
   BLOCK 3 – SUBTILE FARBEN: Light-Mode
   Hintergründe und Ränder für Alerts, Badge-outlines usw.
   Werden aus der Farb-Palette automatisch berechnet.
   ─────────────────────────────────────────────────────────────────────── */
:root,
[data-bs-theme="light"] {

    --bs-primary-bg-subtle:    #cfe2ff;
    --bs-primary-border-subtle: #99c2fe;
    --bs-primary-text-emphasis: #08449d;

    --bs-secondary-bg-subtle:    #e2e3e5;
    --bs-secondary-border-subtle: #c1c5c8;
    --bs-secondary-text-emphasis: #43494e;

    --bs-success-bg-subtle:    #d1e7dd;
    --bs-success-border-subtle: #9ecdb7;
    --bs-success-text-emphasis: #105434;

    --bs-danger-bg-subtle:    #f8d7da;
    --bs-danger-border-subtle: #f0aab1;
    --bs-danger-text-emphasis: #88212b;

    --bs-warning-bg-subtle:    #fff3cd;
    --bs-warning-border-subtle: #ffe597;
    --bs-warning-text-emphasis: #9e7804;

    --bs-info-bg-subtle:    #cff4fc;
    --bs-info-border-subtle: #99e9f9;
    --bs-info-text-emphasis: #087d95;

    --bs-light-bg-subtle:    #fcfcfd;
    --bs-light-border-subtle: #c9c9ca;
    --bs-light-text-emphasis: #495057;

    --bs-dark-bg-subtle:    #646669;
    --bs-dark-border-subtle: #909294;
    --bs-dark-text-emphasis: #0a0b0c;
}

/* ───────────────────────────────────────────────────────────────────────
   BLOCK 4 – SUBTILE FARBEN: Dark-Mode
   Hintergründe und Ränder für Alerts, Badge-outlines usw.
   Werden aus der Farb-Palette automatisch berechnet.
   ─────────────────────────────────────────────────────────────────────── */
[data-bs-theme="dark"] {

    --bs-primary-bg-subtle:    #182538;
    --bs-primary-border-subtle: #2e476b;
    --bs-primary-text-emphasis: #d1e3ff;

    --bs-secondary-bg-subtle:    #232526;
    --bs-secondary-border-subtle: #434648;
    --bs-secondary-text-emphasis: #e1e3e4;

    --bs-success-bg-subtle:    #1a2821;
    --bs-success-border-subtle: #314d40;
    --bs-success-text-emphasis: #d3e8de;

    --bs-danger-bg-subtle:    #331d1f;
    --bs-danger-border-subtle: #62383c;
    --bs-danger-text-emphasis: #f8d8db;

    --bs-warning-bg-subtle:    #383017;
    --bs-warning-border-subtle: #6b5c2d;
    --bs-warning-text-emphasis: #fff3cf;

    --bs-info-bg-subtle:    #183136;
    --bs-info-border-subtle: #2e5e67;
    --bs-info-text-emphasis: #d1f5fc;

    --bs-light-bg-subtle:    #0a0c0d;
    --bs-light-border-subtle: #121416;
    --bs-light-text-emphasis: #adb5bd;

    --bs-dark-bg-subtle:    #2f2f30;
    --bs-dark-border-subtle: #525354;
    --bs-dark-text-emphasis: #fbfbfc;
}

/* ───────────────────────────────────────────────────────────────────────
   BASIS-KOMPONENTEN – Design-System-Defaults
   Paket-verwaltet, nicht editieren – bei jeder Regeneration neu erzeugt.
   Nur var(--bs-*)-Variablen (theme-aware). App-Overrides hinter den PRESERVE-Marker.
   ─────────────────────────────────────────────────────────────────────── */

/* Tabellenkopf – zentral & theme-aware; explizite color haertet gegen
   .table-light & Co. (deren festes #000 waere im Dark-Mode unlesbar). */
.table thead th { background-color: var(--bs-tertiary-bg); color: var(--bs-emphasis-color); }

/* Button-Farb-Overrides – Bootstrap-Buttons erben --bs-* NICHT automatisch;
   die --bs-btn-*-Variablen werden aus der Palette abgeleitet. */
.btn-primary {
    --bs-btn-bg:                  var(--bs-primary);
    --bs-btn-border-color:        var(--bs-primary);
    --bs-btn-hover-bg:            color-mix(in srgb, var(--bs-primary) 85%, black);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--bs-primary) 80%, black);
    --bs-btn-active-bg:           color-mix(in srgb, var(--bs-primary) 75%, black);
    --bs-btn-active-border-color: color-mix(in srgb, var(--bs-primary) 70%, black);
    --bs-btn-disabled-bg:         var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}
.btn-outline-primary {
    --bs-btn-color:              var(--bs-primary);
    --bs-btn-border-color:       var(--bs-primary);
    --bs-btn-hover-bg:           var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-active-bg:          var(--bs-primary);
    --bs-btn-active-border-color:var(--bs-primary);
}
.btn-success {
    --bs-btn-bg:                  var(--bs-success);
    --bs-btn-border-color:        var(--bs-success);
    --bs-btn-hover-bg:            color-mix(in srgb, var(--bs-success) 85%, black);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--bs-success) 80%, black);
    --bs-btn-active-bg:           color-mix(in srgb, var(--bs-success) 75%, black);
    --bs-btn-disabled-bg:         var(--bs-success);
    --bs-btn-disabled-border-color: var(--bs-success);
}
.btn-outline-success {
    --bs-btn-color:              var(--bs-success);
    --bs-btn-border-color:       var(--bs-success);
    --bs-btn-hover-bg:           var(--bs-success);
    --bs-btn-hover-border-color: var(--bs-success);
}
.btn-danger {
    --bs-btn-bg:                  var(--bs-danger);
    --bs-btn-border-color:        var(--bs-danger);
    --bs-btn-hover-bg:            color-mix(in srgb, var(--bs-danger) 85%, black);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--bs-danger) 80%, black);
    --bs-btn-active-bg:           color-mix(in srgb, var(--bs-danger) 75%, black);
    --bs-btn-disabled-bg:         var(--bs-danger);
    --bs-btn-disabled-border-color: var(--bs-danger);
}
.btn-outline-danger {
    --bs-btn-color:              var(--bs-danger);
    --bs-btn-border-color:       var(--bs-danger);
    --bs-btn-hover-bg:           var(--bs-danger);
    --bs-btn-hover-border-color: var(--bs-danger);
}
.btn-secondary {
    --bs-btn-bg:                  var(--bs-secondary);
    --bs-btn-border-color:        var(--bs-secondary);
    --bs-btn-hover-bg:            color-mix(in srgb, var(--bs-secondary) 85%, black);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--bs-secondary) 80%, black);
    --bs-btn-active-bg:           color-mix(in srgb, var(--bs-secondary) 75%, black);
    --bs-btn-disabled-bg:         var(--bs-secondary);
    --bs-btn-disabled-border-color: var(--bs-secondary);
}
.btn-outline-secondary {
    --bs-btn-color:              var(--bs-secondary);
    --bs-btn-border-color:       var(--bs-secondary);
    --bs-btn-hover-bg:           var(--bs-secondary);
    --bs-btn-hover-border-color: var(--bs-secondary);
}
.btn:focus { box-shadow: none !important; }

/* Anker-Ziel: Offset unter Sticky-Navbar */
:target { scroll-margin-top: 84px; }

/* Button-Font-Size-Utilities (kombinierbar mit btn-sm / btn-lg) */
.btn-fs-lg { font-size: 1rem   !important; }
.btn-fs-md { font-size: 0.8rem !important; }
.btn-fs-sm { font-size: 0.7rem !important; }

/* Custom Scrollbar – theme-aware über --bs-emphasis-color-hsl */
.custom-scrollbar::-webkit-scrollbar { width: 15px; height: 15px; }
.custom-scrollbar::-webkit-scrollbar-thumb {
    background-color: hsla(var(--bs-emphasis-color-hsl), 0.25);
    border: 4px solid transparent;
    background-clip: padding-box;
    border-radius: var(--bs-border-radius-pill);
}
.custom-scrollbar::-webkit-scrollbar-thumb:vertical { min-height: 24px; }
.custom-scrollbar::-webkit-scrollbar-thumb:horizontal { min-width: 24px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background-color: hsla(var(--bs-emphasis-color-hsl), 0.5);
    background-clip: padding-box;
}
.custom-scrollbar::-webkit-scrollbar-track { background: 0 0; }
.custom-scrollbar::-webkit-scrollbar-corner { background-color: transparent; }
.custom-scrollbar {
    scrollbar-color: hsla(var(--bs-emphasis-color-hsl), 0.25) transparent;
    scrollbar-width: thin;
}

/* === PRESERVE-START === */
/* ───────────────────────────────────────────────────────────────────────
   BLOCK 4 – THEME-TOGGLE BUTTON
   ─────────────────────────────────────────────────────────────────────── */
#themeToggle {
    opacity: .75;
    transition: opacity .15s;
}
#themeToggle:hover { opacity: 1; }

/* ───────────────────────────────────────────────────────────────────────
   BLOCK 5 – LAYOUT & KOMPONENTEN (migriert aus pcm-dark.css / pcm-light.css)
   ─────────────────────────────────────────────────────────────────────── */

/* Navbar / Sidebar */
.sidebar .offcanvas-header,
.docs-navbar {
    min-height: 55px;
    border-bottom: var(--bs-border-width) solid var(--bs-content-border-color);
}
.docs-navbar {
    background-color: hsla(var(--bs-body-bg-hsl), 0.75);
    backdrop-filter: blur(8px);
}

/* Transparenter Button (Navbar-Icons) */
.btn-transparent {
    background-color: transparent;
    color: var(--bs-body-color) !important;
    border: none;
    --bs-btn-hover-color: var(--bs-action-hover-color);
    --bs-btn-hover-bg: var(--bs-action-hover-bg);
    --bs-btn-hover-border-color: var(--bs-action-hover-border-color);
}

/* Filter-Suche / Sidebar */
.filter-docs {
    background-color: var(--bs-sidebar-bg);
}
.simple-link {
    color: hsla(var(--bs-emphasis-color-hsl), 0.75);
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.simple-link:hover {
    color: hsla(var(--bs-emphasis-color-hsl), 0.9);
}

/* Code-Blöcke */
.pre {
    position: relative;
    padding: var(--bs-spacer-3) var(--bs-spacer-5) !important;
}
.hljs-ln-numbers {
    display: block;
    width: auto;
    user-select: none;
    text-align: center;
    vertical-align: top;
    color: var(--bs-tertiary-color);
}
.hljs-ln-code {
    padding-right: var(--bs-spacer-4) !important;
    padding-left: var(--bs-spacer-2) !important;
}

/* Tabellen */
.table-user td { vertical-align: middle; }

/* Folder-Browser */
.folder-header {
    cursor: pointer;
    user-select: none;
}
[data-bs-theme="light"] .folder-header:hover { background-color: #e9ecef; }
[data-bs-theme="dark"]  .folder-header:hover { background-color: #2b2f33; }

/* Blockquote */
[data-bs-theme="dark"] blockquote {
    --bs-alert-bg: var(--bs-warning-bg-subtle);
    --bs-alert-border-color: var(--bs-warning-border-subtle);
    padding: 0.5rem;
    background-color: var(--bs-alert-bg);
    border: 1px solid var(--bs-alert-border-color);
}
[data-bs-theme="light"] blockquote {
    font-size: smaller;
    background-color: #f1e295;
    color: #0e0e0e;
    padding: 0.5rem;
    border: 1px solid #95999e;
}

/* Sonstiges */
.content-title { margin-bottom: 2.25rem; margin-top: 2.25rem; }
.nav-link2:hover { text-decoration: none !important; }
.list-group-item { padding: 0.35rem 1.25rem; border: none; }
.dropdown-menu > a > i { margin-right: 0.5rem; }
.cursor, .pointer { cursor: pointer; }
.btn-disable { color: #ddd !important; }\n\n/* Layout1 – Glassnav */
#navbar {
    background-color: rgba(var(--bs-body-bg-rgb), 0.85) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--bs-border-color);
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
}

/* TOC rechte Spalte */
#toc-right .list-group-item {
    padding: 0.2rem 0.5rem;
    font-size: 0.875rem;
    border: none;
    background-color: transparent;
    border-radius: 0;
}
#toc-right a {
    text-decoration: none !important;
}
#toc-right a.list-group {
    color: var(--bs-secondary-color);
    display: block;
}
#toc-right a.list-group:hover {
    color: var(--bs-body-color);
}
#toc-right .list-group.toc {
    padding-left: 0.75rem;
}\n\n/* ── JSON-Dump-Anzeige (Formatter s2json) ────────────────────────────────
   Lesbar formatierter JSON-Dump in Tabelle / Liste / Karte.
   Theme-aware über Bootstrap-Variablen.

   Höhe je Ansicht über CSS-Variablen justierbar:
   --json-dump-h    feste Höhe (nur Tabelle – gleichmäßige, kompakte Zeilen)
   --json-dump-maxh Maximalhöhe (Liste/Karte – passt sich kurzem JSON an)
   ─────────────────────────────────────────────────────────────────────── */
.json-dump {
    margin: 0;
    padding: 0.5rem 0.75rem;
    background-color: var(--bs-tertiary-bg, var(--bs-secondary-bg));
    border: 1px solid var(--bs-border-color);
    border-left: 3px solid var(--bs-primary);
    border-radius: var(--bs-border-radius, 0.375rem);
    color: var(--bs-body-color);
    font-size: 0.8125rem;
    line-height: 1.45;
    white-space: pre-wrap;
    word-break: break-word;
    height: var(--json-dump-h, auto);
    max-height: var(--json-dump-maxh, 20rem);
    overflow: auto;                 /* vertikal + horizontal scrollen */
    overscroll-behavior: contain;   /* kein Scroll-Durchschlag auf die Seite */
    resize: vertical;               /* bei Bedarf aufziehbar */
}
/* Tabelle: feste, kompakte Höhe + Breitenbegrenzung → gleichmäßige Zeilen */
.table      .json-dump { --json-dump-h: 9rem; max-width: 22rem; }
/* Liste: anpassende Maximalhöhe */
.list-group .json-dump { --json-dump-maxh: 14rem; }
/* Karte: etwas mehr Maximalhöhe */
.card       .json-dump { --json-dump-maxh: 16rem; }
.json-dump--invalid {
    border-color: var(--bs-danger);
    border-left-color: var(--bs-danger);
    background-color: var(--bs-danger-bg-subtle, rgba(var(--bs-danger-rgb), 0.1));
    color: var(--bs-danger-text-emphasis, var(--bs-danger));
}

/* ───────────────────────────────────────────────────────────────────────
   Abbildungen (image-Block der Export-Views / db-Kürzel)
   <figure class="md-figure md-figure--{left|center|right}"> mit optionaler
   <figcaption>. Nutzt bewusst Utility-Klassen statt inline-<style>.
   ─────────────────────────────────────────────────────────────────────── */
.md-figure { margin: 1rem 0; }
.md-figure img { max-width: 100%; height: auto; border-radius: var(--bs-border-radius, 0.375rem); }
.md-figure figcaption {
    margin-top: 0.35rem;
    font-size: 0.8125rem;
    color: var(--bs-secondary-color);
    line-height: 1.4;
}
.md-figure--center { text-align: center; }
.md-figure--center img { margin-inline: auto; }
.md-figure--left  { float: left;  max-width: 50%; margin: 0.25rem 1rem 0.75rem 0; }
.md-figure--right { float: right; max-width: 50%; margin: 0.25rem 0 0.75rem 1rem; }

/* Asset-Karte: seit Stage 2a Bootstrap-Markup (.card/.card-body/…); die früheren
   .md-card*-Utilities sind archiviert unter storage/attic/snippets/theme-css-md-card.css. */