/* ══════════════════════════════════════════════════════════
   jaas-theme.css – Design-Token-System (Light + Dark)
   ══════════════════════════════════════════════════════════
   
   Konvention:
     --jt-bg-*       Hintergründe
     --jt-fg-*       Vordergrund / Text
     --jt-border-*   Rahmen
     --jt-shadow-*   Schatten
     --jt-surface-*  Karten, Panels, Dialoge
     --jt-accent-*   Akzentfarben (Branding bleibt --main-color)
   
   Einbinden: VOR jaas.css und app.css in index.html
   ══════════════════════════════════════════════════════════ */


/* ── Light (Default) ── */

:root {
    /* Hintergründe */
    --jt-bg-page:           #f0f2f5;
    --jt-bg-surface:        #ffffff;
    --jt-bg-surface-2:      #f8fafb;
    --jt-bg-surface-3:      #f5f7f9;
    --jt-bg-surface-hover:  rgba(0,0,0,0.02);
    --jt-bg-surface-active: rgba(0,0,0,0.04);
    --jt-bg-inset:          #fafafa;
    --jt-bg-overlay:        rgba(0,0,0,0.35);
    --jt-bg-overlay-heavy:  rgba(0,0,0,0.45);

    /* Vordergrund / Text */
    --jt-fg-default:        #222222;
    --jt-fg-secondary:      #555555;
    --jt-fg-tertiary:       #888888;
    --jt-fg-muted:          #999999;
    --jt-fg-placeholder:    #bbbbbb;
    --jt-fg-inverse:        #ffffff;

    /* Rahmen */
    --jt-border-default:    #e6e6e6;
    --jt-border-light:      #efefef;
    --jt-border-subtle:     rgba(0,0,0,0.06);
    --jt-border-input:      var(--tertiary-color2);

    /* Schatten */
    --jt-shadow-sm:         0 1px 3px rgba(0,0,0,0.08);
    --jt-shadow-md:         0 2px 10px rgba(0,0,0,0.06);
    --jt-shadow-lg:         0 6px 18px rgba(0,0,0,0.06);
    --jt-shadow-xl:         0 10px 30px rgba(0,0,0,0.18);
    --jt-shadow-card:       0 3px 23px -1px rgba(0,0,0,0.3);

    /* Oberflächen (Karten, Dialoge, Panels) */
    --jt-surface-card:      #ffffff;
    --jt-surface-card-header: #f8fafb;
    --jt-surface-dialog:    #ffffff;
    --jt-surface-popover:   #ffffff;
    --jt-surface-sidebar:   var(--secondary-color);
    --jt-surface-tooltip:   var(--secondary-color);

    /* Inputs */
    --jt-input-bg:          #ffffff;
    --jt-input-border:      var(--tertiary-color2);
    --jt-input-text:        var(--tertiary-color);
    --jt-input-placeholder: #aaa;
    --jt-input-focus-ring:  rgba(100,196,221,0.25);

    /* Status */
    --jt-status-ok-bg:      #e8f5e9;
    --jt-status-ok-fg:      #2e7d32;
    --jt-status-ok-border:  #a5d6a7;
    --jt-status-warn-bg:    #fff4cf;
    --jt-status-warn-fg:    #8a6d3b;
    --jt-status-warn-border:#e2c36a;
    --jt-status-danger-bg:  #ffebee;
    --jt-status-danger-fg:  #c62828;
    --jt-status-danger-border: #ef9a9a;
    --jt-status-info-bg:    #e5f3ff;
    --jt-status-info-fg:    #1565c0;
    --jt-status-info-border:#90caf9;

    /* Sonstiges */
    --jt-radius-sm:         8px;
    --jt-radius-md:         10px;
    --jt-radius-lg:         14px;
    --jt-radius-xl:         20px;
    --jt-radius-pill:       999px;
    --jt-transition:        0.15s ease;
}


/* ── Dark Mode ── */

[data-theme="dark"] {
    /* Hintergründe */
    --jt-bg-page:           #121417;
    --jt-bg-surface:        #1a1d23;
    --jt-bg-surface-2:      #22262d;
    --jt-bg-surface-3:      #282c34;
    --jt-bg-surface-hover:  rgba(255,255,255,0.04);
    --jt-bg-surface-active: rgba(255,255,255,0.08);
    --jt-bg-inset:          #1e2128;
    --jt-bg-overlay:        rgba(0,0,0,0.55);
    --jt-bg-overlay-heavy:  rgba(0,0,0,0.65);

    /* Vordergrund / Text */
    --jt-fg-default:        #e4e6ea;
    --jt-fg-secondary:      #b0b4bc;
    --jt-fg-tertiary:       #8a8f98;
    --jt-fg-muted:          #6c727d;
    --jt-fg-placeholder:    #555a63;
    --jt-fg-inverse:        #121417;

    /* Rahmen */
    --jt-border-default:    #2e3340;
    --jt-border-light:      #282c34;
    --jt-border-subtle:     rgba(255,255,255,0.06);
    --jt-border-input:      #3a3f4b;

    /* Schatten – in Dark dunkler & breiter */
    --jt-shadow-sm:         0 1px 3px rgba(0,0,0,0.3);
    --jt-shadow-md:         0 2px 10px rgba(0,0,0,0.25);
    --jt-shadow-lg:         0 6px 18px rgba(0,0,0,0.3);
    --jt-shadow-xl:         0 10px 30px rgba(0,0,0,0.45);
    --jt-shadow-card:       0 3px 23px -1px rgba(0,0,0,0.5);

    /* Oberflächen */
    --jt-surface-card:      #1e2128;
    --jt-surface-card-header: #22262d;
    --jt-surface-dialog:    #1e2128;
    --jt-surface-popover:   #22262d;
    --jt-surface-sidebar:   #1a1d23;
    --jt-surface-tooltip:   #282c34;

    /* Inputs */
    --jt-input-bg:          #22262d;
    --jt-input-border:      #3a3f4b;
    --jt-input-text:        #e4e6ea;
    --jt-input-placeholder: #555a63;
    --jt-input-focus-ring:  rgba(100,196,221,0.30);

    /* Status – etwas gedämpfter */
    --jt-status-ok-bg:      rgba(46,125,50,0.15);
    --jt-status-ok-fg:      #81c784;
    --jt-status-ok-border:  rgba(46,125,50,0.35);
    --jt-status-warn-bg:    rgba(255,183,77,0.12);
    --jt-status-warn-fg:    #ffb74d;
    --jt-status-warn-border:rgba(255,183,77,0.30);
    --jt-status-danger-bg:  rgba(198,40,40,0.15);
    --jt-status-danger-fg:  #ef9a9a;
    --jt-status-danger-border: rgba(198,40,40,0.35);
    --jt-status-info-bg:    rgba(21,101,192,0.12);
    --jt-status-info-fg:    #64b5f6;
    --jt-status-info-border:rgba(21,101,192,0.30);

    /* ── Branding-Override für Dark ── */
    --secondary-color:      #1a1d23;
    --secondary-color2:     rgba(255,255,255,0.05);
    --secondary-color3:     #22262d;
    --tertiary-color:       #b0b4bc;
    --tertiary-color2:      rgba(255,255,255,0.10);
    --tertiary-color3:      rgba(255,255,255,0.04);
}

/* ── Body & HTML Grundfarbe ── */

