@import '_content/UiKit/UiKit.lbkjahcqxv.bundle.scp.css';

/* _content/TimebookWeb/Components/Layout/LoginLayout.razor.rz.scp.css */
.login-layout[b-ow1pckygo0] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    background-color: var(--surface-canvas);
}
/* _content/TimebookWeb/Components/Layout/MainLayout.razor.rz.scp.css */
/* ==========================================================================
   MainLayout — Admin Template
   ========================================================================== */

.app-layout[b-8f8sdd6pp4] {
    display: flex;
    height: 100vh;
    overflow: hidden;
}

/* --- Sidebar --- */

.app-sidebar[b-8f8sdd6pp4] {
    width: 260px;
    flex-shrink: 0;
    border-right: 1px solid var(--border-subtle);
    box-shadow: var(--shadow-sidebar);
    transition: width 250ms cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

.app-sidebar--collapsed[b-8f8sdd6pp4] {
    width: 60px;
    overflow: visible;  /* Flyouts dürfen rausragen */
}

.app-sidebar-brand[b-8f8sdd6pp4] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) 0;
}

[b-8f8sdd6pp4] .app-sidebar-brand-icon {
    color: var(--accent);
    flex-shrink: 0;
}

.app-sidebar-brand-text[b-8f8sdd6pp4] {
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* --- Main Area --- */

.app-main[b-8f8sdd6pp4] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
}

/* --- TopBar --- */

.app-topbar[b-8f8sdd6pp4] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-sm) var(--spacing-lg);
    border-bottom: 1px solid var(--border-subtle);
    background-color: var(--surface-primary);
    flex-shrink: 0;
    min-height: 52px;
}

.app-topbar-toggle[b-8f8sdd6pp4] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-secondary);
    padding: var(--spacing-xs);
    border-radius: var(--radius-sm);
    transition: color var(--transition-fast), background-color var(--transition-fast);
}

.app-topbar-toggle:hover[b-8f8sdd6pp4] {
    color: var(--accent);
    background-color: rgba(var(--accent-rgb), 0.06);
}

.app-topbar-title[b-8f8sdd6pp4] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.app-topbar-right[b-8f8sdd6pp4] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-left: auto;
    position: relative;
}

.app-topbar-user[b-8f8sdd6pp4] {
    font-size: var(--text-md);
    color: var(--text-secondary);
    white-space: nowrap;
}

/* --- User Menu --- */

.user-menu-wrapper[b-8f8sdd6pp4] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    cursor: pointer;
    position: relative;
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-md);
    transition: background-color var(--transition-fast);
}

.user-menu-wrapper:hover[b-8f8sdd6pp4] {
    background-color: rgba(var(--accent-rgb), 0.06);
}

.user-menu-caret[b-8f8sdd6pp4] {
    font-size: 12px;
    color: var(--text-tertiary);
    transition: transform var(--transition-fast);
}

.user-menu-dropdown[b-8f8sdd6pp4] {
    position: absolute;
    top: calc(100% + var(--spacing-xs));
    right: 0;
    min-width: 200px;
    background-color: var(--surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    z-index: var(--z-dropdown, 100);
    padding: var(--spacing-xs);
    animation: user-menu-enter-b-8f8sdd6pp4 150ms ease-out;
}

@keyframes user-menu-enter-b-8f8sdd6pp4 {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.user-menu-item[b-8f8sdd6pp4] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    width: 100%;
    padding: var(--spacing-sm) var(--spacing-md);
    border: none;
    background: none;
    cursor: pointer;
    font-size: var(--text-sm);
    color: var(--text-primary);
    border-radius: var(--radius-md);
    transition: background-color var(--transition-fast);
}

.user-menu-item:hover[b-8f8sdd6pp4] {
    background-color: var(--surface-hover);
}

.user-menu-item--danger[b-8f8sdd6pp4] {
    color: var(--status-danger);
}

.user-menu-item--danger:hover[b-8f8sdd6pp4] {
    background-color: rgba(var(--danger-rgb, 220, 38, 38), 0.08);
}

.user-menu-item i[b-8f8sdd6pp4] {
    font-size: 18px;
}

.user-menu-divider[b-8f8sdd6pp4] {
    height: 1px;
    background-color: var(--border-subtle);
    margin: var(--spacing-xs) 0;
}

/* --- Content --- */

.app-content[b-8f8sdd6pp4] {
    flex: 1;
    overflow-y: auto;
    background-color: var(--surface-canvas);
}

/* --- Backdrop (Mobile Overlay) --- */

.app-sidebar-backdrop[b-8f8sdd6pp4] {
    display: none;
}

/* --- Responsive --- */

@media (max-width: 768px) {
    .app-sidebar[b-8f8sdd6pp4] {
        position: fixed;
        left: 0;
        top: 0;
        bottom: 0;
        z-index: 1000;
        width: 260px;
        transform: translateX(0);
        transition: transform 250ms ease;
        background-color: var(--surface-primary);
    }

    .app-sidebar--collapsed[b-8f8sdd6pp4] {
        transform: translateX(-100%);
    }

    .app-sidebar-backdrop[b-8f8sdd6pp4] {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 999;
        background-color: rgba(0, 0, 0, 0.4);
        backdrop-filter: blur(2px);
    }

    .app-sidebar--collapsed[b-8f8sdd6pp4] {
        transform: translateX(-100%);
        width: 260px;          /* Auf Mobile nie collapsed-Icon-State */
        overflow: hidden;      /* Desktop-overflow:visible hier zurücknehmen */
    }

    .app-topbar-user[b-8f8sdd6pp4] {
        display: none;
    }

}

/* ==========================================================================
   Notification Bell & Dropdown
   ========================================================================== */

/* --- Trigger (Bell + Badge) --- */

.notif-trigger[b-8f8sdd6pp4] {
    position: relative;
    display: flex;
    align-items: center;
}

.notif-bell-btn[b-8f8sdd6pp4] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-secondary);
    padding: var(--spacing-xs);
    border-radius: var(--radius-sm);
    transition: color var(--transition-fast), background-color var(--transition-fast);
}

.notif-bell-btn:hover[b-8f8sdd6pp4] {
    color: var(--accent);
    background-color: rgba(var(--accent-rgb), 0.06);
}

.notif-bell-btn--active[b-8f8sdd6pp4] {
    color: var(--accent);
    background-color: rgba(var(--accent-rgb), 0.1);
}

.notif-badge-count[b-8f8sdd6pp4] {
    position: absolute;
    top: -2px;
    right: -4px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background-color: var(--status-danger);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
    pointer-events: none;
    animation: notif-pop-b-8f8sdd6pp4 300ms cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes notif-pop-b-8f8sdd6pp4 {
    0%   { transform: scale(0); }
    100% { transform: scale(1); }
}

@keyframes notif-shake-b-8f8sdd6pp4 {
    0%, 100% { transform: rotate(0); }
    20%      { transform: rotate(12deg); }
    40%      { transform: rotate(-10deg); }
    60%      { transform: rotate(6deg); }
    80%      { transform: rotate(-3deg); }
}

/* --- Backdrop --- */

.notif-backdrop[b-8f8sdd6pp4] {
    position: fixed;
    inset: 0;
    z-index: var(--z-dropdown, 100);
    background: transparent;
}

/* --- Panel --- */

.notif-panel[b-8f8sdd6pp4] {
    position: absolute;
    top: calc(100% + var(--spacing-xs));
    right: 0;
    width: 380px;
    max-height: 480px;
    display: flex;
    flex-direction: column;
    background-color: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg, 12px);
    box-shadow: var(--shadow-lg);
    z-index: calc(var(--z-dropdown, 100) + 1);
    animation: notif-slide-in-b-8f8sdd6pp4 200ms ease-out;
    overflow: hidden;
}

@keyframes notif-slide-in-b-8f8sdd6pp4 {
    0%   { opacity: 0; transform: translateY(-8px); }
    100% { opacity: 1; transform: translateY(0); }
}

/* --- Panel Header --- */

.notif-panel-header[b-8f8sdd6pp4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--spacing-md) var(--spacing-md) var(--spacing-sm);
    border-bottom: 1px solid var(--border-subtle);
}

.notif-panel-title[b-8f8sdd6pp4] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold, 600);
    color: var(--text-primary);
}

.notif-mark-all[b-8f8sdd6pp4] {
    background: none;
    border: none;
    cursor: pointer;
    font-size: var(--text-sm, 0.8125rem);
    color: var(--text-link);
    padding: 0;
    transition: color var(--transition-fast);
}

.notif-mark-all:hover[b-8f8sdd6pp4] {
    color: var(--text-link-hover);
    text-decoration: underline;
}

/* --- Panel List --- */

.notif-panel-list[b-8f8sdd6pp4] {
    flex: 1;
    overflow-y: auto;
    overscroll-behavior: contain;
}

/* --- Notification Item --- */

.notif-item[b-8f8sdd6pp4] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    width: 100%;
    padding: var(--spacing-sm) var(--spacing-md);
    background: none;
    border: none;
    border-bottom: 1px solid var(--border-subtle);
    cursor: pointer;
    text-align: left;
    transition: background-color var(--transition-fast);
}

.notif-item:last-child[b-8f8sdd6pp4] {
    border-bottom: none;
}

.notif-item:hover[b-8f8sdd6pp4] {
    background-color: var(--surface-secondary);
}

.notif-item--unread[b-8f8sdd6pp4] {
    background-color: rgba(var(--accent-rgb), 0.04);
}

.notif-item--unread:hover[b-8f8sdd6pp4] {
    background-color: rgba(var(--accent-rgb), 0.08);
}

/* --- Unread Dot --- */

.notif-unread-dot[b-8f8sdd6pp4] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--accent, #3b82f6);
    flex-shrink: 0;
    margin-top: 6px;
}

.notif-unread-dot--hidden[b-8f8sdd6pp4] {
    visibility: hidden;
}

/* --- Icon Circle --- */

.notif-icon[b-8f8sdd6pp4] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    flex-shrink: 0;
}

.notif-icon--success[b-8f8sdd6pp4] {
    background-color: rgba(34, 197, 94, 0.12);
    color: #16a34a;
}

.notif-icon--warning[b-8f8sdd6pp4] {
    background-color: rgba(245, 158, 11, 0.12);
    color: #d97706;
}

.notif-icon--info[b-8f8sdd6pp4] {
    background-color: rgba(59, 130, 246, 0.12);
    color: #2563eb;
}

.notif-icon--neutral[b-8f8sdd6pp4] {
    background-color: rgba(107, 114, 128, 0.12);
    color: #6b7280;
}

.notif-icon--primary[b-8f8sdd6pp4] {
    background-color: rgba(var(--accent-rgb), 0.12);
    color: var(--accent, #6366f1);
}

/* --- Item Content --- */

.notif-item-content[b-8f8sdd6pp4] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1;
}

.notif-item-title[b-8f8sdd6pp4] {
    font-size: var(--text-sm, 0.8125rem);
    font-weight: var(--font-semibold, 600);
    color: var(--text-primary);
}

.notif-item-desc[b-8f8sdd6pp4] {
    font-size: var(--text-sm, 0.8125rem);
    color: var(--text-secondary);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.notif-item-time[b-8f8sdd6pp4] {
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-tertiary);
}

/* --- Empty State --- */

.notif-empty[b-8f8sdd6pp4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-xl) var(--spacing-md);
}

[b-8f8sdd6pp4] .notif-empty-icon {
    color: var(--text-tertiary);
}

.notif-empty-text[b-8f8sdd6pp4] {
    font-size: var(--text-sm, 0.8125rem);
    color: var(--text-tertiary);
}

/* --- Panel Footer --- */

.notif-panel-footer[b-8f8sdd6pp4] {
    display: flex;
    justify-content: center;
    padding: var(--spacing-sm) var(--spacing-md);
    border-top: 1px solid var(--border-subtle);
}

.notif-footer-link[b-8f8sdd6pp4] {
    font-size: var(--text-sm, 0.8125rem);
    color: var(--text-link);
    cursor: pointer;
    transition: color var(--transition-fast);
}

.notif-footer-link:hover[b-8f8sdd6pp4] {
    color: var(--text-link-hover);
    text-decoration: underline;
}

/* --- Notification Panel: Mobile --- */
@media (max-width: 768px) {
    .notif-panel[b-8f8sdd6pp4] {
        position: fixed;
        top: 52px;
        right: var(--spacing-sm);
        left: var(--spacing-sm);
        width: auto;
        max-height: calc(100vh - 52px - var(--spacing-md));
    }
}

/* ── Wartungsmodus ── */

.wartung-admin-banner[b-8f8sdd6pp4] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-xs) var(--spacing-md);
    background: var(--dp-amber-500, #f59e0b);
    color: #fff;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    letter-spacing: 0.02em;
}

.wartung-overlay[b-8f8sdd6pp4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    text-align: center;
    padding: var(--spacing-xl);
    gap: var(--spacing-md);
}

.wartung-overlay__icon[b-8f8sdd6pp4] {
    font-size: 4rem;
    color: var(--dp-amber-500, #f59e0b);
    opacity: 0.8;
}

.wartung-overlay__title[b-8f8sdd6pp4] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin: 0;
}

.wartung-overlay__text[b-8f8sdd6pp4] {
    font-size: var(--text-base);
    color: var(--text-secondary);
    max-width: 400px;
    margin: 0;
    line-height: 1.6;
}
/* _content/TimebookWeb/Components/Pages/Auswertung.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   Baustellenauswertung — Clean report layout
   ═══════════════════════════════════════════════ */

/* ── Toolbar / Filter ── */
.aw-toolbar[b-yerq3qw123] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.aw-datum-filter[b-yerq3qw123] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.aw-bis-label[b-yerq3qw123] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    padding: 0 var(--spacing-2xs);
}

[b-yerq3qw123] .aw-datepicker {
    max-width: 150px;
}

.aw-kunde-filter[b-yerq3qw123] {
    min-width: 200px;
}

[b-yerq3qw123] .aw-dropdown {
    max-width: 220px;
}

.filter-chips[b-yerq3qw123] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-2xs);
}

/* ── KPI-Leiste ── */
.kpi-row[b-yerq3qw123] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}

[b-yerq3qw123] .kpi-card {
    text-align: center;
}

.kpi-value[b-yerq3qw123] {
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    line-height: var(--leading-tight);
}

.kpi-label[b-yerq3qw123] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    margin-top: 2px;
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
}

/* ── Interne Stunden (Halle, Sonstiges, Fahrtzeit) ── */
.aw-intern-row[b-yerq3qw123] {
    display: flex;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}

.aw-intern-card[b-yerq3qw123] {
    display: flex;
    flex-direction: column;
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    border-left: 3px solid var(--dp-slate-400, #94a3b8);
    flex: 1;
    min-width: 0;
    cursor: pointer;
    transition: background var(--transition-fast), box-shadow var(--transition-fast);
}

.aw-intern-card:hover[b-yerq3qw123] {
    background: var(--surface-secondary);
}

.aw-intern-card--open[b-yerq3qw123] {
    box-shadow: var(--shadow-sm);
}

.aw-intern-header[b-yerq3qw123] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
}

.aw-intern-icon[b-yerq3qw123] {
    font-size: 1.5rem;
    color: var(--text-tertiary);
    flex-shrink: 0;
    width: 32px;
    text-align: center;
}

.aw-intern-content[b-yerq3qw123] {
    min-width: 0;
    flex: 1;
}

.aw-intern-kategorie[b-yerq3qw123] {
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.aw-intern-stunden[b-yerq3qw123] {
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    line-height: var(--leading-tight);
}

.aw-intern-meta[b-yerq3qw123] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin-top: 1px;
}

.aw-intern-toggle[b-yerq3qw123] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}

.aw-intern-detail[b-yerq3qw123] {
    border-top: 1px solid var(--border-subtle);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--surface-secondary);
    border-radius: 0 0 var(--radius-md) var(--radius-md);
}

/* ── Baustellen-Tabelle ── */
.aw-tabelle-wrapper[b-yerq3qw123] {
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-xs);
}

.aw-tabelle[b-yerq3qw123] {
    width: 100%;
    border-collapse: collapse;
}

.aw-tabelle thead[b-yerq3qw123] {
    background: var(--surface-secondary);
}

.aw-tabelle th[b-yerq3qw123] {
    padding: var(--spacing-sm) var(--spacing-md);
    text-align: left;
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    border-bottom: 2px solid var(--border-default);
    white-space: nowrap;
}

.aw-th--baustelle[b-yerq3qw123] { width: 30%; }
.aw-th--kunde[b-yerq3qw123] { width: 20%; }
.aw-th--monate[b-yerq3qw123] { width: 8%; text-align: center; }
.aw-th--ma[b-yerq3qw123] { width: 8%; text-align: center; }
.aw-th--netto[b-yerq3qw123] { width: 14%; text-align: right; }
.aw-th--aktionen[b-yerq3qw123] { width: 110px; }

.aw-row[b-yerq3qw123] {
    cursor: pointer;
    transition: background var(--transition-fast);
}

.aw-row:hover[b-yerq3qw123] {
    background: var(--surface-secondary);
}

.aw-row--open[b-yerq3qw123] {
    background: var(--accent-light);
}

.aw-row td[b-yerq3qw123] {
    padding: var(--spacing-sm) var(--spacing-md);
    border-bottom: 1px solid var(--border-subtle);
    vertical-align: middle;
}

/* Baustelle-Zelle (zweizeilig) */
.aw-cell--baustelle[b-yerq3qw123] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin-bottom: var(--spacing-2xs);
}

.aw-baustelle-name[b-yerq3qw123] {
    font-weight: var(--font-semibold);
    font-size: var(--text-sm-plus);
    color: var(--text-primary);
}

.aw-baustelle-ort[b-yerq3qw123] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.aw-cell--kunde[b-yerq3qw123] {
    font-size: var(--text-sm-plus);
    color: var(--text-primary);
}

.aw-cell--monate[b-yerq3qw123],
.aw-cell--ma[b-yerq3qw123] {
    text-align: center;
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
    font-size: var(--text-sm-plus);
}

.aw-cell--netto[b-yerq3qw123] {
    text-align: right;
    font-weight: var(--font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    font-size: var(--text-md);
}

.aw-cell--aktionen[b-yerq3qw123] {
    display: flex;
    align-items: center;
    gap: 0;
    justify-content: flex-end;
}

.aw-expand-toggle[b-yerq3qw123] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    cursor: pointer;
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast);
}

.aw-expand-toggle:hover[b-yerq3qw123] {
    background: var(--surface-secondary);
}

.toggle-icon[b-yerq3qw123] {
    color: var(--text-tertiary);
    font-size: var(--icon-sm);
}

/* ── Detail-Zeile (expandiert) ── */
.aw-detail-row > td[b-yerq3qw123] {
    padding: 0 !important;
    background: var(--surface-secondary);
    border-bottom: 2px solid var(--border-default);
}

.aw-detail[b-yerq3qw123] {
    padding: var(--spacing-md) var(--spacing-lg);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

/* ── Sektionen (Monate / Mitarbeiter) ── */
.aw-section[b-yerq3qw123] {
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.aw-section-header[b-yerq3qw123] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--surface-secondary);
    border-bottom: 1px solid var(--border-subtle);
    font-weight: var(--font-semibold);
    font-size: var(--text-sm-plus);
    color: var(--text-primary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
}

/* ── Monatsbalken (horizontale Balken) ── */
.aw-monatsbalken-container[b-yerq3qw123] {
    padding: var(--spacing-sm) var(--spacing-md);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.aw-monatsbalken-row[b-yerq3qw123] {
    display: grid;
    grid-template-columns: 120px 1fr auto auto;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-2xs) 0;
}

.aw-monatsbalken-label[b-yerq3qw123] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    text-transform: capitalize;
    white-space: nowrap;
}

.aw-monatsbalken-track[b-yerq3qw123] {
    height: 24px;
    background: var(--surface-secondary);
    border-radius: var(--radius-sm);
    overflow: hidden;
    position: relative;
    min-width: 40px;
}

.aw-monatsbalken-fill[b-yerq3qw123] {
    height: 100%;
    background: linear-gradient(90deg, var(--dp-blue-400, #60a5fa), var(--dp-blue-500, #3b82f6));
    border-radius: var(--radius-sm);
    transition: width 0.4s ease;
    min-width: 4px;
}

.aw-monatsbalken-wert[b-yerq3qw123] {
    font-size: var(--text-sm);
    font-weight: var(--font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    min-width: 70px;
    text-align: right;
    white-space: nowrap;
}

.aw-monatsbalken-meta[b-yerq3qw123] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    min-width: 80px;
    white-space: nowrap;
}

/* ── Mitarbeiter-Tabelle ── */
.aw-ma-tabelle[b-yerq3qw123] {
    width: 100%;
    border-collapse: collapse;
}

.aw-ma-tabelle thead[b-yerq3qw123] {
    background: var(--surface-secondary);
}

.aw-ma-tabelle th[b-yerq3qw123] {
    padding: var(--spacing-xs) var(--spacing-md);
    text-align: left;
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    border-bottom: 1px solid var(--border-subtle);
}

.aw-ma-th--tage[b-yerq3qw123] {
    text-align: center;
    width: 80px;
}

.aw-ma-th--netto[b-yerq3qw123] {
    text-align: right;
    width: 100px;
}

.aw-ma-tabelle tbody td[b-yerq3qw123] {
    padding: var(--spacing-xs) var(--spacing-md);
    border-bottom: 1px solid var(--border-subtle);
    font-size: var(--text-sm-plus);
}

.aw-ma-name[b-yerq3qw123] {
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.aw-ma-tage[b-yerq3qw123] {
    text-align: center;
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
}

.aw-ma-netto[b-yerq3qw123] {
    text-align: right;
    font-weight: var(--font-semibold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
}

.aw-ma-summe[b-yerq3qw123] {
    background: var(--surface-secondary);
}

.aw-ma-summe td[b-yerq3qw123] {
    font-weight: var(--font-bold) !important;
    border-top: 2px solid var(--border-default);
    border-bottom: none !important;
    padding: var(--spacing-sm) var(--spacing-md) !important;
}
/* _content/TimebookWeb/Components/Pages/Baustellen.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   Kunden — Master-Detail Verwaltung
   ═══════════════════════════════════════════════ */

/* ── KPI-Leiste ── */
.kunden-stats[b-vc57uqjvig] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
}

.kpi-value[b-vc57uqjvig] {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin-bottom: var(--spacing-xs);
}

.kpi-aktiv[b-vc57uqjvig] {
    color: var(--dp-emerald-600);
}

.kpi-baustellen[b-vc57uqjvig] {
    color: var(--dp-blue-600);
}

.kpi-stunden[b-vc57uqjvig] {
    color: var(--dp-amber-600);
}

.kpi-label[b-vc57uqjvig] {
    font-size: var(--text-md);
    color: var(--text-secondary);
}

/* ── Toolbar: Suche + Chips ── */
.kunden-toolbar[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-lg);
}

.kunden-chips[b-vc57uqjvig] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
}

/* ── Dialog-Formular ── */
.dialog-form[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.form-row-2col[b-vc57uqjvig] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-md);
}

/* ── Kundenliste ── */
.kunden-liste[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.kunde-card-inner[b-vc57uqjvig] {
    display: flex;
    flex-direction: row;
    gap: var(--spacing-md);
    align-items: flex-start;
}

.kunde-info[b-vc57uqjvig] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.kunde-name-row[b-vc57uqjvig] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
}

.kunde-name[b-vc57uqjvig] {
    font-weight: var(--font-semibold);
    font-size: var(--text-base);
    color: var(--text-primary);
}

.kunde-adresse[b-vc57uqjvig] {
    display: flex;
    align-items: center;
    gap: var(--spacing-2xs, 4px);
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.kunde-aktionen[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xs, 4px);
}

/* ── Detail: Tabs + Content ── */
.tab-content[b-vc57uqjvig] {
    margin-top: var(--spacing-lg);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

/* ── Detail: Notiz ── */
.notiz-text[b-vc57uqjvig] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: var(--leading-relaxed);
    white-space: pre-wrap;
}

/* ── Detail: Baustellen-Tab ── */
.baustellen-tab-header[b-vc57uqjvig] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--spacing-md);
}

.baustellen-tab-titel[b-vc57uqjvig] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.baustellen-tab-liste[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.baustelle-card-inner[b-vc57uqjvig] {
    display: flex;
    flex-direction: row;
    gap: var(--spacing-md);
    align-items: flex-start;
}

.baustelle-info[b-vc57uqjvig] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.baustelle-name-row[b-vc57uqjvig] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
}

.baustelle-name[b-vc57uqjvig] {
    font-weight: var(--font-semibold);
    font-size: var(--text-sm-plus, var(--text-base));
    color: var(--text-primary);
}

.baustelle-adresse[b-vc57uqjvig] {
    display: flex;
    align-items: center;
    gap: var(--spacing-2xs, 4px);
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.baustelle-bemerkung[b-vc57uqjvig] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-2xs, 4px);
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    font-style: italic;
}

.baustelle-aktionen[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xs, 4px);
}

/* ── Detail-Sidebar ── */
.sidebar-header[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-sm);
    text-align: center;
}

