@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));
    }
}
/* _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__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-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);
}

.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;
    }
}
/* _content/TimebookWeb/Components/Pages/Home.razor.rz.scp.css */
/* ===== A) HERO STATUS BAR ===== */
.hero-inner[b-ru109lyok2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing-md);
    flex-wrap: wrap;
}

.hero-left[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    flex-wrap: wrap;
}

.hero-right[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    white-space: nowrap;
}

.pulse-dot[b-ru109lyok2] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #16a34a;
    box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.6);
    animation: pulse-b-ru109lyok2 2s infinite;
    flex-shrink: 0;
}

@keyframes pulse-b-ru109lyok2 {
    0% { box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.6); }
    70% { box-shadow: 0 0 0 10px rgba(22, 163, 74, 0); }
    100% { box-shadow: 0 0 0 0 rgba(22, 163, 74, 0); }
}

.live-label[b-ru109lyok2] {
    font-weight: var(--font-bold);
    font-size: var(--text-sm);
    color: #16a34a;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.hero-divider[b-ru109lyok2] {
    width: 1px;
    height: 20px;
    background: var(--border-secondary);
    flex-shrink: 0;
}

.hero-stat[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-sm);
    color: var(--text-secondary);
    white-space: nowrap;
}

.hero-stat strong[b-ru109lyok2] {
    color: var(--text-primary);
    font-weight: var(--font-semibold);
}

/* ===== B) BAUSTELLEN-KARTE ===== */
.map-header[b-ru109lyok2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--spacing-md);
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}

.map-header-left[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

[b-ru109lyok2] .map-header-left .phosphor-icon {
    color: var(--accent);
}

.map-title[b-ru109lyok2] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.map-reset-btn[b-ru109lyok2] {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
    padding: 6px 14px;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-secondary);
    background: var(--surface-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.map-reset-btn:hover[b-ru109lyok2] {
    background: var(--surface-tertiary);
    color: var(--text-primary);
}

.map-container[b-ru109lyok2] {
    height: 400px;
    border-radius: var(--radius-md);
    overflow: visible;
    border: 1px solid var(--border-subtle);
}

/* ===== MAP PINS ===== */
.map-pin[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    position: relative;
    cursor: default;
    transform: translate(-50%, -50%);
}

.map-pin-dot[b-ru109lyok2] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--pin-color);
    border: 3px solid white;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 2;
    transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.map-pin:hover .map-pin-dot[b-ru109lyok2] {
    transform: scale(1.2);
}

.map-pin-count[b-ru109lyok2] {
    font-size: 12px;
    font-weight: 700;
    color: white;
    line-height: 1;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

/* Pulse ring — active baustellen */
.map-pin--active .map-pin-ring[b-ru109lyok2] {
    position: absolute;
    top: 0;
    left: 50%;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    transform: translateX(-50%);
    z-index: 1;
    background: var(--pin-color);
    animation: pin-pulse-b-ru109lyok2 2.5s cubic-bezier(0, 0, 0.2, 1) infinite;
}

@keyframes pin-pulse-b-ru109lyok2 {
    0% {
        transform: translateX(-50%) scale(1);
        opacity: 0.45;
    }
    100% {
        transform: translateX(-50%) scale(2.8);
        opacity: 0;
    }
}

/* Static pins — geplant / abgeschlossen */
.map-pin--static .map-pin-dot[b-ru109lyok2] {
    width: 18px;
    height: 18px;
    border-width: 2px;
    opacity: 0.65;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

.map-pin--static .map-pin-count[b-ru109lyok2] {
    font-size: 9px;
}

/* ===== HOVER POPUP ===== */
.map-pin-popup[b-ru109lyok2] {
    position: absolute;
    bottom: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%) translateY(6px) scale(0.95);
    background: white;
    border-radius: 12px;
    padding: 14px 16px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05);
    min-width: 220px;
    max-width: 300px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
    z-index: 100;
    white-space: normal;
}

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

.map-pin-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-pin-popup-header[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 2px;
}

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

.map-pin-popup-badge[b-ru109lyok2] {
    font-size: 10px;
    font-weight: 600;
    padding: 1px 7px;
    border-radius: 10px;
    white-space: nowrap;
    flex-shrink: 0;
}

.map-pin-popup-badge--aktiv[b-ru109lyok2] {
    background: #dcfce7;
    color: #15803d;
}

.map-pin-popup-badge--geplant[b-ru109lyok2] {
    background: #fef3c7;
    color: #a16207;
}

.map-pin-popup-badge--abgeschlossen[b-ru109lyok2] {
    background: #f1f5f9;
    color: #64748b;
}

.map-pin-popup-ort[b-ru109lyok2] {
    font-size: 11px;
    color: #64748b;
    line-height: 1.3;
}

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

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

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

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

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

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

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

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

.map-pin-ma-rolle[b-ru109lyok2] {
    font-size: 11px;
    color: #94a3b8;
    font-weight: 400;
}

/* ===== C) TEAM-STATUS ===== */
.team-status-grid[b-ru109lyok2] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-lg);
    margin-top: var(--spacing-lg);
}