[data-theme="dark"] body,
[data-theme="dark"] html {
    background-color: var(--jt-bg-page);
    color: var(--jt-fg-default);
}

/* ── Globale Surface-Overrides für Dark ── */

[data-theme="dark"] .content,
[data-theme="dark"] .page-content {
    background-color: var(--jt-bg-surface);
}

[data-theme="dark"] .nav-headline > h1 {
    color: var(--jt-fg-inverse);
}

/* ── Inputs ── */

[data-theme="dark"] .input-form,
[data-theme="dark"] .input-search-filter,
[data-theme="dark"] .input-form-error {
    background-color: var(--jt-input-bg);
    color: var(--jt-input-text);
    border-color: var(--jt-input-border);
}

/* ── Buttons ── */

[data-theme="dark"] .btn-primary:hover {
    background-color: var(--jt-bg-surface-2);
}

[data-theme="dark"] .cancel {
    background-color: var(--jt-bg-surface);
    color: var(--main-color);
    border-color: var(--main-color);
}

[data-theme="dark"] .desktop-action-btn:disabled,
[data-theme="dark"] .mobile-action-btn:disabled {
    background: #2e3340;
    color: #555a63;
}

/* ── Cards, Panels, Dialoge ── */

[data-theme="dark"] .panel {
    background: var(--jt-surface-card);
    border-color: var(--jt-border-default);
    box-shadow: var(--jt-shadow-sm);
}

[data-theme="dark"] .panel > summary {
    background: var(--jt-surface-card-header);
    border-bottom-color: var(--jt-border-subtle);
}

[data-theme="dark"] .panel > summary:hover {
    background: var(--jt-bg-surface-3);
}

[data-theme="dark"] .panel[open] > summary {
    background: var(--jt-bg-surface-3);
}

/* ── Radzen Overrides ── */

[data-theme="dark"] .rz-tabview-panel {
    background: var(--jt-bg-surface);
}

[data-theme="dark"] .rz-tabview-top > .rz-tabview-nav {
    border-bottom-color: var(--jt-border-subtle);
}