.sidebar-firma-icon[b-vc57uqjvig] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: var(--radius-lg, 12px);
    background: var(--surface-secondary);
    color: var(--accent);
}

.sidebar-firma[b-vc57uqjvig] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.sidebar-kundennr[b-vc57uqjvig] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    font-variant-numeric: tabular-nums;
}

.sidebar-stat-grid[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.sidebar-stat[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xs, 2px);
    padding: var(--spacing-sm);
    border-radius: var(--radius-md);
    background: var(--surface-secondary);
}

.sidebar-stat-label[b-vc57uqjvig] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.sidebar-stat-value[b-vc57uqjvig] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
}

.sidebar-stat-value.stat-aktiv[b-vc57uqjvig] {
    color: var(--dp-emerald-600);
}

.sidebar-stat-value.stat-stunden[b-vc57uqjvig] {
    color: var(--dp-amber-600);
}

.sidebar-footer-actions[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

/* ── Geocoding-Sektion im Dialog ── */
.geocode-section[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
    padding-top: var(--spacing-sm);
    border-top: 1px solid var(--border-subtle);
}

.geocode-header[b-vc57uqjvig] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.geocode-label[b-vc57uqjvig] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
}

/* ── Koordinaten-Hinweis ── */
.coords-hint[b-vc57uqjvig] {
    margin-top: -0.25rem;
    margin-bottom: 0.5rem;
    font-size: 0.82rem;
}

.coords-hint a[b-vc57uqjvig] {
    color: var(--color-primary, #2563eb);
    text-decoration: none;
}

.coords-hint a:hover[b-vc57uqjvig] {
    text-decoration: underline;
}

/* ── Geofencing Section ── */
.geofencing-section[b-vc57uqjvig] {
    margin-top: var(--spacing-md);
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--border-default);
}

.geofencing-section__header[b-vc57uqjvig] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin-bottom: var(--spacing-md);
}

.geofencing-section__header[b-vc57uqjvig]  i {
    color: var(--color-primary, #2563eb);
}

/* ── Import-Dialog ── */
.import-zusammenfassung[b-vc57uqjvig] {
    display: flex;
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
}

.import-stat[b-vc57uqjvig] {
    flex: 1;
    text-align: center;
    padding: var(--spacing-md);
    border-radius: var(--radius-md);
    background: var(--surface-secondary);
}

.import-stat-wert[b-vc57uqjvig] {
    font-size: 1.75rem;
    font-weight: var(--font-bold, 700);
    font-variant-numeric: tabular-nums;
}

.import-stat-label[b-vc57uqjvig] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-top: var(--spacing-2xs, 2px);
}

.import-stat-neu[b-vc57uqjvig] { color: var(--dp-emerald-600); }
.import-stat-aktualisiert[b-vc57uqjvig] { color: var(--dp-amber-600); }
.import-stat-baustellen[b-vc57uqjvig] { color: var(--accent); }
.import-stat-fehler[b-vc57uqjvig] { color: var(--dp-red-600); }

.import-liste[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    max-height: 200px;
    overflow-y: auto;
}

.import-eintrag[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xs, 2px);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-sm);
    background: var(--surface-secondary);
    font-size: var(--text-sm);
}

.import-eintrag-kopf[b-vc57uqjvig] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.import-baustelle-info[b-vc57uqjvig] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-xs);
    color: var(--text-secondary);
    padding-left: var(--spacing-xs);
}

.import-kundennr[b-vc57uqjvig] {
    color: var(--text-tertiary);
    font-size: var(--text-xs);
    font-variant-numeric: tabular-nums;
}

.import-ort[b-vc57uqjvig] {
    color: var(--text-secondary);
    font-size: var(--text-xs);
    margin-left: auto;
}

.import-fehler-liste[b-vc57uqjvig] {
    max-height: 150px;
    overflow-y: auto;
    margin-top: var(--spacing-xs);
    font-size: var(--text-sm);
}

.import-datei-bereich[b-vc57uqjvig] {
    display: flex;
    justify-content: center;
    padding: var(--spacing-xl) 0;
}

.import-datei-label[b-vc57uqjvig] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-xl) var(--spacing-2xl);
    border: 2px dashed var(--border-default);
    border-radius: var(--radius-lg, 12px);
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    color: var(--text-secondary);
    font-weight: var(--font-medium, 500);
}

.import-datei-label:hover[b-vc57uqjvig] {
    border-color: var(--accent);
    background: var(--surface-secondary);
}

.import-datei-hint[b-vc57uqjvig] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-weight: normal;
}

.import-datei-input[b-vc57uqjvig] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}

.import-laden[b-vc57uqjvig] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    color: var(--text-secondary);
}

/* ── Responsive ── */
@media (min-width: 768px) {
    .kunden-toolbar[b-vc57uqjvig] {
        flex-direction: row;
        align-items: center;
    }

    .kunden-toolbar[b-vc57uqjvig]  .ui-search-box {
        flex: 1;
        max-width: 400px;
    }
}

@media (max-width: 768px) {
    /* KPI-Leiste zweispaltig auf Mobile */
    .kunden-stats[b-vc57uqjvig] {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-sm);
    }

    /* Kundenkarten: Aktionen unter den Info-Block */
    .kunde-card-inner[b-vc57uqjvig] {
        flex-direction: column;
    }

    .kunde-aktionen[b-vc57uqjvig] {
        flex-direction: row;
        width: 100%;
        justify-content: flex-end;
        padding-top: var(--spacing-xs);
        border-top: 1px solid var(--border-subtle);
    }

    /* Baustellenkarten: Aktionen unter den Info-Block */
    .baustelle-card-inner[b-vc57uqjvig] {
        flex-direction: column;
    }

    .baustelle-aktionen[b-vc57uqjvig] {
        flex-direction: row;
        width: 100%;
        justify-content: flex-end;
        padding-top: var(--spacing-xs);
        border-top: 1px solid var(--border-subtle);
    }

    /* Formular-Spalten einspaltig */
    .form-row-2col[b-vc57uqjvig] {
        grid-template-columns: 1fr;
    }

    /* Detail-Sidebar: horizontal stat grid auf Mobile */
    .sidebar-stat-grid[b-vc57uqjvig] {
        flex-direction: row;
        flex-wrap: wrap;
        gap: var(--spacing-sm);
    }

    .sidebar-stat[b-vc57uqjvig] {
        flex: 1;
        min-width: 80px;
        text-align: center;
    }

    .sidebar-stat-value[b-vc57uqjvig] {
        font-size: var(--text-xl);
    }

    /* Sidebar-Header kompakter */
    .sidebar-firma-icon[b-vc57uqjvig] {
        width: 48px;
        height: 48px;
    }

    /* Sidebar Footer: Buttons nebeneinander */
    .sidebar-footer-actions[b-vc57uqjvig] {
        flex-direction: row;
        flex-wrap: wrap;
        gap: var(--spacing-sm);
    }

    .sidebar-footer-actions > *[b-vc57uqjvig] {
        flex: 1;
        min-width: 120px;
    }

    /* Baustellen-Tab Header */
    .baustellen-tab-header[b-vc57uqjvig] {
        flex-wrap: wrap;
        gap: var(--spacing-sm);
    }

    /* Geocode-Section */
    .geocode-header[b-vc57uqjvig] {
        flex-wrap: wrap;
        gap: var(--spacing-sm);
    }
}
/* _content/TimebookWeb/Components/Pages/Einstellungen.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Einstellungen — Scoped Styles
   ═══════════════════════════════════════════════════════ */

.einst-content[b-wrg6nwbnqb] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-top: 1.5rem;
    max-width: 860px;
}

/* ── Section Intro ── */