.team-status-card[b-ru109lyok2] {
    background: var(--surface-primary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
}

.team-status-header[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
}

.team-status-icon[b-ru109lyok2] {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: white;
}

.team-status-icon--pending[b-ru109lyok2] { background: #d97706; }
.team-status-icon--absent[b-ru109lyok2] { background: #6366f1; }
.team-status-icon--birthday[b-ru109lyok2] { background: #ec4899; }

.team-status-title[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

.team-status-list[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
    max-height: 240px;
    overflow-y: auto;
}

.team-status-overflow[b-ru109lyok2] {
    text-align: center;
    font-size: var(--text-sm, 0.875rem);
    color: var(--text-secondary);
    padding: var(--spacing-xs) 0;
    font-weight: var(--font-medium);
}

.team-status-person[b-ru109lyok2] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--radius-md);
    background: var(--surface-secondary);
}

.team-status-person-info[b-ru109lyok2] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.team-status-person-name[b-ru109lyok2] {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    line-height: 1.3;
}

.team-status-person-rolle[b-ru109lyok2] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.team-status-person-badge[b-ru109lyok2] {
    display: inline-block;
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    padding: 1px 8px;
    border-radius: var(--radius-full);
    width: fit-content;
}

.team-status-person-badge--urlaub[b-ru109lyok2] {
    background: #ede9fe;
    color: #6d28d9;
}

.team-status-person-badge--krank[b-ru109lyok2] {
    background: #fee2e2;
    color: #dc2626;
}

.team-status-person-badge--unbezahlt[b-ru109lyok2] {
    background: var(--surface-tertiary);
    color: var(--text-secondary);
}

.birthday-today-badge[b-ru109lyok2] {
    font-size: var(--text-xs);
    font-weight: var(--font-bold);
    color: #ec4899;
    background: #fce7f3;
    padding: 2px 10px;
    border-radius: var(--radius-full);
    white-space: nowrap;
    animation: birthday-glow-b-ru109lyok2 2s ease-in-out infinite;
}

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

.team-status-empty[b-ru109lyok2] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    text-align: center;
    padding: var(--spacing-lg) 0;
}

/* Aktivitaeten-Feed */
.activity-feed[b-ru109lyok2] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.activity-item[b-ru109lyok2] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    padding: var(--spacing-sm) 0;
    position: relative;
}

.activity-item + .activity-item[b-ru109lyok2] {
    border-top: 1px solid var(--border-primary);
}

.activity-icon[b-ru109lyok2] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: white;
    font-size: var(--text-sm);
}