[data-theme="dark"] .rz-tabview-top > .rz-tabview-nav li > a {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .rz-tabview-top > .rz-tabview-nav li > a:hover {
    background: var(--jt-bg-surface-active);
    color: var(--jt-fg-default);
}

[data-theme="dark"] .rz-dialog {
    background: var(--jt-surface-dialog);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .rz-dialog-titlebar {
    background: var(--jt-surface-card-header);
    color: var(--jt-fg-default);
}

[data-theme="dark"] .rz-dialog-content {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .rz-dropdown {
    background: var(--jt-input-bg);
    border-color: var(--jt-input-border);
    color: var(--jt-input-text);
}

[data-theme="dark"] .rz-popup {
    background: var(--jt-surface-popover);
    border-color: var(--jt-border-default);
}

/* ── Sidebar ── */

[data-theme="dark"] .sidebar {
    background-color: var(--jt-surface-sidebar);
}

/* ── Menu / Popover ── */

[data-theme="dark"] .menu-links,
[data-theme="dark"] .bm-panel {
    background: var(--jt-surface-popover);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .menu-links::before,
[data-theme="dark"] .bm-panel::before {
    background: var(--jt-surface-popover);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .menu-links a,
[data-theme="dark"] .bm-panel a {
    color: var(--jt-fg-secondary);
}

[data-theme="dark"] .menu-links a:hover,
[data-theme="dark"] .bm-panel a:hover {
    background: var(--jt-bg-surface-active);
}

/* ── Popover (Jobtura-eigener) ── */

[data-theme="dark"] .jt-popover {
    background: var(--jt-surface-popover);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .jt-popover-body {
    color: var(--jt-fg-default);
}

/* ── Mobile Rows ── */

[data-theme="dark"] .mobile-row {
    background: var(--jt-surface-card);
    border-color: var(--jt-border-default);
}

/* ── Desktop Detailansichten (ALPD + AIDV) ── */

[data-theme="dark"] .alpd-card,
[data-theme="dark"] .aidm-card {
    background: var(--jt-surface-card);
    border-color: var(--jt-border-default);
    box-shadow: var(--jt-shadow-md);
}

[data-theme="dark"] .alpd-card-header {
    background: var(--jt-surface-card-header);
    border-bottom-color: var(--jt-border-subtle);
}

[data-theme="dark"] .alpd-card-title {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .alpd-field-label {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .alpd-field-value {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .alpd-field-editable:hover,
[data-theme="dark"] .aidv-field-editable:hover {
    background: var(--jt-bg-surface-active);
}

[data-theme="dark"] .alpd-text-box,
[data-theme="dark"] .aidv-text-box {
    background: var(--jt-bg-inset);
    border-color: var(--jt-border-default);
    color: var(--jt-fg-default);
}

[data-theme="dark"] .alpd-entries-table,
[data-theme="dark"] .aidv-entries-table {
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .alpd-entries-header,
[data-theme="dark"] .aidv-entries-header {
    background: var(--jt-bg-surface-3);
    border-bottom-color: var(--jt-border-default);
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .alpd-entries-row,
[data-theme="dark"] .aidv-entries-row {
    border-bottom-color: var(--jt-border-light);
}

[data-theme="dark"] .alpd-entries-row:hover,
[data-theme="dark"] .aidv-entries-row:hover {
    background: var(--jt-bg-surface-hover);
}

[data-theme="dark"] .alpd-empty-hint,
[data-theme="dark"] .aidv-empty-hint,
[data-theme="dark"] .aidm-empty {
    background: var(--jt-bg-surface-hover);
    color: var(--jt-fg-muted);
}

[data-theme="dark"] .alpd-badge {
    box-shadow: 0 1px 4px rgba(0,0,0,0.3);
}

/* ── Desktop Stock ── */

[data-theme="dark"] .aidv-stock-desktop-box {
    background: var(--jt-bg-inset);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .aidv-stock-desktop-label {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .aidv-stock-desktop-value {
    color: var(--jt-fg-default);
}

/* ── Mobile (AIDM) ── */

[data-theme="dark"] .aidm-hero-body {
    background: var(--jt-surface-card);
}

[data-theme="dark"] .aidm-title {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .aidm-meta-label {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .aidm-meta-value {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .aidm-meta-row {
    border-bottom-color: var(--jt-border-subtle);
}

[data-theme="dark"] .aidm-chip {
    background: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
    color: var(--jt-fg-default);
}

[data-theme="dark"] .aidm-pill {
    background: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
    color: var(--jt-fg-default);
}

[data-theme="dark"] .aidm-pill-ok {
    border-color: var(--jt-status-ok-border);
}

[data-theme="dark"] .aidm-pill-danger {
    border-color: var(--jt-status-danger-border);
}

[data-theme="dark"] .aidm-comment-box {
    background: var(--jt-bg-inset);
    border-color: var(--jt-border-default);
    color: var(--jt-fg-default);
}

[data-theme="dark"] .aidm-stock-box {
    background: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .aidm-stock-label {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .aidm-stock-value {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .aidm-booking-name {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .aidm-booking-row {
    border-bottom-color: var(--jt-border-subtle);
}

[data-theme="dark"] .aidm-booking-qty {
    background: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
    color: var(--jt-fg-default);
}

[data-theme="dark"] .aidm-section-title {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .aidm-image-placeholder {
    background: linear-gradient(180deg, #22262d 0%, #1a1d23 100%);
}

[data-theme="dark"] .aidm-image-wrap {
    background: var(--jt-bg-surface-2);
    border-bottom-color: var(--jt-border-default);
}

/* ── Toggle-Gruppe ── */

[data-theme="dark"] .aidm-toggle-group {
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .aidm-toggle-inactive {
    background: var(--jt-bg-surface-2);
    color: var(--jt-fg-muted);
}

[data-theme="dark"] .aidm-toggle-active.aidm-toggle-ok {
    background: var(--jt-status-ok-bg);
    color: var(--jt-status-ok-fg);
    border-color: var(--jt-status-ok-border);
}

[data-theme="dark"] .aidm-toggle-active.aidm-toggle-danger {
    background: var(--jt-status-danger-bg);
    color: var(--jt-status-danger-fg);
    border-color: var(--jt-status-danger-border);
}

/* ── Remove / Delete Buttons ── */

[data-theme="dark"] .alpd-remove-btn,
[data-theme="dark"] .aidv-remove-btn {
    border-color: rgba(169,68,66,0.35);
    color: #ef9a9a;
}

[data-theme="dark"] .alpd-remove-btn:hover,
[data-theme="dark"] .aidv-remove-btn:hover {
    background: rgba(198,40,40,0.12);
    border-color: rgba(198,40,40,0.5);
}

[data-theme="dark"] .alpd-delete-btn {
    border-color: rgba(217,83,79,0.5);
    color: #ef9a9a;
}

[data-theme="dark"] .alpd-delete-btn:hover {
    background: #d9534f;
    color: #fff;
}

/* ── Galerie ── */

[data-theme="dark"] .alpd-gallery-thumb {
    background: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
}

/* ── Header ── */

[data-theme="dark"] .header ul {
    background-color: var(--main-color);
}

/* ── Tooltip ── */

[data-theme="dark"] *[data-tooltip]::after {
    background: var(--jt-surface-tooltip);
    border-color: var(--jt-border-default);
    color: var(--jt-fg-default);
}

/* ── Filter Desktop ── */

[data-theme="dark"] .filter-panel {
    background: var(--jt-bg-surface);
}

/* ── Stundenzettel (TT) ── */

[data-theme="dark"] .tt-monthly-body-table {
    background: var(--jt-surface-card);
}

[data-theme="dark"] .tt-header-sub-row {
    background-color: var(--jt-bg-surface-3);
    border-bottom-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-header-sub-row > div {
    border-right-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-monthly-body-table-content > .tt-day:nth-child(odd) > .tt-day-summary {
    background-color: var(--jt-bg-surface);
}

[data-theme="dark"] .tt-monthly-body-table-content > .tt-day:nth-child(even) > .tt-day-summary {
    background-color: var(--jt-bg-surface-2);
}

[data-theme="dark"] .tt-day-summary:hover {
    background-color: var(--jt-bg-surface-3) !important;
}

[data-theme="dark"] .tt-monthly-body-table-content-row > div,
[data-theme="dark"] .tt-day-row > div {
    border-right-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-week {
    background: var(--jt-surface-card);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-week-header {
    background: var(--jt-surface-card-header);
}

[data-theme="dark"] .tt-day-details {
    background-color: var(--jt-bg-surface-2);
    border-top-color: var(--jt-border-default);
}

/* ── TT Mobile ── */

[data-theme="dark"] .tt-mobile-header-card {
    background: var(--jt-surface-card);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-m-week {
    background: var(--jt-surface-card);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-m-week-summary {
    background: var(--jt-surface-card-header);
    border-bottom-color: var(--jt-border-subtle);
}

[data-theme="dark"] .tt-m-day {
    background: var(--jt-surface-card);
    border-color: var(--jt-border-subtle);
}

[data-theme="dark"] .tt-m-day-body {
    background: var(--jt-bg-surface-2);
    border-top-color: var(--jt-border-subtle);
}

[data-theme="dark"] .tt-m-chip {
    background: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-mobile-stat {
    background: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
}

/* ── Zielradar ── */

[data-theme="dark"] .tr-card,
[data-theme="dark"] .trm-card {
    background: var(--jt-surface-card);
    border-color: var(--jt-border-default);
    box-shadow: var(--jt-shadow-md);
}

[data-theme="dark"] .tr-input,
[data-theme="dark"] .tr-textarea,
[data-theme="dark"] .trm-input,
[data-theme="dark"] .trm-textarea {
    background: var(--jt-input-bg);
    border-color: var(--jt-input-border);
    color: var(--jt-input-text);
}

/* ── Verfügbarkeiten ── */

[data-theme="dark"] .availability-wrapper {
    background: var(--jt-bg-surface);
}

[data-theme="dark"] .availability-grid {
    background: var(--jt-surface-card);
    border-color: var(--jt-border-default);
}

/* ── Changelog ── */

[data-theme="dark"] .changelog-dialog {
    background: var(--jt-surface-dialog);
}

[data-theme="dark"] .changelog-header,
[data-theme="dark"] .changelog-footer {
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .changelog-body {
    color: var(--jt-fg-default);
}

/* ── Scrollbar Dark ── */

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background-color: rgba(255,255,255,0.15);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255,255,255,0.25);
}

/* ── Background Image ausblenden in Dark ── */

[data-theme="dark"] html,
[data-theme="dark"] body {
    background-image: none !important;
}

/* ── Not Found ── */

[data-theme="dark"] .aidm-not-found-title {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .aidm-not-found-text {
    color: var(--jt-fg-muted);
}

/* ── Dokument-Liste (ALPD Mobile) ── */

[data-theme="dark"] .alp-doc-row {
    background: var(--jt-bg-inset);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .alp-doc-row:active {
    background: var(--jt-bg-surface-active);
}

[data-theme="dark"] .alp-doc-filename {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .alp-doc-meta {
    color: var(--jt-fg-muted);
}

[data-theme="dark"] .alp-doc-comment {
    color: var(--jt-fg-tertiary);
}

/* ══════════════════════════════════════════════════════════
   Dark Mode – Dialoge, Tabs, Inline-Inputs
   ══════════════════════════════════════════════════════════ */


/* ── Custom Dialoge (dialog-overlay / dialog-box / scan-dialog) ── */

[data-theme="dark"] .dialog-overlay {
    background: var(--jt-bg-overlay-heavy);
}

[data-theme="dark"] .dialog-box {
    background: var(--jt-surface-dialog);
    box-shadow: 0 8px 24px rgba(0,0,0,0.45);
}

[data-theme="dark"] .dialog-text {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .scan-dialog {
    background: var(--jt-surface-dialog);
    box-shadow: 0 8px 24px rgba(0,0,0,0.45);
}

[data-theme="dark"] .scan-dialog-title {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .scan-dialog-subtitle {
    color: var(--jt-fg-muted);
}

[data-theme="dark"] .scan-dialog-close {
    color: var(--jt-fg-muted);
}

[data-theme="dark"] .scan-dialog-close:hover {
    color: var(--jt-fg-default);
}


/* ── Inline-Inputs in Dialogen (via style="...") ── */
/* Da viele Dialog-Inputs inline style="border: 1px solid #ccc" haben,
   brauchen wir !important für Dark-Override. */

[data-theme="dark"] .dialog-box input[type="text"],
[data-theme="dark"] .dialog-box input[type="number"],
[data-theme="dark"] .dialog-box input[type="date"],
[data-theme="dark"] .dialog-box textarea,
[data-theme="dark"] .scan-dialog input[type="text"],
[data-theme="dark"] .scan-dialog input[type="number"],
[data-theme="dark"] .scan-dialog textarea {
    background-color: var(--jt-input-bg) !important;
    color: var(--jt-input-text) !important;
    border-color: var(--jt-input-border) !important;
}

    [data-theme="dark"] .dialog-box input::placeholder,
    [data-theme="dark"] .dialog-box textarea::placeholder,
    [data-theme="dark"] .scan-dialog input::placeholder,
    [data-theme="dark"] .scan-dialog textarea::placeholder {
        color: var(--jt-input-placeholder);
    }

/* Labels in Dialogen (oft hardcoded color: #888 via style) */
[data-theme="dark"] .dialog-box label,
[data-theme="dark"] .scan-dialog label {
    color: var(--jt-fg-tertiary) !important;
}

/* Fehlermeldungen in Dialogen */
[data-theme="dark"] .dialog-box [style*="color: #a94442"],
[data-theme="dark"] .scan-dialog [style*="color: #a94442"] {
    color: var(--jt-status-danger-fg) !important;
}

/* Bestätigungstexte (z.B. "ScanCode: XYZ") */
[data-theme="dark"] .dialog-box [style*="font-weight: 600"] {
    color: var(--jt-fg-default);
}


 /* ── Radzen Tabs – Komplett-Override ── */

/* Tab-Navigation: Hintergrund + Trennung */
[data-theme="dark"] .rz-tabview-top > .rz-tabview-panels {
    border-top-color: var(--jt-border-default);
}

/* Inaktiver Tab */
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li > a {
    color: var(--jt-fg-muted);
    background: transparent;
}

    /* Inaktiver Tab Hover */
    [data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li > a:hover {
        background: var(--jt-bg-surface-active);
        color: var(--jt-fg-default);
    }

/* Aktiver (ausgewählter) Tab */
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav .rz-tabview-selected {
    border-bottom-color: var(--main-color);
    color: var(--main-color);
}

    [data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav .rz-tabview-selected > a {
        color: var(--main-color) !important;
    }

/* Tab-Panel Inhalt */
[data-theme="dark"] .rz-tabview-panel {
    background: var(--jt-bg-surface);
    color: var(--jt-fg-default);
}

/* Tab-Titel */
[data-theme="dark"] .rz-tabview-title {
    color: inherit;
}


/* ── Radzen Standard-Theme-Overrides ── */

/* Radzen Inputs allgemein */
[data-theme="dark"] .rz-inputtext {
    background: var(--jt-input-bg) !important;
    color: var(--jt-input-text) !important;
    border-color: var(--jt-input-border) !important;
}

[data-theme="dark"] .rz-inputtext::placeholder {
    color: var(--jt-input-placeholder) !important;
}

[data-theme="dark"] .rz-inputtext:focus {
    border-color: var(--main-color) !important;
    box-shadow: 0 0 0 3px var(--jt-input-focus-ring) !important;
    outline: none !important;
}

/* Radzen Dropdown – Komplett-Override für Dark */
[data-theme="dark"] .rz-dropdown {
    background: var(--jt-input-bg) !important;
    border-color: var(--jt-input-border) !important;
    color: var(--jt-input-text) !important;
}

[data-theme="dark"] .rz-dropdown:hover:not(.rz-state-disabled) {
    border-color: var(--main-color) !important;
}

[data-theme="dark"] .rz-dropdown.rz-state-focused,
[data-theme="dark"] .rz-dropdown:focus-within {
    border-color: var(--main-color) !important;
    box-shadow: 0 0 0 3px var(--jt-input-focus-ring) !important;
    outline: none !important;
}

/* Focus-visible / outline auf dem hidden input innerhalb des Dropdowns entfernen */
[data-theme="dark"] .rz-dropdown .rz-helper-hidden-accessible input:focus,
[data-theme="dark"] .rz-dropdown .rz-helper-hidden-accessible input:focus-visible,
[data-theme="dark"] .rz-dropdown *:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

[data-theme="dark"] .rz-dropdown .rz-dropdown-label {
    color: var(--jt-input-text) !important;
}

[data-theme="dark"] .rz-dropdown .rz-placeholder {
    color: var(--jt-input-placeholder) !important;
}

[data-theme="dark"] .rz-dropdown .rz-dropdown-trigger {
    color: var(--jt-fg-muted) !important;
    background: transparent !important;
}

[data-theme="dark"] .rz-dropdown .rz-dropdown-clear-icon {
    color: var(--jt-fg-muted) !important;
}

/* ── Radzen Dropdown – Disabled ── */

[data-theme="dark"] .rz-dropdown.rz-state-disabled {
    background: var(--jt-bg-surface-3) !important;
    border-color: var(--jt-border-default) !important;
    color: var(--jt-fg-muted) !important;
    opacity: 0.55 !important;
}

[data-theme="dark"] .rz-dropdown.rz-state-disabled .rz-placeholder {
    color: var(--jt-fg-muted) !important;
}

[data-theme="dark"] .rz-dropdown.rz-state-disabled .rz-dropdown-label {
    color: var(--jt-fg-muted) !important;
}

[data-theme="dark"] .rz-dropdown.rz-state-disabled .rz-dropdown-trigger {
    color: var(--jt-fg-muted) !important;
}

/* Radzen DatePicker */
[data-theme="dark"] .rz-datepicker {
    background: var(--jt-surface-popover);
    border-color: var(--jt-border-default);
    color: var(--jt-fg-default);
}

[data-theme="dark"] .rz-datepicker .rz-calendar-header {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .rz-datepicker td,
[data-theme="dark"] .rz-datepicker th {
    color: var(--jt-fg-secondary);
}

[data-theme="dark"] .rz-state-highlight {
    background: var(--main-color);
    color: var(--jt-fg-inverse);
}

/* Radzen Dropdown Items */
[data-theme="dark"] .rz-dropdown-items-wrapper {
    background: var(--jt-surface-popover);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .rz-dropdown-item {
    color: var(--jt-fg-default);
}

    [data-theme="dark"] .rz-dropdown-item:hover,
    [data-theme="dark"] .rz-dropdown-item.rz-state-highlight {
        background: var(--jt-bg-surface-active);
    }

/* Radzen Overlay / Backdrop */
[data-theme="dark"] .rz-overlay {
    background: var(--jt-bg-overlay-heavy);
}


/* ── fullscreen-overlay (Login Popup etc.) ── */

[data-theme="dark"] .fullscreen-overlay {
    background-color: var(--jt-bg-overlay-heavy);
}

[data-theme="dark"] .fullscreen-modal {
    background-color: var(--jt-surface-dialog);
    border: 1px solid var(--jt-border-default);
    box-shadow: var(--jt-shadow-xl);
    color: var(--jt-fg-default);
}

[data-theme="dark"] .fullscreen-modal .modal-header h2 {
    color: var(--jt-fg-default);
}


/* ── JT-Popover-Overlay ── */

[data-theme="dark"] .jt-popover-overlay {
    background: var(--jt-bg-overlay-heavy);
}

[data-theme="dark"] .jt-popover {
    background: var(--jt-surface-popover);
    border-color: var(--jt-border-default);
    box-shadow: var(--jt-shadow-xl);
}

[data-theme="dark"] .jt-popover-title {
    color: var(--jt-fg-default);
}


/* ── customeredit-flex Labels (Detailansichten) ── */

[data-theme="dark"] .customeredit-flex-header {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .customeredit-flex-label-input label {
    color: var(--jt-fg-tertiary);
}

/* ── hr Dark ── */

[data-theme="dark"] hr {
    border-color: var(--jt-border-default);
    opacity: 0.5;
}


/* ── aidv-tab-title (dekorative Überschrift in Tabs) ── */

[data-theme="dark"] .aidv-tab-title,
[data-theme="dark"] .alpd-tab-title {
    color: var(--jt-fg-muted);
}

    [data-theme="dark"] .aidv-tab-title::before,
    [data-theme="dark"] .aidv-tab-title::after,
    [data-theme="dark"] .alpd-tab-title::before,
    [data-theme="dark"] .alpd-tab-title::after {
        background: linear-gradient(to right, transparent, rgba(255,255,255,0.08));
    }


/* ── aidm-image-empty (Platzhalter-Buttons) ── */

[data-theme="dark"] .aidm-image-empty-btn {
    background: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
    color: var(--jt-fg-default);
}

    [data-theme="dark"] .aidm-image-empty-btn:hover {
        background: var(--jt-bg-surface-3);
    }

[data-theme="dark"] .aidm-image-empty-icon {
    color: var(--jt-fg-muted);
}

[data-theme="dark"] .aidm-image-empty-title {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .aidm-image-empty-subtitle {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .aidm-subtitle {
    color: var(--jt-fg-secondary);
}

[data-theme="dark"] .aidm-empty-inline {
    color: var(--jt-fg-muted);
}


/* ── Status-Row in Detailansicht ── */

[data-theme="dark"] .aidm-status-row {
    color: var(--jt-fg-default);
}

/* ══════════════════════════════════════════════════════════
   Dark Mode – Radzen Tabs Feintuning
   ══════════════════════════════════════════════════════════ */

/* ── Tab-Leiste Hintergrund ── */
[data-theme="dark"] .rz-tabview-top > .rz-tabview-nav {
    background: transparent;
    border-bottom: 1px solid var(--jt-border-default);
}

/* ── Alle Tab-Items: vollständiger Reset ── */
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li,
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li > a {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* ── Inaktiver Tab ── */
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li:not(.rz-tabview-selected) {
    background: var(--jt-bg-surface-2) !important;
    border: 1px solid var(--jt-border-default) !important;
    border-radius: 8px 8px 0 0;
}

[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li:not(.rz-tabview-selected) > a {
    background: transparent !important;
}

[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li:not(.rz-tabview-selected) > a,
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li:not(.rz-tabview-selected) .rz-tabview-title {
    color: var(--jt-fg-muted) !important;
}

[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li:not(.rz-tabview-selected):hover {
    background: var(--jt-bg-surface-3) !important;
}

[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li:not(.rz-tabview-selected):hover > a,
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li:not(.rz-tabview-selected):hover .rz-tabview-title {
    color: var(--jt-fg-default) !important;
}

/* ── Aktiver (ausgewählter) Tab ── */
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li.rz-tabview-selected {
    background: var(--jt-bg-surface) !important;
    border: 1px solid var(--jt-border-default) !important;
    border-bottom: 2px solid var(--main-color) !important;
    border-radius: 8px 8px 0 0;
}

/* Aktiver Tab <a>: Hintergrund KOMPLETT entfernen (Radzen setzt --main-color hier) */
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li.rz-tabview-selected > a,
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li.rz-tabview-selected > a:hover,
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li.rz-tabview-selected > a:focus,
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li.rz-tabview-selected > a:active {
    background: transparent !important;
    background-color: transparent !important;
}

[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li.rz-tabview-selected > a,
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li.rz-tabview-selected .rz-tabview-title {
    color: var(--main-color) !important;
}

/* ── Tab-Panel-Trenner ── */
[data-theme="dark"] .rz-tabview-top > .rz-tabview-panels {
    border-top-color: var(--jt-border-default);
    background: var(--jt-bg-surface);
}

/* ── Tab-Panel-Inhalt ── */
[data-theme="dark"] .rz-tabview-panel {
    background: var(--jt-bg-surface);
    color: var(--jt-fg-default);
}

/* ── Fokus-Ring entfernen (stört in Dark) ── */
[data-theme="dark"] .rz-tabview.rz-tabview-top > .rz-tabview-nav li > a:focus {
    box-shadow: none !important;
    outline: none !important;
}

/* ── ZXingBlazor (Barcode-Scanner) in Dark ── */

[data-theme="dark"] .scan-dialog-body .modal-body,
[data-theme="dark"] .scan-dialog-body .card,
[data-theme="dark"] .scan-dialog-body .card-body {
    background: var(--jt-surface-dialog) !important;
    color: var(--jt-fg-default) !important;
    border-color: var(--jt-border-default) !important;
}

[data-theme="dark"] .scan-dialog-body .form-select,
[data-theme="dark"] .scan-dialog-body select {
    background-color: var(--jt-input-bg) !important;
    color: var(--jt-input-text) !important;
    border-color: var(--jt-input-border) !important;
}

[data-theme="dark"] .scan-dialog-body video {
    background: #000 !important;
}

/* ZXingBlazor rendert intern div-Container mit weißem Background */
[data-theme="dark"] .scan-dialog-body div[style*="background"],
[data-theme="dark"] .scan-dialog-body .barcode-scanner-overlay {
    background: var(--jt-surface-dialog) !important;
}

/* ZXingBlazor Buttons */
[data-theme="dark"] .scan-dialog-body .btn-outline-secondary,
[data-theme="dark"] .scan-dialog-body .btn-secondary {
    background: var(--jt-bg-surface-2) !important;
    color: var(--jt-fg-default) !important;
    border-color: var(--jt-border-default) !important;
}

[data-theme="dark"] .scan-dialog-body .btn-outline-secondary:hover,
[data-theme="dark"] .scan-dialog-body .btn-secondary:hover {
    background: var(--jt-bg-surface-3) !important;
}

/* ZXingBlazor Container-Hintergrund pauschal */
[data-theme="dark"] .scan-dialog-body > div {
    background: transparent !important;
}

/* ── Dashboard Header Navigation (Dark) ── */

[data-theme="dark"] .dashboard-page.header-mobile {
    background-color: transparent;
}

[data-theme="dark"] .dashboard-page .header ul {
    background-color: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
    box-shadow: var(--jt-shadow-card);
}

[data-theme="dark"] .dashboard-page .header li a {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .dashboard-page .header li a:hover {
    background-color: var(--jt-bg-surface-active);
    color: var(--main-color);
}

[data-theme="dark"] .dashboard-page .nav-headline > h1 {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .dashboard-page .timeclock-img {
    /* Logo bleibt unverändert */
}

@media (max-width: 640.98px) {
    [data-theme="dark"] .dashboard-page.header-mobile {
        background-color: var(--jt-bg-surface);
        box-shadow: var(--jt-shadow-card);
    }
}

/* ── Page Header (Unterseiten, Dark) ── */

[data-theme="dark"] .jt-page-header-title > h1 {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .jt-page-header-link {
    background: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
    color: var(--jt-fg-secondary);
}

    [data-theme="dark"] .jt-page-header-link:hover {
        background: var(--jt-bg-surface-active);
        border-color: var(--main-color);
        color: var(--main-color);
    }


/* ══════════════════════════════════════════════════════════
   Dark Mode – Stundenzettel (TT) Komplett-Erweiterung
   ══════════════════════════════════════════════════════════ */


/* ── Desktop: Header-Grid ── */

[data-theme="dark"] .tt-monthly-header-grid {
    background-color: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
}

    [data-theme="dark"] .tt-monthly-header-grid label {
        color: var(--jt-fg-tertiary);
    }

[data-theme="dark"] .tt-field-value {
    color: var(--jt-fg-default);
}

/* ── Desktop: Header-Gruppen-Zeile ── */

[data-theme="dark"] .tt-header-group-row {
    background-color: var(--jt-bg-surface-3);
    border-bottom-color: var(--jt-border-default);
    color: var(--jt-fg-default);
}

    [data-theme="dark"] .tt-header-group-row > div {
        border-right-color: var(--jt-border-default);
    }

/* ── Desktop: Wochen-Vertrags-Grid ── */

[data-theme="dark"] .tt-week-contract-grid {
    background: var(--jt-bg-inset);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-week-contract-label {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .tt-week-contract-value {
    color: var(--jt-fg-default);
}

/* ── Desktop: Tages-Markierungen ── */

[data-theme="dark"] .tt-monthly-body-table-content-row--marked {
    background-color: rgba(100, 196, 221, 0.15) !important;
}

[data-theme="dark"] .tt-day--marked > .tt-day-details {
    background-color: rgba(100, 196, 221, 0.10);
}

/* ── Desktop: Tages-Rahmen ── */

[data-theme="dark"] .tt-day {
    border-bottom-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-day-details {
    border-top-color: var(--jt-border-default);
}

/* ── Desktop: Body-Tabelle ── */

[data-theme="dark"] .tt-monthly-body-table {
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-week .tt-monthly-body-table {
    border-top-color: var(--jt-border-default);
}

/* ── Generische Inputs im TT ── */

[data-theme="dark"] .time-input {
    background: var(--jt-input-bg);
    color: var(--jt-input-text);
    border-color: var(--jt-input-border);
}

    [data-theme="dark"] .time-input:disabled {
        background: var(--jt-bg-surface-3);
        color: var(--jt-fg-muted);
        opacity: 0.6;
    }

[data-theme="dark"] .tt-input-small {
    background: var(--jt-input-bg);
    color: var(--jt-input-text);
    border-color: var(--jt-input-border);
}

    [data-theme="dark"] .tt-input-small::placeholder {
        color: var(--jt-input-placeholder);
    }

/* ── TT Muted / Error ── */

[data-theme="dark"] .tt-muted {
    color: var(--jt-fg-muted);
}

[data-theme="dark"] .tt-error {
    background: var(--jt-status-danger-bg);
    color: var(--jt-status-danger-fg);
    border-color: var(--jt-status-danger-border);
}

/* ── Desktop: Vorgang-Button ── */

[data-theme="dark"] .tt-process-button {
    background: var(--jt-input-bg);
    border-color: var(--jt-input-border);
    color: var(--jt-fg-default);
}

    [data-theme="dark"] .tt-process-button:disabled {
        background: var(--jt-bg-surface-3);
        color: var(--jt-fg-muted);
        opacity: 0.55;
    }

/* ── Modal (Vorgang + Allowances) ── */

[data-theme="dark"] .tt-modal-backdrop {
    background: var(--jt-bg-overlay-heavy);
}

[data-theme="dark"] .tt-modal {
    background: var(--jt-surface-dialog);
    box-shadow: var(--jt-shadow-xl);
}

[data-theme="dark"] .tt-modal-header {
    border-bottom-color: var(--jt-border-default);
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-modal-title {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-modal-close {
    color: var(--jt-fg-muted);
}

    [data-theme="dark"] .tt-modal-close:hover {
        color: var(--jt-fg-default);
    }

[data-theme="dark"] .tt-modal-body {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-modal-footer {
    border-top-color: var(--jt-border-default);
}

/* ── Allowances-Dialog ── */

[data-theme="dark"] .tt-allowances-meta-label {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .tt-allowances-meta-value {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-allowances-grid-header-left,
[data-theme="dark"] .tt-allowances-grid-header-right {
    color: var(--jt-fg-default);
    border-bottom-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-allowances-name {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-allowances-input {
    background: var(--jt-input-bg);
    color: var(--jt-input-text);
    border-color: var(--jt-input-border);
}

[data-theme="dark"] .tt-allowances-spacer {
    border-color: var(--jt-border-subtle);
}

/* ── Undo-Release-Dialog ── */

[data-theme="dark"] .tt-undo-month-title {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-undo-month-subtitle {
    color: var(--jt-fg-secondary);
}

[data-theme="dark"] .tt-undo-month-password {
    background: var(--jt-input-bg) !important;
    color: var(--jt-input-text) !important;
    border-color: var(--jt-input-border) !important;
}

[data-theme="dark"] .tt-undo-month-toggle-text {
    color: var(--jt-fg-secondary);
}

[data-theme="dark"] .tt-undo-month-error {
    color: var(--jt-status-danger-fg);
}

/* ── Reise / Markierung ── */

[data-theme="dark"] .tt-travel-label {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-travel-checkbox {
    accent-color: var(--main-color);
}

/* ── TT Holiday-Icon ── */

[data-theme="dark"] .tt-holiday {
    opacity: 0.85;
}

/* ══════════════════════════════════════════════════════════
   Dark Mode – Stundenzettel Mobile Komplett-Erweiterung
   ══════════════════════════════════════════════════════════ */

/* ── Mobile: Labels ── */

[data-theme="dark"] .tt-mobile-label {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .tt-mobile-stat-label {
    color: var(--jt-fg-muted);
}

[data-theme="dark"] .tt-mobile-stat-value {
    color: var(--jt-fg-default);
}

/* ── Mobile: Wochen-Vertrag ── */

[data-theme="dark"] .tt-m-week-contract {
    background: var(--jt-bg-surface);
    border-bottom-color: var(--jt-border-subtle);
}

[data-theme="dark"] .tt-m-week-contract-label {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .tt-m-week-contract-value {
    color: var(--jt-fg-default);
}

/* ── Mobile: KW Complete ── */

[data-theme="dark"] .tt-m-week.tt-m-week-complete {
    border-color: rgba(46, 160, 67, 0.30);
}

    [data-theme="dark"] .tt-m-week.tt-m-week-complete > .tt-m-week-summary {
        background: rgba(46, 160, 67, 0.10);
    }

/* ── Mobile: Tages-Summary ── */

[data-theme="dark"] .tt-m-day-weekday {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-m-day-summary--marked {
    background: rgba(100, 196, 221, 0.12) !important;
}

[data-theme="dark"] .tt-m-day-body--marked {
    background: rgba(100, 196, 221, 0.08) !important;
}

/* ── Mobile: Reisetag-Markierung ── */

[data-theme="dark"] .tt-m-day--travel {
    border-color: rgba(255, 193, 7, 0.30);
}

[data-theme="dark"] .tt-m-day--marked {
    border-color: rgba(100, 196, 221, 0.35);
}

/* ── Mobile: Inline-Label/Value ── */

[data-theme="dark"] .tt-m-inline-label {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .tt-m-inline-value {
    color: var(--jt-fg-default);
}

/* ── Mobile: Chips (Dark-Varianten) ── */

[data-theme="dark"] .tt-m-chip {
    color: var(--jt-fg-default);
}

    [data-theme="dark"] .tt-m-chip:nth-child(1) { /* SOLL */
        background: rgba(33, 150, 243, 0.10);
        border-color: rgba(33, 150, 243, 0.20);
    }

    [data-theme="dark"] .tt-m-chip:nth-child(2) { /* IST */
        background: rgba(76, 175, 80, 0.10);
        border-color: rgba(76, 175, 80, 0.20);
    }

    [data-theme="dark"] .tt-m-chip:nth-child(3) { /* AZK */
        background: rgba(156, 39, 176, 0.10);
        border-color: rgba(156, 39, 176, 0.20);
    }

[data-theme="dark"] .tt-m-chip-label {
    color: var(--jt-fg-muted);
}

/* ── Mobile: Zeitfelder ── */

[data-theme="dark"] .tt-m-time-field {
    background: var(--jt-bg-inset);
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .tt-m-time-label {
    color: var(--jt-fg-muted);
}

[data-theme="dark"] .tt-m-time-value {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-m-time-input {
    background: var(--jt-input-bg);
    color: var(--jt-input-text);
    border-color: var(--jt-input-border);
}

/* ── Mobile: Section-Titel ── */

[data-theme="dark"] .tt-m-section-title {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-m-section-diff {
    color: var(--jt-fg-secondary);
}

/* ── Mobile: Entry-Cards ── */

[data-theme="dark"] .tt-m-entry-card {
    background: var(--jt-bg-inset);
    border-color: var(--jt-border-default);
}

    [data-theme="dark"] .tt-m-entry-card::before {
        background: rgba(255, 255, 255, 0.08);
    }

[data-theme="dark"] .tt-m-entry-card--work::before {
    background: rgba(76, 175, 80, 0.55);
}

[data-theme="dark"] .tt-m-entry-card--break::before {
    background: rgba(245, 124, 0, 0.55);
}

[data-theme="dark"] .tt-m-entry-type-badge {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-m-entry-card--work .tt-m-entry-type-badge {
    background: rgba(76, 175, 80, 0.15);
    border-color: rgba(76, 175, 80, 0.30);
    color: #81c784;
}

[data-theme="dark"] .tt-m-entry-card--break .tt-m-entry-type-badge {
    background: rgba(245, 124, 0, 0.15);
    border-color: rgba(245, 124, 0, 0.30);
    color: #ffb74d;
}

[data-theme="dark"] .tt-m-entry-diff {
    color: var(--jt-fg-secondary);
}

[data-theme="dark"] .tt-m-entry-label {
    color: var(--jt-fg-muted);
}

[data-theme="dark"] .tt-m-entry-value {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .tt-m-entry-input {
    background: var(--jt-input-bg);
    color: var(--jt-input-text);
    border-color: var(--jt-input-border);
}

    [data-theme="dark"] .tt-m-entry-input::placeholder {
        color: var(--jt-input-placeholder);
    }

/* ── Mobile: Days-Container ── */

[data-theme="dark"] .tt-m-days {
    background: transparent;
}

/* ── Mobile: Wochentag-Pfeil ── */

[data-theme="dark"] .tt-m-week-summary::before,
[data-theme="dark"] .tt-m-day-summary::before {
    color: var(--jt-fg-muted);
}

[data-theme="dark"] .tt-m-week-range {
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .tt-m-week-title {
    color: var(--jt-fg-default);
}


/* ══════════════════════════════════════════════════════════
   Dark Mode – Abwesenheiten (TT-Abs) Komplett
   ══════════════════════════════════════════════════════════ */


/* ── Desktop: Absences-Tabelle ── */

[data-theme="dark"] .tt-absences-table {
    background: var(--jt-surface-card);
    border-color: var(--jt-border-default);
}

    [data-theme="dark"] .tt-absences-table .tt-header-group-row {
        background-color: var(--jt-bg-surface-3);
        border-bottom-color: var(--jt-border-default);
        color: var(--jt-fg-default);
    }

        [data-theme="dark"] .tt-absences-table .tt-header-group-row > div {
            border-right-color: var(--jt-border-default);
        }

    [data-theme="dark"] .tt-absences-table .tt-header-sub-row {
        background-color: var(--jt-bg-surface-2);
        border-bottom-color: var(--jt-border-default);
        color: var(--jt-fg-tertiary);
    }

        [data-theme="dark"] .tt-absences-table .tt-header-sub-row > div {
            border-right-color: var(--jt-border-default);
        }

    [data-theme="dark"] .tt-absences-table .tt-monthly-body-table-content-row.tt-abs-grid > div {
        border-right-color: var(--jt-border-default);
        color: var(--jt-fg-default);
    }

    /* ── Desktop: Absences Zebra ── */

    [data-theme="dark"] .tt-absences-table .tt-monthly-body-table-content-row:nth-child(odd) {
        background-color: var(--jt-bg-surface);
    }

    [data-theme="dark"] .tt-absences-table .tt-monthly-body-table-content-row:nth-child(even) {
        background-color: var(--jt-bg-surface-2);
    }

    [data-theme="dark"] .tt-absences-table .tt-monthly-body-table-content-row:hover {
        background-color: var(--jt-bg-surface-3);
    }

/* ── Desktop: Action Bar ── */

[data-theme="dark"] .tt-abs-actionbar {
    color: var(--jt-fg-default);
}

/* ── Desktop: Menu-Button ── */

[data-theme="dark"] .tt-abs-menu-button {
    background: var(--jt-bg-surface-2) !important;
    border-color: var(--jt-border-default) !important;
    color: var(--jt-fg-secondary) !important;
}

    [data-theme="dark"] .tt-abs-menu-button:hover {
        background: var(--jt-bg-surface-active) !important;
        border-color: var(--main-color) !important;
        color: var(--main-color) !important;
    }

/* ── Mobile: Entry-Card Statusfarben (Dark-Varianten) ── */

[data-theme="dark"] .tt-m-entry-card {
    border-left-color: #4a5060; /* neutral grau, dunkler */
}

[data-theme="dark"] .tt-m-entry-card--status-confirmed {
    border-left-color: #66bb6a; /* grün, leicht heller */
}

[data-theme="dark"] .tt-m-entry-card--status-open {
    border-left-color: #fdd835; /* gelb */
}

[data-theme="dark"] .tt-m-entry-card--status-rejected {
    border-left-color: #ef5350; /* rot */
}

[data-theme="dark"] .tt-m-entry-card--status-cancelled {
    border-left-color: #616e82; /* grau, gedämpft */
}

/* ── Warning-Box / Info-Box ── */

[data-theme="dark"] .tt-warning-box {
    background: var(--jt-status-warn-bg);
    border-color: var(--jt-status-warn-border);
    color: var(--jt-status-warn-fg);
}

[data-theme="dark"] .tt-warning-hint {
    color: var(--jt-status-warn-fg);
}

[data-theme="dark"] .tt-info-box {
    background: var(--jt-status-info-bg);
    border-color: var(--jt-status-info-border);
    color: var(--jt-status-info-fg);
}

/* ── Release-Result-Dialog ── */

[data-theme="dark"] .release-result-label {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .release-result-value {
    color: var(--jt-fg-secondary);
}

[data-theme="dark"] .dialog-errorbox {
    background: var(--jt-status-danger-bg);
    border-color: var(--jt-status-danger-border);
    color: var(--jt-status-danger-fg);
}

/* ── Radzen ContextMenu (global, betrifft Absences-Menü) ── */

[data-theme="dark"] .rz-context-menu {
    background: var(--jt-surface-popover);
    border-color: var(--jt-border-default);
    box-shadow: var(--jt-shadow-xl);
}

    [data-theme="dark"] .rz-context-menu .rz-navigation-item-text {
        color: var(--jt-fg-default);
    }

    [data-theme="dark"] .rz-context-menu .rz-navigation-item:hover {
        background: var(--jt-bg-surface-active);
    }

    [data-theme="dark"] .rz-context-menu .rz-navigation-item-icon-children {
        color: var(--jt-fg-muted);
    }

/* ── Changelog-Overlay (auch von Absences genutzt) ── */

[data-theme="dark"] .changelog-overlay {
    background: var(--jt-bg-overlay-heavy);
}

[data-theme="dark"] .changelog-title {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .changelog-close {
    color: var(--jt-fg-muted);
}

    [data-theme="dark"] .changelog-close:hover {
        color: var(--jt-fg-default);
    }



/* ══════════════════════════════════════════════════════════
   Dark Mode – Radzen ContextMenu Fix
   ══════════════════════════════════════════════════════════ */

/* Radzen ContextMenu: Wrapper + Items komplett */
[data-theme="dark"] .rz-context-menu,
[data-theme="dark"] .rz-menu {
    background: var(--jt-surface-popover) !important;
    border-color: var(--jt-border-default) !important;
    box-shadow: var(--jt-shadow-xl) !important;
    color: var(--jt-fg-default) !important;
}

    [data-theme="dark"] .rz-context-menu .rz-navigation-item-text,
    [data-theme="dark"] .rz-menu .rz-navigation-item-text,
    [data-theme="dark"] .rz-context-menu .rz-menu-item-text,
    [data-theme="dark"] .rz-menu .rz-menu-item-text {
        color: var(--jt-fg-default) !important;
    }

    [data-theme="dark"] .rz-context-menu .rz-navigation-item:hover,
    [data-theme="dark"] .rz-menu .rz-navigation-item:hover,
    [data-theme="dark"] .rz-context-menu .rz-menu-item:hover,
    [data-theme="dark"] .rz-menu .rz-menu-item:hover {
        background: var(--jt-bg-surface-active) !important;
    }

    [data-theme="dark"] .rz-context-menu .rz-navigation-item-icon-children,
    [data-theme="dark"] .rz-menu .rz-menu-item-icon {
        color: var(--jt-fg-muted) !important;
    }

    /* Radzen ContextMenu: ul-Hintergrund */
    [data-theme="dark"] .rz-context-menu ul,
    [data-theme="dark"] .rz-menu ul {
        background: var(--jt-surface-popover) !important;
    }

    /* Radzen ContextMenu: li + a */
    [data-theme="dark"] .rz-context-menu li,
    [data-theme="dark"] .rz-menu li {
        color: var(--jt-fg-default) !important;
    }

        [data-theme="dark"] .rz-context-menu li a,
        [data-theme="dark"] .rz-menu li a {
            color: var(--jt-fg-default) !important;
        }

        [data-theme="dark"] .rz-context-menu li:hover,
        [data-theme="dark"] .rz-menu li:hover {
            background: var(--jt-bg-surface-active) !important;
        }




/* ══════════════════════════════════════════════════════════
   Dark Mode – Hamburger-Menü-Icon (Zeiterfassung Header)
   ══════════════════════════════════════════════════════════ */

/* Navicon-Striche: im Dark Mode weiß statt --main-color,
   damit sie auf dunklem Hintergrund sichtbar sind */
[data-theme="dark"] .header .menu-icon .navicon {
    background: var(--jt-fg-default) !important;
}

    [data-theme="dark"] .header .menu-icon .navicon:before,
    [data-theme="dark"] .header .menu-icon .navicon:after {
        background: var(--jt-fg-default) !important;
    }

/* Hover: Akzentfarbe */
[data-theme="dark"] .header .menu-icon:hover .navicon {
    background: var(--main-color) !important;
}

    [data-theme="dark"] .header .menu-icon:hover .navicon:before,
    [data-theme="dark"] .header .menu-icon:hover .navicon:after {
        background: var(--main-color) !important;
    }

/* Checked-State: transparent (X-Animation), bleibt transparent */
[data-theme="dark"] .header .menu-btn:checked ~ .menu-icon .navicon {
    background: transparent !important;
}

/* ══════════════════════════════════════════════════════════
   Dark Mode – Scan-Historie & Mobile Filter-Toggles
   ══════════════════════════════════════════════════════════ */

/* ── Scan-History (fixiert unten) ── */

[data-theme="dark"] .scan-history {
    background: var(--jt-bg-surface);
    border-top-color: var(--jt-border-default);
}

[data-theme="dark"] .scan-row {
    color: var(--jt-fg-default);
}

[data-theme="dark"] .scan-error {
    color: var(--jt-fg-default);
}

/* ── History-Items (Scan-Chips) ── */

[data-theme="dark"] .history-item {
    background: var(--jt-bg-surface-2);
    border-color: var(--jt-border-default);
    color: var(--jt-fg-default);
}

    [data-theme="dark"] .history-item:hover {
        background: var(--jt-bg-surface-active);
        border-color: var(--main-color);
        color: var(--main-color);
    }

/* ── History-List Leer-Text ── */

[data-theme="dark"] .history-list > span {
    color: var(--jt-fg-muted);
}

/* ── Mobile Filter-Item (Sound-Toggles) ── */

[data-theme="dark"] .mobile-filter-item {
    border-bottom-color: var(--jt-border-subtle);
}

[data-theme="dark"] .mobile-filter-label {
    color: var(--jt-fg-default);
}

/* ── Toggle-Switch Slider ── */

[data-theme="dark"] .toggle-slider {
    background-color: var(--jt-border-default);
}

[data-theme="dark"] .toggle-slider:before {
    background-color: var(--jt-fg-default);
}

[data-theme="dark"] input:checked + .toggle-slider {
    background-color: var(--main-color);
}

[data-theme="dark"] input:checked + .toggle-slider:before {
    background-color: var(--jt-fg-inverse);
}

/* ── Scan-Count Text ── */

[data-theme="dark"] .scan-row > div {
    color: var(--jt-fg-secondary);
}

/* ── Desktop Tabelle (alpl-table) ── */

[data-theme="dark"] .alpl-table {
    border-color: var(--jt-border-default);
}

[data-theme="dark"] .alpl-table-header {
    background: var(--jt-bg-surface-3);
    border-bottom-color: var(--jt-border-default);
    color: var(--jt-fg-tertiary);
}

[data-theme="dark"] .alpl-table-row {
    border-bottom-color: var(--jt-border-light);
    color: var(--jt-fg-default);
}

[data-theme="dark"] .alpl-table-row:not(.alpl-table-header):hover {
    background: var(--jt-bg-surface-hover);
}