.einst-section-intro[b-wrg6nwbnqb] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1.25rem 1.5rem;
    background: var(--dp-slate-50, #f8fafc);
    border-radius: 0.75rem;
    border: 1px solid var(--dp-slate-200, #e2e8f0);
}

.einst-section-intro__icon[b-wrg6nwbnqb] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 0.625rem;
    background: var(--dp-blue-50, #eff6ff);
    color: var(--dp-blue-600, #2563eb);
    font-size: 1.35rem;
}

.einst-section-intro__icon--kalender[b-wrg6nwbnqb] {
    background: var(--dp-emerald-50, #ecfdf5);
    color: var(--dp-emerald-600, #059669);
}

.einst-section-intro h3[b-wrg6nwbnqb] {
    margin: 0 0 0.25rem;
    font-size: 1rem;
    font-weight: 600;
    color: var(--dp-slate-800, #1e293b);
}

.einst-section-intro p[b-wrg6nwbnqb] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--dp-slate-500, #64748b);
    line-height: 1.5;
}

/* ── Gesetzliche Vorgaben Card ── */

.einst-gesetz-card[b-wrg6nwbnqb] {
    background: #fff;
    border: 1px solid var(--dp-slate-200, #e2e8f0);
    border-radius: 0.75rem;
    overflow: hidden;
}

.einst-gesetz-card__header[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.875rem 1.25rem;
    background: var(--dp-slate-50, #f8fafc);
    border-bottom: 1px solid var(--dp-slate-200, #e2e8f0);
    font-size: 0.9rem;
    color: var(--dp-slate-600, #475569);
}

.einst-gesetz-card__title[b-wrg6nwbnqb] {
    font-weight: 600;
    flex: 1;
}

.einst-gesetz-card__badge[b-wrg6nwbnqb] {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 0.2rem 0.5rem;
    border-radius: 0.3rem;
    background: var(--dp-blue-50, #eff6ff);
    color: var(--dp-blue-700, #1d4ed8);
    border: 1px solid var(--dp-blue-200, #bfdbfe);
}

.einst-gesetz-card__body[b-wrg6nwbnqb] {
    display: flex;
    flex-direction: column;
    padding: 1rem 1.25rem;
    gap: 0;
}

.einst-gesetz-stufe[b-wrg6nwbnqb] {
    display: flex;
    align-items: stretch;
    gap: 1rem;
    padding: 0.75rem 0;
}

.einst-gesetz-stufe + .einst-gesetz-stufe[b-wrg6nwbnqb] {
    border-top: 1px solid var(--dp-slate-100, #f1f5f9);
}

.einst-gesetz-stufe__bar[b-wrg6nwbnqb] {
    width: 4px;
    border-radius: 2px;
    flex-shrink: 0;
    min-height: 2rem;
}

.einst-gesetz-stufe__bar--none[b-wrg6nwbnqb] {
    background: var(--dp-slate-300, #cbd5e1);
}

.einst-gesetz-stufe__bar--30[b-wrg6nwbnqb] {
    background: var(--dp-blue-500, #3b82f6);
}

.einst-gesetz-stufe__bar--45[b-wrg6nwbnqb] {
    background: var(--dp-blue-700, #1d4ed8);
}

.einst-gesetz-stufe__text[b-wrg6nwbnqb] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.einst-gesetz-stufe__text strong[b-wrg6nwbnqb] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--dp-slate-700, #334155);
}

.einst-gesetz-stufe__text span[b-wrg6nwbnqb] {
    font-size: 0.8rem;
    color: var(--dp-slate-500, #64748b);
}

.einst-gesetz-card__footer[b-wrg6nwbnqb] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    font-size: 0.8rem;
    color: var(--dp-slate-500, #64748b);
    background: var(--dp-slate-50, #f8fafc);
    border-top: 1px solid var(--dp-slate-200, #e2e8f0);
    line-height: 1.45;
}

.einst-gesetz-card__footer i[b-wrg6nwbnqb] {
    flex-shrink: 0;
    margin-top: 0.1rem;
    color: var(--dp-blue-500, #3b82f6);
}

/* ── Panel (wiederverwendbar für Sektionen) ── */

.einst-panel[b-wrg6nwbnqb] {
    background: #fff;
    border: 1px solid var(--dp-slate-200, #e2e8f0);
    border-radius: 0.75rem;
    overflow: hidden;
}

.einst-panel__header[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1.25rem;
    background: var(--dp-slate-50, #f8fafc);
    border-bottom: 1px solid var(--dp-slate-200, #e2e8f0);
}

.einst-panel__title[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--dp-slate-700, #334155);
}

.einst-panel__summary[b-wrg6nwbnqb] {
    font-size: 0.8rem;
    color: var(--dp-slate-500, #64748b);
    padding: 0.25rem 0.65rem;
    background: var(--dp-slate-100, #f1f5f9);
    border-radius: 1rem;
}

.einst-panel__summary strong[b-wrg6nwbnqb] {
    color: var(--dp-slate-700, #334155);
}

.einst-panel__body[b-wrg6nwbnqb] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ── Custom Switch ── */

.einst-switch[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
}

.einst-switch input[type="checkbox"][b-wrg6nwbnqb] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.einst-switch__slider[b-wrg6nwbnqb] {
    position: relative;
    flex-shrink: 0;
    width: 2.5rem;
    height: 1.375rem;
    background: var(--dp-slate-300, #cbd5e1);
    border-radius: 1rem;
    transition: background 0.2s ease;
}

.einst-switch__slider[b-wrg6nwbnqb]::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 1rem;
    height: 1rem;
    background: #fff;
    border-radius: 50%;
    transition: transform 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.einst-switch input:checked + .einst-switch__slider[b-wrg6nwbnqb] {
    background: var(--dp-blue-500, #3b82f6);
}

.einst-switch input:checked + .einst-switch__slider[b-wrg6nwbnqb]::after {
    transform: translateX(1.125rem);
}

.einst-switch input:focus-visible + .einst-switch__slider[b-wrg6nwbnqb] {
    outline: 2px solid var(--dp-blue-400, #60a5fa);
    outline-offset: 2px;
}

.einst-switch__label[b-wrg6nwbnqb] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--dp-slate-700, #334155);
}

/* ── Pausenregeln Tabelle ── */

.einst-regeln[b-wrg6nwbnqb] {
    border: 1px solid var(--dp-slate-200, #e2e8f0);
    border-radius: 0.625rem;
    overflow: hidden;
}

.einst-regeln__header[b-wrg6nwbnqb] {
    display: grid;
    grid-template-columns: 1fr 130px 120px 48px;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    background: var(--dp-slate-50, #f8fafc);
    border-bottom: 1px solid var(--dp-slate-200, #e2e8f0);
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--dp-slate-500, #64748b);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.einst-regeln__row[b-wrg6nwbnqb] {
    display: grid;
    grid-template-columns: 1fr 130px 120px 48px;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    align-items: center;
    background: #fff;
    transition: background 0.15s ease;
}

.einst-regeln__row + .einst-regeln__row[b-wrg6nwbnqb] {
    border-top: 1px solid var(--dp-slate-100, #f1f5f9);
}

.einst-regeln__row--gesetzlich[b-wrg6nwbnqb] {
    background: var(--dp-blue-50, #eff6ff);
}

.einst-regeln__cell--action[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.einst-regeln__lock[b-wrg6nwbnqb] {
    color: var(--dp-blue-500, #3b82f6);
    font-size: 1rem;
    display: flex;
}

.einst-regeln__header--5col[b-wrg6nwbnqb],
.einst-regeln__row--5col[b-wrg6nwbnqb] {
    grid-template-columns: 1fr 130px 100px 120px 48px;
}

.einst-regeln__select[b-wrg6nwbnqb] {
    width: 100%;
    padding: 0.35rem 0.5rem;
    border: 1px solid var(--dp-slate-200, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8125rem;
    color: var(--dp-slate-700, #334155);
    background: #fff;
    cursor: pointer;
}

.einst-regeln__select:focus[b-wrg6nwbnqb] {
    outline: 2px solid var(--dp-blue-500, #3b82f6);
    outline-offset: -1px;
}

.einst-regeln__giltfuer-text[b-wrg6nwbnqb] {
    font-size: 0.8125rem;
    color: var(--dp-slate-500, #64748b);
    font-style: italic;
}

.einst-regeln__add[b-wrg6nwbnqb] {
    margin-top: 0.75rem;
}

/* ── Banner (Erfolg / Fehler / Warnung) ── */

.einst-banner[b-wrg6nwbnqb] {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.875rem 1.125rem;
    border-radius: 0.625rem;
    font-size: 0.85rem;
    line-height: 1.45;
}

.einst-banner i[b-wrg6nwbnqb] {
    flex-shrink: 0;
    font-size: 1.1rem;
    margin-top: 0.05rem;
}

.einst-banner--success[b-wrg6nwbnqb] {
    background: var(--dp-emerald-50, #ecfdf5);
    border: 1px solid #a7f3d0;
    color: #065f46;
}

.einst-banner--success i[b-wrg6nwbnqb] {
    color: var(--dp-emerald-500, #10b981);
}

.einst-banner--danger[b-wrg6nwbnqb] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.einst-banner--danger i[b-wrg6nwbnqb] {
    color: #dc2626;
}

.einst-banner--danger strong[b-wrg6nwbnqb] {
    display: block;
    margin-bottom: 0.15rem;
}

.einst-banner--toast[b-wrg6nwbnqb] {
    animation: banner-slide-in-b-wrg6nwbnqb 0.3s ease-out;
}

@keyframes banner-slide-in-b-wrg6nwbnqb {
    from {
        opacity: 0;
        transform: translateY(-0.5rem);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ── Verbindungsstatus Card ── */

.einst-status-card[b-wrg6nwbnqb] {
    display: flex;
    align-items: stretch;
    background: #fff;
    border: 1px solid var(--dp-slate-200, #e2e8f0);
    border-radius: 0.75rem;
    overflow: hidden;
}

.einst-status-card__indicator[b-wrg6nwbnqb] {
    width: 5px;
    flex-shrink: 0;
}

.einst-status-card--connected .einst-status-card__indicator[b-wrg6nwbnqb] {
    background: var(--dp-emerald-500, #10b981);
}

.einst-status-card--disconnected .einst-status-card__indicator[b-wrg6nwbnqb] {
    background: var(--dp-slate-300, #cbd5e1);
}

.einst-status-card__content[b-wrg6nwbnqb] {
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.einst-status-card__title[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
}

.einst-status-card__detail[b-wrg6nwbnqb] {
    font-size: 0.825rem;
    color: var(--dp-slate-500, #64748b);
}

/* ── Sync-Optionen (Karten) ── */

.einst-sync-options[b-wrg6nwbnqb] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.einst-sync-option[b-wrg6nwbnqb] {
    cursor: pointer;
}

.einst-sync-option input[type="checkbox"][b-wrg6nwbnqb] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.einst-sync-option__card[b-wrg6nwbnqb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.625rem;
    padding: 1.25rem 1rem;
    border: 2px solid var(--dp-slate-200, #e2e8f0);
    border-radius: 0.75rem;
    background: #fff;
    transition: all 0.2s ease;
}

.einst-sync-option__card i[b-wrg6nwbnqb] {
    font-size: 1.5rem;
    color: var(--dp-slate-400, #94a3b8);
    transition: color 0.2s ease;
}

.einst-sync-option__card strong[b-wrg6nwbnqb] {
    font-size: 0.85rem;
    color: var(--dp-slate-700, #334155);
}

.einst-sync-option__card span[b-wrg6nwbnqb] {
    font-size: 0.75rem;
    color: var(--dp-slate-500, #64748b);
    line-height: 1.35;
}

.einst-sync-option input:checked + .einst-sync-option__card[b-wrg6nwbnqb] {
    border-color: var(--dp-blue-500, #3b82f6);
    background: var(--dp-blue-50, #eff6ff);
}

.einst-sync-option input:checked + .einst-sync-option__card i[b-wrg6nwbnqb] {
    color: var(--dp-blue-600, #2563eb);
}

.einst-sync-option input:focus-visible + .einst-sync-option__card[b-wrg6nwbnqb] {
    outline: 2px solid var(--dp-blue-400, #60a5fa);
    outline-offset: 2px;
}

.einst-sync-option__card:hover[b-wrg6nwbnqb] {
    border-color: var(--dp-slate-300, #cbd5e1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.einst-sync-trigger[b-wrg6nwbnqb] {
    margin-top: 0.5rem;
    display: flex;
    justify-content: center;
}

/* ── Form Grid ── */

.einst-form-grid[b-wrg6nwbnqb] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}

/* ── Actions Footer ── */

.einst-actions[b-wrg6nwbnqb] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.25rem;
}

/* ── GPS Tab ── */

.einst-section-intro__icon--gps[b-wrg6nwbnqb] {
    background: #fffbeb;
    color: #d97706;
}

.einst-section-intro__hinweis[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.5rem;
    font-size: 0.8rem;
    color: var(--dp-slate-400, #94a3b8);
}

.einst-section-intro__hinweis i[b-wrg6nwbnqb] {
    font-size: 0.9rem;
    color: #d97706;
}

.einst-gps-stats[b-wrg6nwbnqb] {
    display: flex;
    gap: 0.75rem;
}

.einst-gps-stat[b-wrg6nwbnqb] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding: 1rem 0.75rem;
    background: #fff;
    border: 1px solid var(--dp-slate-200, #e2e8f0);
    border-radius: 0.75rem;
}

.einst-gps-stat__zahl[b-wrg6nwbnqb] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--dp-slate-700, #334155);
}

.einst-gps-stat__label[b-wrg6nwbnqb] {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--dp-slate-500, #64748b);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.einst-gps-stat--success[b-wrg6nwbnqb] {
    border-color: #a7f3d0;
    background: var(--dp-emerald-50, #ecfdf5);
}

.einst-gps-stat--success .einst-gps-stat__zahl[b-wrg6nwbnqb] {
    color: #059669;
}

.einst-gps-stat--warning[b-wrg6nwbnqb] {
    border-color: #fed7aa;
    background: #fffbeb;
}

.einst-gps-stat--warning .einst-gps-stat__zahl[b-wrg6nwbnqb] {
    color: #d97706;
}

.einst-gps-stat--muted[b-wrg6nwbnqb] {
    border-color: var(--dp-slate-200, #e2e8f0);
    background: var(--dp-slate-50, #f8fafc);
}

.einst-gps-stat--muted .einst-gps-stat__zahl[b-wrg6nwbnqb] {
    color: var(--dp-slate-400, #94a3b8);
}

.einst-panel__body--table[b-wrg6nwbnqb] {
    padding: 0;
}

.einst-gps-filter[b-wrg6nwbnqb] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs);
    padding: var(--spacing-sm) var(--spacing-md);
    border-bottom: 1px solid var(--border-subtle, var(--border-default));
}

.einst-gps-table__header[b-wrg6nwbnqb] {
    display: grid;
    grid-template-columns: 1fr 1.2fr 120px;
    gap: 0.75rem;
    padding: 0.625rem 1.25rem;
    background: var(--dp-slate-50, #f8fafc);
    border-bottom: 1px solid var(--dp-slate-200, #e2e8f0);
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--dp-slate-500, #64748b);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.einst-gps-table__row[b-wrg6nwbnqb] {
    display: grid;
    grid-template-columns: 1fr 1.2fr 120px;
    gap: 0.75rem;
    padding: 0.625rem 1.25rem;
    align-items: center;
    font-size: 0.85rem;
}

.einst-gps-table__row + .einst-gps-table__row[b-wrg6nwbnqb] {
    border-top: 1px solid var(--dp-slate-100, #f1f5f9);
}

.einst-gps-table__name[b-wrg6nwbnqb] {
    font-weight: 500;
    color: var(--dp-slate-700, #334155);
}

.einst-gps-table__adresse[b-wrg6nwbnqb] {
    color: var(--dp-slate-500, #64748b);
}

.einst-gps-table__adresse em[b-wrg6nwbnqb] {
    color: var(--dp-slate-300, #cbd5e1);
}

.einst-gps-progress[b-wrg6nwbnqb] {
    height: 8px;
    background: var(--dp-slate-200, #e2e8f0);
    border-radius: 4px;
    overflow: hidden;
}

.einst-gps-progress__bar[b-wrg6nwbnqb] {
    height: 100%;
    background: var(--dp-blue-500, #3b82f6);
    border-radius: 4px;
    transition: width 0.4s ease;
}

.einst-gps-progress__info[b-wrg6nwbnqb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.einst-gps-progress__text[b-wrg6nwbnqb] {
    font-size: 0.825rem;
    color: var(--dp-slate-600, #475569);
}

.einst-gps-progress__counters[b-wrg6nwbnqb] {
    display: flex;
    gap: 0.75rem;
    font-size: 0.8rem;
    font-weight: 500;
}

.einst-gps-progress__ok[b-wrg6nwbnqb] {
    color: #059669;
}

.einst-gps-progress__fail[b-wrg6nwbnqb] {
    color: #dc2626;
}

.einst-actions--gps[b-wrg6nwbnqb] {
    justify-content: flex-start;
}

.einst-gps-sync-info[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.einst-gps-sync-info__dauer[b-wrg6nwbnqb] {
    font-size: 0.8rem;
    color: var(--dp-slate-400, #94a3b8);
}

/* ── Geofencing-Erklärung ── */
.einst-geofencing-erklaerung[b-wrg6nwbnqb] {
    margin-bottom: var(--spacing-md);
}

.einst-geofencing-erklaerung h4[b-wrg6nwbnqb] {
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--spacing-xs) 0;
}

.einst-geofencing-erklaerung p[b-wrg6nwbnqb] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.6;
    margin: 0;
}

/* ── Geofencing Modi ── */
.einst-geofencing-modi[b-wrg6nwbnqb] {
    margin-top: var(--spacing-lg);
    margin-bottom: var(--spacing-sm);
}

.einst-geofencing-modi h4[b-wrg6nwbnqb] {
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--spacing-sm) 0;
}

.einst-geofencing-modi__grid[b-wrg6nwbnqb] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-md);
}

.einst-geofencing-modus[b-wrg6nwbnqb] {
    padding: var(--spacing-md);
    border-radius: var(--radius-md);
    border: 2px solid var(--border-default);
    background: var(--surface-secondary);
    transition: border-color 0.15s;
}

.einst-geofencing-modus--aktiv[b-wrg6nwbnqb] {
    border-color: var(--color-primary, #2563eb);
    background: var(--surface-primary, #fff);
}

.einst-geofencing-modus__header[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    margin-bottom: var(--spacing-xs);
    color: var(--text-primary);
}

.einst-geofencing-modus p[b-wrg6nwbnqb] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.5;
    margin: 0 0 var(--spacing-xs) 0;
}

.einst-geofencing-modus__hinweis[b-wrg6nwbnqb] {
    font-size: var(--text-xs);
    color: var(--dp-amber-600, #d97706);
    font-weight: var(--font-medium, 500);
}

.einst-gps-laden[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    justify-content: center;
    padding: 2rem;
    font-size: 0.875rem;
    color: var(--dp-slate-500, #64748b);
}

.einst-gps-laden i[b-wrg6nwbnqb] {
    animation: spin-b-wrg6nwbnqb 1s linear infinite;
}

@keyframes spin-b-wrg6nwbnqb {
    to { transform: rotate(360deg); }
}

.einst-banner--warning[b-wrg6nwbnqb] {
    background: #fffbeb;
    border: 1px solid #fed7aa;
    color: #92400e;
}

.einst-banner--warning i[b-wrg6nwbnqb] {
    color: #d97706;
}

.einst-banner--info[b-wrg6nwbnqb] {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #1e40af;
}

.einst-banner--info i[b-wrg6nwbnqb] {
    color: #3b82f6;
}

/* ── Responsive ── */

@media (max-width: 768px) {
    .einst-form-grid[b-wrg6nwbnqb] {
        grid-template-columns: 1fr;
    }

    .einst-sync-options[b-wrg6nwbnqb] {
        grid-template-columns: 1fr;
    }

    .einst-regeln__header[b-wrg6nwbnqb],
    .einst-regeln__row[b-wrg6nwbnqb] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }

    .einst-regeln__header[b-wrg6nwbnqb] {
        display: none;
    }

    .einst-section-intro[b-wrg6nwbnqb] {
        flex-direction: column;
    }

    .einst-gps-stats[b-wrg6nwbnqb] {
        flex-wrap: wrap;
    }

    .einst-gps-stat[b-wrg6nwbnqb] {
        min-width: calc(50% - 0.375rem);
    }

    .einst-gps-table__header[b-wrg6nwbnqb] {
        display: none;
    }

    .einst-gps-table__row[b-wrg6nwbnqb] {
        grid-template-columns: 1fr;
        gap: 0.25rem;
    }

    .einst-gps-sync-info[b-wrg6nwbnqb] {
        flex-direction: column;
        align-items: flex-start;
    }

    .einst-gps-progress__info[b-wrg6nwbnqb] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.375rem;
    }
}

/* ── Firmenstandorte ── */

.einst-standort-form[b-wrg6nwbnqb] {
    margin-top: 0.75rem;
    padding: 1.25rem;
    background: var(--dp-slate-50, #f8fafc);
    border: 1px solid var(--dp-slate-200, #e2e8f0);
    border-radius: 0.625rem;
}

.einst-standort-form__actions[b-wrg6nwbnqb] {
    display: flex;
    gap: 0.625rem;
    margin-top: 1rem;
}

.einst-gps-table__actions[b-wrg6nwbnqb] {
    display: flex;
    gap: 0.25rem;
    justify-content: flex-end;
}

.einst-standort-table .einst-gps-table__header[b-wrg6nwbnqb],
.einst-standort-table .einst-gps-table__row[b-wrg6nwbnqb] {
    grid-template-columns: 1fr 1.2fr 120px 80px;
}

/* ── GPS-Tabelle mit Koordinaten-Spalten ── */

.einst-gps-table--coords .einst-gps-table__header[b-wrg6nwbnqb],
.einst-gps-table--coords .einst-gps-table__row[b-wrg6nwbnqb] {
    grid-template-columns: 1fr 0.8fr 110px 110px 110px 40px;
}

.einst-gps-table__coord[b-wrg6nwbnqb] {
    font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
    font-size: 0.8rem;
    color: var(--dp-slate-600, #475569);
}

.einst-gps-table__coord em[b-wrg6nwbnqb] {
    color: var(--dp-slate-300, #cbd5e1);
    font-family: inherit;
}

.einst-gps-table__coord--fehler[b-wrg6nwbnqb] {
    color: #dc2626;
    font-weight: 600;
}

.einst-gps-table__row--fehler[b-wrg6nwbnqb] {
    background: #fef2f2;
}

.einst-gps-table__edit-row[b-wrg6nwbnqb] {
    grid-column: 1 / -1;
    padding: 0.75rem 1.25rem;
    background: var(--dp-slate-50, #f8fafc);
    border-top: 1px solid var(--dp-slate-200, #e2e8f0);
    border-bottom: 1px solid var(--dp-slate-200, #e2e8f0);
}

.einst-gps-inline-edit__fields[b-wrg6nwbnqb] {
    display: flex;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.einst-gps-inline-edit__fields label[b-wrg6nwbnqb] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.einst-gps-inline-edit__fields label span[b-wrg6nwbnqb] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--dp-slate-500, #64748b);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.einst-gps-inline-edit__actions[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.einst-gps-inline-edit__link[b-wrg6nwbnqb] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-left: auto;
    font-size: 0.8rem;
    color: var(--dp-blue-600, #2563eb);
    text-decoration: none;
}

.einst-gps-inline-edit__link:hover[b-wrg6nwbnqb] {
    text-decoration: underline;
}

/* ═══════════ Arbeitszeit (BRTV) ═══════════ */

.az-grid[b-wrg6nwbnqb] {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: var(--spacing-md, 1rem);
    align-items: end;
}

.az-woche-ergebnis[b-wrg6nwbnqb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: var(--spacing-sm, 0.5rem) var(--spacing-md, 1rem);
    background: var(--dp-slate-50, #f8fafc);
    border-radius: var(--radius-md, 0.5rem);
    border: 1px solid var(--dp-slate-200, #e2e8f0);
    min-width: 100px;
}

.az-woche-label[b-wrg6nwbnqb] {
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-tertiary, #94a3b8);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}

.az-woche-wert[b-wrg6nwbnqb] {
    font-size: var(--text-2xl, 1.5rem);
    font-weight: 700;
    color: var(--text-primary, #0f172a);
    font-variant-numeric: tabular-nums;
}

.az-monate-label[b-wrg6nwbnqb] {
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-secondary, #64748b);
    margin-top: var(--spacing-xs, 0.25rem);
}

.az-info-box[b-wrg6nwbnqb] {
    display: flex;
    gap: var(--spacing-md, 1rem);
    padding: var(--spacing-md, 1rem) var(--spacing-lg, 1.5rem);
    background: var(--dp-blue-50, #eff6ff);
    border: 1px solid var(--dp-blue-200, #bfdbfe);
    border-radius: var(--radius-lg, 0.75rem);
}

.az-info-icon[b-wrg6nwbnqb] {
    flex-shrink: 0;
    font-size: 1.5rem;
    color: var(--dp-blue-500, #3b82f6);
    margin-top: 2px;
}

.az-info-content h4[b-wrg6nwbnqb] {
    margin: 0 0 var(--spacing-sm, 0.5rem) 0;
    font-size: var(--text-base, 1rem);
    color: var(--dp-blue-800, #1e40af);
}

.az-info-content ul[b-wrg6nwbnqb] {
    margin: 0;
    padding-left: 1.25rem;
    font-size: var(--text-sm, 0.875rem);
    color: var(--dp-blue-700, #1d4ed8);
    line-height: 1.6;
}

.az-info-hinweis[b-wrg6nwbnqb] {
    margin-top: var(--spacing-sm, 0.5rem);
    font-size: var(--text-xs, 0.75rem);
    color: var(--dp-blue-500, #3b82f6);
    font-style: italic;
}

.az-freitag-toggle[b-wrg6nwbnqb] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xs, 0.125rem);
    padding: var(--spacing-sm, 0.5rem) var(--spacing-md, 1rem);
    background: var(--surface-secondary, #f8fafc);
    border-radius: var(--radius-md, 0.5rem);
    border: 1px solid var(--border-subtle, #e2e8f0);
}

.az-toggle-label[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm, 0.5rem);
    cursor: pointer;
    font-weight: var(--font-medium, 500);
    font-size: var(--text-sm, 0.875rem);
}

.az-toggle-label input[type="checkbox"][b-wrg6nwbnqb] {
    width: 16px;
    height: 16px;
    accent-color: var(--accent, #3b82f6);
}

.az-toggle-hint[b-wrg6nwbnqb] {
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-tertiary, #94a3b8);
    margin-left: 28px;
}

@media (max-width: 640px) {
    .az-grid[b-wrg6nwbnqb] {
        grid-template-columns: 1fr;
    }
}

/* ═══════════ Wartungsmodus ═══════════ */

.wartung-toggle-row[b-wrg6nwbnqb] {
    margin-bottom: var(--spacing-md, 1rem);
}

.wartung-toggle[b-wrg6nwbnqb] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md, 1rem);
    cursor: pointer;
}

.wartung-toggle input[type="checkbox"][b-wrg6nwbnqb] {
    width: 20px;
    height: 20px;
    accent-color: var(--dp-red-500, #ef4444);
}

.wartung-toggle__label[b-wrg6nwbnqb] {
    font-size: var(--text-base, 1rem);
}

/* ── Anomalien ── */

.einst-input[b-wrg6nwbnqb] {
    width: 120px;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    color: var(--text-primary);
    background: var(--surface-primary);
    transition: border-color 0.15s;
}

.einst-input:focus[b-wrg6nwbnqb] {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(37,99,235,0.1);
}
/* _content/TimebookWeb/Components/Pages/Home.razor.rz.scp.css */
/* ==========================================================================
   Dashboard — "Betriebszentrale"
   Refined industrial aesthetic: clean data hierarchy, purposeful density
   ========================================================================== */

/* ===== JARVIS CARD ===== */

.jarvis-card[b-ru109lyok2] {
    position: relative;
    border-radius: var(--radius-lg);
    padding: 1px;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6, #06b6d4);
    margin-bottom: 1rem;
    overflow: hidden;
}

.jarvis-card__glow[b-ru109lyok2] {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(59,130,246,0.08), rgba(139,92,246,0.06), rgba(6,182,212,0.08));
    border-radius: var(--radius-lg);
    pointer-events: none;
    z-index: 0;
}

.jarvis-card__content[b-ru109lyok2] {
    position: relative;
    z-index: 1;
    background: var(--surface-primary);
    border-radius: calc(var(--radius-lg) - 1px);
    padding: 1.25rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
}

.jarvis-card__left[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex: 1;
    min-width: 0;
}

.jarvis-card__avatar[b-ru109lyok2] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #fff;
    font-size: 1.5rem;
}

.jarvis-card__text[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.jarvis-card__greet[b-ru109lyok2] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.01em;
}

.jarvis-card__status[b-ru109lyok2] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.4;
}

.jarvis-card__status--warn strong[b-ru109lyok2] {
    color: var(--status-warning);
}

.jarvis-card__right[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.625rem;
    flex-shrink: 0;
}

.jarvis-card__datum[b-ru109lyok2] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    text-transform: capitalize;
    white-space: nowrap;
}

.jarvis-card__btn[b-ru109lyok2] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4rem 0.875rem;
    border: none;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, #3b82f6, #7c3aed);
    color: #fff;
    font-size: var(--text-sm);
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.15s, transform 0.15s;
    white-space: nowrap;
}

.jarvis-card__btn:hover[b-ru109lyok2] {
    opacity: 0.9;
    transform: translateY(-1px);
}

.jarvis-card__badge[b-ru109lyok2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    border-radius: 10px;
    background: rgba(255,255,255,0.25);
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0 0.375rem;
}

/* ===== ANOMALIE DIALOG ===== */

.anomalie-overlay[b-ru109lyok2] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    animation: fadeIn-b-ru109lyok2 0.15s ease;
}

.anomalie-dialog[b-ru109lyok2] {
    background: var(--surface-primary);
    border-radius: var(--radius-xl, 1rem);
    width: 100%;
    max-width: 560px;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 24px 48px rgba(0,0,0,0.2);
    animation: slideUp-b-ru109lyok2 0.2s ease;
}

.anomalie-dialog__header[b-ru109lyok2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-default);
}

.anomalie-dialog__title[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-primary);
}

.anomalie-dialog__title :first-child[b-ru109lyok2] {
    color: #7c3aed;
    font-size: 1.25rem;
}

.anomalie-dialog__close[b-ru109lyok2] {
    background: none;
    border: none;
    padding: 0.375rem;
    cursor: pointer;
    color: var(--text-tertiary);
    border-radius: var(--radius-sm);
    transition: background 0.15s;
    font-size: 1.1rem;
}

.anomalie-dialog__close:hover[b-ru109lyok2] {
    background: var(--surface-secondary);
    color: var(--text-primary);
}

.anomalie-dialog__body[b-ru109lyok2] {
    padding: 1rem 1.5rem 1.5rem;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.anomalie-dialog__empty[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 2rem 0;
    color: var(--text-secondary);
    font-size: var(--text-sm);
}

.anomalie-dialog__empty :first-child[b-ru109lyok2] {
    font-size: 2.5rem;
    color: var(--status-success);
}

/* Zusammenfassung Chips */

.anomalie-dialog__summary[b-ru109lyok2] {
    display: flex;
    gap: 0.5rem;
    padding: 0 1.5rem;
    flex-wrap: wrap;
}

.anomalie-summary-chip[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    border-radius: 99px;
    background: var(--surface-secondary);
    font-size: var(--text-xs);
    color: var(--text-secondary);
    border: 1px solid var(--border-default);
}

.anomalie-summary-chip--kritisch[b-ru109lyok2] {
    background: rgba(239,68,68,0.06);
    border-color: rgba(239,68,68,0.2);
    color: var(--status-danger);
}

.anomalie-summary-chip__icon[b-ru109lyok2] {
    font-size: 0.875rem;
    line-height: 1;
}

.anomalie-summary-chip__count[b-ru109lyok2] {
    font-weight: 700;
}

.anomalie-summary-chip__label[b-ru109lyok2] {
    font-weight: 500;
}

/* Anomalie-Gruppe */

.anomalie-gruppe[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.anomalie-gruppe__header[b-ru109lyok2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.25rem 0;
}

.anomalie-gruppe__label[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-primary);
}

.anomalie-gruppe__icon[b-ru109lyok2] {
    font-size: 1rem;
    line-height: 1;
}

.anomalie-gruppe__alle-btn[b-ru109lyok2] {
    background: none;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    padding: 0.25rem 0.625rem;
    font-size: var(--text-xs);
    color: var(--text-secondary);
    cursor: pointer;
    transition: all 0.15s;
    font-weight: 500;
}

.anomalie-gruppe__alle-btn:hover[b-ru109lyok2] {
    background: var(--status-success);
    border-color: var(--status-success);
    color: #fff;
}

/* Anomalie-Item */

.anomalie-item[b-ru109lyok2] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-default);
    transition: border-color 0.15s;
}

.anomalie-item--warnung[b-ru109lyok2] {
    border-left: 3px solid var(--status-warning);
}

.anomalie-item--kritisch[b-ru109lyok2] {
    border-left: 3px solid var(--status-danger);
}

.anomalie-item__icon[b-ru109lyok2] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}

.anomalie-item--warnung .anomalie-item__icon[b-ru109lyok2] {
    background: rgba(245,158,11,0.1);
    color: var(--status-warning);
}

.anomalie-item--kritisch .anomalie-item__icon[b-ru109lyok2] {
    background: rgba(239,68,68,0.1);
    color: var(--status-danger);
}

.anomalie-item__content[b-ru109lyok2] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.anomalie-item__header[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.anomalie-item__titel[b-ru109lyok2] {
    font-weight: 600;
    font-size: var(--text-sm);
    color: var(--text-primary);
}

.anomalie-item__desc[b-ru109lyok2] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    line-height: 1.4;
}

.anomalie-item__actions[b-ru109lyok2] {
    display: flex;
    gap: 0.375rem;
    flex-shrink: 0;
    align-self: center;
}

.anomalie-item__btn[b-ru109lyok2],
.anomalie-item__link[b-ru109lyok2] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    background: var(--surface-primary);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-tertiary);
    transition: all 0.15s;
}

.anomalie-item__btn:hover[b-ru109lyok2] {
    background: var(--status-success);
    border-color: var(--status-success);
    color: #fff;
}

.anomalie-item__link:hover[b-ru109lyok2] {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}

@keyframes fadeIn-b-ru109lyok2 {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp-b-ru109lyok2 {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== Responsive ===== */
@media (max-width: 640px) {
    .jarvis-card__content[b-ru109lyok2] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    .jarvis-card__right[b-ru109lyok2] {
        align-items: flex-start;
        flex-direction: row;
        gap: 1rem;
        width: 100%;
        justify-content: space-between;
    }
}

/* ===== A) HERO + KPIs ===== */

.dash-hero[b-ru109lyok2] {
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.dash-hero__top[b-ru109lyok2] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.dash-hero__greet[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
}

.dash-hero__tagline[b-ru109lyok2] {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.01em;
}

.dash-hero__datum[b-ru109lyok2] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    margin-top: 0.1rem;
    text-transform: capitalize;
}

.dash-hero__uhr[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: var(--text-md);
    font-weight: 600;
    color: var(--text-secondary);
    background: var(--surface-secondary);
    padding: 0.3rem 0.75rem;
    border-radius: var(--radius-full);
}

[b-ru109lyok2] .dash-hero__uhr .phosphor-icon {
    font-size: var(--icon-sm);
    color: var(--text-tertiary);
}

/* ── KPI Row ── */

.dash-kpis[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0;
    background: var(--surface-secondary);
    border-radius: var(--radius-md);
    padding: 0.15rem;
}

.dash-kpi[b-ru109lyok2] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.75rem 1rem;
    border-radius: var(--radius-md);
    transition: background var(--transition-fast);
}

.dash-kpi:hover[b-ru109lyok2] {
    background: var(--surface-primary);
}

.dash-kpi--highlight[b-ru109lyok2] {
    background: #fef3c7;
    border-left: 3px solid #f59e0b;
}

.dash-kpi__divider[b-ru109lyok2] {
    width: 1px;
    height: 2rem;
    background: var(--border-default);
    flex-shrink: 0;
}

.dash-kpi__icon[b-ru109lyok2] {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.1rem;
}

.dash-kpi__icon--active[b-ru109lyok2] {
    background: #dcfce7;
    color: #16a34a;
}

.dash-kpi__icon--sites[b-ru109lyok2] {
    background: var(--dp-blue-50);
    color: var(--dp-blue-600);
}

.dash-kpi__icon--total[b-ru109lyok2] {
    background: var(--dp-slate-100);
    color: var(--dp-slate-600);
}

.dash-kpi__icon--absent[b-ru109lyok2] {
    background: #ede9fe;
    color: #7c3aed;
}

.dash-kpi__icon--urlaub[b-ru109lyok2] {
    background: #dbeafe;
    color: #2563eb;
}

.dash-kpi__icon--pending[b-ru109lyok2] {
    background: #fef3c7;
    color: #d97706;
}

.dash-kpi__data[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.dash-kpi__zahl[b-ru109lyok2] {
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
}

.dash-kpi__label[b-ru109lyok2] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-weight: 500;
    margin-top: 0.15rem;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ── Tagesfortschritt ── */

.dash-progress[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.dash-progress__header[b-ru109lyok2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.dash-progress__label[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.dash-progress__pulse[b-ru109lyok2] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #16a34a;
    animation: kpi-pulse-b-ru109lyok2 2.5s ease-in-out infinite;
}

@keyframes kpi-pulse-b-ru109lyok2 {
    0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.5); }
    50% { opacity: 0.7; box-shadow: 0 0 0 4px rgba(22, 163, 74, 0); }
}

.dash-progress__pct[b-ru109lyok2] {
    font-size: var(--text-md);
    font-weight: 800;
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
}

.dash-progress__track[b-ru109lyok2] {
    height: 6px;
    background: var(--surface-secondary);
    border-radius: 3px;
    overflow: hidden;
}

.dash-progress__fill[b-ru109lyok2] {
    height: 100%;
    border-radius: 3px;
    background: linear-gradient(90deg, #16a34a, #22c55e);
    transition: width 0.8s cubic-bezier(0.22, 1, 0.36, 1);
    min-width: 0;
}

.dash-progress__detail[b-ru109lyok2] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-weight: 500;
}


/* ===== B) KARTE + SIDEBAR ===== */

.dash-main[b-ru109lyok2] {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 1rem;
    margin-top: 1rem;
    height: 520px;
}

/* ── Karte ── */

.dash-map[b-ru109lyok2] {
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.dash-map__header[b-ru109lyok2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-subtle);
}

.dash-map__title[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-primary);
}

[b-ru109lyok2] .dash-map__title .phosphor-icon {
    color: var(--accent);
}

.dash-map__reset[b-ru109lyok2] {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--surface-secondary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.dash-map__reset:hover[b-ru109lyok2] {
    background: var(--surface-primary);
    color: var(--text-primary);
    border-color: var(--border-strong);
}

.dash-map__container[b-ru109lyok2] {
    flex: 1;
    min-height: 380px;
    overflow: visible;
}

/* ── Sidebar "Wer ist wo?" ── */

.dash-sidebar[b-ru109lyok2] {
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ── Sidebar Tabs ── */
.dash-sidebar__tabs[b-ru109lyok2] {
    display: flex;
    border-bottom: 2px solid var(--border-default);
}

.dash-sidebar__tab[b-ru109lyok2] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-sm) var(--spacing-md);
    border: none;
    background: transparent;
    color: var(--text-secondary);
    font-size: var(--text-sm);
    font-family: var(--font-family);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--transition-fast);
    position: relative;
}

.dash-sidebar__tab:hover[b-ru109lyok2] {
    color: var(--text-primary);
    background: var(--surface-secondary);
}

.dash-sidebar__tab--active[b-ru109lyok2] {
    color: var(--accent);
    font-weight: var(--font-semibold);
}

.dash-sidebar__tab--active[b-ru109lyok2]::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--accent);
}

.dash-sidebar__tab-count[b-ru109lyok2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: var(--font-bold);
    color: white;
    line-height: 1;
}

.dash-sidebar__tab-count--success[b-ru109lyok2] {
    background: var(--status-success);
}

.dash-sidebar__tab-count--danger[b-ru109lyok2] {
    background: var(--status-danger);
}

.dash-sidebar__tab-count--feierabend[b-ru109lyok2] {
    background: #7c3aed;
}

/* ── Feierabend-Liste ── */
.dash-feierabend-liste[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.dash-feierabend[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast);
}

.dash-feierabend:hover[b-ru109lyok2] {
    background: var(--surface-secondary);
}

.dash-feierabend__info[b-ru109lyok2] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.dash-feierabend__name[b-ru109lyok2] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dash-feierabend__rolle[b-ru109lyok2] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.dash-feierabend__zeit[b-ru109lyok2] {
    flex-shrink: 0;
    font-size: var(--text-xs);
    font-weight: 600;
    color: #7c3aed;
    background: #ede9fe;
    padding: 1px 7px;
    border-radius: var(--radius-full);
    white-space: nowrap;
}

/* ── Fehlend-Liste ── */
.dash-fehlend-liste[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.dash-fehlend[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast);
}

.dash-fehlend:hover[b-ru109lyok2] {
    background: var(--surface-secondary);
}

.dash-fehlend--critical[b-ru109lyok2] {
    background: rgba(239, 68, 68, 0.04);
}

.dash-fehlend__info[b-ru109lyok2] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.dash-fehlend__name[b-ru109lyok2] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dash-fehlend__rolle[b-ru109lyok2] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.dash-fehlend__tag[b-ru109lyok2] {
    flex-shrink: 0;
}

.dash-sidebar__header[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-subtle);
    font-size: var(--text-sm);
    font-weight: 700;
    color: var(--text-primary);
    flex-shrink: 0;
}

[b-ru109lyok2] .dash-sidebar__header .phosphor-icon {
    color: var(--accent);
    font-size: var(--icon-md);
}

.dash-sidebar__scroll[b-ru109lyok2] {
    flex: 1;
    overflow-y: auto;
    padding: 0.5rem;
}

.dash-sidebar__empty[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    color: var(--text-tertiary);
    font-size: var(--text-sm);
}

[b-ru109lyok2] .dash-sidebar__empty .phosphor-icon {
    font-size: 2rem;
    opacity: 0.4;
}

/* ── Baustellen-Gruppe ── */

.dash-gruppe[b-ru109lyok2] {
    margin-bottom: 0.25rem;
}

.dash-gruppe__header[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.5rem;
    font-size: var(--text-xs);
    font-weight: 700;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.dash-gruppe__dot[b-ru109lyok2] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.dash-gruppe__dot--pending[b-ru109lyok2] {
    background: var(--dp-slate-300);
}

.dash-gruppe__name[b-ru109lyok2] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dash-gruppe__count[b-ru109lyok2] {
    font-size: var(--text-xs);
    font-weight: 700;
    color: var(--text-tertiary);
    background: var(--surface-secondary);
    padding: 0 0.4rem;
    border-radius: var(--radius-full);
    min-width: 1.2rem;
    text-align: center;
}

.dash-gruppe__wetter[b-ru109lyok2] {
    margin-left: auto;
    font-size: var(--text-xs);
    color: var(--text-secondary);
    white-space: nowrap;
}

.dash-gruppe__regen[b-ru109lyok2] {
    margin-left: 0.25rem;
    font-size: var(--text-xs);
}

.dash-regen--kein[b-ru109lyok2] {
    color: var(--color-success);
}

.dash-regen--leicht[b-ru109lyok2] {
    color: var(--color-warning);
}

.dash-regen--mittel[b-ru109lyok2] {
    color: var(--color-warning);
}

.dash-regen--stark[b-ru109lyok2] {
    color: var(--color-danger);
}

.dash-gruppe__overflow[b-ru109lyok2] {
    text-align: center;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    padding: 0.25rem 0 0.5rem;
}

/* ── Mitarbeiter-Zeile ── */

.dash-ma[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.5rem;
    border-radius: var(--radius-md);
    transition: background var(--transition-fast);
}

.dash-ma:hover[b-ru109lyok2] {
    background: var(--surface-secondary);
}

.dash-ma__info[b-ru109lyok2] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.dash-ma__name[b-ru109lyok2] {
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text-primary);
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dash-ma__rolle[b-ru109lyok2] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.dash-ma__status[b-ru109lyok2] {
    display: flex;
}

.dash-ma__tag[b-ru109lyok2] {
    font-size: 0.55rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.1rem 0.35rem;
    border-radius: var(--radius-xs);
}

.dash-ma__tag--vorort[b-ru109lyok2] {
    color: #16a34a;
    background: #dcfce7;
}

.dash-ma__tag--unterwegs[b-ru109lyok2] {
    color: var(--dp-blue-700);
    background: var(--dp-blue-50);
}

.dash-ma__dauer[b-ru109lyok2] {
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--text-tertiary);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    flex-shrink: 0;
}

.dash-ma--pending[b-ru109lyok2] {
    opacity: 0.55;
}

.dash-gruppe--pending[b-ru109lyok2] {
    margin-top: 0.25rem;
    padding-top: 0.25rem;
    border-top: 1px solid var(--border-subtle);
}


/* ===== WARNUNG: Fehlende Check-Ins ===== */

.dash-warn[b-ru109lyok2] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
    background: var(--dp-amber-50, #fffbeb);
    border: 1px solid var(--dp-amber-500, #f59e0b);
    border-left: 4px solid var(--dp-amber-500, #f59e0b);
    border-radius: var(--radius-md);
    margin-bottom: var(--spacing-lg);
}

.dash-warn--critical[b-ru109lyok2] {
    background: var(--dp-red-50, #fef2f2);
    border-color: var(--dp-red-500, #ef4444);
    border-left-color: var(--dp-red-500, #ef4444);
}

.dash-warn--critical .dash-warn__icon[b-ru109lyok2] {
    color: var(--dp-red-600, #dc2626);
}

.dash-warn--critical .dash-warn__title[b-ru109lyok2] {
    color: var(--dp-red-600, #dc2626);
}

.dash-warn__icon[b-ru109lyok2] {
    font-size: var(--icon-xl);
    color: var(--dp-amber-600, #d97706);
    flex-shrink: 0;
    line-height: 1;
    padding-top: 2px;
}

.dash-warn__content[b-ru109lyok2] {
    flex: 1;
    min-width: 0;
}

.dash-warn__title[b-ru109lyok2] {
    display: block;
    font-size: var(--text-base);
    font-weight: var(--font-semibold);
    color: var(--dp-amber-600, #d97706);
    margin-bottom: var(--spacing-sm);
}

.dash-warn__list[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.dash-warn__person[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-2xs) var(--spacing-sm);
    border-radius: var(--radius-sm);
}

.dash-warn__person--critical[b-ru109lyok2] {
    background: rgba(239, 68, 68, 0.06);
}

.dash-warn__pname[b-ru109lyok2] {
    font-size: var(--text-sm-plus);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    flex: 1;
}

.dash-warn__ptag[b-ru109lyok2] {
    flex-shrink: 0;
}

/* ===== C) UNTERE CARDS ===== */

.dash-cards[b-ru109lyok2] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.dash-card[b-ru109lyok2] {
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.dash-card--warning[b-ru109lyok2] {
    border-color: #fde68a;
    background: linear-gradient(180deg, #fffbeb 0%, var(--surface-primary) 40%);
}

.dash-card__header[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.dash-card__icon[b-ru109lyok2] {
    width: 30px;
    height: 30px;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: white;
    font-size: var(--icon-sm);
}

.dash-card__icon--absent[b-ru109lyok2] { background: #7c3aed; }
.dash-card__icon--birthday[b-ru109lyok2] { background: #ec4899; }
.dash-card__icon--gps[b-ru109lyok2] { background: #f59e0b; }

.dash-card__icon-sm[b-ru109lyok2] {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fef3c7;
    color: #d97706;
    font-size: var(--icon-xs);
    flex-shrink: 0;
}

.dash-card__title[b-ru109lyok2] {
    flex: 1;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-primary);
}

.dash-card__list[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.dash-card__person[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.4rem;
    border-radius: var(--radius-md);
    background: var(--surface-secondary);
}

.dash-card__pname[b-ru109lyok2] {
    flex: 1;
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dash-card__page[b-ru109lyok2] {
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--text-secondary);
    white-space: nowrap;
}

.dash-card__pdetail[b-ru109lyok2] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    white-space: nowrap;
}

.dash-card__badge[b-ru109lyok2] {
    font-size: var(--text-xs);
    font-weight: 600;
    padding: 1px 7px;
    border-radius: var(--radius-full);
    white-space: nowrap;
}

.dash-card__badge--urlaub[b-ru109lyok2] {
    background: #ede9fe;
    color: #6d28d9;
}

.dash-card__badge--krank[b-ru109lyok2] {
    background: #fee2e2;
    color: #dc2626;
}

.dash-card__badge--unbezahlt[b-ru109lyok2] {
    background: var(--surface-secondary);
    color: var(--text-secondary);
}

.dash-card__birthday-today[b-ru109lyok2] {
    font-size: var(--text-xs);
    font-weight: 700;
    color: #ec4899;
    background: #fce7f3;
    padding: 1px 8px;
    border-radius: var(--radius-full);
    white-space: nowrap;
    animation: bday-glow-b-ru109lyok2 2.5s ease-in-out infinite;
}

@keyframes bday-glow-b-ru109lyok2 {
    0%, 100% { box-shadow: 0 0 0 0 rgba(236, 72, 153, 0); }
    50% { box-shadow: 0 0 0 3px rgba(236, 72, 153, 0.12); }
}

.dash-card__empty[b-ru109lyok2] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    text-align: center;
    padding: 1rem 0;
}

.dash-card__overflow[b-ru109lyok2] {
    text-align: center;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    padding: 0.15rem 0;
}

.dash-card__link[b-ru109lyok2] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--border-subtle);
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--text-link);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.dash-card__link:hover[b-ru109lyok2] {
    color: var(--text-link-hover);
}


/* ===== MAP MARKERS (Stecknadel + Info-Card) ===== */

.map-mk[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    cursor: default;
    transform: translate(-50%, -100%);
}

/* Syncfusion rendert jeden Marker in einem positionierten Container-div.
   Beim Hover muss dieser Container über allen anderen liegen.
   overflow:visible nötig damit Popup über Container-Grenzen hinausragt. */
[b-ru109lyok2] div:has(> .map-mk) {
    overflow: visible !important;
}

[b-ru109lyok2] div:has(> .map-mk:hover) {
    z-index: 99999 !important;
}

/* ── Pill-Marker (einheitlich für aktiv + inaktiv) ── */
.map-mk-pill[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 5px;
    background: white;
    border-radius: 14px;
    padding: 4px 10px 4px 6px;
    font-size: 11px;
    font-weight: 600;
    color: #334155;
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.05);
    white-space: nowrap;
    position: relative;
    z-index: 1;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.map-mk:hover .map-mk-pill[b-ru109lyok2] {
    transform: scale(1.06);
    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(0, 0, 0, 0.08);
}

.map-mk-wicon[b-ru109lyok2] {
    font-size: 13px;
    line-height: 1;
}

.map-mk-dot[b-ru109lyok2] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.map-mk-name[b-ru109lyok2] {
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 120px;
}

.map-mk-count[b-ru109lyok2] {
    font-size: 10px;
    font-weight: 700;
    color: white;
    background: var(--pin-color);
    border-radius: 8px;
    padding: 0 5px;
    min-width: 16px;
    text-align: center;
    line-height: 16px;
}

/* Pfeil nach unten */
.map-mk-arrow[b-ru109lyok2] {
    position: absolute;
    bottom: -4px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    width: 8px;
    height: 8px;
    background: white;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.06);
}

/* Pulsierender Ring (nur aktive) */
.map-mk-pulse[b-ru109lyok2] {
    position: absolute;
    bottom: -8px;
    left: 50%;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    transform: translateX(-50%);
    background: var(--pin-color);
    animation: mk-pulse-b-ru109lyok2 2.5s cubic-bezier(0, 0, 0.2, 1) infinite;
    z-index: -1;
}

@keyframes mk-pulse-b-ru109lyok2 {
    0% { transform: translateX(-50%) scale(1); opacity: 0.35; }
    100% { transform: translateX(-50%) scale(3); opacity: 0; }
}

/* Inaktive etwas dezenter */
.map-mk--leer .map-mk-pill[b-ru109lyok2] {
    opacity: 0.7;
    font-size: 10px;
    padding: 3px 8px 3px 5px;
}

.map-mk--leer .map-mk-dot[b-ru109lyok2] {
    width: 6px;
    height: 6px;
}

/* ── Hover-Popup ── */
.map-mk-popup[b-ru109lyok2] {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%) translateY(6px) scale(0.95);
    background: white;
    border-radius: 10px;
    padding: 12px 14px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(0, 0, 0, 0.06);
    min-width: 220px;
    max-width: 300px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease, transform 0.15s ease;
    z-index: 99999;
    white-space: normal;
}

.map-mk:hover .map-mk-popup[b-ru109lyok2] {
    opacity: 1;
    transform: translateX(-50%) translateY(0) scale(1);
    pointer-events: auto;
}

.map-mk-popup-arrow[b-ru109lyok2] {
    position: absolute;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    width: 12px;
    height: 12px;
    background: white;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.06);
}

.map-mk-popup-head[b-ru109lyok2] {
    margin-bottom: 2px;
}

.map-mk-popup-name[b-ru109lyok2] {
    font-size: 13px;
    font-weight: 700;
    color: #0f172a;
}

.map-mk-popup-ort[b-ru109lyok2] {
    font-size: 11px;
    color: #64748b;
    margin-bottom: 4px;
}

.map-mk-popup-wetter[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: #475569;
    padding: 4px 0;
}

.map-mk-popup-divider[b-ru109lyok2] {
    height: 1px;
    background: #e2e8f0;
    margin: 6px 0;
}

.map-mk-popup-team[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.map-mk-ma[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
}

.map-mk-ma-dot[b-ru109lyok2] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.map-mk-ma-dot--vorort[b-ru109lyok2] {
    background: #16a34a;
    box-shadow: 0 0 0 2px rgba(22, 163, 74, 0.2);
}

.map-mk-ma-dot--unterwegs[b-ru109lyok2] {
    background: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

.map-mk-ma-dot--pause[b-ru109lyok2] {
    background: #d97706;
    box-shadow: 0 0 0 2px rgba(217, 119, 6, 0.2);
}

.map-mk-ma-name[b-ru109lyok2] {
    font-weight: 600;
    color: #1e293b;
    flex: 1;
}

.map-mk-ma-rolle[b-ru109lyok2] {
    font-size: 10px;
    color: #94a3b8;
}


/* ===== RESPONSIVE ===== */

@media (max-width: 900px) {
    .dash-main[b-ru109lyok2] {
        grid-template-columns: 1fr;
    }

    .dash-sidebar[b-ru109lyok2] {
        max-height: 360px;
    }

    .dash-kpis[b-ru109lyok2] {
        flex-wrap: wrap;
    }

    .dash-kpi[b-ru109lyok2] {
        min-width: calc(50% - 1rem);
    }

    .dash-kpi__divider[b-ru109lyok2] {
        display: none;
    }
}

@media (max-width: 640px) {
    .dash-hero[b-ru109lyok2] {
        padding: 1rem;
    }

    .dash-hero__top[b-ru109lyok2] {
        flex-direction: column;
        gap: 0.5rem;
    }

    .dash-kpi[b-ru109lyok2] {
        min-width: 100%;
    }

    .dash-map__container[b-ru109lyok2] {
        min-height: 280px;
    }

    .dash-cards[b-ru109lyok2] {
        grid-template-columns: 1fr;
    }
}
/* _content/TimebookWeb/Components/Pages/Login.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════
   Login — Split-Screen, industriell-elegant
   ═══════════════════════════════════════════════════════════════ */

.login-scene[b-ufbpn4bjiw] {
    display: flex;
    min-height: 100vh;
    width: 100%;
}

/* ── Linke Seite: Brand-Fläche ── */
.login-left[b-ufbpn4bjiw] {
    flex: 1;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: linear-gradient(145deg, var(--dp-slate-900) 0%, #1a2332 50%, var(--dp-slate-800) 100%);
    overflow: hidden;
    padding: 3rem;
}

.login-left[b-ufbpn4bjiw]::before {
    content: '';
    position: absolute;
    top: -30%;
    right: -20%;
    width: 80%;
    height: 80%;
    background: radial-gradient(circle, rgba(220, 38, 38, 0.08) 0%, transparent 70%);
    pointer-events: none;
}

.login-left[b-ufbpn4bjiw]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, transparent, #dc2626, #94a3b8, transparent);
}

.brand-area[b-ufbpn4bjiw] {
    position: relative;
    z-index: 2;
    text-align: center;
    animation: brandFadeIn-b-ufbpn4bjiw 0.8s ease-out;
}

.brand-logo[b-ufbpn4bjiw] {
    width: 500px;
    max-width: 80%;
    height: auto;
    filter: brightness(1.1);
    margin-bottom: 2rem;
}

.brand-tagline[b-ufbpn4bjiw] {
    font-family: var(--font-family);
    font-size: var(--text-lg);
    font-weight: 400;
    color: var(--dp-slate-400);
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.left-decoration[b-ufbpn4bjiw] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.6;
}

.deco-grid[b-ufbpn4bjiw] {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 400px;
    height: 400px;
    opacity: 0.5;
}

/* ── Rechte Seite: Formular ── */
.login-right[b-ufbpn4bjiw] {
    flex: 0 0 480px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    background: var(--surface-primary, #fff);
    position: relative;
}

.login-right[b-ufbpn4bjiw]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 1px;
    background: linear-gradient(180deg, transparent 10%, var(--dp-slate-200) 50%, transparent 90%);
}

/* ── Karte ── */
.login-card[b-ufbpn4bjiw] {
    width: 100%;
    max-width: 360px;
    animation: cardSlideIn-b-ufbpn4bjiw 0.6s ease-out;
}

.login-header[b-ufbpn4bjiw] {
    margin-bottom: 2.5rem;
}

.login-title[b-ufbpn4bjiw] {
    font-family: var(--font-family);
    font-size: 2rem;
    font-weight: 700;
    color: var(--dp-slate-900);
    margin: 0 0 0.5rem;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.login-subtitle[b-ufbpn4bjiw] {
    font-family: var(--font-family);
    font-size: var(--text-md);
    color: var(--dp-slate-500);
    margin: 0;
    font-weight: 400;
}

/* ── Formular ── */
.login-form[b-ufbpn4bjiw] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.form-group[b-ufbpn4bjiw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-label[b-ufbpn4bjiw] {
    font-family: var(--font-family);
    font-size: var(--text-sm-plus);
    font-weight: 600;
    color: var(--dp-slate-600);
    display: flex;
    align-items: center;
    gap: 0.4rem;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.form-label i[b-ufbpn4bjiw] {
    font-size: 1rem;
    color: var(--dp-slate-400);
}

.login-input[b-ufbpn4bjiw] {
    width: 100%;
    padding: 0.75rem 1rem;
    font-family: var(--font-family);
    font-size: var(--text-md);
    font-weight: 400;
    border: 1.5px solid var(--dp-slate-200);
    border-radius: var(--dp-radius-4);
    background-color: var(--dp-slate-50);
    color: var(--dp-slate-900);
    outline: none;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.login-input:focus[b-ufbpn4bjiw] {
    border-color: var(--dp-slate-900);
    background-color: #fff;
    box-shadow: 0 0 0 3px rgba(15, 23, 42, 0.06);
}

.login-input[b-ufbpn4bjiw]::placeholder {
    color: var(--dp-slate-400);
    font-weight: 400;
}

.login-input:disabled[b-ufbpn4bjiw] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ── Button ── */
.login-btn[b-ufbpn4bjiw] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.8rem 1.5rem;
    margin-top: 0.5rem;
    font-family: var(--font-family);
    font-size: var(--text-md);
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #fff;
    background: linear-gradient(135deg, var(--dp-slate-900) 0%, var(--dp-slate-800) 100%);
    border: none;
    border-radius: var(--dp-radius-4);
    cursor: pointer;
    transition: all 0.25s ease;
    position: relative;
    overflow: hidden;
}

.login-btn[b-ufbpn4bjiw]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.login-btn:hover:not(:disabled)[b-ufbpn4bjiw]::before {
    opacity: 1;
}

.login-btn span[b-ufbpn4bjiw],
.login-btn i[b-ufbpn4bjiw] {
    position: relative;
    z-index: 1;
}

.login-btn i[b-ufbpn4bjiw] {
    font-size: 1.1rem;
}

.login-btn:active:not(:disabled)[b-ufbpn4bjiw] {
    transform: scale(0.98);
}

.login-btn:disabled[b-ufbpn4bjiw] {
    cursor: not-allowed;
    opacity: 0.7;
}

.login-btn--loading[b-ufbpn4bjiw] {
    pointer-events: none;
}

/* ── Spinner ── */
.spinner[b-ufbpn4bjiw] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-ufbpn4bjiw 0.6s linear infinite;
}

/* ── Footer ── */
.login-footer[b-ufbpn4bjiw] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 2.5rem;
}

.footer-line[b-ufbpn4bjiw] {
    flex: 1;
    height: 1px;
    background: var(--dp-slate-200);
}

.footer-text[b-ufbpn4bjiw] {
    font-family: var(--font-family);
    font-size: var(--text-xs);
    color: var(--dp-slate-400);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    white-space: nowrap;
}

/* ── Animationen ── */
@keyframes brandFadeIn-b-ufbpn4bjiw {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes cardSlideIn-b-ufbpn4bjiw {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes spin-b-ufbpn4bjiw {
    to { transform: rotate(360deg); }
}

/* ── Responsive ── */
@media (max-width: 900px) {
    .login-scene[b-ufbpn4bjiw] {
        flex-direction: column;
    }

    .login-left[b-ufbpn4bjiw] {
        flex: none;
        min-height: 200px;
        padding: 2rem;
    }

    .brand-logo[b-ufbpn4bjiw] {
        width: 400px;
    }

    .brand-tagline[b-ufbpn4bjiw] {
        font-size: var(--text-sm);
    }

    .left-decoration[b-ufbpn4bjiw] {
        display: none;
    }

    .login-right[b-ufbpn4bjiw] {
        flex: 1;
        padding: 2rem;
    }

    .login-right[b-ufbpn4bjiw]::before {
        display: none;
    }
}

@media (max-width: 480px) {
    .login-right[b-ufbpn4bjiw] {
        padding: 1.5rem;
    }

    .login-title[b-ufbpn4bjiw] {
        font-size: 1.5rem;
    }
}
/* _content/TimebookWeb/Components/Pages/MeinUrlaub.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   Mein Urlaub — MA-Ansicht
   ═══════════════════════════════════════════════ */

/* ── KPI-Leiste ── */
.kpi-row[b-ygwo7yp272] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
}

.kpi-card[b-ygwo7yp272] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
}

.kpi-icon[b-ygwo7yp272] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-md);
    font-size: var(--icon-lg);
    flex-shrink: 0;
}

.kpi-icon--anspruch[b-ygwo7yp272] {
    background: var(--surface-secondary);
    color: var(--text-secondary);
}

.kpi-icon--vorjahr[b-ygwo7yp272] {
    background: var(--status-info-light);
    color: var(--status-info);
}

.kpi-icon--genommen[b-ygwo7yp272] {
    background: var(--status-warning-light);
    color: var(--status-warning);
}

.kpi-icon--geplant[b-ygwo7yp272] {
    background: var(--status-info-light);
    color: var(--status-info);
}

.kpi-icon--verfuegbar[b-ygwo7yp272] {
    background: var(--status-success-light);
    color: var(--status-success);
}

.kpi-data[b-ygwo7yp272] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.kpi-number[b-ygwo7yp272] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    line-height: var(--leading-tight);
    letter-spacing: var(--tracking-tight);
}

.kpi-label[b-ygwo7yp272] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Filter-Toolbar ── */
.filter-toolbar[b-ygwo7yp272] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.filter-chips[b-ygwo7yp272] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-2xs);
}

/* ── Anträge-Liste ── */
.antraege-liste[b-ygwo7yp272] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

/* ── Antrag-Card ── */
.antrag-card[b-ygwo7yp272] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
}

.antrag-info[b-ygwo7yp272] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.antrag-header-row[b-ygwo7yp272] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    flex-wrap: wrap;
}

.antrag-datum-range[b-ygwo7yp272] {
    font-weight: var(--font-semibold);
    font-size: var(--text-sm-plus);
    color: var(--text-primary);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.antrag-details[b-ygwo7yp272] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.antrag-tage[b-ygwo7yp272] {
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.antrag-eingereicht[b-ygwo7yp272] {
    color: var(--text-tertiary);
}

.antrag-bemerkung[b-ygwo7yp272] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-style: italic;
}

.antrag-ablehnungsgrund[b-ygwo7yp272] {
    font-size: var(--text-xs);
    color: var(--dp-red-600, #dc2626);
    display: flex;
    align-items: center;
    gap: 4px;
}

.antrag-actions[b-ygwo7yp272] {
    display: flex;
    gap: var(--spacing-xs);
    flex-shrink: 0;
}

/* ── Status-farbige Card-Akzente ── */
[b-ygwo7yp272] .status-eingereicht {
    border-left: 3px solid var(--dp-blue-500, #3b82f6);
}

[b-ygwo7yp272] .status-genehmigt {
    border-left: 3px solid var(--dp-green-500, #22c55e);
}

[b-ygwo7yp272] .status-abgelehnt {
    border-left: 3px solid var(--dp-red-500, #ef4444);
}

[b-ygwo7yp272] .status-storniert {
    border-left: 3px solid var(--dp-slate-400, #94a3b8);
    opacity: 0.7;
}

/* ── Dialog ── */
.dialog-form[b-ygwo7yp272] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.form-row-2col[b-ygwo7yp272] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-md);
}

.form-arbeitstage[b-ygwo7yp272] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xs) var(--spacing-sm);
    background: var(--dp-green-50, #f0fdf4);
    border: 1px solid var(--dp-green-200, #bbf7d0);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    color: var(--dp-green-700, #15803d);
}

.dialog-confirm-text[b-ygwo7yp272] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: var(--leading-relaxed);
}

.dialog-footer[b-ygwo7yp272] {
    display: flex;
    justify-content: flex-end;
    gap: var(--spacing-sm);
}

/* ── Responsive: Tablet ── */
@media (max-width: 900px) {
    .kpi-row[b-ygwo7yp272] {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* ── Responsive: Mobile ── */
@media (max-width: 640px) {
    .kpi-row[b-ygwo7yp272] {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-sm);
    }

    .kpi-card[b-ygwo7yp272] {
        padding: var(--spacing-sm);
        gap: var(--spacing-sm);
    }

    .kpi-icon[b-ygwo7yp272] {
        width: 28px;
        height: 28px;
        font-size: var(--icon-sm);
        border-radius: var(--radius-sm);
    }

    .kpi-number[b-ygwo7yp272] {
        font-size: var(--text-lg);
    }

    .kpi-label[b-ygwo7yp272] {
        font-size: var(--text-xs);
    }

    .form-row-2col[b-ygwo7yp272] {
        grid-template-columns: 1fr;
    }

    .antrag-card[b-ygwo7yp272] {
        flex-wrap: wrap;
    }

    .antrag-actions[b-ygwo7yp272] {
        flex-basis: 100%;
        justify-content: flex-end;
        margin-top: var(--spacing-xs);
    }
}

/* ── Responsive: Extra-Small ── */
@media (max-width: 480px) {
    .kpi-row[b-ygwo7yp272] {
        grid-template-columns: 1fr;
    }

    .kpi-card[b-ygwo7yp272] {
        padding: var(--spacing-xs) var(--spacing-sm);
    }
}
/* _content/TimebookWeb/Components/Pages/Mitarbeiter.razor.rz.scp.css */
/* ══════════════════════════════════════════════
   MITARBEITER – Clean & Scannable
   ══════════════════════════════════════════════ */

/* ── KPI Strip (inline, kompakt) ── */
.kpi-strip[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-lg);
    padding: var(--spacing-md) var(--spacing-xl);
    background: var(--surface-primary);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    margin-bottom: var(--spacing-lg);
    box-shadow: var(--shadow-xs);
}

.kpi-item[b-5zv24wtyoc] {
    display: flex;
    align-items: baseline;
    gap: var(--spacing-sm);
}

.kpi-number[b-5zv24wtyoc] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.kpi-aktiv[b-5zv24wtyoc] { color: var(--dp-emerald-600); }
.kpi-inaktiv[b-5zv24wtyoc] { color: var(--dp-red-600); }

.kpi-text[b-5zv24wtyoc] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    letter-spacing: var(--tracking-wide);
    text-transform: uppercase;
}

.kpi-divider[b-5zv24wtyoc] {
    width: 1px;
    height: 24px;
    background: var(--border-default);
    flex-shrink: 0;
}

/* ── Toolbar ── */
.mitarbeiter-toolbar[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.mitarbeiter-chips[b-5zv24wtyoc] {
    display: flex;
    gap: var(--spacing-xs);
}

/* ── Mitarbeiter-Grid (Karten) ── */
.ma-grid[b-5zv24wtyoc] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
    gap: var(--spacing-lg);
}

.ma-card[b-5zv24wtyoc] {
    background: var(--surface-primary);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
    cursor: pointer;
    transition: box-shadow var(--transition-fast), border-color var(--transition-fast);
    box-shadow: var(--shadow-xs);
}

.ma-card:hover[b-5zv24wtyoc] {
    box-shadow: var(--shadow-sm);
    border-color: var(--border-default);
}

.ma-card--inaktiv[b-5zv24wtyoc] {
    opacity: 0.55;
}

.ma-card__top[b-5zv24wtyoc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--spacing-sm);
}

.ma-card__identity[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.ma-card__name[b-5zv24wtyoc] {
    font-weight: var(--font-semibold);
    font-size: var(--text-base);
    color: var(--text-primary);
    line-height: 1.3;
}

.ma-card__rolle[b-5zv24wtyoc] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-top: 1px;
}

.ma-card__details[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    padding-top: var(--spacing-sm);
    border-top: 1px solid var(--border-subtle);
}

.ma-card__detail[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--text-sm);
}

.ma-card__detail i[b-5zv24wtyoc] {
    font-size: 14px;
    color: var(--text-tertiary);
    flex-shrink: 0;
    width: 16px;
    text-align: center;
}

.ma-card__label[b-5zv24wtyoc] {
    color: var(--text-tertiary);
    min-width: 72px;
    flex-shrink: 0;
}

.ma-card__value[b-5zv24wtyoc] {
    color: var(--text-primary);
    font-weight: var(--font-medium);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.ma-card__footer[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding-top: var(--spacing-sm);
    border-top: 1px solid var(--border-subtle);
}

/* ── Dialog-Formular ── */
.dialog-form[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.form-row-2col[b-5zv24wtyoc] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-md);
}

/* ── Benutzerkonto-Sektion ── */
.konto-section[b-5zv24wtyoc] {
    border-top: 1px solid var(--border-subtle);
    padding-top: var(--spacing-md);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.konto-toggle[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--text-sm);
    color: var(--text-secondary);
    cursor: pointer;
    font-weight: var(--font-medium);
}

.konto-toggle input[type="checkbox"][b-5zv24wtyoc] {
    accent-color: var(--accent);
}

.konto-info[b-5zv24wtyoc] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm) var(--spacing-lg);
}

.konto-info-item[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.konto-info-item i[b-5zv24wtyoc] { font-size: 14px; }

.konto-info-item--warn[b-5zv24wtyoc] {
    color: var(--status-warning);
}

.konto-hint[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    background-color: var(--surface-secondary);
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-md);
}

.konto-hint i[b-5zv24wtyoc] {
    font-size: 16px;
    color: var(--accent);
}

/* ══════════════════════════════════════════════
   DETAILANSICHT
   ══════════════════════════════════════════════ */

.tab-content[b-5zv24wtyoc] {
    margin-top: var(--spacing-lg);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

/* ── Profil-Grid (kompakte Blöcke statt FormSections) ── */
.profil-grid[b-5zv24wtyoc] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-md);
}

.profil-block[b-5zv24wtyoc] {
    background: var(--surface-primary);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
    transition: box-shadow var(--transition-fast);
}

.profil-block:hover[b-5zv24wtyoc] {
    box-shadow: var(--shadow-sm);
}

.profil-block-label[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
}

.profil-block-label i[b-5zv24wtyoc] {
    font-size: 16px;
    color: var(--accent);
}

.profil-fields[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.profil-field[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.profil-field-label[b-5zv24wtyoc] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.profil-field-value[b-5zv24wtyoc] {
    font-size: var(--text-md);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

/* ── Notiz-Block ── */
.profil-notiz[b-5zv24wtyoc] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    padding: var(--spacing-md) var(--spacing-lg);
    background: var(--surface-secondary);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: var(--leading-relaxed);
}

.profil-notiz i[b-5zv24wtyoc] {
    font-size: 18px;
    color: var(--text-tertiary);
    flex-shrink: 0;
    margin-top: 1px;
}

/* ── Stundenhistorie ── */
.stunden-tabelle[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
}

.stunden-header[b-5zv24wtyoc] {
    display: grid;
    grid-template-columns: 120px 1fr 80px;
    gap: var(--spacing-md);
    padding: var(--spacing-sm) var(--spacing-md);
    font-weight: var(--font-semibold);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    border-bottom: 1px solid var(--border-default);
}

.stunden-row[b-5zv24wtyoc] {
    display: grid;
    grid-template-columns: 120px 1fr 80px;
    gap: var(--spacing-md);
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    transition: background var(--transition-fast);
}

.stunden-row:hover[b-5zv24wtyoc] {
    background: var(--surface-secondary);
}

/* ── Detail-Sidebar ── */
.sidebar-header[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-sm);
    text-align: center;
}

.sidebar-name[b-5zv24wtyoc] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.sidebar-stat-grid[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.sidebar-stat[b-5zv24wtyoc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-md);
    background: var(--surface-secondary);
}

.sidebar-stat-label[b-5zv24wtyoc] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.sidebar-stat-value[b-5zv24wtyoc] {
    font-size: var(--text-md);
    font-weight: var(--font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
}

.sidebar-stat-value.positiv[b-5zv24wtyoc] { color: var(--dp-emerald-600); }
.sidebar-stat-value.negativ[b-5zv24wtyoc] { color: var(--dp-red-600); }

.sidebar-footer-actions[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

/* ══════════════════════════════════════════════
   EXPORT-DIALOG
   ══════════════════════════════════════════════ */

.export-dialog[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.export-info[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-sm);
    color: var(--text-secondary);
    background: var(--surface-secondary);
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-md);
}

.export-info i[b-5zv24wtyoc] {
    font-size: 16px;
    color: var(--accent);
    flex-shrink: 0;
}

.export-actions-top[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.export-actions-label[b-5zv24wtyoc] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin-right: auto;
}

.export-link-btn[b-5zv24wtyoc] {
    background: none;
    border: none;
    padding: 0;
    font-size: var(--text-sm);
    color: var(--accent);
    cursor: pointer;
    font-family: inherit;
}

.export-link-btn:hover[b-5zv24wtyoc] {
    text-decoration: underline;
}

.export-link-sep[b-5zv24wtyoc] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.export-spalten-grid[b-5zv24wtyoc] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-xs) var(--spacing-lg);
}

.export-spalte-label[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--text-sm);
    color: var(--text-primary);
    cursor: pointer;
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast);
}

.export-spalte-label:hover[b-5zv24wtyoc] {
    background: var(--surface-secondary);
}

.export-spalte-label input[type="checkbox"][b-5zv24wtyoc] {
    accent-color: var(--accent);
    flex-shrink: 0;
}

/* ══════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════ */

@media (min-width: 768px) {
    .mitarbeiter-toolbar[b-5zv24wtyoc]  .ui-search-box {
        flex: 1;
        max-width: 360px;
    }
}

@media (max-width: 768px) {
    .kpi-strip[b-5zv24wtyoc] {
        flex-wrap: wrap;
        justify-content: center;
    }

    .kpi-divider[b-5zv24wtyoc] {
        display: none;
    }

    .mitarbeiter-toolbar[b-5zv24wtyoc] {
        flex-direction: column;
        align-items: stretch;
    }

    .ma-grid[b-5zv24wtyoc] {
        grid-template-columns: 1fr;
    }

    .profil-grid[b-5zv24wtyoc] {
        grid-template-columns: 1fr;
    }

    .form-row-2col[b-5zv24wtyoc] {
        grid-template-columns: 1fr;
    }

    .stunden-header[b-5zv24wtyoc],
    .stunden-row[b-5zv24wtyoc] {
        grid-template-columns: 90px 1fr 60px;
    }
}
/* _content/TimebookWeb/Components/Pages/PasswortAendern.razor.rz.scp.css */
.login-card[b-44zlbymhcr] {
    width: 100%;
    max-width: 400px;
    background-color: var(--surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-lg);
    padding: var(--spacing-2xl);
}

.login-header[b-44zlbymhcr] {
    text-align: center;
    margin-bottom: var(--spacing-2xl);
}

[b-44zlbymhcr] .login-icon {
    color: var(--accent);
    font-size: 48px;
    margin-bottom: var(--spacing-md);
}

.login-title[b-44zlbymhcr] {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin: 0;
}

.login-subtitle[b-44zlbymhcr] {
    font-size: var(--text-md);
    color: var(--text-secondary);
    margin: var(--spacing-xs) 0 0;
}

.login-form[b-44zlbymhcr] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

.login-input[b-44zlbymhcr] {
    width: 100%;
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--text-md);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    background-color: var(--surface-primary);
    color: var(--text-primary);
    outline: none;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.login-input:focus[b-44zlbymhcr] {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(var(--accent-rgb), 0.1);
}

.login-input[b-44zlbymhcr]::placeholder {
    color: var(--text-tertiary);
}

[b-44zlbymhcr] .login-button {
    width: 100%;
    margin-top: var(--spacing-sm);
}
/* _content/TimebookWeb/Components/Pages/Protokoll.razor.rz.scp.css */
/* ══════════════════════════════════════════════
   Systemprotokoll — Admin Log Viewer
   ══════════════════════════════════════════════ */

/* ── Filter-Leiste ── */
.protokoll-filter[b-pcgy91hxv9] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-md);
    align-items: flex-end;
    padding: var(--spacing-lg);
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
    margin-bottom: var(--spacing-lg);
}

.protokoll-filter__field[b-pcgy91hxv9] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    min-width: 140px;
}

.protokoll-filter__field--grow[b-pcgy91hxv9] {
    flex: 1;
    min-width: 200px;
}

.protokoll-filter__label[b-pcgy91hxv9] {
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
}

.protokoll-filter__select[b-pcgy91hxv9],
.protokoll-filter__input[b-pcgy91hxv9] {
    height: 2.125rem;
    padding: 0 var(--spacing-sm);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    font-size: var(--text-base);
    font-family: var(--font-family);
    background: var(--surface-primary);
    color: var(--text-primary);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.protokoll-filter__select:focus[b-pcgy91hxv9],
.protokoll-filter__input:focus[b-pcgy91hxv9] {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 2px var(--accent-light);
}

.protokoll-filter__actions[b-pcgy91hxv9] {
    display: flex;
    gap: var(--spacing-sm);
    align-items: flex-end;
}

/* ── Info-Leiste ── */
.protokoll-info[b-pcgy91hxv9] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    font-size: var(--text-base);
    color: var(--text-secondary);
    margin-bottom: var(--spacing-md);
}

.protokoll-info__page[b-pcgy91hxv9] {
    color: var(--text-tertiary);
}

.protokoll-info__cleanup[b-pcgy91hxv9] {
    margin-left: auto;
}

/* ── Tabelle ── */
.protokoll-table-wrapper[b-pcgy91hxv9] {
    overflow-x: auto;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
}

.protokoll-table[b-pcgy91hxv9] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-base);
}

.protokoll-table thead[b-pcgy91hxv9] {
    background: var(--surface-secondary);
}

.protokoll-table th[b-pcgy91hxv9] {
    padding: var(--spacing-md) var(--spacing-lg);
    text-align: left;
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    border-bottom: 2px solid var(--border-default);
}

.protokoll-th--zeit[b-pcgy91hxv9] { width: 155px; }
.protokoll-th--level[b-pcgy91hxv9] { width: 100px; }
.protokoll-th--quelle[b-pcgy91hxv9] { width: 150px; }
.protokoll-th--benutzer[b-pcgy91hxv9] { width: 120px; }

.protokoll-row[b-pcgy91hxv9] {
    cursor: pointer;
    transition: background var(--transition-fast);
}

.protokoll-row:hover[b-pcgy91hxv9] {
    background: var(--surface-secondary);
}

.protokoll-row--selected[b-pcgy91hxv9] {
    background: var(--accent-light);
}

.protokoll-row td[b-pcgy91hxv9] {
    padding: var(--spacing-sm) var(--spacing-lg);
    border-bottom: 1px solid var(--border-subtle);
    vertical-align: top;
}

.protokoll-cell--zeit[b-pcgy91hxv9] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    color: var(--text-secondary);
    font-size: var(--text-sm-plus);
}

.protokoll-cell--quelle[b-pcgy91hxv9] {
    font-family: 'SF Mono', 'Cascadia Code', 'Fira Code', monospace;
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.protokoll-cell--nachricht[b-pcgy91hxv9] {
    word-break: break-word;
    color: var(--text-primary);
}

.protokoll-cell--benutzer[b-pcgy91hxv9] {
    color: var(--text-tertiary);
}

/* ── Detail-Zeile ── */
.protokoll-detail-row td[b-pcgy91hxv9] {
    padding: 0 !important;
    background: var(--surface-secondary);
    border-bottom: 2px solid var(--border-default);
}

.protokoll-detail[b-pcgy91hxv9] {
    padding: var(--spacing-lg) var(--spacing-xl);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

.protokoll-detail__section strong[b-pcgy91hxv9] {
    display: block;
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    color: var(--text-secondary);
    margin-bottom: var(--spacing-xs);
}

.protokoll-detail__section p[b-pcgy91hxv9] {
    margin: 0;
    color: var(--text-primary);
    font-size: var(--text-base);
    line-height: var(--leading-relaxed);
}

.protokoll-detail__pre[b-pcgy91hxv9] {
    margin: 0;
    padding: var(--spacing-lg);
    background: var(--dp-slate-900);
    color: var(--dp-slate-100);
    border-radius: var(--radius-md);
    font-family: 'SF Mono', 'Cascadia Code', 'Fira Code', monospace;
    font-size: var(--text-sm);
    overflow-x: auto;
    white-space: pre-wrap;
    word-break: break-all;
    max-height: 400px;
    overflow-y: auto;
    line-height: var(--leading-relaxed);
}

/* ── GPS-Detail-Box ── */

.protokoll-gps-detail[b-pcgy91hxv9] {
    background: var(--dp-amber-50, #fffbeb);
    border: 1px solid var(--dp-amber-200, #fde68a);
    border-radius: var(--radius-md);
    padding: var(--spacing-md);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.protokoll-gps-detail__header[b-pcgy91hxv9] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    color: var(--dp-amber-700, #b45309);
    font-size: var(--text-sm);
}

.protokoll-gps-detail__grid[b-pcgy91hxv9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-xs) var(--spacing-lg);
}

.protokoll-gps-detail__item[b-pcgy91hxv9] {
    display: flex;
    flex-direction: column;
}

.protokoll-gps-detail__label[b-pcgy91hxv9] {
    font-size: var(--text-xs);
    color: var(--dp-slate-500, #64748b);
    font-weight: var(--font-medium);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.protokoll-gps-detail__value[b-pcgy91hxv9] {
    font-size: var(--text-sm);
    color: var(--dp-slate-800, #1e293b);
    font-weight: var(--font-semibold);
    font-variant-numeric: tabular-nums;
}

.protokoll-gps-detail__value--danger[b-pcgy91hxv9] {
    color: var(--dp-red-600, #dc2626);
}

.protokoll-gps-detail__link[b-pcgy91hxv9] {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--dp-blue-600, #2563eb);
    text-decoration: none;
    margin-top: var(--spacing-xs);
}

.protokoll-gps-detail__link:hover[b-pcgy91hxv9] {
    color: var(--dp-blue-800, #1e40af);
    text-decoration: underline;
}

/* ── Pagination ── */
.protokoll-pagination[b-pcgy91hxv9] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-lg);
    padding: var(--spacing-lg) 0;
}

.protokoll-pagination__info[b-pcgy91hxv9] {
    font-size: var(--text-base);
    color: var(--text-secondary);
}

/* ── Lösch-Dialog ── */
.protokoll-dialog-backdrop[b-pcgy91hxv9] {
    position: fixed;
    inset: 0;
    background: var(--surface-overlay);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal);
}

.protokoll-dialog[b-pcgy91hxv9] {
    background: var(--surface-primary);
    border-radius: var(--radius-xl);
    padding: var(--spacing-xl);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
}

.protokoll-dialog__icon[b-pcgy91hxv9] {
    font-size: var(--icon-4xl);
    color: var(--status-warning);
    margin-bottom: var(--spacing-sm);
}

.protokoll-dialog h4[b-pcgy91hxv9] {
    margin: 0 0 var(--spacing-sm);
    color: var(--text-primary);
    font-weight: var(--font-semibold);
}

.protokoll-dialog p[b-pcgy91hxv9] {
    color: var(--text-secondary);
    margin: 0 0 var(--spacing-xl);
    font-size: var(--text-base);
}

.protokoll-dialog__actions[b-pcgy91hxv9] {
    display: flex;
    gap: var(--spacing-sm);
    justify-content: center;
}

/* ── Loading ── */
.protokoll-loading[b-pcgy91hxv9] {
    padding: var(--spacing-3xl);
    text-align: center;
    color: var(--text-tertiary);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-sm);
    font-size: var(--text-md);
}

[b-pcgy91hxv9] .protokoll-spinner {
    animation: spin-b-pcgy91hxv9 1s linear infinite;
}

@keyframes spin-b-pcgy91hxv9 {
    to { transform: rotate(360deg); }
}
/* _content/TimebookWeb/Components/Pages/Schlechtwetter.razor.rz.scp.css */
/* ══════════════════════════════════════════════
   Schlechtwetter — S-KUG Dokumentation
   ══════════════════════════════════════════════ */

/* ── Saison-Header ── */
.sw-saison-header[b-etp39pfnua] {
    margin-bottom: var(--spacing-lg);
}

.sw-saison-nav[b-etp39pfnua] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-md);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
}

.nav-arrow[b-etp39pfnua] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    background: var(--surface-primary);
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
    font-size: var(--text-sm);
}

.nav-arrow:hover[b-etp39pfnua] {
    border-color: var(--accent);
    color: var(--accent);
    background: var(--accent-light);
}

.sw-saison-titel[b-etp39pfnua] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    color: var(--text-primary);
}

.sw-saison-range[b-etp39pfnua] {
    font-size: var(--text-sm);
    font-weight: var(--font-normal);
    color: var(--text-secondary);
}

/* ── KPI-Karten ── */
.kpi-row[b-etp39pfnua] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
}

.kpi-card[b-etp39pfnua] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
}

.kpi-icon[b-etp39pfnua] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-md);
    font-size: var(--icon-lg);
    flex-shrink: 0;
}

.kpi-icon--ausfall[b-etp39pfnua] {
    background: var(--status-danger-light, #fef2f2);
    color: var(--status-danger, #dc2626);
}

.kpi-icon--stunden[b-etp39pfnua] {
    background: var(--status-info-light);
    color: var(--status-info);
}

.kpi-icon--ma[b-etp39pfnua] {
    background: var(--status-success-light);
    color: var(--status-success);
}

.kpi-icon--grund[b-etp39pfnua] {
    background: var(--status-warning-light);
    color: var(--status-warning);
}

.kpi-data[b-etp39pfnua] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.kpi-number[b-etp39pfnua] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    line-height: var(--leading-tight);
    letter-spacing: var(--tracking-tight);
}

.kpi-label[b-etp39pfnua] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Kalender-Card ── */
.sw-kalender-card[b-etp39pfnua] {
    margin-bottom: var(--spacing-lg);
}

.sw-monate-grid[b-etp39pfnua] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-lg);
}

.sw-monat[b-etp39pfnua] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.sw-monat-header[b-etp39pfnua] {
    font-size: var(--text-base);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    text-transform: capitalize;
    padding-bottom: var(--spacing-xs);
    border-bottom: 1px solid var(--border-subtle);
}

.sw-monat-kalender[b-etp39pfnua] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 3px;
}

.mk-header[b-etp39pfnua] {
    text-align: center;
    font-size: var(--text-xs);
    font-weight: var(--font-bold);
    text-transform: uppercase;
    letter-spacing: var(--tracking-widest);
    color: var(--text-secondary);
    padding-bottom: var(--spacing-xs);
}

.mk-header--we[b-etp39pfnua] {
    color: var(--text-tertiary);
}

.mk-zelle[b-etp39pfnua] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: var(--spacing-xs) 2px;
    background: var(--surface-primary);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    min-height: 56px;
    transition: all var(--transition-fast);
    position: relative;
}

.mk-zelle--leer[b-etp39pfnua] {
    background: transparent;
    border-color: transparent;
}

.mk-zelle--we[b-etp39pfnua] {
    opacity: 0.35;
    background: var(--surface-secondary);
}

.mk-zelle--ausfall[b-etp39pfnua] {
    background: var(--dp-blue-50, #eff6ff);
    border-color: var(--dp-blue-200, #bfdbfe);
    box-shadow: var(--shadow-xs);
}

.mk-zelle--ausfall:hover[b-etp39pfnua] {
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}

.mk-tag[b-etp39pfnua] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
}

.mk-ausfall-icon[b-etp39pfnua] {
    font-size: var(--text-xs);
    color: var(--dp-blue-500, #3b82f6);
    line-height: 1;
}

.mk-stunden[b-etp39pfnua] {
    font-size: var(--text-xs);
    font-weight: var(--font-bold);
    font-variant-numeric: tabular-nums;
}

.mk-stunden--ausfall[b-etp39pfnua] {
    color: var(--dp-blue-600, #2563eb);
}

/* ── MA-Tabelle ── */
.sw-ma-card[b-etp39pfnua] {
    margin-bottom: var(--spacing-lg);
}

.sw-ma-tabelle[b-etp39pfnua] {
    display: flex;
    flex-direction: column;
}

.sw-ma-row[b-etp39pfnua] {
    display: grid;
    grid-template-columns: 1fr repeat(4, 80px) 90px;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    border-bottom: 1px solid var(--border-subtle);
}

.sw-ma-row:last-child[b-etp39pfnua] {
    border-bottom: none;
}

.sw-ma-row:hover:not(.sw-ma-row--header):not(.sw-ma-row--footer)[b-etp39pfnua] {
    background: var(--surface-secondary);
}

.sw-ma-row--header[b-etp39pfnua] {
    font-size: var(--text-sm);
    font-weight: var(--font-bold);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--text-secondary);
    border-bottom: 2px solid var(--border-default);
    padding-bottom: var(--spacing-sm);
}

.sw-ma-row--footer[b-etp39pfnua] {
    font-weight: var(--font-bold);
    border-top: 2px solid var(--border-default);
    border-bottom: none;
    padding-top: var(--spacing-sm);
    color: var(--text-primary);
}

.sw-ma-name[b-etp39pfnua] {
    font-weight: var(--font-medium);
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sw-ma-monat[b-etp39pfnua] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
}

.sw-ma-summe[b-etp39pfnua] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: var(--font-bold);
    color: var(--text-primary);
}

/* ── Detail-Liste ── */
.sw-detail-card[b-etp39pfnua] {
    margin-bottom: var(--spacing-lg);
}

.sw-detail-liste[b-etp39pfnua] {
    display: flex;
    flex-direction: column;
}

.sw-detail-row[b-etp39pfnua] {
    display: grid;
    grid-template-columns: 90px 1fr 1fr 70px 1fr auto 40px;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    border-bottom: 1px solid var(--border-subtle);
}

.sw-detail-row:last-child[b-etp39pfnua] {
    border-bottom: none;
}

.sw-detail-row:hover:not(.sw-detail-row--header)[b-etp39pfnua] {
    background: var(--surface-secondary);
}

.sw-detail-row--header[b-etp39pfnua] {
    font-size: var(--text-sm);
    font-weight: var(--font-bold);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--text-secondary);
    border-bottom: 2px solid var(--border-default);
    padding-bottom: var(--spacing-sm);
}

.sw-detail-datum[b-etp39pfnua] {
    font-variant-numeric: tabular-nums;
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.sw-detail-ma[b-etp39pfnua] {
    font-weight: var(--font-medium);
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sw-detail-grund[b-etp39pfnua] {
    min-width: 0;
}

.sw-detail-stunden[b-etp39pfnua] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.sw-detail-baustelle[b-etp39pfnua] {
    color: var(--text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sw-detail-art[b-etp39pfnua] {
    text-align: right;
}

.sw-detail-aktionen[b-etp39pfnua] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.sw-detail-aktionen[b-etp39pfnua]  .ui-btn {
    color: var(--text-tertiary);
    transition: color var(--transition-fast);
}

.sw-detail-aktionen[b-etp39pfnua]  .ui-btn:hover {
    color: var(--status-danger);
}

/* ── Erfassungs-Formular ── */
.sw-erfassung-card[b-etp39pfnua] {
    background: var(--surface-secondary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
    box-shadow: var(--shadow-sm);
}

.sw-erfassung-form[b-etp39pfnua] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.sw-ausfall-art[b-etp39pfnua] {
    display: flex;
    gap: var(--spacing-lg);
    align-items: center;
}

.sw-radio[b-etp39pfnua] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    cursor: pointer;
    font-size: var(--text-sm);
    color: var(--text-primary);
}

.sw-radio input[type="radio"][b-etp39pfnua] {
    accent-color: var(--accent);
}

.sw-teil-felder[b-etp39pfnua] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-md);
}

.sw-ma-auswahl[b-etp39pfnua] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.sw-alle-toggle[b-etp39pfnua] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    cursor: pointer;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--accent);
    padding-bottom: var(--spacing-xs);
    border-bottom: 1px solid var(--border-subtle);
}

.sw-alle-toggle input[type="checkbox"][b-etp39pfnua] {
    accent-color: var(--accent);
}

.sw-ma-checkboxen[b-etp39pfnua] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-xs) var(--spacing-md);
}

.sw-ma-checkbox[b-etp39pfnua] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    cursor: pointer;
    font-size: var(--text-sm);
    color: var(--text-primary);
    padding: var(--spacing-2xs) 0;
}

.sw-ma-checkbox input[type="checkbox"][b-etp39pfnua] {
    accent-color: var(--accent);
}

.sw-ma-urlaub[b-etp39pfnua] {
    opacity: 0.7;
}

.sw-erfassung-actions[b-etp39pfnua] {
    display: flex;
    justify-content: flex-end;
    gap: var(--spacing-sm);
    padding-top: var(--spacing-sm);
    border-top: 1px solid var(--border-subtle);
}

/* ── Info-Box ── */
.sw-info-card[b-etp39pfnua] {
    margin-bottom: var(--spacing-lg);
}

.sw-info-box[b-etp39pfnua] {
    display: flex;
    gap: var(--spacing-md);
    padding: var(--spacing-sm);
}

.sw-info-icon[b-etp39pfnua] {
    flex-shrink: 0;
    color: var(--status-info);
}

.sw-info-content h4[b-etp39pfnua] {
    font-size: var(--text-base);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin: 0 0 var(--spacing-sm) 0;
}

.sw-info-content ul[b-etp39pfnua] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.sw-info-content li[b-etp39pfnua] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    padding-left: var(--spacing-md);
    position: relative;
}

.sw-info-content li[b-etp39pfnua]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 5px;
    height: 5px;
    background: var(--status-info);
    border-radius: var(--radius-full);
}

.sw-info-content li strong[b-etp39pfnua] {
    color: var(--text-primary);
}

/* ── Export-Bar ── */
.sw-export-bar[b-etp39pfnua] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: var(--spacing-lg);
}

/* ══════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════ */

@media (max-width: 900px) {
    .kpi-row[b-etp39pfnua] {
        grid-template-columns: repeat(2, 1fr);
    }

    .sw-monate-grid[b-etp39pfnua] {
        grid-template-columns: 1fr;
    }

    .sw-detail-row[b-etp39pfnua] {
        grid-template-columns: 80px 1fr 70px auto 40px;
    }

    .sw-detail-ma[b-etp39pfnua],
    .sw-detail-baustelle[b-etp39pfnua] {
        display: none;
    }

    .sw-ma-row[b-etp39pfnua] {
        grid-template-columns: 1fr repeat(4, 60px) 70px;
    }

    .sw-ma-checkboxen[b-etp39pfnua] {
        grid-template-columns: repeat(2, 1fr);
    }

    .sw-teil-felder[b-etp39pfnua] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    /* Saison-Header: kompakter */
    .sw-saison-nav[b-etp39pfnua] {
        gap: var(--spacing-sm);
        padding: var(--spacing-xs) var(--spacing-sm);
    }

    .sw-saison-titel[b-etp39pfnua] {
        flex-direction: column;
        gap: var(--spacing-2xs);
        font-size: var(--text-base);
        text-align: center;
    }

    .sw-saison-range[b-etp39pfnua] {
        font-size: var(--text-xs);
    }

    .nav-arrow[b-etp39pfnua] {
        width: 36px;
        height: 36px;
    }

    /* KPI */
    .kpi-row[b-etp39pfnua] {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-sm);
    }

    .kpi-card[b-etp39pfnua] {
        padding: var(--spacing-sm);
        gap: var(--spacing-sm);
    }

    .kpi-icon[b-etp39pfnua] {
        width: 28px;
        height: 28px;
        font-size: var(--icon-sm);
        border-radius: var(--radius-sm);
    }

    .kpi-number[b-etp39pfnua] {
        font-size: var(--text-lg);
    }

    .kpi-label[b-etp39pfnua] {
        font-size: var(--text-xs);
    }

    /* Kalender: kompakter */
    .mk-zelle[b-etp39pfnua] {
        padding: 2px;
        min-height: 44px;
        gap: 1px;
    }

    .mk-tag[b-etp39pfnua] {
        font-size: var(--text-xs);
    }

    .mk-stunden[b-etp39pfnua] {
        font-size: 0.625rem;
    }

    .mk-ausfall-icon[b-etp39pfnua] {
        font-size: 0.625rem;
    }

    /* MA-Tabelle: scrollbar */
    .sw-ma-tabelle[b-etp39pfnua] {
        overflow-x: auto;
    }

    .sw-ma-row[b-etp39pfnua] {
        grid-template-columns: 120px repeat(4, 55px) 65px;
        font-size: var(--text-sm);
        padding: var(--spacing-xs) var(--spacing-sm);
        min-width: 480px;
    }

    /* Detail-Liste: vereinfacht */
    .sw-detail-row[b-etp39pfnua] {
        grid-template-columns: 80px 1fr 55px 40px;
        gap: var(--spacing-xs);
        padding: var(--spacing-xs) var(--spacing-sm);
    }

    .sw-detail-grund[b-etp39pfnua],
    .sw-detail-art[b-etp39pfnua],
    .sw-detail-ma[b-etp39pfnua],
    .sw-detail-baustelle[b-etp39pfnua] {
        display: none;
    }

    /* Erfassung: kompakter */
    .sw-erfassung-card[b-etp39pfnua] {
        padding: var(--spacing-md);
    }

    .sw-ma-checkboxen[b-etp39pfnua] {
        grid-template-columns: 1fr;
    }

    .sw-ausfall-art[b-etp39pfnua] {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--spacing-sm);
    }

    .sw-erfassung-actions[b-etp39pfnua] {
        flex-direction: column;
    }

    .sw-erfassung-actions[b-etp39pfnua]  .ui-btn {
        width: 100%;
    }

    /* Info-Box: vertikal */
    .sw-info-box[b-etp39pfnua] {
        flex-direction: column;
        gap: var(--spacing-sm);
    }

    /* Export */
    .sw-export-bar[b-etp39pfnua] {
        justify-content: stretch;
    }

    .sw-export-bar[b-etp39pfnua]  .ui-btn {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .kpi-row[b-etp39pfnua] {
        grid-template-columns: 1fr;
    }

    .mk-zelle[b-etp39pfnua] {
        min-height: 36px;
        padding: 1px;
    }

    .mk-tag[b-etp39pfnua] {
        font-size: 0.625rem;
    }

    .sw-ma-row[b-etp39pfnua] {
        grid-template-columns: 100px repeat(4, 48px) 58px;
        font-size: var(--text-xs);
    }
}
/* _content/TimebookWeb/Components/Pages/Stundenzettel.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   Stundenzettel — Compact admin view
   Soft grays, tight spacing, clean lines
   ═══════════════════════════════════════════════ */

/* ── Monats-Navigation ── */
.monat-nav[b-0o43tw4z1n] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}

.monat-label[b-0o43tw4z1n] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    min-width: 140px;
    text-align: center;
    letter-spacing: var(--tracking-wide);
    text-transform: capitalize;
}

/* ── Toolbar ── */
.stundenzettel-toolbar[b-0o43tw4z1n] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.stundenzettel-toolbar[b-0o43tw4z1n]  .ui-search-box {
    flex: 1;
    max-width: 280px;
}

.filter-chips[b-0o43tw4z1n] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-2xs);
}

/* ── KPI-Leiste ── */
.kpi-row[b-0o43tw4z1n] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}

[b-0o43tw4z1n] .kpi-card {
    text-align: center;
}

.kpi-value[b-0o43tw4z1n] {
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    line-height: var(--leading-tight);
}

.kpi-label[b-0o43tw4z1n] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    margin-top: 2px;
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
}

/* ── Mitarbeiter-Tabelle (kompakt) ── */
.sz-tabelle-wrapper[b-0o43tw4z1n] {
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-xs);
}

.sz-tabelle[b-0o43tw4z1n] {
    width: 100%;
    border-collapse: collapse;
}

.sz-tabelle thead[b-0o43tw4z1n] {
    background: var(--surface-secondary);
}

.sz-tabelle th[b-0o43tw4z1n] {
    padding: var(--spacing-sm) var(--spacing-md);
    text-align: left;
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    border-bottom: 2px solid var(--border-default);
    white-space: nowrap;
}

.sz-th--ma[b-0o43tw4z1n] { width: 30%; }
.sz-th--rolle[b-0o43tw4z1n] { width: 10%; }
.sz-th--tage[b-0o43tw4z1n] { width: 7%; text-align: center; }
.sz-th--stunden[b-0o43tw4z1n] { width: 12%; text-align: right; }
.sz-th--zuschlag[b-0o43tw4z1n] { width: 10%; text-align: right; }
.sz-th--urlaub[b-0o43tw4z1n] { width: 8%; text-align: center; }
.sz-th--bearbeitet[b-0o43tw4z1n] { width: 10%; }
.sz-th--aktionen[b-0o43tw4z1n] { width: 110px; }

.sz-ma-row[b-0o43tw4z1n] {
    cursor: pointer;
    transition: background var(--transition-fast);
}

.sz-ma-row:hover[b-0o43tw4z1n] {
    background: var(--surface-secondary);
}

.sz-ma-row--open[b-0o43tw4z1n] {
    background: var(--accent-light);
}

.sz-ma-row--highlight[b-0o43tw4z1n],
.sz-ma-row--highlight:hover[b-0o43tw4z1n] {
    background: rgba(124,58,237,0.08) !important;
}

.sz-eintrag--highlight td[b-0o43tw4z1n],
.sz-eintrag--highlight:hover td[b-0o43tw4z1n] {
    background: rgba(124,58,237,0.08) !important;
}

.sz-ma-row td[b-0o43tw4z1n] {
    padding: var(--spacing-xs) var(--spacing-md);
    border-bottom: 1px solid var(--border-subtle);
    vertical-align: middle;
}

.sz-cell--ma[b-0o43tw4z1n] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.sz-ma-name[b-0o43tw4z1n] {
    font-weight: var(--font-semibold);
    font-size: var(--text-sm-plus);
    color: var(--text-primary);
    white-space: nowrap;
}

.sz-cell--rolle[b-0o43tw4z1n] {
    /* badge handles styling */
}

.sz-cell--tage[b-0o43tw4z1n] {
    text-align: center;
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
    font-size: var(--text-sm-plus);
}

.sz-cell--stunden[b-0o43tw4z1n] {
    text-align: right;
    font-weight: var(--font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    font-size: var(--text-md);
}

.sz-cell--zuschlag[b-0o43tw4z1n] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    color: var(--status-warning);
    font-size: var(--text-sm-plus);
    font-weight: var(--font-medium);
}

.sz-cell--urlaub[b-0o43tw4z1n] {
    text-align: center;
}

.kpi-value--urlaub[b-0o43tw4z1n] {
    color: var(--dp-blue-600, #2563eb);
}

.sz-cell--muted[b-0o43tw4z1n] {
    color: var(--text-tertiary);
}

.sz-cell--bearbeitet[b-0o43tw4z1n] {
    /* badge handles styling */
}

.sz-cell--aktionen[b-0o43tw4z1n] {
    display: flex;
    align-items: center;
    gap: 0;
    justify-content: flex-end;
}

.sz-expand-toggle[b-0o43tw4z1n] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    cursor: pointer;
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast);
}

.sz-expand-toggle:hover[b-0o43tw4z1n] {
    background: var(--surface-secondary);
}

.toggle-icon[b-0o43tw4z1n] {
    color: var(--text-tertiary);
    font-size: var(--icon-sm);
}

/* ── Detail-Zeile (expandiert) ── */
.sz-detail-row > td[b-0o43tw4z1n] {
    padding: 0 !important;
    background: var(--surface-secondary);
    border-bottom: 2px solid var(--border-default);
}

/* ── Detail (aufgeklappt) ── */
.ma-detail[b-0o43tw4z1n] {
    padding-top: var(--spacing-sm);
    margin-top: var(--spacing-sm);
    border-top: 1px solid var(--border-subtle);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

/* ── KW-Gruppe ── */
.kw-gruppe[b-0o43tw4z1n] {
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.kw-header[b-0o43tw4z1n] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-xs) var(--spacing-sm);
    background: var(--surface-secondary);
    border-bottom: 1px solid var(--border-subtle);
}

.kw-header--eingereicht[b-0o43tw4z1n] {
    background: var(--dp-blue-50, #eff6ff);
    border-bottom-color: var(--dp-blue-200, #bfdbfe);
}

.kw-header--bestaetigt[b-0o43tw4z1n] {
    background: var(--dp-green-50, #f0fdf4);
    border-bottom-color: var(--dp-green-200, #bbf7d0);
}

.kw-header--abgelehnt[b-0o43tw4z1n] {
    background: var(--dp-red-50, #fef2f2);
    border-bottom-color: var(--dp-red-200, #fecaca);
}

.kw-label[b-0o43tw4z1n] {
    font-weight: var(--font-bold);
    font-size: var(--text-sm-plus);
    color: var(--text-primary);
    white-space: nowrap;
}

.kw-soll-info[b-0o43tw4z1n] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-variant-numeric: tabular-nums;
}

.kw-spacer[b-0o43tw4z1n] {
    flex: 1;
}

.kw-admin-kommentar[b-0o43tw4z1n] {
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-tertiary, var(--text-secondary));
    font-style: italic;
}

.kw-actions[b-0o43tw4z1n] {
    display: flex;
    gap: var(--spacing-xs);
}

.kw-gruppe .detail-tabelle[b-0o43tw4z1n] {
    margin-bottom: 0;
}

.kw-keine-eintraege[b-0o43tw4z1n] {
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    font-style: italic;
}

.kw-zusammenfassung[b-0o43tw4z1n] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-xs) var(--spacing-sm);
    background: var(--dp-slate-50);
    font-size: var(--text-sm);
    font-variant-numeric: tabular-nums;
    border-top: 1px solid var(--border-subtle);
}

/* ── Detail-Tabelle ── */
.detail-tabelle[b-0o43tw4z1n] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-sm);
    margin-bottom: var(--spacing-sm);
}

.detail-tabelle th[b-0o43tw4z1n] {
    text-align: left;
    padding: 4px var(--spacing-sm);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
    border-bottom: 1px solid var(--border-default);
    white-space: nowrap;
}

.detail-tabelle td[b-0o43tw4z1n] {
    padding: 3px var(--spacing-sm);
    border-bottom: 1px solid var(--border-subtle);
    color: var(--text-primary);
    line-height: var(--leading-snug);
}

.detail-tabelle tbody tr:nth-child(even)[b-0o43tw4z1n] {
    background: var(--dp-slate-50);
}

.detail-tabelle tbody tr:hover[b-0o43tw4z1n] {
    background: var(--dp-blue-50);
}

.beginn-zelle[b-0o43tw4z1n],
.ende-zelle[b-0o43tw4z1n] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    color: var(--text-secondary);
    font-size: var(--text-xs);
}

.brutto-zelle[b-0o43tw4z1n] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    color: var(--text-tertiary);
    font-size: var(--text-xs);
}

.pause-zelle[b-0o43tw4z1n] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    color: var(--text-tertiary);
    font-size: var(--text-xs);
}

.netto-zelle[b-0o43tw4z1n] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.bemerkung-zelle[b-0o43tw4z1n] {
    color: var(--text-tertiary);
    font-style: italic;
    font-size: var(--text-xs);
}

/* ── Baustellen-Aufteilung ── */
.baustellen-aufteilung[b-0o43tw4z1n] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-xs);
    padding-top: var(--spacing-xs);
    border-top: 1px solid var(--border-subtle);
}

.aufteilung-label[b-0o43tw4z1n] {
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
}

.aufteilung-item[b-0o43tw4z1n] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: var(--text-xs);
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
}

/* ── Zusammenfassung (Detail + Dialog) ── */
.detail-zusammenfassung[b-0o43tw4z1n],
.form-zusammenfassung[b-0o43tw4z1n] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-xs) var(--spacing-sm);
    background: var(--dp-slate-50);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-subtle);
    font-size: var(--text-sm);
    font-variant-numeric: tabular-nums;
}

.detail-zusammenfassung[b-0o43tw4z1n] {
    margin-bottom: var(--spacing-sm);
}

.zf-item[b-0o43tw4z1n] {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-2xs);
    color: var(--text-secondary);
}

.zf-label[b-0o43tw4z1n] {
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
}

.zf-netto[b-0o43tw4z1n] {
    font-weight: var(--font-bold);
    color: var(--text-primary);
}

/* ── Dialog-Form ── */
.dialog-form[b-0o43tw4z1n] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.form-row-2col[b-0o43tw4z1n] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-md);
}

.form-row-3col[b-0o43tw4z1n] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: var(--spacing-md);
}

/* ── Freigabe-Alerts ── */
.freigabe-alerts[b-0o43tw4z1n] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    margin-bottom: var(--spacing-md);
}

/* ── Freigabe-Tabs ── */
.freigabe-tabs[b-0o43tw4z1n] {
    margin-bottom: var(--spacing-md);
}

/* ── KW-Status-Strip ── */
.kw-status-strip[b-0o43tw4z1n] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-2xs);
    padding: var(--spacing-xs) 0;
    margin-left: 40px;
}

.kw-strip-spacer[b-0o43tw4z1n] {
    flex: 1;
}

/* ── Zeilen-Aktionen ── */
.zeilen-aktionen[b-0o43tw4z1n] {
    display: flex;
    gap: 0;
    justify-content: flex-end;
}

/* ── Lösch-Dialog ── */
.loeschen-text[b-0o43tw4z1n] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

/* ── Urlaub-Integration ── */
.urlaub-info-banner[b-0o43tw4z1n] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xs) var(--spacing-sm);
    background: var(--dp-blue-50, #eff6ff);
    border: 1px solid var(--dp-blue-200, #bfdbfe);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    color: var(--dp-blue-700, #1d4ed8);
}

.urlaub-geplant[b-0o43tw4z1n],
.urlaub-monat[b-0o43tw4z1n] {
    color: var(--dp-blue-600, #2563eb);
}

.urlaub-zeile[b-0o43tw4z1n] {
    background: var(--dp-blue-50, #eff6ff) !important;
}

.urlaub-zeile td[b-0o43tw4z1n] {
    color: var(--dp-blue-700, #1d4ed8) !important;
    font-style: italic;
}

/* ── Aktive Einträge ── */
tr.aktiv-zeile[b-0o43tw4z1n] {
    background: var(--surface-warning-subtle, #fffbe6);
    border-left: 3px solid var(--border-warning, #f59e0b);
}

.aktiv-label[b-0o43tw4z1n] {
    color: var(--text-warning, #d97706);
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
}

/* ── GPS-Spalte ── */
.gps-spalte[b-0o43tw4z1n],
.gps-zelle[b-0o43tw4z1n] {
    width: 60px;
    text-align: center;
    white-space: nowrap;
}

.gps-doppel[b-0o43tw4z1n] {
    display: flex;
    gap: 0.25rem;
    justify-content: center;
    align-items: center;
}

.gps-icon[b-0o43tw4z1n] {
    font-size: 1rem;
}

.gps-icon--ok[b-0o43tw4z1n] {
    color: var(--dp-emerald-600, #059669);
}

.gps-icon--warn[b-0o43tw4z1n] {
    color: var(--dp-amber-500, #f59e0b);
}

.gps-icon--none[b-0o43tw4z1n] {
    color: var(--text-tertiary, var(--text-secondary));
    font-size: var(--text-xs, 0.75rem);
}

/* ── Arbeitsort-Tabs (Dialog) ── */
.sz-arbeitsort-tabs[b-0o43tw4z1n] {
    display: flex;
    gap: 2px;
    width: 100%;
    background: var(--surface-secondary);
    border-radius: var(--radius-md);
    padding: 3px;
}

.sz-arbeitsort-tab[b-0o43tw4z1n] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xs) var(--spacing-sm);
    border: none;
    border-radius: calc(var(--radius-md) - 2px);
    background: transparent;
    color: var(--text-secondary);
    font-size: var(--text-base);
    font-family: var(--font-family);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.sz-arbeitsort-tab:hover[b-0o43tw4z1n] {
    color: var(--text-primary);
    background: var(--surface-tertiary, var(--dp-slate-100));
}

.sz-arbeitsort-tab--active[b-0o43tw4z1n] {
    background: var(--surface-primary);
    color: var(--text-primary);
    font-weight: var(--font-semibold);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* ── Standort-Liste (Dialog) ── */
.sz-standort-liste[b-0o43tw4z1n] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.sz-standort-btn[b-0o43tw4z1n] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-sm) var(--spacing-md);
    border: 2px solid var(--border-default);
    border-radius: var(--radius-md);
    background: var(--surface-primary);
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: left;
    font-family: var(--font-family);
}

.sz-standort-btn:hover[b-0o43tw4z1n] {
    border-color: var(--accent);
    background: var(--surface-secondary);
}

.sz-standort-btn--active[b-0o43tw4z1n] {
    border-color: var(--accent);
    background: var(--dp-blue-50, #eff6ff);
    box-shadow: 0 0 0 2px rgba(var(--accent-rgb, 59, 130, 246), 0.15);
}

.sz-standort-btn[b-0o43tw4z1n]  i {
    font-size: 1.4rem;
    color: var(--dp-slate-500, #64748b);
    flex-shrink: 0;
}

.sz-standort-btn--active[b-0o43tw4z1n]  i {
    color: var(--accent);
}

.sz-standort-btn-text[b-0o43tw4z1n] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.sz-standort-btn-text strong[b-0o43tw4z1n] {
    font-size: var(--text-base);
    color: var(--text-primary);
}

.sz-standort-btn-text span[b-0o43tw4z1n] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.sz-standort-leer[b-0o43tw4z1n] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--text-sm);
    color: var(--text-tertiary, var(--text-secondary));
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .form-row-2col[b-0o43tw4z1n],
    .form-row-3col[b-0o43tw4z1n] {
        grid-template-columns: 1fr;
    }

    .kw-header[b-0o43tw4z1n] {
        flex-wrap: wrap;
    }

    .kw-actions[b-0o43tw4z1n] {
        flex-basis: 100%;
        justify-content: flex-end;
    }

    .stundenzettel-toolbar[b-0o43tw4z1n] {
        flex-direction: column;
        align-items: stretch;
    }

    .stundenzettel-toolbar[b-0o43tw4z1n]  .ui-search-box {
        max-width: none;
    }

    .ma-card-header[b-0o43tw4z1n] {
        flex-wrap: wrap;
    }

    .ma-info[b-0o43tw4z1n] {
        flex-basis: calc(100% - 48px);
    }

    .ma-stunden[b-0o43tw4z1n] {
        order: 3;
        margin-left: 48px;
    }

    .kw-status-strip[b-0o43tw4z1n] {
        margin-left: 0;
    }
}

@media (max-width: 640px) {
    .kpi-row[b-0o43tw4z1n] {
        grid-template-columns: repeat(2, 1fr);
    }

    .detail-tabelle[b-0o43tw4z1n] {
        display: block;
        overflow-x: auto;
    }
}

/* ═══════════ Pausen-Dialog ═══════════ */

.pausen-dialog[b-0o43tw4z1n] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.pausen-dialog__info[b-0o43tw4z1n] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.5;
}

[b-0o43tw4z1n] .pausen-dialog__icon {
    font-size: var(--icon-lg);
    color: var(--dp-amber-500, #f59e0b);
    flex-shrink: 0;
}

.pausen-dialog__vergleich[b-0o43tw4z1n] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    background: var(--surface-secondary);
    border-radius: var(--radius-md);
    padding: var(--spacing-md);
}

.pausen-dialog__zeile[b-0o43tw4z1n] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--text-sm);
}

.pausen-dialog__label[b-0o43tw4z1n] {
    color: var(--text-secondary);
    font-weight: var(--font-medium);
}

.pausen-dialog__wert[b-0o43tw4z1n] {
    font-weight: var(--font-bold);
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
}

.pausen-dialog__wert--ist[b-0o43tw4z1n] {
    color: var(--dp-amber-600, #d97706);
}

.pausen-dialog__wert--soll[b-0o43tw4z1n] {
    color: var(--status-success, #16a34a);
}
/* _content/TimebookWeb/Components/Pages/Urlaub.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   Urlaubsverwaltung — Kalender + Anträge
   ═══════════════════════════════════════════════ */

/* ── Monats-Navigation ── */
.monat-nav[b-kgix9kgqdk] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}

.monat-label[b-kgix9kgqdk] {
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    min-width: 140px;
    text-align: center;
    letter-spacing: var(--tracking-wide);
    text-transform: capitalize;
}

/* ── KPI-Leiste ── */
.kpi-row[b-kgix9kgqdk] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
    margin-top: var(--spacing-md);
}

[b-kgix9kgqdk] .kpi-card {
    text-align: center;
}

.kpi-value[b-kgix9kgqdk] {
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    line-height: var(--leading-tight);
}

.kpi-value--warning[b-kgix9kgqdk] { color: var(--dp-amber-600, #d97706); }
.kpi-value--success[b-kgix9kgqdk] { color: var(--dp-green-600, #16a34a); }
.kpi-value--info[b-kgix9kgqdk] { color: var(--dp-blue-600, #2563eb); }

.kpi-label[b-kgix9kgqdk] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    margin-top: 2px;
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
}

/* ── Kalender Container ── */
.kalender-container[b-kgix9kgqdk] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* ── Kalender-Grid ── */
.kalender-grid[b-kgix9kgqdk] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
    background: var(--border-subtle);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    overflow: hidden;
    min-width: 700px;
}

.kalender-header[b-kgix9kgqdk] {
    padding: var(--spacing-xs) var(--spacing-2xs);
    font-size: var(--text-xs);
    font-weight: var(--font-bold);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    text-align: center;
    background: var(--surface-secondary);
}

.kalender-header--we[b-kgix9kgqdk] {
    color: var(--dp-red-400, #f87171);
}

.kalender-zelle[b-kgix9kgqdk] {
    background: var(--surface-primary);
    padding: var(--spacing-2xs);
    min-height: 80px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.kalender-zelle--leer[b-kgix9kgqdk] {
    background: var(--surface-secondary);
    min-height: auto;
}

.kalender-zelle--we[b-kgix9kgqdk] {
    background: var(--dp-slate-50, #f8fafc);
}

.kalender-zelle--heute[b-kgix9kgqdk] {
    background: var(--dp-blue-50, #eff6ff);
}

.tag-nummer[b-kgix9kgqdk] {
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    line-height: 20px;
    height: 20px;
    flex-shrink: 0;
}

.tag-nummer--heute[b-kgix9kgqdk] {
    color: var(--dp-blue-600, #2563eb);
    background: var(--dp-blue-100, #dbeafe);
    border-radius: var(--radius-full);
    width: 20px;
    text-align: center;
    display: inline-block;
}

/* ── Urlaub-Balken ── */
.tag-balken[b-kgix9kgqdk] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
}

.urlaub-balken[b-kgix9kgqdk] {
    height: 18px;
    border-radius: 2px;
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 0 4px;
    transition: opacity var(--transition-fast), transform var(--transition-fast);
    overflow: hidden;
}

.urlaub-balken:hover[b-kgix9kgqdk] {
    opacity: 0.85;
    transform: scaleY(1.1);
}

.balken-start[b-kgix9kgqdk] {
    border-top-left-radius: var(--radius-sm);
    border-bottom-left-radius: var(--radius-sm);
}

.balken-ende[b-kgix9kgqdk] {
    border-top-right-radius: var(--radius-sm);
    border-bottom-right-radius: var(--radius-sm);
}

.balken-text[b-kgix9kgqdk] {
    font-size: 10px;
    font-weight: var(--font-semibold);
    color: white;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

/* ── Legende ── */
.kalender-legende[b-kgix9kgqdk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-sm);
    margin-top: var(--spacing-md);
    padding: var(--spacing-xs) var(--spacing-sm);
    background: var(--surface-secondary);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.legende-item[b-kgix9kgqdk] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.legende-farbe[b-kgix9kgqdk] {
    width: 12px;
    height: 12px;
    border-radius: 2px;
    display: inline-block;
}

.legende-farbe--ma[b-kgix9kgqdk] {
    width: 4px;
    height: 12px;
    border-radius: 1px;
}

.legende-sep[b-kgix9kgqdk] {
    color: var(--border-default);
}

/* ── Jahres-Navigation ── */
.jahr-nav[b-kgix9kgqdk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-top: var(--spacing-md);
    margin-bottom: var(--spacing-sm);
}

.jahr-label[b-kgix9kgqdk] {
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    min-width: 50px;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.jahr-anzahl[b-kgix9kgqdk] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    margin-left: var(--spacing-sm);
}

/* ── Mitarbeiter-Filter ── */
.ma-filter[b-kgix9kgqdk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}

.ma-filter-label[b-kgix9kgqdk] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    white-space: nowrap;
}

.ma-filter-chips[b-kgix9kgqdk] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-2xs);
}

/* ── Anträge-Tab ── */
.antraege-toolbar[b-kgix9kgqdk] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
    margin-top: var(--spacing-md);
}

.antraege-toolbar[b-kgix9kgqdk]  .ui-search-box {
    flex: 1;
    max-width: 280px;
}

.filter-chips[b-kgix9kgqdk] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-2xs);
}

.antraege-liste[b-kgix9kgqdk] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

/* ── Antrag-Card ── */
.antrag-card[b-kgix9kgqdk] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
}

.antrag-info[b-kgix9kgqdk] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.antrag-header-row[b-kgix9kgqdk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    flex-wrap: wrap;
}

.antrag-name[b-kgix9kgqdk] {
    font-weight: var(--font-semibold);
    font-size: var(--text-sm-plus);
    color: var(--text-primary);
}

.antrag-details[b-kgix9kgqdk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.antrag-datum[b-kgix9kgqdk] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

.antrag-tage[b-kgix9kgqdk] {
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.antrag-eingereicht[b-kgix9kgqdk] {
    color: var(--text-tertiary);
}

.antrag-bemerkung[b-kgix9kgqdk] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-style: italic;
}

.antrag-ablehnungsgrund[b-kgix9kgqdk] {
    font-size: var(--text-xs);
    color: var(--dp-red-600, #dc2626);
    display: flex;
    align-items: center;
    gap: 4px;
}

.antrag-actions[b-kgix9kgqdk] {
    display: flex;
    gap: var(--spacing-xs);
    flex-shrink: 0;
}

/* ── Status-farbige Card-Akzente ── */
[b-kgix9kgqdk] .status-eingereicht {
    border-left: 3px solid var(--dp-blue-500, #3b82f6);
}

[b-kgix9kgqdk] .status-genehmigt {
    border-left: 3px solid var(--dp-green-500, #22c55e);
}

[b-kgix9kgqdk] .status-abgelehnt {
    border-left: 3px solid var(--dp-red-500, #ef4444);
}

[b-kgix9kgqdk] .status-storniert {
    border-left: 3px solid var(--dp-slate-400, #94a3b8);
    opacity: 0.7;
}

/* ── Dialog ── */
.dialog-form[b-kgix9kgqdk] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.form-row-2col[b-kgix9kgqdk] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-md);
}

.form-arbeitstage[b-kgix9kgqdk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xs) var(--spacing-sm);
    background: var(--dp-green-50, #f0fdf4);
    border: 1px solid var(--dp-green-200, #bbf7d0);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    color: var(--dp-green-700, #15803d);
}

.dialog-confirm-text[b-kgix9kgqdk] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: var(--leading-relaxed);
}

/* ── Detail-Dialog ── */
.detail-dialog-content[b-kgix9kgqdk] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.detail-row[b-kgix9kgqdk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-2xs) 0;
    border-bottom: 1px solid var(--border-subtle);
}

.detail-row:last-child[b-kgix9kgqdk] {
    border-bottom: none;
}

.detail-row--danger[b-kgix9kgqdk] {
    color: var(--dp-red-600, #dc2626);
}

.detail-label[b-kgix9kgqdk] {
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    min-width: 110px;
    flex-shrink: 0;
}

/* ── Kontingente-Tab ── */
.kontingente-header[b-kgix9kgqdk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.kontingente-grid[b-kgix9kgqdk] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-md);
}

/* ── Kontingent-Karte Inhalt ── */
.k-hero[b-kgix9kgqdk] {
    display: flex;
    align-items: baseline;
    gap: var(--spacing-xs);
    margin-bottom: var(--spacing-sm);
}

.k-hero-value[b-kgix9kgqdk] {
    font-size: 2rem;
    font-weight: var(--font-bold);
    color: var(--dp-green-600, #16a34a);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

/* ── Fortschrittsbalken ── */
.k-bar[b-kgix9kgqdk] {
    height: 8px;
    background: var(--dp-green-100, #dcfce7);
    border-radius: var(--radius-full);
    overflow: hidden;
    display: flex;
    margin-bottom: 4px;
}

.k-bar-segment[b-kgix9kgqdk] {
    height: 100%;
    min-width: 0;
    transition: width 0.3s ease;
}

.k-bar-genommen[b-kgix9kgqdk] {
    background: var(--dp-slate-400, #94a3b8);
}

.k-bar-geplant[b-kgix9kgqdk] {
    background: var(--dp-blue-400, #60a5fa);
}

.k-bar-legend[b-kgix9kgqdk] {
    display: flex;
    gap: var(--spacing-sm);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin-bottom: var(--spacing-sm);
}

.k-dot[b-kgix9kgqdk] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: var(--radius-full);
    margin-right: 3px;
    vertical-align: middle;
}

.k-dot--genommen[b-kgix9kgqdk] { background: var(--dp-slate-400, #94a3b8); }
.k-dot--geplant[b-kgix9kgqdk] { background: var(--dp-blue-400, #60a5fa); }
.k-dot--frei[b-kgix9kgqdk] { background: var(--dp-green-100, #dcfce7); border: 1px solid var(--dp-green-300, #86efac); }

.k-vorjahr[b-kgix9kgqdk] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin-top: var(--spacing-xs);
}

/* ── Jahresabschluss-Ergebnis Mini-Tabelle ── */
.ja-tabelle[b-kgix9kgqdk] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    overflow: hidden;
    margin-top: var(--spacing-md);
}

.ja-row[b-kgix9kgqdk] {
    display: grid;
    grid-template-columns: 1fr 100px 120px;
    align-items: center;
    padding: var(--spacing-xs) var(--spacing-sm);
    border-bottom: 1px solid var(--border-subtle);
    gap: var(--spacing-xs);
}

.ja-row:last-child[b-kgix9kgqdk] {
    border-bottom: none;
}

.ja-header-row[b-kgix9kgqdk] {
    background: var(--surface-secondary);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
}

.ja-col-name[b-kgix9kgqdk] {
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

.ja-col-num[b-kgix9kgqdk] {
    text-align: center;
    font-variant-numeric: tabular-nums;
}

/* ── Jahresabschluss Ergebnis ── */
.jahresabschluss-ergebnis[b-kgix9kgqdk] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .kpi-row[b-kgix9kgqdk] {
        grid-template-columns: repeat(2, 1fr);
    }

    .form-row-2col[b-kgix9kgqdk] {
        grid-template-columns: 1fr;
    }

    .antraege-toolbar[b-kgix9kgqdk] {
        flex-direction: column;
        align-items: stretch;
    }

    .ma-filter[b-kgix9kgqdk] {
        flex-direction: column;
        align-items: flex-start;
    }

    .antraege-toolbar[b-kgix9kgqdk]  .ui-search-box {
        max-width: none;
    }

    .antrag-card[b-kgix9kgqdk] {
        flex-wrap: wrap;
    }

    .antrag-actions[b-kgix9kgqdk] {
        flex-basis: 100%;
        justify-content: flex-end;
        margin-top: var(--spacing-xs);
    }

    .kontingente-header[b-kgix9kgqdk] {
        flex-direction: column;
        gap: var(--spacing-sm);
    }

    .kontingente-grid[b-kgix9kgqdk] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .kpi-row[b-kgix9kgqdk] {
        grid-template-columns: repeat(2, 1fr);
    }

    .kontingente-grid[b-kgix9kgqdk] {
        grid-template-columns: 1fr;
    }
}
/* _content/TimebookWeb/Components/Pages/Wochenuebersicht.razor.rz.scp.css */
/* ══════════════════════════════════════════════
   Übersicht — Wochen- & Monatsansicht
   Utilitarian construction-site aesthetic
   ══════════════════════════════════════════════ */

/* ── Perioden-Strip: Tabs + Navigation ── */
.perioden-strip[b-dv2mjpwpra] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing-lg);
    padding: var(--spacing-sm) var(--spacing-md);
    margin-bottom: var(--spacing-lg);
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
}

.perioden-tabs[b-dv2mjpwpra] {
    display: flex;
    gap: 2px;
    background: var(--surface-secondary);
    border-radius: var(--radius-md);
    padding: 2px;
}

.tab-btn[b-dv2mjpwpra] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xs) var(--spacing-md);
    border: none;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text-secondary);
    font-family: var(--font-family);
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.tab-btn:hover[b-dv2mjpwpra] {
    color: var(--text-primary);
    background: var(--surface-primary);
}

.tab-btn--active[b-dv2mjpwpra] {
    background: var(--surface-primary);
    color: var(--accent);
    font-weight: var(--font-semibold);
    box-shadow: var(--shadow-sm);
}

.perioden-nav[b-dv2mjpwpra] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.nav-arrow[b-dv2mjpwpra] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    background: var(--surface-primary);
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
    font-size: var(--text-sm);
}

.nav-arrow:hover[b-dv2mjpwpra] {
    border-color: var(--accent);
    color: var(--accent);
    background: var(--accent-light);
}

.perioden-label[b-dv2mjpwpra] {
    display: flex;
    align-items: baseline;
    gap: var(--spacing-xs);
    font-variant-numeric: tabular-nums;
    min-width: 180px;
    justify-content: center;
}

.perioden-label strong[b-dv2mjpwpra] {
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    color: var(--text-primary);
}

.perioden-range[b-dv2mjpwpra] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.heute-btn[b-dv2mjpwpra] {
    padding: var(--spacing-2xs) var(--spacing-sm);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    background: var(--surface-primary);
    color: var(--text-secondary);
    font-family: var(--font-family);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.heute-btn:hover[b-dv2mjpwpra] {
    border-color: var(--accent);
    color: var(--accent);
}

/* ── KPI-Karten ── */
.kpi-row[b-dv2mjpwpra] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
}

.kpi-card[b-dv2mjpwpra] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
}

.kpi-icon[b-dv2mjpwpra] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-md);
    font-size: var(--icon-lg);
    flex-shrink: 0;
}

.kpi-icon--stunden[b-dv2mjpwpra] {
    background: var(--status-info-light);
    color: var(--status-info);
}

.kpi-icon--tage[b-dv2mjpwpra] {
    background: var(--status-success-light);
    color: var(--status-success);
}

.kpi-icon--schnitt[b-dv2mjpwpra] {
    background: var(--status-warning-light);
    color: var(--status-warning);
}

.kpi-icon--baustellen[b-dv2mjpwpra] {
    background: rgba(var(--accent-rgb), 0.1);
    color: var(--accent);
}

.kpi-icon--zuschlag[b-dv2mjpwpra] {
    background: var(--dp-orange-50, rgba(234, 88, 12, 0.1));
    color: var(--dp-orange-600, #ea580c);
}

.kpi-icon--fahrzeit[b-dv2mjpwpra] {
    background: var(--dp-amber-50, rgba(245, 158, 11, 0.1));
    color: var(--dp-amber-600, #d97706);
}

.kpi-data[b-dv2mjpwpra] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.kpi-number[b-dv2mjpwpra] {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    line-height: var(--leading-tight);
    letter-spacing: var(--tracking-tight);
}

.kpi-label[b-dv2mjpwpra] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Einreich-Leiste (prominent) ── */
.einreich-card[b-dv2mjpwpra] {
    display: flex;
    align-items: center;
    gap: var(--spacing-lg);
    padding: var(--spacing-lg) var(--spacing-xl);
    background: var(--surface-primary);
    border: 2px solid var(--border-default);
    border-radius: var(--radius-lg);
    margin-bottom: var(--spacing-lg);
    box-shadow: var(--shadow-sm);
}

.einreich-card--offen[b-dv2mjpwpra] {
    background: var(--dp-amber-50, #fffbeb);
    border-color: var(--dp-amber-300, #fcd34d);
}

.einreich-card--success[b-dv2mjpwpra] {
    background: var(--dp-emerald-50, #ecfdf5);
    border-color: var(--dp-emerald-300, #6ee7b7);
}

.einreich-card--danger[b-dv2mjpwpra] {
    background: var(--dp-red-50, #fef2f2);
    border-color: var(--dp-red-300, #fca5a5);
}

.einreich-card--info[b-dv2mjpwpra] {
    background: var(--dp-blue-50, #eff6ff);
    border-color: var(--dp-blue-300, #93c5fd);
}

.einreich-icon[b-dv2mjpwpra] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: var(--radius-md);
    font-size: var(--icon-xl, 1.75rem);
    flex-shrink: 0;
}

.einreich-card--offen .einreich-icon[b-dv2mjpwpra] {
    background: var(--dp-amber-100, #fef3c7);
    color: var(--dp-amber-600, #d97706);
}

.einreich-card--info .einreich-icon[b-dv2mjpwpra] {
    background: var(--dp-blue-100, #dbeafe);
    color: var(--dp-blue-600, #2563eb);
}

.einreich-card--success .einreich-icon[b-dv2mjpwpra] {
    background: var(--dp-emerald-100, #d1fae5);
    color: var(--dp-emerald-600, #059669);
}

.einreich-card--danger .einreich-icon[b-dv2mjpwpra] {
    background: var(--dp-red-100, #fee2e2);
    color: var(--dp-red-600, #dc2626);
}

.einreich-content[b-dv2mjpwpra] {
    flex: 1;
    min-width: 0;
}

.einreich-status[b-dv2mjpwpra] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.einreich-text[b-dv2mjpwpra] {
    font-size: var(--text-base);
    color: var(--text-secondary);
}

.einreich-kommentar[b-dv2mjpwpra] {
    display: block;
    font-size: var(--text-sm);
    color: var(--text-tertiary, var(--text-secondary));
    font-style: italic;
    margin-top: var(--spacing-2xs, 2px);
}

.einreich-hint[b-dv2mjpwpra] {
    font-size: var(--text-base);
    font-weight: var(--font-medium);
    color: var(--dp-amber-700, #b45309);
}

.einreich-actions[b-dv2mjpwpra] {
    display: flex;
    gap: var(--spacing-sm);
    flex-shrink: 0;
}

/* ══════════════════════════════════════
   WOCHENANSICHT — Vertikales Bar-Grid
   ══════════════════════════════════════ */
.wochen-grid[b-dv2mjpwpra] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: var(--spacing-xs);
    margin-bottom: var(--spacing-lg);
}

.tag-spalte[b-dv2mjpwpra] {
    display: flex;
    flex-direction: column;
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--spacing-sm);
    min-height: 220px;
    transition: border-color var(--transition-fast);
}

.tag-spalte:hover[b-dv2mjpwpra] {
    border-color: var(--border-strong);
}

.tag-spalte--we[b-dv2mjpwpra] {
    opacity: 0.45;
    background: var(--surface-secondary);
}

.tag-spalte--heute[b-dv2mjpwpra] {
    border-color: var(--accent);
    box-shadow: 0 0 0 1px var(--accent), var(--shadow-sm);
    opacity: 1;
}

.tag-spalte--heute .tag-kopf[b-dv2mjpwpra] {
    color: var(--accent);
}

.tag-spalte--urlaub[b-dv2mjpwpra] {
    background: var(--dp-blue-50, #eff6ff);
    border-color: var(--dp-blue-200, #bfdbfe);
}

.tag-spalte--feiertag[b-dv2mjpwpra] {
    background: var(--dp-slate-50, #f8fafc);
    border-color: var(--dp-slate-300, #cbd5e1);
    border-style: dashed;
}

.tag-kopf[b-dv2mjpwpra] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    padding-bottom: var(--spacing-xs);
    border-bottom: 1px solid var(--border-subtle);
    margin-bottom: var(--spacing-sm);
}

.tag-name[b-dv2mjpwpra] {
    font-size: var(--text-xs);
    font-weight: var(--font-bold);
    text-transform: uppercase;
    letter-spacing: var(--tracking-widest);
    color: var(--text-secondary);
}

.tag-datum[b-dv2mjpwpra] {
    font-size: var(--text-sm);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    font-weight: var(--font-semibold);
}

.tag-stunden[b-dv2mjpwpra] {
    text-align: center;
    margin-bottom: var(--spacing-sm);
}

.tag-stunden-wert[b-dv2mjpwpra] {
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    font-variant-numeric: tabular-nums;
}

.tag-zuschlag-label[b-dv2mjpwpra] {
    font-size: var(--text-xs);
    color: #ea580c;
    font-weight: var(--font-medium);
    white-space: nowrap;
}

.tag-pause-label[b-dv2mjpwpra] {
    font-size: var(--text-xs);
    color: var(--text-tertiary, var(--text-secondary));
    white-space: nowrap;
}

.tag-stunden-frei[b-dv2mjpwpra] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.tag-soll-label[b-dv2mjpwpra] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    white-space: nowrap;
}

/* Stunden-Farben */
.stunden--gruen[b-dv2mjpwpra] { color: var(--dp-emerald-600, #059669); }
.stunden--gelb[b-dv2mjpwpra]  { color: var(--dp-amber-600, #d97706); }
.stunden--rot[b-dv2mjpwpra]   { color: var(--dp-red-600, #dc2626); }

/* Vertikaler Balken (stacked, bottom-up) */
.tag-balken-track[b-dv2mjpwpra] {
    display: flex;
    flex-direction: column-reverse;
    gap: 2px;
    height: 60px;
    margin-bottom: var(--spacing-sm);
    background: var(--surface-secondary);
    border-radius: var(--radius-sm);
    overflow: hidden;
    padding: 2px;
}

.tag-balken-segment[b-dv2mjpwpra] {
    border-radius: var(--radius-xs);
    min-height: 3px;
    transition: opacity var(--transition-fast);
}

.tag-balken-segment:hover[b-dv2mjpwpra] {
    opacity: 0.8;
}

/* Einträge unter dem Balken */
.tag-eintraege[b-dv2mjpwpra] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-top: auto;
}

.tag-eintrag[b-dv2mjpwpra] {
    display: flex;
    align-items: center;
    gap: var(--spacing-2xs);
    font-size: var(--text-xs);
}

.eintrag-dot[b-dv2mjpwpra] {
    width: 6px;
    height: 6px;
    border-radius: var(--radius-full);
    flex-shrink: 0;
}

.eintrag-name[b-dv2mjpwpra] {
    font-weight: var(--font-medium);
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}

.eintrag-dauer[b-dv2mjpwpra] {
    margin-left: auto;
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
}

/* ── Wochen-Footer (Soll/Ist/Mehrarbeit) ── */
.wochen-footer[b-dv2mjpwpra] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-lg);
    padding: var(--spacing-sm) var(--spacing-md);
    background: var(--surface-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    margin-top: var(--spacing-xs);
    margin-bottom: var(--spacing-lg);
    font-variant-numeric: tabular-nums;
}

.wf-item[b-dv2mjpwpra] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.wf-label[b-dv2mjpwpra] {
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
}

.wf-value[b-dv2mjpwpra] {
    font-size: var(--text-base);
    font-weight: var(--font-bold);
    color: var(--text-primary);
}

.wf-mehrarbeit .wf-value[b-dv2mjpwpra] {
    color: var(--dp-red-600, #dc2626);
}

.wf-minderarbeit .wf-value[b-dv2mjpwpra] {
    color: var(--dp-amber-600, #d97706);
}

.wf-samstag .wf-value[b-dv2mjpwpra] {
    color: var(--dp-purple-600, #9333ea);
}

/* ══════════════════════════════════════
   MONATSANSICHT — Kalender-Heatmap
   ══════════════════════════════════════ */
.monats-kalender[b-dv2mjpwpra] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: var(--spacing-xs);
    margin-bottom: var(--spacing-lg);
}

.mk-header[b-dv2mjpwpra] {
    text-align: center;
    font-size: var(--text-xs);
    font-weight: var(--font-bold);
    text-transform: uppercase;
    letter-spacing: var(--tracking-widest);
    color: var(--text-secondary);
    padding-bottom: var(--spacing-xs);
}

.mk-header--we[b-dv2mjpwpra] {
    color: var(--text-tertiary);
}

.mk-zelle[b-dv2mjpwpra] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: var(--spacing-sm) var(--spacing-xs);
    background: var(--surface-primary);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    min-height: 72px;
    transition: all var(--transition-fast);
}

.mk-zelle--leer[b-dv2mjpwpra] {
    background: transparent;
    border-color: transparent;
}

.mk-zelle--we[b-dv2mjpwpra] {
    opacity: 0.35;
    background: var(--surface-secondary);
}

.mk-zelle--heute[b-dv2mjpwpra] {
    border-color: var(--accent);
    box-shadow: 0 0 0 1px var(--accent);
    opacity: 1;
}

.mk-zelle--feiertag[b-dv2mjpwpra] {
    background: var(--dp-slate-50, #f8fafc);
    border-color: var(--dp-slate-300, #cbd5e1);
    border-style: dashed;
}

.mk-feiertag-label[b-dv2mjpwpra] {
    font-size: var(--text-xs);
    color: var(--dp-slate-400, #94a3b8);
}

.mk-zelle--hat-daten[b-dv2mjpwpra] {
    border-color: var(--border-default);
    box-shadow: var(--shadow-xs);
}

.mk-zelle--hat-daten:hover[b-dv2mjpwpra] {
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}

.mk-tag[b-dv2mjpwpra] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
}

.mk-stunden[b-dv2mjpwpra] {
    font-size: var(--text-sm);
    font-weight: var(--font-bold);
    font-variant-numeric: tabular-nums;
}

.mk-dots[b-dv2mjpwpra] {
    display: flex;
    gap: 3px;
}

.mk-dot[b-dv2mjpwpra] {
    width: 7px;
    height: 7px;
    border-radius: var(--radius-full);
}

/* ── Detail-Tabelle (Monat) ── */
.detail-card[b-dv2mjpwpra] {
    margin-bottom: var(--spacing-lg);
}

.detail-tabelle[b-dv2mjpwpra] {
    display: flex;
    flex-direction: column;
}

.detail-zeile[b-dv2mjpwpra] {
    display: grid;
    grid-template-columns: 55px 32px 1fr auto;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-bottom: 1px solid var(--border-subtle);
}

.detail-zeile:last-child[b-dv2mjpwpra] {
    border-bottom: none;
}

.detail-zeile:hover[b-dv2mjpwpra] {
    background: var(--surface-secondary);
}

.detail-datum[b-dv2mjpwpra] {
    font-variant-numeric: tabular-nums;
    font-weight: var(--font-semibold);
    font-size: var(--text-sm);
    color: var(--text-primary);
}

.detail-tag[b-dv2mjpwpra] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    text-transform: uppercase;
}

.detail-baustellen[b-dv2mjpwpra] {
    display: flex;
    gap: var(--spacing-xs);
    flex-wrap: wrap;
}

.detail-badge[b-dv2mjpwpra] {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: 3px var(--spacing-sm);
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    color: #fff;
    white-space: nowrap;
}

.badge-dauer[b-dv2mjpwpra] {
    font-weight: var(--font-normal);
    opacity: 0.85;
}

.detail-gesamt[b-dv2mjpwpra] {
    font-variant-numeric: tabular-nums;
    font-weight: var(--font-bold);
    font-size: var(--text-sm);
    text-align: right;
    white-space: nowrap;
}

/* ══════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════ */

/* ── Tablet: 640px–900px ── */
@media (max-width: 900px) {
    .kpi-row[b-dv2mjpwpra] {
        grid-template-columns: repeat(2, 1fr);
    }

    .wochen-grid[b-dv2mjpwpra] {
        grid-template-columns: repeat(7, 1fr);
        gap: 2px;
    }

    .tag-spalte[b-dv2mjpwpra] {
        padding: var(--spacing-xs);
        min-height: 160px;
    }

    .tag-balken-track[b-dv2mjpwpra] {
        height: 40px;
    }

    .tag-eintraege[b-dv2mjpwpra] {
        display: none;
    }
}

/* ── Mobile: ≤640px ── */
@media (max-width: 640px) {

    .einreich-card[b-dv2mjpwpra] {
        flex-direction: column;
        gap: var(--spacing-md);
        text-align: center;
        padding: var(--spacing-md);
    }

    .einreich-icon[b-dv2mjpwpra] {
        width: 40px;
        height: 40px;
    }

    .einreich-status[b-dv2mjpwpra] {
        flex-direction: column;
        gap: var(--spacing-xs);
    }

    /* — Perioden-Strip: Tabs + Nav untereinander, volle Breite — */
    .perioden-strip[b-dv2mjpwpra] {
        flex-direction: column;
        gap: var(--spacing-sm);
        padding: var(--spacing-xs) var(--spacing-sm);
    }

    .perioden-tabs[b-dv2mjpwpra] {
        width: 100%;
    }

    .tab-btn[b-dv2mjpwpra] {
        flex: 1;
        justify-content: center;
        padding: var(--spacing-xs) var(--spacing-xs);
        font-size: var(--text-sm);
    }

    .perioden-nav[b-dv2mjpwpra] {
        width: 100%;
        justify-content: center;
    }

    .perioden-label[b-dv2mjpwpra] {
        min-width: 0;
    }

    .perioden-label strong[b-dv2mjpwpra] {
        font-size: var(--text-base);
    }

    .perioden-range[b-dv2mjpwpra] {
        font-size: var(--text-xs);
    }

    .nav-arrow[b-dv2mjpwpra] {
        width: 36px;
        height: 36px;
    }

    .heute-btn[b-dv2mjpwpra] {
        padding: var(--spacing-xs) var(--spacing-sm);
    }

    /* — KPI-Karten: 2×2, enger — */
    .kpi-row[b-dv2mjpwpra] {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--spacing-sm);
    }

    .kpi-card[b-dv2mjpwpra] {
        padding: var(--spacing-sm);
        gap: var(--spacing-sm);
    }

    .kpi-icon[b-dv2mjpwpra] {
        width: 28px;
        height: 28px;
        font-size: var(--icon-sm);
        border-radius: var(--radius-sm);
    }

    .kpi-number[b-dv2mjpwpra] {
        font-size: var(--text-lg);
    }

    .kpi-label[b-dv2mjpwpra] {
        font-size: var(--text-xs);
    }

    /* — Wochenansicht: Horizontale Liste statt 7-Spalten-Grid — */
    .wochen-grid[b-dv2mjpwpra] {
        grid-template-columns: 1fr;
        gap: var(--spacing-xs);
    }

    .tag-spalte[b-dv2mjpwpra] {
        flex-direction: row;
        align-items: center;
        gap: var(--spacing-sm);
        padding: var(--spacing-sm);
        min-height: auto;
        border-radius: var(--radius-md);
    }

    .tag-spalte:hover[b-dv2mjpwpra] {
        border-color: var(--border-default);
    }

    .tag-kopf[b-dv2mjpwpra] {
        flex-direction: row;
        align-items: baseline;
        gap: var(--spacing-xs);
        padding-bottom: 0;
        border-bottom: none;
        margin-bottom: 0;
        min-width: 72px;
        flex-shrink: 0;
    }

    .tag-name[b-dv2mjpwpra] {
        font-size: var(--text-xs);
    }

    .tag-datum[b-dv2mjpwpra] {
        font-size: var(--text-sm);
    }

    .tag-stunden[b-dv2mjpwpra] {
        text-align: left;
        margin-bottom: 0;
        min-width: 48px;
        flex-shrink: 0;
    }

    .tag-stunden-wert[b-dv2mjpwpra] {
        font-size: var(--text-base);
    }

    .tag-balken-track[b-dv2mjpwpra] {
        flex-direction: row;
        height: 20px;
        flex: 1;
        min-width: 0;
        margin-bottom: 0;
    }

    .tag-balken-segment[b-dv2mjpwpra] {
        min-height: auto;
        min-width: 3px;
        height: 100%;
    }

    .tag-eintraege[b-dv2mjpwpra] {
        display: none;
    }

    /* — Monatsansicht: kompakter — */
    .monats-kalender[b-dv2mjpwpra] {
        gap: 2px;
    }

    .mk-zelle[b-dv2mjpwpra] {
        padding: var(--spacing-2xs);
        min-height: 52px;
        gap: 2px;
    }

    .mk-zelle--hat-daten:hover[b-dv2mjpwpra] {
        transform: none;
    }

    .mk-tag[b-dv2mjpwpra] {
        font-size: var(--text-xs);
    }

    .mk-stunden[b-dv2mjpwpra] {
        font-size: var(--text-xs);
    }

    .mk-dot[b-dv2mjpwpra] {
        width: 5px;
        height: 5px;
    }

    .mk-dots[b-dv2mjpwpra] {
        gap: 2px;
    }

    /* — Detail-Tabelle: Badges umbrechen, kompakter — */
    .detail-zeile[b-dv2mjpwpra] {
        grid-template-columns: 50px 1fr auto;
        gap: var(--spacing-xs);
        padding: var(--spacing-xs);
    }

    .detail-tag[b-dv2mjpwpra] {
        display: none;
    }

    .detail-badge[b-dv2mjpwpra] {
        white-space: normal;
        line-height: var(--leading-snug);
    }

    .detail-baustellen[b-dv2mjpwpra] {
        gap: 3px;
    }
}

/* ── Extra-Small: ≤480px ── */
@media (max-width: 480px) {

    /* KPI: 1 Spalte */
    .kpi-row[b-dv2mjpwpra] {
        grid-template-columns: 1fr;
    }

    .kpi-card[b-dv2mjpwpra] {
        padding: var(--spacing-xs) var(--spacing-sm);
    }

    /* Monatskalender: noch kompakter */
    .mk-zelle[b-dv2mjpwpra] {
        padding: 2px;
        min-height: 44px;
        gap: 1px;
        border-radius: var(--radius-sm);
    }

    .mk-tag[b-dv2mjpwpra] {
        font-size: 0.625rem;
    }

    .mk-stunden[b-dv2mjpwpra] {
        font-size: 0.625rem;
    }

    .mk-dot[b-dv2mjpwpra] {
        width: 4px;
        height: 4px;
    }

    /* Wochenansicht: noch kompakter */
    .tag-kopf[b-dv2mjpwpra] {
        min-width: 60px;
    }

    .tag-stunden[b-dv2mjpwpra] {
        min-width: 40px;
    }

    .tag-stunden-wert[b-dv2mjpwpra] {
        font-size: var(--text-sm);
    }

    .tag-balken-track[b-dv2mjpwpra] {
        height: 16px;
    }

    /* Detail-Tabelle: Stunden unter Baustellen stacken */
    .detail-zeile[b-dv2mjpwpra] {
        grid-template-columns: 44px 1fr;
        gap: var(--spacing-2xs);
    }

    .detail-gesamt[b-dv2mjpwpra] {
        grid-column: 2;
        text-align: left;
        font-size: var(--text-xs);
    }

    .perioden-label strong[b-dv2mjpwpra] {
        font-size: var(--text-sm);
    }
}
/* _content/TimebookWeb/Components/Pages/Zeiterfassung.razor.rz.scp.css */
/* ── Stempeluhr Hero ── */
.check-in-hero[b-a4fykzbyxk] {
    margin-bottom: var(--spacing-lg);
}

.hero-content[b-a4fykzbyxk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-lg);
    padding: var(--spacing-lg) 0;
}

.status-line[b-a4fykzbyxk] {
    font-size: var(--text-lg);
}

.baustelle-select[b-a4fykzbyxk] {
    width: 100%;
    max-width: 400px;
}

/* ── Bemerkung-Inline (ohne Baustelle) ── */
.bemerkung-inline[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    width: 100%;
    max-width: 400px;
    padding: var(--spacing-xs) var(--spacing-sm);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    background: var(--surface-primary);
    transition: border-color 0.15s ease;
}

.bemerkung-inline:focus-within[b-a4fykzbyxk] {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px rgba(var(--accent-rgb, 59, 130, 246), 0.15);
}

.bemerkung-inline[b-a4fykzbyxk]  i {
    color: var(--text-tertiary, var(--text-secondary));
    font-size: 1.1rem;
    flex-shrink: 0;
}

.bemerkung-input[b-a4fykzbyxk] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: var(--text-base, 1rem);
    color: var(--text-primary);
    padding: var(--spacing-xs) 0;
}

.bemerkung-input[b-a4fykzbyxk]::placeholder {
    color: var(--text-tertiary, var(--text-secondary));
}

.eintrag-bemerkung[b-a4fykzbyxk] {
    font-style: italic;
}

.active-info[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--text-lg);
    color: var(--text-secondary);
}

.active-ort[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-sm);
    color: var(--text-tertiary, var(--text-secondary));
    margin-top: calc(-1 * var(--spacing-sm));
}

.wetter-info[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    flex-wrap: wrap;
    justify-content: center;
}

.wetter-icon[b-a4fykzbyxk] {
    font-size: 1.25rem;
}

.wetter-temp[b-a4fykzbyxk] {
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.wetter-sep[b-a4fykzbyxk] {
    color: var(--border-default);
}

.wetter-regen[b-a4fykzbyxk] {
    font-weight: var(--font-medium);
}

.regen--kein[b-a4fykzbyxk] {
    color: var(--color-success);
}

.regen--leicht[b-a4fykzbyxk] {
    color: var(--color-warning);
}

.regen--mittel[b-a4fykzbyxk] {
    color: var(--color-warning);
}

.regen--stark[b-a4fykzbyxk] {
    color: var(--color-danger);
}

.wetter-wind[b-a4fykzbyxk] {
    color: var(--text-tertiary);
}

.timer-display[b-a4fykzbyxk] {
    font-family: 'Courier New', Courier, monospace;
    font-size: 3rem;
    font-weight: var(--font-bold);
    color: var(--text-primary);
    letter-spacing: 0.05em;
    line-height: 1;
}

/* ── Tages-Card ── */
.tages-card[b-a4fykzbyxk] {
    margin-bottom: var(--spacing-lg);
}

/* ── Einträge-Liste ── */
.eintraege-liste[b-a4fykzbyxk] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.eintrag-row[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-md);
    background: var(--surface-secondary);
}

.eintrag-row:hover[b-a4fykzbyxk] {
    background: var(--surface-tertiary, var(--dp-slate-100));
}

.eintrag-zeit[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    min-width: 120px;
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.zeit-trenner[b-a4fykzbyxk] {
    color: var(--text-tertiary, var(--text-secondary));
}

.eintrag-baustelle[b-a4fykzbyxk] {
    flex: 1;
    color: var(--text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.eintrag-dauer[b-a4fykzbyxk] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    min-width: 80px;
    text-align: right;
    color: var(--text-secondary);
}

.eintrag-pause[b-a4fykzbyxk] {
    display: block;
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-tertiary, var(--text-secondary));
    font-weight: normal;
}

.eintrag-status[b-a4fykzbyxk] {
    min-width: 100px;
    text-align: right;
}

/* ── Tages-Zusammenfassung ── */
.tages-summary[b-a4fykzbyxk] {
    display: flex;
    gap: var(--spacing-xl);
    padding-top: var(--spacing-md);
    margin-top: var(--spacing-md);
    border-top: 1px solid var(--border-default);
}

.summary-item[b-a4fykzbyxk] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xs, 2px);
}

.summary-label[b-a4fykzbyxk] {
    font-size: var(--text-sm);
    color: var(--text-tertiary, var(--text-secondary));
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.summary-value[b-a4fykzbyxk] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
}

.summary-netto .summary-value[b-a4fykzbyxk] {
    color: var(--dp-emerald-600);
}

/* ── Schlechtwetter-Formular (temporär deaktiviert) ──
.schlechtwetter-card {
    margin-bottom: var(--spacing-lg);
}

.sw-ausfall-art {
    display: flex;
    gap: var(--spacing-md);
}

.sw-radio {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-sm);
    color: var(--text-primary);
    cursor: pointer;
}

.sw-radio input[type="radio"] {
    accent-color: var(--accent);
}
── */

/* ── GPS / Geofencing ── */
.geofencing-info-banner[b-a4fykzbyxk] {
    width: 100%;
    max-width: 400px;
}

.geofencing-info-content[b-a4fykzbyxk] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.geofencing-info-content p[b-a4fykzbyxk] {
    margin: 0;
    font-size: var(--text-sm);
    line-height: 1.5;
}

.geofencing-info-liste[b-a4fykzbyxk] {
    margin: 0.5rem 0;
    padding-left: 1.25rem;
    font-size: var(--text-sm);
    line-height: 1.6;
}

.geofencing-info-liste li[b-a4fykzbyxk] {
    margin-bottom: 0.25rem;
}

.geofencing-info-rechtsgrundlage[b-a4fykzbyxk] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin-top: 0.5rem;
}

.gps-hinweis[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-xs, 0.75rem);
    color: var(--text-tertiary, var(--text-secondary));
}

.gps-status[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    width: 100%;
    max-width: 400px;
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.gps-status--checking[b-a4fykzbyxk] {
    background: var(--surface-secondary);
    color: var(--text-secondary);
}

.gps-status--checking[b-a4fykzbyxk]  i {
    animation: spin-b-a4fykzbyxk 1s linear infinite;
}

.gps-status--error[b-a4fykzbyxk] {
    background: var(--dp-red-50, #fef2f2);
    color: var(--dp-red-700, #b91c1c);
}

.gps-status--warning[b-a4fykzbyxk] {
    background: var(--dp-amber-50, #fffbeb);
    color: var(--dp-amber-700, #b45309);
}

.gps-status--success[b-a4fykzbyxk] {
    background: var(--dp-emerald-50, #ecfdf5);
    color: var(--dp-emerald-700, #047857);
}

@keyframes spin-b-a4fykzbyxk {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* ── Arbeitsort-Tabs ── */
.arbeitsort-tabs[b-a4fykzbyxk] {
    display: flex;
    gap: 2px;
    width: 100%;
    max-width: 400px;
    background: var(--surface-secondary);
    border-radius: var(--radius-md);
    padding: 3px;
}

.arbeitsort-tab[b-a4fykzbyxk] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xs) var(--spacing-sm);
    border: none;
    border-radius: calc(var(--radius-md) - 2px);
    background: transparent;
    color: var(--text-secondary);
    font-size: var(--text-sm);
    font-weight: var(--font-medium, 500);
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.arbeitsort-tab:hover[b-a4fykzbyxk] {
    color: var(--text-primary);
    background: var(--surface-tertiary, var(--dp-slate-100));
}

.arbeitsort-tab--active[b-a4fykzbyxk] {
    background: var(--surface-primary);
    color: var(--text-primary);
    font-weight: var(--font-semibold);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* ── Standort-Auswahl ── */
.standort-liste[b-a4fykzbyxk] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    width: 100%;
    max-width: 400px;
}

.standort-btn[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-sm) var(--spacing-md);
    border: 2px solid var(--border-default);
    border-radius: var(--radius-md);
    background: var(--surface-primary);
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: left;
}

.standort-btn:hover[b-a4fykzbyxk] {
    border-color: var(--accent);
    background: var(--surface-secondary);
}

.standort-btn--active[b-a4fykzbyxk] {
    border-color: var(--accent);
    background: var(--dp-blue-50, #eff6ff);
    box-shadow: 0 0 0 2px rgba(var(--accent-rgb, 59, 130, 246), 0.15);
}

.standort-btn[b-a4fykzbyxk]  i {
    font-size: 1.4rem;
    color: var(--dp-slate-500, #64748b);
    flex-shrink: 0;
}

.standort-btn--active[b-a4fykzbyxk]  i {
    color: var(--accent);
}

.standort-btn-text[b-a4fykzbyxk] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.standort-btn-text strong[b-a4fykzbyxk] {
    font-size: var(--text-base, 1rem);
    color: var(--text-primary);
}

.standort-btn-text span[b-a4fykzbyxk] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.standort-leer[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--text-sm);
    color: var(--text-tertiary, var(--text-secondary));
}

.wechsel-oder[b-a4fykzbyxk] {
    font-size: var(--text-sm);
    color: var(--text-tertiary, var(--text-secondary));
    text-align: center;
}

/* ── Fahrt / Baustelle wechseln ── */
.eintrag-row--fahrt[b-a4fykzbyxk] {
    border-left: 3px solid var(--dp-amber-500, #f59e0b);
    background: var(--dp-amber-50, #fffbeb);
}

.eintrag-row--fahrt:hover[b-a4fykzbyxk] {
    background: var(--dp-amber-100, #fef3c7);
}

.eintrag-row--fahrt .eintrag-baustelle[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.fahrt-actions[b-a4fykzbyxk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-sm);
    width: 100%;
    max-width: 300px;
}

.wechsel-panel[b-a4fykzbyxk] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
    width: 100%;
    max-width: 400px;
    padding: var(--spacing-md);
    border-radius: var(--radius-md);
    background: var(--surface-secondary);
    border: 1px solid var(--border-default);
}

.wechsel-label[b-a4fykzbyxk] {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
}

.sonstiges-input[b-a4fykzbyxk] {
    width: 100%;
    padding: var(--spacing-sm) var(--spacing-md);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    background: var(--surface-primary);
    color: var(--text-primary);
}

.sonstiges-input:focus[b-a4fykzbyxk] {
    outline: none;
    border-color: var(--dp-blue-500, #3b82f6);
    box-shadow: 0 0 0 2px var(--dp-blue-100, #dbeafe);
}

.wechsel-actions[b-a4fykzbyxk] {
    display: flex;
    gap: var(--spacing-sm);
    align-items: center;
}

.stale-fahrt-content[b-a4fykzbyxk] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.stale-fahrt-content p[b-a4fykzbyxk] {
    margin: 0;
    font-size: var(--text-sm);
}

.summary-fahrzeit .summary-label[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.summary-fahrzeit .summary-value[b-a4fykzbyxk] {
    color: var(--dp-amber-600, #d97706);
}

/* ── Hilfe ── */
.hilfe-toggle[b-a4fykzbyxk] {
    display: flex;
    justify-content: center;
    margin-bottom: var(--spacing-md);
}

.hilfe-btn[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xs) var(--spacing-md);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-full, 9999px);
    background: var(--surface-primary);
    color: var(--text-secondary);
    font-size: var(--text-sm);
    cursor: pointer;
    transition: all 0.15s ease;
}

.hilfe-btn:hover[b-a4fykzbyxk] {
    background: var(--surface-secondary);
    color: var(--text-primary);
    border-color: var(--accent);
}

.hilfe-panel[b-a4fykzbyxk] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    padding: var(--spacing-md);
    margin-bottom: var(--spacing-lg);
    border-radius: var(--radius-lg, var(--radius-md));
    background: var(--surface-secondary);
    border: 1px solid var(--border-default);
}

.hilfe-section[b-a4fykzbyxk] {
    display: flex;
    gap: var(--spacing-md);
    padding: var(--spacing-sm) 0;
}

.hilfe-section + .hilfe-section[b-a4fykzbyxk] {
    border-top: 1px solid var(--border-subtle, var(--border-default));
}

.hilfe-icon[b-a4fykzbyxk] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-md);
    background: var(--dp-emerald-50, #ecfdf5);
    color: var(--dp-emerald-600, #059669);
    font-size: 1.1rem;
}

.hilfe-icon--standort[b-a4fykzbyxk] {
    background: var(--dp-cyan-50, #ecfeff);
    color: var(--dp-cyan-600, #0891b2);
}

.hilfe-icon--fahrt[b-a4fykzbyxk] {
    background: var(--dp-amber-50, #fffbeb);
    color: var(--dp-amber-600, #d97706);
}

.hilfe-icon--ohne[b-a4fykzbyxk] {
    background: var(--dp-blue-50, #eff6ff);
    color: var(--dp-blue-600, #2563eb);
}

.hilfe-icon--gps[b-a4fykzbyxk] {
    background: var(--dp-purple-50, #faf5ff);
    color: var(--dp-purple-600, #9333ea);
}

.hilfe-icon--uebersicht[b-a4fykzbyxk] {
    background: var(--dp-slate-100, #f1f5f9);
    color: var(--dp-slate-600, #475569);
}

.hilfe-text[b-a4fykzbyxk] {
    flex: 1;
    min-width: 0;
}

.hilfe-text strong[b-a4fykzbyxk] {
    display: block;
    font-size: var(--text-sm);
    color: var(--text-primary);
    margin-bottom: 2px;
}

.hilfe-text p[b-a4fykzbyxk] {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.5;
}

.hilfe-text em[b-a4fykzbyxk] {
    font-style: normal;
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .eintrag-row[b-a4fykzbyxk] {
        flex-wrap: wrap;
    }

    .eintrag-baustelle[b-a4fykzbyxk] {
        order: 3;
        flex-basis: 100%;
        min-width: 0;
    }

    .timer-display[b-a4fykzbyxk] {
        font-size: 2.25rem;
    }

    .tages-summary[b-a4fykzbyxk] {
        flex-direction: column;
        gap: var(--spacing-sm);
    }

}

/* ── Arbeitszeit-Info ── */
.az-tagesinfo[b-a4fykzbyxk] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-xs) var(--spacing-md);
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.az-tagesinfo__soll[b-a4fykzbyxk] {
    font-variant-numeric: tabular-nums;
    font-weight: var(--font-medium);
}