.activity-icon--success[b-ru109lyok2] { background: #16a34a; }
.activity-icon--warning[b-ru109lyok2] { background: #d97706; }
.activity-icon--info[b-ru109lyok2] { background: #2563eb; }

.activity-content[b-ru109lyok2] {
    flex: 1;
    min-width: 0;
}

.activity-text[b-ru109lyok2] {
    font-size: var(--text-sm);
    color: var(--text-primary);
    display: block;
    line-height: 1.4;
}

.activity-time[b-ru109lyok2] {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    font-variant-numeric: tabular-nums;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 900px) {
    .team-status-grid[b-ru109lyok2] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .hero-inner[b-ru109lyok2] {
        flex-direction: column;
        align-items: flex-start;
    }

    .hero-left[b-ru109lyok2] {
        flex-direction: column;
        align-items: flex-start;
    }

    .hero-divider[b-ru109lyok2] {
        display: none;
    }

    .map-container[b-ru109lyok2] {
        height: 300px;
    }
}
/* _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 */
/* ── KPI-Leiste ── */
.mitarbeiter-stats[b-5zv24wtyoc] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
}

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

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

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

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

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

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

/* ── 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-section-title[b-5zv24wtyoc] {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-size: var(--text-md);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin: 0;
}

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

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

.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);
}

/* ── Mitarbeiterliste ── */
.mitarbeiter-liste[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

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

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

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

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

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

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

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

/* ── Detail: Stundenhistorie ── */
.stunden-tabelle[b-5zv24wtyoc] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.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-sm);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    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);
}

.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-md);
}

.sidebar-stat[b-5zv24wtyoc] {
    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-5zv24wtyoc] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.sidebar-stat-value[b-5zv24wtyoc] {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    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);
}

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

    .mitarbeiter-toolbar[b-5zv24wtyoc]  .ui-search-box {
        flex: 1;
        max-width: 400px;
    }
}

@media (max-width: 768px) {
    .mitarbeiter-stats[b-5zv24wtyoc] {
        grid-template-columns: 1fr;
    }

    .mitarbeiter-card-inner[b-5zv24wtyoc] {
        flex-wrap: wrap;
    }

    .mitarbeiter-aktionen[b-5zv24wtyoc] {
        flex-direction: row;
        width: 100%;
        justify-content: flex-end;
    }

    .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/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-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;
}

/* ── MA-Liste ── */
.ma-liste[b-0o43tw4z1n] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

/* ── MA-Card Header (immer sichtbar) ── */
.ma-card-header[b-0o43tw4z1n] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    cursor: pointer;
    user-select: none;
    padding: 2px 0;
    border-radius: var(--radius-sm);
    transition: background var(--transition-fast);
}

.ma-card-header:hover[b-0o43tw4z1n] {
    background: var(--surface-secondary);
    margin: -2px -6px;
    padding: 4px 6px;
}

.ma-info[b-0o43tw4z1n] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    min-width: 0;
}

.ma-name[b-0o43tw4z1n] {
    font-weight: var(--font-semibold);
    font-size: var(--text-sm-plus);
    color: var(--text-primary);
    white-space: nowrap;
}

.ma-stunden-detail[b-0o43tw4z1n] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
}

.ma-stunden[b-0o43tw4z1n] {
    font-weight: var(--font-semibold);
    font-size: var(--text-md);
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    white-space: nowrap;
    background: var(--dp-slate-50);
    padding: 2px 8px;
    border-radius: var(--radius-sm);
}

.ma-stunden-aufschluesselung[b-0o43tw4z1n] {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.ma-actions[b-0o43tw4z1n] {
    display: flex;
    align-items: center;
    gap: 0;
}

.toggle-icon[b-0o43tw4z1n] {
    color: var(--text-tertiary);
    font-size: var(--icon-sm);
    transition: transform var(--transition-fast);
    margin-left: 2px;
}

/* ── 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-spacer[b-0o43tw4z1n] {
    flex: 1;
}

.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: 40px;
    text-align: center;
    white-space: nowrap;
}

.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);
}

/* ── 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;
    }
}
/* _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: 1;
    margin-bottom: 2px;
}

.tag-nummer--heute[b-kgix9kgqdk] {
    color: var(--dp-blue-600, #2563eb);
    background: var(--dp-blue-100, #dbeafe);
    border-radius: var(--radius-full);
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* ── 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;
}

/* ── 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);
    }
}

@media (max-width: 640px) {
    .kpi-row[b-kgix9kgqdk] {
        grid-template-columns: repeat(2, 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: rgba(234, 88, 12, 0.1);
    color: #ea580c;
}

.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-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-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);
}

/* 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);
}

/* ══════════════════════════════════════
   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--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));
}

.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;
}

.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); }
}

/* ── 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);
    }

}