/* /Components/Home/DailyRegistrations.razor.rz.scp.css */
.daily-registrations-panel[b-0mav7yjxr8] {
    background: #fff;
    padding: 16px 20px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.panel-header[b-0mav7yjxr8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #ffe0cc;
    flex-shrink: 0;
}

.panel-title[b-0mav7yjxr8] {
    color: #f27406;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
}

.panel-meta[b-0mav7yjxr8] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: #6b7280;
    white-space: nowrap;
    flex-shrink: 0;
}

.panel-meta-sep[b-0mav7yjxr8] {
    color: #d1d5db;
}

/* Registrations content - scrollable */
.registrations-content[b-0mav7yjxr8] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}

.registration-section[b-0mav7yjxr8] {
    margin-bottom: 16px;
}

.registration-section:last-child[b-0mav7yjxr8] {
    margin-bottom: 0;
}

/* Section titles */
.section-title[b-0mav7yjxr8] {
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Registration items - compact single row, project-coloured tab */
.registration-item[b-0mav7yjxr8] {
    background: #fafafa;
    border-left: 3px solid transparent;
    border-radius: 6px;
    padding: 8px 12px;
    margin-bottom: 6px;
}

.registration-item:last-child[b-0mav7yjxr8] {
    margin-bottom: 0;
}

.item-row[b-0mav7yjxr8] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.item-project[b-0mav7yjxr8] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    font-size: 0.8rem;
    color: #1a1a2e;
    flex-shrink: 0;
}

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

.item-amount[b-0mav7yjxr8] {
    font-weight: 600;
    font-size: 0.9rem;
    min-width: 50px;
    flex-shrink: 0;
    color: #333;
}

.item-hourtype[b-0mav7yjxr8] {
    font-size: 0.8rem;
    color: #555;
}

.item-separator[b-0mav7yjxr8] {
    font-size: 0.8rem;
    color: #ccc;
}

.item-description[b-0mav7yjxr8] {
    font-size: 0.8rem;
    color: #999;
    font-style: italic;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

/* Rejected items */
.registration-item.rejected[b-0mav7yjxr8] {
    background: #fef2f2;
    border-color: #fecaca;
    border-left: 3px solid #dc2626;
}

.item-rejected-badge[b-0mav7yjxr8] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    color: #dc2626;
    background: rgba(220, 38, 38, 0.1);
    padding: 2px 8px;
    border-radius: 10px;
    margin-left: auto;
    flex-shrink: 0;
    white-space: nowrap;
}

.item-rejection-reason[b-0mav7yjxr8] {
    font-size: 0.75rem;
    color: #991b1b;
    font-style: italic;
    margin-top: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Empty state */
.empty-state[b-0mav7yjxr8] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px 20px;
}

.empty-icon[b-0mav7yjxr8] {
    font-size: 3rem;
    color: #ffe0cc;
    margin-bottom: 16px;
}

.empty-message[b-0mav7yjxr8] {
    font-size: 1rem;
    font-weight: 500;
    color: #666;
    margin-bottom: 8px;
}

.empty-hint[b-0mav7yjxr8] {
    font-size: 0.875rem;
    color: #999;
    margin: 0;
}

/* Loading state with shimmer */
.loading-state[b-0mav7yjxr8] {
    flex: 1;
    padding: 8px 0;
}

@keyframes shimmer-b-0mav7yjxr8 {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

.skeleton-section[b-0mav7yjxr8] {
    margin-bottom: 16px;
}

.skeleton-header[b-0mav7yjxr8] {
    width: 80px;
    height: 16px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-0mav7yjxr8 1.5s infinite;
    border-radius: 4px;
    margin-bottom: 12px;
}

.skeleton-item[b-0mav7yjxr8] {
    height: 36px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-0mav7yjxr8 1.5s infinite;
    border-radius: 6px;
    margin-bottom: 6px;
}

/* Responsive adjustments */
@media (max-width: 640px) {
    .daily-registrations-panel[b-0mav7yjxr8] {
        margin-left: -1rem;
        margin-right: -1rem;
        padding: 16px;
        max-height: 400px;
    }

    .panel-title[b-0mav7yjxr8] {
        font-size: 1rem;
    }

    .empty-icon[b-0mav7yjxr8] {
        font-size: 2.5rem;
    }

    .empty-state[b-0mav7yjxr8] {
        padding: 30px 16px;
    }
}
/* /Components/Home/HourRegistrationForm.razor.rz.scp.css */
.hour-registration-form[b-1enlvrk1g0] {
    background: #fff;
    padding: 16px 20px;
}

.form-title[b-1enlvrk1g0] {
    color: #f27406;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid #ffe0cc;
}

.project-display[b-1enlvrk1g0] {
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 0.9rem;
    color: #555;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.form-row[b-1enlvrk1g0] {
    margin-bottom: 16px;
}

.form-row:last-of-type[b-1enlvrk1g0] {
    margin-bottom: 20px;
}

/* Two form fields side by side */
.form-row-pair[b-1enlvrk1g0] {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

.form-row-pair .form-row[b-1enlvrk1g0] {
    flex: 1;
    min-width: 0;
    margin-bottom: 0;
}

.form-label[b-1enlvrk1g0] {
    display: block;
    font-size: 0.9rem;
    font-weight: 500;
    color: #333;
    margin-bottom: 6px;
}

.form-label-optional[b-1enlvrk1g0] {
    font-size: 0.75rem;
    font-weight: 400;
    color: #9ca3af;
    margin-left: 4px;
}


/* Segmented control for registration type */
.segmented[b-1enlvrk1g0] {
    display: flex;
    gap: 6px;
    width: 100%;
}

.segmented-btn[b-1enlvrk1g0] {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #ffe0cc;
    background: #fff;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 500;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.15s ease;
}

.segmented-btn:hover:not(:disabled)[b-1enlvrk1g0] {
    border-color: #f27406;
    background: #fff5f0;
    color: #ef4220;
}

.segmented-btn.active[b-1enlvrk1g0] {
    border-color: #ef4220;
    background: #fff5f0;
    color: #ef4220;
    font-weight: 600;
}

.segmented-btn:disabled[b-1enlvrk1g0] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Hours input + chips inline */
.hours-input-row[b-1enlvrk1g0] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* Quick chips for hour value presets */
.quick-chips[b-1enlvrk1g0] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    flex: 1;
    min-width: 0;
}

.quick-chip[b-1enlvrk1g0] {
    padding: 4px 12px;
    border: 1px solid #e0e0e0;
    background: #fff;
    border-radius: 999px;
    font-size: 0.85rem;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.15s ease;
}

.quick-chip:hover[b-1enlvrk1g0] {
    border-color: #f27406;
    background: #fff5f0;
    color: #ef4220;
}

.quick-chip.active[b-1enlvrk1g0] {
    border-color: #ef4220;
    background: #fff5f0;
    color: #ef4220;
    font-weight: 600;
}

.form-actions[b-1enlvrk1g0] {
    display: flex;
    justify-content: center;
    padding-top: 12px;
    border-top: 1px solid #f0f0f0;
}

.submit-btn[b-1enlvrk1g0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 20px;
    border: none;
    border-radius: 8px;
    background: #d1d5db;
    color: #fff;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: not-allowed;
    transition: all 0.15s ease;
}

.submit-btn.active[b-1enlvrk1g0] {
    background: #ef4220;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(239, 66, 32, 0.25);
}

.submit-btn.active:hover[b-1enlvrk1g0] {
    background: #d63a1a;
}

/* ComboBox with shimmer loader */
@keyframes shimmer-b-1enlvrk1g0 {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

.combobox-loading-shimmer[b-1enlvrk1g0] {
    width: 100%;
    height: 36px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-1enlvrk1g0 1.5s infinite;
    border-radius: 4px;
}

.combobox-with-loader[b-1enlvrk1g0] {
    position: relative;
}

.combobox-shimmer[b-1enlvrk1g0] {
    position: absolute;
    left: 12px;
    right: 36px;
    top: 50%;
    transform: translateY(-50%);
    height: 14px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-1enlvrk1g0 1.5s infinite;
    border-radius: 4px;
    z-index: 10;
    pointer-events: none;
}

.button-shimmer[b-1enlvrk1g0] {
    display: inline-block;
    width: 16px;
    height: 16px;
    background: linear-gradient(90deg, rgba(255,255,255,0.3) 25%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0.3) 75%);
    background-size: 200% 100%;
    animation: shimmer-b-1enlvrk1g0 1.5s infinite;
    border-radius: 50%;
}

/* Registration blocked state */
.registration-blocked[b-1enlvrk1g0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px 20px;
    text-align: center;
}

.blocked-icon[b-1enlvrk1g0] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(242, 116, 6, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

.blocked-icon i[b-1enlvrk1g0] {
    font-size: 1.5rem;
    color: #f27406;
}

.blocked-title[b-1enlvrk1g0] {
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a2e;
    margin: 0 0 8px 0;
}

.blocked-message[b-1enlvrk1g0] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
    line-height: 1.5;
}

/* Alert styles */
.alert[b-1enlvrk1g0] {
    padding: 12px 16px;
    border-radius: 6px;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
}

.alert-success[b-1enlvrk1g0] {
    background-color: #d4edda;
    border: 1px solid #c3e6cb;
    color: #155724;
}

.alert-danger[b-1enlvrk1g0] {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    color: #721c24;
}

/* Confirmation dialog */
.confirm-overlay[b-1enlvrk1g0] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 16px;
}

.confirm-dialog[b-1enlvrk1g0] {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    max-width: 400px;
    width: 100%;
    text-align: center;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

.confirm-icon[b-1enlvrk1g0] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(242, 116, 6, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
}

.confirm-icon i[b-1enlvrk1g0] {
    font-size: 1.25rem;
    color: #f27406;
}

.confirm-title[b-1enlvrk1g0] {
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a2e;
    margin: 0 0 8px 0;
}

.confirm-message[b-1enlvrk1g0] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0 0 20px 0;
    line-height: 1.5;
}

.confirm-actions[b-1enlvrk1g0] {
    display: flex;
    gap: 10px;
}

.confirm-btn[b-1enlvrk1g0] {
    flex: 1;
    padding: 10px 16px;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    border: none;
}

.confirm-btn-cancel[b-1enlvrk1g0] {
    background: #f0f0f0;
    color: #333;
}

.confirm-btn-cancel:hover[b-1enlvrk1g0] {
    background: #e0e0e0;
}

.confirm-btn-proceed[b-1enlvrk1g0] {
    background: #f27406;
    color: #fff;
}

.confirm-btn-proceed:hover[b-1enlvrk1g0] {
    background: #ef4220;
}

/* Responsive adjustments */
@media (max-width: 640px) {
    .hour-registration-form[b-1enlvrk1g0] {
        margin-left: -1rem;
        margin-right: -1rem;
        padding: 12px 16px;
    }

    .form-title[b-1enlvrk1g0] {
        display: none;
    }

    .form-actions[b-1enlvrk1g0] {
        position: sticky;
        bottom: 0;
        background: #fff;
        margin: 16px -16px 0 -16px;
        padding: 12px 16px env(safe-area-inset-bottom, 12px) 16px;
        border-top: 1px solid #f0f0f0;
        box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
        z-index: 5;
    }

    .submit-btn[b-1enlvrk1g0] {
        width: 100%;
    }
}
/* /Components/Home/WeekSelector.razor.rz.scp.css */
/* Container — flat, contained, no floating card chrome */
.week-selector-container[b-6uos5r8d37] {
    background: #fff;
    padding: 14px 16px;
    margin: 0 auto 12px auto;
    max-width: 1200px;
    overflow: hidden;
}

.week-selector-header[b-6uos5r8d37] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 4px;
}

.week-nav-row[b-6uos5r8d37] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.week-title-toggle[b-6uos5r8d37] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: none;
    border: none;
    padding: 6px 12px;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.15s ease;
    color: #1a1a2e;
}

.week-title-toggle:hover[b-6uos5r8d37] {
    background: #fff5f0;
}

.week-title-toggle strong[b-6uos5r8d37] {
    font-size: 1rem;
    color: #1a1a2e;
}

.week-subtitle[b-6uos5r8d37] {
    font-size: 0.875rem;
    color: #6c757d;
}

.date-toggle-icon[b-6uos5r8d37] {
    font-size: 0.75rem;
    color: #9ca3af;
    transition: transform 0.2s ease;
}

.date-toggle-icon.open[b-6uos5r8d37] {
    transform: rotate(180deg);
}

.week-date-picker-popover[b-6uos5r8d37] {
    margin-top: 4px;
    padding: 8px;
    background: #fff5f0;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
}

.week-nav-btn-wrapper[b-6uos5r8d37] {
    position: relative;
    flex-shrink: 0;
}

.week-rejected-indicator[b-6uos5r8d37] {
    position: absolute;
    top: -2px;
    right: -2px;
    font-size: 0.6rem;
    color: #dc2626;
    background: #fff;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.week-nav-btn[b-6uos5r8d37] {
    background: none;
    border: none;
    padding: 8px;
    cursor: pointer;
    color: #6c757d;
    border-radius: 8px;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.week-nav-btn:hover[b-6uos5r8d37] {
    background: #fff5f0;
    color: #ef4220;
}

/* Status badge */
.week-status-badge[b-6uos5r8d37] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 12px;
    width: fit-content;
    letter-spacing: 0.02em;
}

.week-status-badge.status-open[b-6uos5r8d37] {
    color: #f27406;
    background: rgba(242, 116, 6, 0.1);
}

.week-status-badge.status-complete[b-6uos5r8d37] {
    color: #2563eb;
    background: rgba(37, 99, 235, 0.1);
}

.week-status-badge.status-awaiting-approval[b-6uos5r8d37] {
    color: #b45309;
    background: rgba(180, 83, 9, 0.12);
}

.week-status-badge.status-fiatted[b-6uos5r8d37] {
    color: #16a34a;
    background: rgba(22, 163, 74, 0.1);
}

.week-status-badge.status-rejected[b-6uos5r8d37] {
    color: #dc2626;
    background: rgba(220, 38, 38, 0.1);
}

.week-status-badge.status-processed[b-6uos5r8d37] {
    color: #475569;
    background: rgba(71, 85, 105, 0.1);
}

.status-badge-skeleton[b-6uos5r8d37] {
    display: inline-block;
    width: 72px;
    height: 22px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-6uos5r8d37 1.5s infinite;
    border-radius: 12px;
}

/* Day strip */
.week-days-scroll[b-6uos5r8d37] {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding: 4px 0 6px 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.15) transparent;
}

.week-days-scroll[b-6uos5r8d37]::-webkit-scrollbar {
    height: 3px;
}

.week-days-scroll[b-6uos5r8d37]::-webkit-scrollbar-track {
    background: transparent;
}

.week-days-scroll[b-6uos5r8d37]::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
    border-radius: 999px;
}

.week-days-scroll[b-6uos5r8d37]::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.25);
}

.day-card[b-6uos5r8d37] {
    flex: 0 0 auto;
    width: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 6px 4px;
    border: 1px solid transparent;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    background: transparent;
    position: relative;
}

.day-card:hover[b-6uos5r8d37] {
    background: #fff5f0;
}

.day-card.today[b-6uos5r8d37] {
    background: #fff5f0;
}

.day-card.selected[b-6uos5r8d37],
.day-card.selected:hover[b-6uos5r8d37] {
    background: #ef4220;
    border-color: #ef4220;
}

.day-card.selected .day-name[b-6uos5r8d37],
.day-card.selected .day-number[b-6uos5r8d37],
.day-card.selected .day-hours[b-6uos5r8d37] {
    color: #fff;
}

.day-card.has-rejection[b-6uos5r8d37] {
    background: rgba(220, 38, 38, 0.08);
}

.day-card.has-rejection:hover[b-6uos5r8d37] {
    background: rgba(220, 38, 38, 0.12);
}

.day-card.has-rejection.selected[b-6uos5r8d37],
.day-card.has-rejection.selected:hover[b-6uos5r8d37] {
    background: #dc2626;
    border-color: #dc2626;
}

.day-card.has-rejection .day-name[b-6uos5r8d37] {
    color: #dc2626;
}

.day-card.has-rejection .day-number[b-6uos5r8d37] {
    color: #991b1b;
}

.day-rejection-icon[b-6uos5r8d37] {
    position: absolute;
    top: -6px;
    right: -6px;
    color: #dc2626;
    font-size: 0.75rem;
    background: #fff;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(220, 38, 38, 0.3);
}

.day-name[b-6uos5r8d37] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 2px;
}

.day-number[b-6uos5r8d37] {
    font-size: 1.15rem;
    font-weight: 600;
    color: #1a1a2e;
    margin-bottom: 2px;
}

.day-hours[b-6uos5r8d37] {
    font-size: 0.7rem;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 4px;
}

.day-hours.hours-short[b-6uos5r8d37] {
    color: #dc2626;
}

/* Bottom — summary row + actions row */
.week-bottom[b-6uos5r8d37] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #fff0e6;
}

.week-summary-row[b-6uos5r8d37] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.week-status-wrapper[b-6uos5r8d37] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.week-status-header[b-6uos5r8d37] {
    font-size: 0.65rem;
    font-weight: 500;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.week-summary-text[b-6uos5r8d37] {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    font-size: 0.9rem;
}

.summary-current[b-6uos5r8d37] {
    font-weight: 700;
    color: #ef4220;
}

.summary-current.met-target[b-6uos5r8d37] {
    color: #16a34a;
}

.summary-sep[b-6uos5r8d37] {
    color: #d1d5db;
}

.summary-target[b-6uos5r8d37] {
    font-weight: 600;
    color: #6b7280;
}

.summary-suffix[b-6uos5r8d37] {
    color: #9ca3af;
    font-size: 0.85rem;
}

.week-actions-row[b-6uos5r8d37] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.week-overview-link[b-6uos5r8d37],
.complete-btn[b-6uos5r8d37] {
    flex: 1;
    justify-content: center;
}

.week-overview-link[b-6uos5r8d37] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    font-weight: 500;
    color: #f27406;
    text-decoration: none;
    padding: 6px 12px;
    border: 1px solid #ffe0cc;
    border-radius: 6px;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.week-overview-link:hover[b-6uos5r8d37] {
    background: #fff5f0;
    border-color: #f27406;
    color: #ef4220;
}

.complete-btn[b-6uos5r8d37] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #fff;
    background: #f27406;
    border: none;
    padding: 6px 14px;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s ease;
    white-space: nowrap;
}

.complete-btn:hover[b-6uos5r8d37] {
    background: #ef4220;
}

/* Skeleton loading */
@keyframes shimmer-b-6uos5r8d37 {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.skeleton-value[b-6uos5r8d37] {
    display: inline-block;
    width: 24px;
    height: 12px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-6uos5r8d37 1.5s infinite;
    border-radius: 4px;
}

.skeleton-total[b-6uos5r8d37] {
    display: inline-block;
    width: 32px;
    height: 16px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-6uos5r8d37 1.5s infinite;
    border-radius: 4px;
}

/* Center the day strip on wider screens (no scrollbar needed) */
@media (min-width: 750px) {
    .week-days-scroll[b-6uos5r8d37] {
        gap: 8px;
        justify-content: center;
        overflow-x: visible;
    }

    .week-days-scroll[b-6uos5r8d37]::-webkit-scrollbar {
        display: none;
    }

    .day-card[b-6uos5r8d37] {
        width: 84px;
        padding: 10px 6px;
    }

    .day-name[b-6uos5r8d37] {
        font-size: 0.75rem;
        margin-bottom: 4px;
    }

    .day-number[b-6uos5r8d37] {
        font-size: 1.4rem;
        margin-bottom: 4px;
    }

    .day-hours[b-6uos5r8d37] {
        font-size: 0.75rem;
    }
}

/* Mobile — break out of layout's 1rem padding for edge-to-edge */
@media (max-width: 640px) {
    .week-selector-container[b-6uos5r8d37] {
        margin-left: -1rem;
        margin-right: -1rem;
        margin-bottom: 0;
        max-width: none;
        padding-bottom: 8px;
    }

    .day-card[b-6uos5r8d37] {
        width: 52px;
    }

}
/* /Components/ProjectDetail/Tabs/BudgetTab.razor.rz.scp.css */
.tab-panel[b-5oe9bckvgq] {
    margin-bottom: 20px;
}

/* ── Inner collapsible chevron (Project bewaking) ── */
.budget-chevron[b-5oe9bckvgq] {
    font-size: 0.7rem;
    color: #999;
    transition: transform 0.2s ease;
}

.budget-chevron.expanded[b-5oe9bckvgq] {
    transform: rotate(180deg);
}

/* ─── Financial tile (unified Financieel Overzicht) ─── */
.fin-tile[b-5oe9bckvgq] {
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 10px;
    padding: 20px 24px;
    margin-top: 10px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

.fin-progress-row[b-5oe9bckvgq] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
}

.fin-progress-bar[b-5oe9bckvgq] {
    flex: 1;
    height: 10px;
    background: #f0f0f0;
    border-radius: 5px;
    overflow: hidden;
}

.fin-progress-fill[b-5oe9bckvgq] {
    height: 100%;
    border-radius: 5px;
    transition: width 0.3s ease;
}

.fin-progress-pct[b-5oe9bckvgq] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #666;
    white-space: nowrap;
}

/* 3 headline metrics */
.fin-metrics[b-5oe9bckvgq] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 20px;
}

.fin-metric[b-5oe9bckvgq] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.fin-metric-label[b-5oe9bckvgq] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #999;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.fin-metric-value[b-5oe9bckvgq] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #333;
    font-variant-numeric: tabular-nums;
}

.fin-metric-desc[b-5oe9bckvgq] {
    font-size: 0.7rem;
    color: #aaa;
}

.fin-metric-formula[b-5oe9bckvgq] {
    font-size: 0.65rem;
    color: #bbb;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    margin-top: 2px;
}

/* Result color classes */
.fin-tile .fin-positive[b-5oe9bckvgq],
.fin-lines-section .fin-positive[b-5oe9bckvgq] {
    color: #16a34a;
}

.fin-tile .fin-negative[b-5oe9bckvgq],
.fin-lines-section .fin-negative[b-5oe9bckvgq] {
    color: #dc2626;
}

.fin-progress-fill.fin-positive[b-5oe9bckvgq] {
    background: #16a34a;
}

.fin-progress-fill.fin-negative[b-5oe9bckvgq] {
    background: #dc2626;
}

.fin-divider[b-5oe9bckvgq] {
    height: 1px;
    background: #f0f0f0;
    margin: 0 0 20px 0;
}

/* Kosten + Opbrengsten totals */
.fin-totals[b-5oe9bckvgq] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
}

.fin-totals-group[b-5oe9bckvgq] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fin-totals-title[b-5oe9bckvgq] {
    font-size: 0.75rem;
    font-weight: 700;
    color: #333;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding-bottom: 4px;
    border-bottom: 1px solid #f0f0f0;
}

.fin-totals-row[b-5oe9bckvgq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fin-totals-label[b-5oe9bckvgq] {
    font-size: 0.8rem;
    color: #666;
}

.fin-totals-value[b-5oe9bckvgq] {
    font-size: 0.88rem;
    font-weight: 600;
    color: #333;
    font-variant-numeric: tabular-nums;
}

/* Budget regels expandable */
.fin-lines-section[b-5oe9bckvgq] {
    margin-top: 10px;
}

.fin-lines-header[b-5oe9bckvgq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 18px;
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s;
}

.fin-lines-header:hover[b-5oe9bckvgq] {
    background: #fafafa;
}

.fin-lines-title[b-5oe9bckvgq] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #444;
}

.fin-lines-title i[b-5oe9bckvgq] {
    color: #f27406;
}

.fin-lines-list[b-5oe9bckvgq] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 6px;
}

.fin-line-card[b-5oe9bckvgq] {
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 8px;
    padding: 10px 14px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.fin-line-card.compact[b-5oe9bckvgq] {
    padding: 8px 12px;
}

.fin-line-header[b-5oe9bckvgq] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}

.fin-line-code[b-5oe9bckvgq] {
    font-size: 0.7rem;
    font-weight: 700;
    color: #f27406;
    background: rgba(242, 116, 6, 0.08);
    padding: 2px 8px;
    border-radius: 4px;
}

.fin-line-desc[b-5oe9bckvgq] {
    flex: 1;
    font-size: 0.8rem;
    font-weight: 600;
    color: #333;
}

.fin-line-grid[b-5oe9bckvgq] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 14px;
}

.fin-line-col[b-5oe9bckvgq] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.fin-line-col-title[b-5oe9bckvgq] {
    font-size: 0.65rem;
    font-weight: 700;
    color: #333;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding-bottom: 3px;
    border-bottom: 1px solid #f0f0f0;
}

.fin-line-col-row[b-5oe9bckvgq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.fin-line-col-label[b-5oe9bckvgq] {
    font-size: 0.7rem;
    color: #888;
}

.fin-line-col-value[b-5oe9bckvgq] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #333;
    font-variant-numeric: tabular-nums;
}

/* Skeleton */
@keyframes shimmer-b-5oe9bckvgq {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.budget-skeleton[b-5oe9bckvgq] {
    margin-top: 10px;
}

.budget-skeleton-card[b-5oe9bckvgq] {
    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 10px;
    padding: 20px 24px;
}

.budget-skeleton-grid[b-5oe9bckvgq] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 28px;
}

.budget-skeleton-group[b-5oe9bckvgq] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.skeleton-line[b-5oe9bckvgq] {
    height: 12px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-5oe9bckvgq 1.5s infinite;
    border-radius: 4px;
}

.skeleton-line.short[b-5oe9bckvgq] { width: 60%; }
.skeleton-line.medium[b-5oe9bckvgq] { width: 80%; }

.skeleton-bar[b-5oe9bckvgq] {
    height: 6px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-5oe9bckvgq 1.5s infinite;
    border-radius: 3px;
}

/* Error + empty state */
.lines-error[b-5oe9bckvgq] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    background: #fff5f5;
    border: 1px solid #ffe0e0;
    border-radius: 8px;
    color: #c53030;
    font-size: 0.88rem;
}

.lines-error i[b-5oe9bckvgq] {
    font-size: 1rem;
}

.empty-state[b-5oe9bckvgq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(239, 66, 32, 0.08);
}

.empty-state-small[b-5oe9bckvgq] {
    padding: 40px 20px;
}

.empty-icon[b-5oe9bckvgq] {
    font-size: 3rem;
    color: #ffe0cc;
    margin-bottom: 16px;
}

.empty-state-small .empty-icon[b-5oe9bckvgq] {
    font-size: 2.2rem;
    margin-bottom: 12px;
}

.empty-message[b-5oe9bckvgq] {
    font-size: 1rem;
    font-weight: 500;
    color: #666;
    margin: 0;
}

/* Mobile */
@media (max-width: 768px) {
    .fin-metrics[b-5oe9bckvgq],
    .fin-totals[b-5oe9bckvgq],
    .fin-line-grid[b-5oe9bckvgq],
    .budget-skeleton-grid[b-5oe9bckvgq] {
        grid-template-columns: 1fr;
        gap: 18px;
    }
}
/* /Components/ProjectDetail/Tabs/OverviewTab.razor.rz.scp.css */
.tab-panel[b-d2v2mm65oj] {
    margin-bottom: 20px;
}

/* ── Filter pills ── */
.filter-section[b-d2v2mm65oj] {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}

.filter-field[b-d2v2mm65oj] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    max-width: 220px;
}

.filter-label[b-d2v2mm65oj] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #888;
}

.filter-select[b-d2v2mm65oj] {
    padding: 8px 12px;
    border: 1.5px solid #e0e0e0;
    border-radius: 8px;
    background: #fff;
    font-size: 0.85rem;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    transition: border-color 0.15s;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 32px;
}

.filter-select:hover[b-d2v2mm65oj] {
    border-color: #ccc;
}

.filter-select:focus[b-d2v2mm65oj] {
    outline: none;
    border-color: #f27406;
    box-shadow: 0 0 0 2px rgba(242, 116, 6, 0.15);
}

/* ── Selection banner ── */
.selection-banner[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 10px;
    margin-bottom: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.07);
}

.selection-banner-left[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.selection-banner-right[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.selection-count[b-d2v2mm65oj] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    background: #f27406;
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    border-radius: 6px;
    white-space: nowrap;
}

.selection-clear[b-d2v2mm65oj] {
    background: none;
    border: none;
    color: #999;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.15s;
}

.selection-clear:hover[b-d2v2mm65oj] {
    color: #555;
    background: #f5f5f5;
}

.banner-btn[b-d2v2mm65oj] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 16px;
    border: none;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}

.banner-btn:disabled[b-d2v2mm65oj] {
    opacity: 0.5;
    cursor: not-allowed;
}

.banner-approve[b-d2v2mm65oj] {
    background: #16a34a;
    color: #fff;
}

.banner-approve:hover:not(:disabled)[b-d2v2mm65oj] {
    background: #15803d;
}

.banner-deny[b-d2v2mm65oj] {
    background: transparent;
    color: #dc2626;
    border: 1.5px solid #dc2626;
}

.banner-deny:hover:not(:disabled)[b-d2v2mm65oj] {
    background: rgba(220, 38, 38, 0.06);
}

/* ── Action bar ── */
.action-bar[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 32px;
    gap: 12px;
    flex-wrap: wrap;
}

.action-bar-left[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.action-bar-right[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.select-all-label[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.82rem;
    color: #555;
    cursor: pointer;
    user-select: none;
}

.select-all-label input[type="checkbox"][b-d2v2mm65oj] {
    width: 16px;
    height: 16px;
    accent-color: #f27406;
    cursor: pointer;
}

.registrations-count[b-d2v2mm65oj] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #999;
}

/* Approve messages */
.approve-message[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 0.82rem;
    font-weight: 500;
    margin-bottom: 12px;
}

.approve-message-success[b-d2v2mm65oj] {
    background: rgba(22, 163, 74, 0.08);
    border: 1px solid rgba(22, 163, 74, 0.2);
    color: #16a34a;
}

.approve-message-error[b-d2v2mm65oj] {
    background: #fff5f5;
    border: 1px solid #ffe0e0;
    color: #c53030;
}

/* ── Date groups ── */
.date-group[b-d2v2mm65oj] {
    margin-bottom: 20px;
}

.date-group-header[b-d2v2mm65oj] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 0 4px 8px 4px;
}

.date-info[b-d2v2mm65oj] {
    display: flex;
    align-items: baseline;
    gap: 10px;
}

.date-text[b-d2v2mm65oj] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #555;
    text-transform: capitalize;
}

.date-count[b-d2v2mm65oj] {
    font-size: 0.72rem;
    color: #aaa;
    font-weight: 500;
}

.date-totals[b-d2v2mm65oj] {
    display: flex;
    align-items: baseline;
    gap: 14px;
}

.date-hours[b-d2v2mm65oj] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #f27406;
}

.date-costs[b-d2v2mm65oj] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #555;
}

/* ── Registration cards ── */
.date-group-cards[b-d2v2mm65oj] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.registration-card[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 10px;
    background: #fff;
    border: 1px solid #e8e8ed;
    transition: all 0.15s;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.registration-card:hover[b-d2v2mm65oj] {
    border-color: #d0d0d8;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.registration-card.selected[b-d2v2mm65oj] {
    background: rgba(242, 116, 6, 0.03);
    border-color: rgba(242, 116, 6, 0.25);
}

.card-checkbox[b-d2v2mm65oj] {
    width: 16px;
    height: 16px;
    accent-color: #f27406;
    cursor: pointer;
    flex-shrink: 0;
}

.card-checkbox-spacer[b-d2v2mm65oj] {
    width: 16px;
    flex-shrink: 0;
}

.card-type-icon[b-d2v2mm65oj] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 0.75rem;
}

.card-type-icon.type-hours[b-d2v2mm65oj] {
    background: rgba(242, 116, 6, 0.1);
    color: #f27406;
}

.card-type-icon.type-costs[b-d2v2mm65oj] {
    background: rgba(22, 163, 74, 0.1);
    color: #16a34a;
}

.card-type-icon.type-amounts[b-d2v2mm65oj] {
    background: rgba(37, 99, 235, 0.1);
    color: #2563eb;
}

.card-content[b-d2v2mm65oj] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.card-top-row[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.card-employee[b-d2v2mm65oj] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.card-hourgroup[b-d2v2mm65oj] {
    font-size: 0.68rem;
    color: #666;
    background: #e8e8e8;
    padding: 1px 8px;
    border-radius: 4px;
    white-space: nowrap;
    flex-shrink: 0;
    font-weight: 600;
}

.card-hourtype[b-d2v2mm65oj] {
    font-size: 0.68rem;
    color: #888;
    background: #f0f0f0;
    padding: 1px 8px;
    border-radius: 4px;
    white-space: nowrap;
    flex-shrink: 0;
}

.card-description[b-d2v2mm65oj] {
    font-size: 0.75rem;
    color: #999;
    font-style: italic;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.card-right[b-d2v2mm65oj] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.card-value[b-d2v2mm65oj] {
    width: 80px;
    font-size: 0.88rem;
    font-weight: 700;
    color: #333;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    text-align: right;
}

.card-status[b-d2v2mm65oj] {
    font-size: 0.72rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 6px;
    white-space: nowrap;
    text-align: center;
    background: transparent;
    border: 1.5px solid transparent;
}

.card-status.status-pending[b-d2v2mm65oj] {
    color: #f27406;
    border-color: #f27406;
}

.card-status.status-approved[b-d2v2mm65oj] {
    color: #16a34a;
    border-color: #16a34a;
}

.card-status.status-processed[b-d2v2mm65oj] {
    color: #475569;
    border-color: #475569;
}

.card-actions[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 4px;
    width: 60px;
    justify-content: flex-end;
}

.card-action-btn[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    font-size: 0.78rem;
    transition: all 0.15s;
}

.card-action-approve[b-d2v2mm65oj] {
    background: rgba(22, 163, 74, 0.1);
    color: #16a34a;
}

.card-action-approve:hover:not(:disabled)[b-d2v2mm65oj] {
    background: #16a34a;
    color: #fff;
}

.card-action-approve:disabled[b-d2v2mm65oj] {
    opacity: 0.5;
    cursor: not-allowed;
}

.card-action-deny[b-d2v2mm65oj] {
    background: rgba(220, 38, 38, 0.1);
    color: #dc2626;
}

.card-action-deny:hover[b-d2v2mm65oj] {
    background: #dc2626;
    color: #fff;
}

/* ── Skeleton loaders ── */
@keyframes shimmer-b-d2v2mm65oj {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.cards-skeleton[b-d2v2mm65oj] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.card-skeleton[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid #f0f0f0;
}

.skeleton-circle[b-d2v2mm65oj] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-d2v2mm65oj 1.5s infinite;
    flex-shrink: 0;
}

.skeleton-lines[b-d2v2mm65oj] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.skeleton-line[b-d2v2mm65oj] {
    height: 12px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-d2v2mm65oj 1.5s infinite;
    border-radius: 4px;
}

.skeleton-line.short[b-d2v2mm65oj] { width: 60%; }
.skeleton-line.medium[b-d2v2mm65oj] { width: 80%; }

/* ── Error + empty state ── */
.lines-error[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    background: #fff5f5;
    border: 1px solid #ffe0e0;
    border-radius: 8px;
    color: #c53030;
    font-size: 0.88rem;
}

.lines-error i[b-d2v2mm65oj] {
    font-size: 1rem;
}

.empty-state[b-d2v2mm65oj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(239, 66, 32, 0.08);
}

.empty-state-small[b-d2v2mm65oj] {
    padding: 40px 20px;
}

.empty-icon[b-d2v2mm65oj] {
    font-size: 3rem;
    color: #ffe0cc;
    margin-bottom: 16px;
}

.empty-state-small .empty-icon[b-d2v2mm65oj] {
    font-size: 2.2rem;
    margin-bottom: 12px;
}

.empty-message[b-d2v2mm65oj] {
    font-size: 1rem;
    font-weight: 500;
    color: #666;
    margin: 0;
}

.empty-hint[b-d2v2mm65oj] {
    font-size: 0.85rem;
    color: #999;
    margin: 6px 0 0 0;
}

/* ── Reject dialog ── */
@keyframes fadeIn-b-d2v2mm65oj {
    from { opacity: 0; }
    to { opacity: 1; }
}

.reject-backdrop[b-d2v2mm65oj] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 999;
    animation: fadeIn-b-d2v2mm65oj 0.15s ease;
}

.reject-dialog[b-d2v2mm65oj] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    width: 420px;
    max-width: calc(100vw - 32px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
    z-index: 1000;
    animation: fadeIn-b-d2v2mm65oj 0.15s ease;
}

.reject-dialog-header[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.reject-dialog-header i[b-d2v2mm65oj] {
    font-size: 1.2rem;
    color: #dc2626;
}

.reject-dialog-header span[b-d2v2mm65oj] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #333;
}

.reject-dialog-desc[b-d2v2mm65oj] {
    font-size: 0.85rem;
    color: #888;
    margin: 0 0 16px 0;
    line-height: 1.4;
}

.reject-reason-input[b-d2v2mm65oj] {
    width: 100%;
    padding: 10px 12px;
    border: 1.5px solid #e0e0e0;
    border-radius: 8px;
    font-size: 0.88rem;
    font-family: inherit;
    resize: vertical;
    min-height: 72px;
    transition: border-color 0.15s;
    box-sizing: border-box;
}

.reject-reason-input:focus[b-d2v2mm65oj] {
    outline: none;
    border-color: #dc2626;
}

.reject-reason-input[b-d2v2mm65oj]::placeholder {
    color: #bbb;
}

.reject-dialog-actions[b-d2v2mm65oj] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
}

.reject-cancel-btn[b-d2v2mm65oj] {
    display: inline-flex;
    align-items: center;
    padding: 8px 18px;
    border: 1.5px solid #e0e0e0;
    border-radius: 8px;
    background: #fff;
    color: #666;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
}

.reject-cancel-btn:hover[b-d2v2mm65oj] {
    background: #f5f5f5;
    border-color: #ccc;
}

.reject-confirm-btn[b-d2v2mm65oj] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 18px;
    border: none;
    border-radius: 8px;
    background: #dc2626;
    color: #fff;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}

.reject-confirm-btn:hover:not(:disabled)[b-d2v2mm65oj] {
    background: #b91c1c;
}

.reject-confirm-btn:disabled[b-d2v2mm65oj] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Mobile ── */
@media (max-width: 768px) {
    .filter-section[b-d2v2mm65oj] {
        flex-direction: column;
    }

    .filter-field[b-d2v2mm65oj] {
        max-width: none;
    }

    .action-bar[b-d2v2mm65oj] {
        flex-direction: column;
        align-items: flex-start;
    }

    .selection-banner[b-d2v2mm65oj] {
        flex-direction: column;
        gap: 10px;
        align-items: stretch;
    }

    .selection-banner-left[b-d2v2mm65oj] {
        justify-content: space-between;
    }

    .selection-banner-right[b-d2v2mm65oj] {
        justify-content: flex-end;
    }

    .banner-btn[b-d2v2mm65oj] {
        padding: 7px 12px;
        font-size: 0.78rem;
    }
}

@media (max-width: 640px) {
    .registration-card[b-d2v2mm65oj] {
        flex-wrap: wrap;
        gap: 4px;
        padding: 10px 12px;
    }

    .card-checkbox[b-d2v2mm65oj] {
        width: 14px;
        height: 14px;
    }

    .card-checkbox-spacer[b-d2v2mm65oj] {
        width: 14px;
    }

    .card-type-icon[b-d2v2mm65oj] {
        width: 26px;
        height: 26px;
        font-size: 0.65rem;
    }

    .card-content[b-d2v2mm65oj] {
        flex: 1 1 0;
        min-width: 0;
    }

    .card-top-row[b-d2v2mm65oj] {
        flex-wrap: wrap;
        gap: 4px;
    }

    .card-employee[b-d2v2mm65oj] {
        font-size: 0.8rem;
    }

    .card-right[b-d2v2mm65oj] {
        width: 100%;
        justify-content: flex-end;
        margin-top: 4px;
        padding-left: 40px;
    }

    .card-value[b-d2v2mm65oj] {
        width: auto;
        font-size: 0.82rem;
    }

    .card-status[b-d2v2mm65oj] {
        padding: 2px 8px;
        font-size: 0.68rem;
    }

    .card-actions[b-d2v2mm65oj] {
        width: auto;
    }

    .card-action-btn[b-d2v2mm65oj] {
        width: 26px;
        height: 26px;
        font-size: 0.72rem;
    }

    .date-group-header[b-d2v2mm65oj] {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
    }
}

@media (max-width: 360px) {
    .card-right[b-d2v2mm65oj] {
        padding-left: 0;
    }

    .selection-banner[b-d2v2mm65oj] {
        padding: 8px 10px;
    }

    .selection-count[b-d2v2mm65oj] {
        font-size: 0.72rem;
        padding: 3px 8px;
    }

    .banner-btn[b-d2v2mm65oj] {
        padding: 6px 10px;
        font-size: 0.72rem;
    }
}
/* /Components/ProjectDetail/Tabs/TeamTab.razor.rz.scp.css */
.tab-panel[b-4j02x6o3bb] {
    margin-bottom: 20px;
}

/* ── Inner toolbar: tab strip + member pill (left) + week selector (right) ── */
.inner-toolbar[b-4j02x6o3bb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.inner-tabs[b-4j02x6o3bb] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px;
    background: #f5f5f7;
    border-radius: 10px;
}

.inner-tab[b-4j02x6o3bb] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border: none;
    background: transparent;
    color: #888;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    border-radius: 8px;
    transition: all 0.15s;
    white-space: nowrap;
}

.inner-tab i[b-4j02x6o3bb] {
    font-size: 0.78rem;
}

.inner-tab:hover[b-4j02x6o3bb] {
    color: #555;
}

.inner-tab.active[b-4j02x6o3bb] {
    background: #fff;
    color: #f27406;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

/* ── Week selector ── */
.week-selector[b-4j02x6o3bb] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.week-nav-btn[b-4j02x6o3bb] {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e8e8ed;
    border-radius: 8px;
    background: #fff;
    color: #555;
    cursor: pointer;
    transition: all 0.15s;
}

.week-nav-btn:hover[b-4j02x6o3bb] {
    border-color: #f27406;
    color: #f27406;
}

.week-label[b-4j02x6o3bb] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 8px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #444;
    white-space: nowrap;
}

.week-label i[b-4j02x6o3bb] {
    color: #bbb;
    font-size: 0.78rem;
}

.week-number[b-4j02x6o3bb] {
    color: #333;
}

.week-range[b-4j02x6o3bb] {
    color: #888;
    font-weight: 500;
}

/* ── Weekly grid ── */
.weekly-grid-wrapper[b-4j02x6o3bb] {
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
    overflow-x: auto;
    margin-bottom: 12px;
}

.weekly-grid[b-4j02x6o3bb] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
    font-variant-numeric: tabular-nums;
}

.weekly-grid thead th[b-4j02x6o3bb] {
    padding: 12px 10px;
    background: #fafafa;
    color: #888;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-bottom: 1px solid #eaeaea;
    border-right: 1px solid #eaeaea;
    text-align: center;
    white-space: nowrap;
}

.weekly-grid thead th:last-child[b-4j02x6o3bb] {
    border-right: none;
}

.weekly-grid thead .th-employee[b-4j02x6o3bb] {
    text-align: left;
    padding-left: 16px;
    min-width: 200px;
    background: #f5f5f7;
    border-right: 1px solid #e8e8ed;
}

.weekly-grid thead .th-day[b-4j02x6o3bb] {
    min-width: 64px;
}

.weekly-grid thead .th-day .day-name[b-4j02x6o3bb] {
    font-size: 0.72rem;
    color: #888;
}

.weekly-grid thead .th-day .day-num[b-4j02x6o3bb] {
    font-size: 0.92rem;
    font-weight: 700;
    color: #333;
    margin-top: 2px;
}

.weekly-grid thead .th-day.today[b-4j02x6o3bb] {
    background: rgba(242, 116, 6, 0.08);
}

.weekly-grid thead .th-day.today .day-num[b-4j02x6o3bb] {
    color: #f27406;
}

.weekly-grid thead .th-day.weekend[b-4j02x6o3bb] {
    background: #f8f8fa;
}

.weekly-grid thead .th-total[b-4j02x6o3bb] {
    text-align: right;
    padding-right: 16px;
    min-width: 110px;
}

.weekly-grid tbody tr[b-4j02x6o3bb] {
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.1s;
}

.weekly-grid tbody tr:hover[b-4j02x6o3bb] {
    background: #fafafa;
}

.weekly-grid td[b-4j02x6o3bb] {
    padding: 12px 10px;
    text-align: center;
    color: #333;
    border-right: 1px solid #f0f0f0;
}

.weekly-grid td:last-child[b-4j02x6o3bb] {
    border-right: none;
}

.weekly-grid .td-employee[b-4j02x6o3bb] {
    text-align: left;
    padding-left: 16px;
    background: #f5f5f7;
    border-right: 1px solid #e8e8ed;
    min-width: 200px;
}

.weekly-grid .td-employee-inner[b-4j02x6o3bb] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.weekly-grid tbody tr:hover .td-employee[b-4j02x6o3bb] {
    background: #eeeef1;
}

.weekly-grid .emp-name[b-4j02x6o3bb] {
    font-weight: 600;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.weekly-grid .td-cell[b-4j02x6o3bb] {
    font-weight: 600;
}

.weekly-grid .td-cell.today[b-4j02x6o3bb] {
    background: rgba(242, 116, 6, 0.04);
}

.weekly-grid .td-cell.weekend[b-4j02x6o3bb] {
    background: #f8f8fa;
    color: #999;
}

.weekly-grid .td-cell.has-pending[b-4j02x6o3bb] {
    color: var(--status-pending);
}

.weekly-grid .td-cell.has-draft[b-4j02x6o3bb] {
    color: var(--status-draft);
}

.weekly-grid .td-cell.has-approved[b-4j02x6o3bb] {
    color: var(--status-approved);
}

.weekly-grid .dash[b-4j02x6o3bb] {
    color: #ccc;
    font-weight: 500;
}

.weekly-grid .td-total[b-4j02x6o3bb] {
    text-align: right;
    padding-right: 16px;
    font-weight: 700;
    white-space: nowrap;
}

.weekly-grid .td-total.has-pending .total-main[b-4j02x6o3bb] { color: var(--status-pending); }
.weekly-grid .td-total.has-draft .total-main[b-4j02x6o3bb] { color: var(--status-draft); }
.weekly-grid .td-total.has-approved .total-main[b-4j02x6o3bb] { color: var(--status-approved); }

.weekly-grid .total-pending[b-4j02x6o3bb] {
    color: var(--status-pending);
    font-size: 0.78rem;
    font-weight: 600;
}

.weekly-grid .total-pending.draft-only[b-4j02x6o3bb] {
    color: var(--status-draft);
}

/* Footer (DAGTOTAAL) */
.weekly-grid tfoot td[b-4j02x6o3bb] {
    background: #fafafa;
    border-top: 1px solid #eaeaea;
    font-weight: 700;
}

.weekly-grid tfoot .td-daytotal-label[b-4j02x6o3bb] {
    color: #888;
    font-size: 0.7rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-align: left;
    padding-left: 16px;
    background: #f5f5f7;
    border-right: 1px solid #e8e8ed;
}

.weekly-grid tfoot .td-day-total.weekend[b-4j02x6o3bb] {
    color: #aaa;
}

.weekly-grid tfoot .td-grand-total[b-4j02x6o3bb] {
    text-align: right;
    padding-right: 16px;
    color: #333;
}

/* ── Legend ── */
.weekly-legend[b-4j02x6o3bb] {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    padding: 4px 4px;
    font-size: 0.78rem;
    color: #888;
}

.legend-item[b-4j02x6o3bb] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.legend-swatch[b-4j02x6o3bb] {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 2px;
}

.legend-swatch.swatch-approved[b-4j02x6o3bb] {
    background: var(--status-approved);
    border-radius: 50%;

}

.legend-swatch.swatch-pending[b-4j02x6o3bb] {
    background: var(--status-pending);
    border-radius: 50%;
}

.legend-swatch.swatch-draft[b-4j02x6o3bb] {
    background: var(--status-draft);
    border-radius: 50%;
}

.legend-swatch.swatch-weekend[b-4j02x6o3bb] {
    background: #f0f0f3;
    border-radius: 50%;
    border: 1px solid #e0e0e3;
}

/* Skeleton */
.weekly-skeleton[b-4j02x6o3bb] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 10px;
}

/* ── Back link ── */
.back-link[b-4j02x6o3bb] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.82rem;
    font-weight: 500;
    color: #888;
    text-decoration: none;
    margin-bottom: 12px;
    transition: color 0.15s;
}

.back-link:hover[b-4j02x6o3bb] {
    color: #f27406;
}

.back-link i[b-4j02x6o3bb] {
    font-size: 0.72rem;
}

/* ── Team tab ── */
.team-search[b-4j02x6o3bb] {
    position: relative;
    margin-bottom: 12px;
}

.team-search-icon[b-4j02x6o3bb] {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #aaa;
    font-size: 0.82rem;
    pointer-events: none;
}

.team-search-input[b-4j02x6o3bb] {
    width: 100%;
    padding: 10px 12px 10px 38px;
    border: 1.5px solid #e0e0e0;
    border-radius: 8px;
    background: #fff;
    font-size: 0.88rem;
    color: #333;
    box-sizing: border-box;
    transition: border-color 0.15s;
}

.team-search-input:focus[b-4j02x6o3bb] {
    outline: none;
    border-color: #f27406;
    box-shadow: 0 0 0 2px rgba(242, 116, 6, 0.15);
}

.team-search-input[b-4j02x6o3bb]::placeholder {
    color: #bbb;
}

.team-meta[b-4j02x6o3bb] {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    padding: 0 4px;
}

.team-meta-count[b-4j02x6o3bb] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.78rem;
    font-weight: 600;
    color: #888;
}

.team-meta-count i[b-4j02x6o3bb] {
    font-size: 0.72rem;
    color: #bbb;
}

.team-list[b-4j02x6o3bb] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 8px;
}

.team-list.team-list-spacious[b-4j02x6o3bb] {
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 12px;
}

.team-card[b-4j02x6o3bb] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 10px;
    cursor: pointer;
    text-align: left;
    transition: all 0.15s;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
    font: inherit;
    color: inherit;
    width: 100%;
}

.team-card:hover[b-4j02x6o3bb] {
    border-color: #f27406;
    box-shadow: 0 2px 10px rgba(242, 116, 6, 0.1);
    transform: translateY(-1px);
}

.team-avatar[b-4j02x6o3bb] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: #fff;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    flex-shrink: 0;
    user-select: none;
}

.team-avatar-lg[b-4j02x6o3bb] {
    width: 56px;
    height: 56px;
    font-size: 1.15rem;
}

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

.team-name[b-4j02x6o3bb] {
    font-size: 0.92rem;
    font-weight: 600;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-stats[b-4j02x6o3bb] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.team-stat[b-4j02x6o3bb] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.76rem;
    color: #777;
    font-variant-numeric: tabular-nums;
}

.team-stat i[b-4j02x6o3bb] {
    color: #bbb;
    font-size: 0.7rem;
}

.team-stat-sep[b-4j02x6o3bb] {
    color: #ddd;
    font-size: 0.78rem;
}

.team-stat-pending[b-4j02x6o3bb] {
    color: var(--status-pending);
    font-weight: 600;
}

.team-card-chevron[b-4j02x6o3bb] {
    color: #ccc;
    font-size: 0.72rem;
    flex-shrink: 0;
    transition: color 0.15s, transform 0.15s;
}

.team-card:hover .team-card-chevron[b-4j02x6o3bb] {
    color: #f27406;
    transform: translateX(2px);
}

/* Member detail */
.team-back-btn[b-4j02x6o3bb] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    margin-bottom: 12px;
}

.team-detail-header[b-4j02x6o3bb] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 10px;
    margin-bottom: 16px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

.team-detail-info[b-4j02x6o3bb] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.team-detail-name[b-4j02x6o3bb] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-detail-stats[b-4j02x6o3bb] {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

.team-detail-stat[b-4j02x6o3bb] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.team-detail-stat-label[b-4j02x6o3bb] {
    font-size: 0.7rem;
    font-weight: 500;
    color: #999;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.team-detail-stat-value[b-4j02x6o3bb] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #333;
    font-variant-numeric: tabular-nums;
}

/* ── Date groups (member's registrations) ── */
.date-group[b-4j02x6o3bb] {
    margin-bottom: 20px;
}

.date-group-header[b-4j02x6o3bb] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 0 4px 8px 4px;
}

.date-info[b-4j02x6o3bb] {
    display: flex;
    align-items: baseline;
    gap: 10px;
}

.date-text[b-4j02x6o3bb] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #555;
    text-transform: capitalize;
}

.date-count[b-4j02x6o3bb] {
    font-size: 0.72rem;
    color: #aaa;
    font-weight: 500;
}

.date-totals[b-4j02x6o3bb] {
    display: flex;
    align-items: baseline;
    gap: 14px;
}

.date-hours[b-4j02x6o3bb] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #f27406;
}

.date-costs[b-4j02x6o3bb] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #555;
}

.date-group-cards[b-4j02x6o3bb] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* ── Registration card (read-only here) ── */
.registration-card[b-4j02x6o3bb] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 10px;
    background: #fff;
    border: 1px solid #e8e8ed;
    transition: all 0.15s;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.registration-card:hover[b-4j02x6o3bb] {
    border-color: #d0d0d8;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.card-checkbox-spacer[b-4j02x6o3bb] {
    width: 16px;
    flex-shrink: 0;
}

.card-type-icon[b-4j02x6o3bb] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 0.75rem;
}

.card-type-icon.type-hours[b-4j02x6o3bb] {
    background: rgba(242, 116, 6, 0.1);
    color: #f27406;
}

.card-type-icon.type-costs[b-4j02x6o3bb] {
    background: rgba(22, 163, 74, 0.1);
    color: #16a34a;
}

.card-type-icon.type-amounts[b-4j02x6o3bb] {
    background: rgba(37, 99, 235, 0.1);
    color: #2563eb;
}

.card-content[b-4j02x6o3bb] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.card-top-row[b-4j02x6o3bb] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.card-hourgroup[b-4j02x6o3bb] {
    font-size: 0.68rem;
    color: #666;
    background: #e8e8e8;
    padding: 1px 8px;
    border-radius: 4px;
    white-space: nowrap;
    flex-shrink: 0;
    font-weight: 600;
}

.card-hourtype[b-4j02x6o3bb] {
    font-size: 0.68rem;
    color: #888;
    background: #f0f0f0;
    padding: 1px 8px;
    border-radius: 4px;
    white-space: nowrap;
    flex-shrink: 0;
}

.card-description[b-4j02x6o3bb] {
    font-size: 0.75rem;
    color: #999;
    font-style: italic;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.card-right[b-4j02x6o3bb] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.card-value[b-4j02x6o3bb] {
    width: 80px;
    font-size: 0.88rem;
    font-weight: 700;
    color: #333;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    text-align: right;
}

.card-status[b-4j02x6o3bb] {
    font-size: 0.72rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 6px;
    white-space: nowrap;
    text-align: center;
    background: transparent;
    border: 1.5px solid transparent;
}

.card-status.status-pending[b-4j02x6o3bb] {
    color: var(--status-pending);
    border-color: var(--status-pending);
}

.card-status.status-approved[b-4j02x6o3bb] {
    color: var(--status-approved);
    border-color: var(--status-approved);
}

.card-status.status-processed[b-4j02x6o3bb] {
    color: #475569;
    border-color: #475569;
}

/* ── Skeleton ── */
@keyframes shimmer-b-4j02x6o3bb {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.cards-skeleton[b-4j02x6o3bb] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.card-skeleton[b-4j02x6o3bb] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid #f0f0f0;
}

.skeleton-circle[b-4j02x6o3bb] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-4j02x6o3bb 1.5s infinite;
    flex-shrink: 0;
}

.skeleton-lines[b-4j02x6o3bb] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.skeleton-line[b-4j02x6o3bb] {
    height: 12px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-4j02x6o3bb 1.5s infinite;
    border-radius: 4px;
}

.skeleton-line.short[b-4j02x6o3bb] { width: 60%; }
.skeleton-line.medium[b-4j02x6o3bb] { width: 80%; }

/* ── Empty state ── */
.empty-state[b-4j02x6o3bb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(239, 66, 32, 0.08);
}

.empty-state-small[b-4j02x6o3bb] {
    padding: 40px 20px;
}

.empty-icon[b-4j02x6o3bb] {
    font-size: 3rem;
    color: #ffe0cc;
    margin-bottom: 16px;
}

.empty-state-small .empty-icon[b-4j02x6o3bb] {
    font-size: 2.2rem;
    margin-bottom: 12px;
}

.empty-message[b-4j02x6o3bb] {
    font-size: 1rem;
    font-weight: 500;
    color: #666;
    margin: 0;
}

/* ── Mobile ── */
@media (max-width: 768px) {
    .inner-toolbar[b-4j02x6o3bb] {
        gap: 8px;
    }

    .week-selector[b-4j02x6o3bb] {
        width: 100%;
        justify-content: space-between;
    }

    .week-label[b-4j02x6o3bb] {
        flex: 1;
        justify-content: center;
        padding: 6px 8px;
        font-size: 0.78rem;
    }

    .week-range[b-4j02x6o3bb] {
        display: none; /* save space — show only "Week N" */
    }

    .inner-tab span[b-4j02x6o3bb] {
        display: none; /* icon-only on mobile */
    }

    .inner-tab[b-4j02x6o3bb] {
        padding: 6px 10px;
    }

    /* Sticky employee column for horizontal scroll */
    .weekly-grid thead .th-employee[b-4j02x6o3bb],
    .weekly-grid .td-employee[b-4j02x6o3bb],
    .weekly-grid tfoot .td-daytotal-label[b-4j02x6o3bb] {
        position: sticky;
        left: 0;
        z-index: 1;
        min-width: 160px;
        box-shadow: 1px 0 0 #e8e8ed;
    }

    .weekly-grid tbody tr:hover .td-employee[b-4j02x6o3bb] {
        background: #eeeef1;
    }

    .weekly-grid thead .th-day[b-4j02x6o3bb],
    .weekly-grid .td-cell[b-4j02x6o3bb] {
        min-width: 50px;
        font-size: 0.8rem;
    }

    .weekly-grid .emp-name[b-4j02x6o3bb] {
        font-size: 0.82rem;
    }

    .team-list[b-4j02x6o3bb],
    .team-list.team-list-spacious[b-4j02x6o3bb] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .team-card[b-4j02x6o3bb] {
        padding: 10px 12px;
        gap: 10px;
    }

    .team-avatar[b-4j02x6o3bb] {
        width: 36px;
        height: 36px;
        font-size: 0.78rem;
    }

    .team-detail-header[b-4j02x6o3bb] {
        padding: 14px 14px;
        gap: 12px;
    }

    .team-avatar-lg[b-4j02x6o3bb] {
        width: 48px;
        height: 48px;
        font-size: 1rem;
    }

    .team-detail-name[b-4j02x6o3bb] {
        font-size: 1rem;
    }

    .team-detail-stats[b-4j02x6o3bb] {
        gap: 14px;
    }

    .team-detail-stat-value[b-4j02x6o3bb] {
        font-size: 0.88rem;
    }
}

@media (max-width: 640px) {
    .registration-card[b-4j02x6o3bb] {
        flex-wrap: wrap;
        gap: 4px;
        padding: 10px 12px;
    }

    .card-checkbox-spacer[b-4j02x6o3bb] {
        width: 14px;
    }

    .card-type-icon[b-4j02x6o3bb] {
        width: 26px;
        height: 26px;
        font-size: 0.65rem;
    }

    .card-content[b-4j02x6o3bb] {
        flex: 1 1 0;
        min-width: 0;
    }

    .card-top-row[b-4j02x6o3bb] {
        flex-wrap: wrap;
        gap: 4px;
    }

    .card-right[b-4j02x6o3bb] {
        width: 100%;
        justify-content: flex-end;
        margin-top: 4px;
        padding-left: 40px;
    }

    .card-value[b-4j02x6o3bb] {
        width: auto;
        font-size: 0.82rem;
    }

    .card-status[b-4j02x6o3bb] {
        padding: 2px 8px;
        font-size: 0.68rem;
    }

    .date-group-header[b-4j02x6o3bb] {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
    }
}
/* /Components/Projects/ProjectCard.razor.rz.scp.css */
.project-card[b-k2njwotkb0] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 16px;
    padding: 14px 18px;
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 8px;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
    overflow: hidden;
    position: relative;
}

.project-card:hover[b-k2njwotkb0] {
    border-color: #d0d0d8;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transform: translateY(-1px);
}

.project-color-bar[b-k2njwotkb0] {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    border-radius: 8px 0 0 8px;
}

.project-code[b-k2njwotkb0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 80px;
    padding: 4px 12px;
    font-size: 0.8rem;
    font-weight: 700;
    border-radius: 6px;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.project-desc[b-k2njwotkb0] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #333;
    min-width: 0;
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-arrow[b-k2njwotkb0] {
    font-size: 0.7rem;
    color: #ccc;
    flex-shrink: 0;
    transition: color 0.15s, transform 0.15s;
}

.project-card:hover .project-arrow[b-k2njwotkb0] {
    color: #888;
    transform: translateX(2px);
}

/* Approval pills */
.approval-pill[b-k2njwotkb0] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 16px;
    white-space: nowrap;
    flex-shrink: 0;
}

.approval-pending[b-k2njwotkb0] {
    background: #fff3e6;
    color: #d46200;
}

.approval-pending i[b-k2njwotkb0] {
    font-size: 0.65rem;
}

.approval-ok[b-k2njwotkb0] {
    background: rgba(22, 163, 74, 0.1);
    color: #16a34a;
}

.approval-ok i[b-k2njwotkb0] {
    font-size: 0.7rem;
}

/* Financial progress section */
.project-financials[b-k2njwotkb0] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 300px;
    flex-shrink: 0;
    margin-left: auto;
    margin-right: 16px;
}

.progress-bar-container[b-k2njwotkb0] {
    position: relative;
    height: 8px;
    background: #f0f0f0;
    border-radius: 4px;
    overflow: hidden;
}

.progress-bar-fill[b-k2njwotkb0] {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.progress-bar-fill.fin-positive[b-k2njwotkb0] {
    background: #16a34a;
}

.progress-bar-fill.fin-negative[b-k2njwotkb0] {
    background: #dc2626;
}

.progress-bar-label[b-k2njwotkb0] {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.55rem;
    font-weight: 600;
    color: #666;
    line-height: 1;
}

.financial-numbers[b-k2njwotkb0] {
    display: flex;
    gap: 12px;
}

.financial-item[b-k2njwotkb0] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.financial-label[b-k2njwotkb0] {
    font-size: 0.6rem;
    color: #999;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.financial-value[b-k2njwotkb0] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #333;
    white-space: nowrap;
}

.financial-value.negative[b-k2njwotkb0] {
    color: #dc2626;
}

/* Below 800px: financials wraps to its own row */
@media (max-width: 800px) {
    .project-financials[b-k2njwotkb0] {
        flex-basis: 100%;
        max-width: none;
        min-width: 0;
        padding-left: 0;
    }
}

/* Mobile */
@media (max-width: 640px) {
    .financial-numbers[b-k2njwotkb0] {
        gap: 8px;
        justify-content: space-between;
    }

    .financial-label[b-k2njwotkb0] {
        font-size: 0.55rem;
    }

    .financial-value[b-k2njwotkb0] {
        font-size: 0.7rem;
    }

    .project-card[b-k2njwotkb0] {
        gap: 10px;
        padding: 12px 14px 12px 18px;
    }
}
/* /Components/Shared/SpinnerEdward.razor.rz.scp.css */
/* Spinner Edward - Dynamic Arc Spinner */

.spinner-edward[b-ar13nwo2yi] {
    display: block;
    animation: edward-rotate-b-ar13nwo2yi 1.75s cubic-bezier(0.35, 0.1, 0.65, 0.9) infinite;
}

.spinner-edward-track[b-ar13nwo2yi] {
    fill: none;
    stroke: #fef0e6;
    stroke-width: 4;
}

.spinner-edward-arc[b-ar13nwo2yi] {
    fill: none;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-dasharray: 126;
    stroke-dashoffset: 0;
    animation: edward-arc-b-ar13nwo2yi 1.55s ease-in-out infinite;
}

@keyframes edward-rotate-b-ar13nwo2yi {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes edward-arc-b-ar13nwo2yi {
    0% {
        stroke-dasharray: 1, 126;
        stroke-dashoffset: 0;
    }
    50% {
        stroke-dasharray: 80, 126;
        stroke-dashoffset: -30;
    }
    100% {
        stroke-dasharray: 1, 126;
        stroke-dashoffset: -124;
    }
}
/* /Components/WeekOverview/EditEntryPanel.razor.rz.scp.css */
/* Wrapper for keyboard capture */
.panel-wrapper[b-mg78wrzds0] {
    outline: none;
}

/* Backdrop overlay */
.panel-backdrop[b-mg78wrzds0] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 999;
    animation: fadeIn-b-mg78wrzds0 0.2s ease;
}

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

/* Side panel */
.edit-panel[b-mg78wrzds0] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 420px;
    max-width: 90vw;
    background: #fff;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    animation: slideIn-b-mg78wrzds0 0.25s ease;
}

@keyframes slideIn-b-mg78wrzds0 {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}

/* Panel header */
.panel-header[b-mg78wrzds0] {
    padding: 20px 24px 16px;
    border-bottom: 1px solid #f0f0f0;
}

.panel-title-row[b-mg78wrzds0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.panel-title[b-mg78wrzds0] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.panel-title i[b-mg78wrzds0] {
    color: #f27406;
}

.panel-close[b-mg78wrzds0] {
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: #999;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: background 0.15s, color 0.15s;
}

.panel-close:hover[b-mg78wrzds0] {
    background: #f3f4f6;
    color: #333;
}

.panel-subtitle[b-mg78wrzds0] {
    margin-top: 6px;
}

.panel-day[b-mg78wrzds0] {
    font-size: 0.85rem;
    color: #888;
    text-transform: capitalize;
}

/* Panel body */
.panel-body[b-mg78wrzds0] {
    flex: 1;
    padding: 20px 24px;
    overflow-y: auto;
}

.panel-field[b-mg78wrzds0] {
    margin-bottom: 16px;
}

.panel-label[b-mg78wrzds0] {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 6px;
}

.panel-readonly[b-mg78wrzds0] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: #f9fafb;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    font-size: 0.85rem;
    color: #374151;
}

.panel-readonly .project-dot[b-mg78wrzds0] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.panel-readonly .project-desc[b-mg78wrzds0] {
    color: #9ca3af;
    font-size: 0.8rem;
}

/* Rejection reason banner */
.rejection-banner[b-mg78wrzds0] {
    margin-bottom: 16px;
    padding: 12px 14px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-left: 3px solid #dc2626;
    border-radius: 6px;
}

.rejection-banner-header[b-mg78wrzds0] {
    font-size: 0.7rem;
    font-weight: 700;
    color: #dc2626;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 6px;
}

.rejection-banner-header i[b-mg78wrzds0] {
    font-size: 0.85rem;
}

.rejection-banner-text[b-mg78wrzds0] {
    font-size: 0.82rem;
    color: #991b1b;
    line-height: 1.4;
    word-break: break-word;
}

/* Info section */
.panel-info[b-mg78wrzds0] {
    margin-top: 20px;
    padding: 12px;
    background: #f9fafb;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.info-item[b-mg78wrzds0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.info-label[b-mg78wrzds0] {
    font-size: 0.75rem;
    color: #888;
}

.info-value[b-mg78wrzds0] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
}

.info-mono[b-mg78wrzds0] {
    font-family: monospace;
    font-size: 0.75rem;
    font-weight: 400;
    color: #9ca3af;
}

/* Panel footer */
.panel-footer[b-mg78wrzds0] {
    padding: 16px 24px;
    border-top: 1px solid #f0f0f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-right[b-mg78wrzds0] {
    display: flex;
    gap: 8px;
}

.btn-delete[b-mg78wrzds0] {
    padding: 8px 16px;
    border: 1px solid #fecaca;
    border-radius: 6px;
    background: #fff;
    color: #dc2626;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.btn-delete:hover[b-mg78wrzds0] {
    background: #fef2f2;
    border-color: #f87171;
}

.btn-cancel[b-mg78wrzds0] {
    padding: 8px 16px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #fff;
    color: #6b7280;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s;
}

.btn-cancel:hover[b-mg78wrzds0] {
    background: #f3f4f6;
}

.btn-save[b-mg78wrzds0] {
    padding: 8px 20px;
    border: none;
    border-radius: 6px;
    background: #f27406;
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.btn-save:hover[b-mg78wrzds0] {
    background: #e06800;
}

.btn-save:disabled[b-mg78wrzds0] {
    background: #f5a85c;
    cursor: not-allowed;
}

.btn-delete:disabled[b-mg78wrzds0],
.btn-cancel:disabled[b-mg78wrzds0] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Delete confirmation */
.delete-confirm[b-mg78wrzds0] {
    margin: 0 24px;
    padding: 16px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    text-align: center;
    animation: fadeIn-b-mg78wrzds0 0.15s ease;
}

.delete-confirm-icon[b-mg78wrzds0] {
    font-size: 1.5rem;
    color: #dc2626;
    margin-bottom: 8px;
}

.delete-confirm-text[b-mg78wrzds0] {
    font-size: 0.8rem;
    color: #555;
    margin: 0 0 12px;
    line-height: 1.4;
}

.delete-confirm-actions[b-mg78wrzds0] {
    display: flex;
    justify-content: center;
    gap: 8px;
}

.btn-delete-confirm[b-mg78wrzds0] {
    padding: 8px 16px;
    border: none;
    border-radius: 6px;
    background: #dc2626;
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.btn-delete-confirm:hover[b-mg78wrzds0] {
    background: #b91c1c;
}

/* Esc hint */
.panel-hint[b-mg78wrzds0] {
    padding: 10px 24px;
    text-align: center;
    font-size: 0.75rem;
    color: #b0b0b0;
}

.panel-hint kbd[b-mg78wrzds0] {
    display: inline-block;
    padding: 1px 6px;
    font-size: 0.7rem;
    font-family: inherit;
    color: #999;
    background: #f3f4f6;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    margin-right: 4px;
}

.hint-separator[b-mg78wrzds0] {
    margin: 0 8px;
    color: #d0d0d0;
}

/* ==========================================
   MOBILE — Bottom sheet instead of side panel
   ========================================== */
@media (max-width: 640px) {
    .edit-panel[b-mg78wrzds0] {
        top: auto;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        max-width: 100%;
        max-height: 90vh;
        border-radius: 16px 16px 0 0;
        animation: slideUp-b-mg78wrzds0 0.25s ease;
    }

    @keyframes slideUp-b-mg78wrzds0 {
        from { transform: translateY(100%); }
        to { transform: translateY(0); }
    }

    /* Drag handle indicator */
    .edit-panel[b-mg78wrzds0]::before {
        content: '';
        display: block;
        width: 36px;
        height: 4px;
        background: #d1d5db;
        border-radius: 2px;
        margin: 8px auto 0;
    }

    .panel-header[b-mg78wrzds0] {
        padding: 12px 20px 12px;
    }

    .panel-body[b-mg78wrzds0] {
        padding: 16px 20px;
    }

    /* Hide keyboard hints on touch devices */
    .panel-hint[b-mg78wrzds0] {
        display: none;
    }

    .panel-footer[b-mg78wrzds0] {
        padding: 12px 20px;
        padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
        flex-direction: column-reverse;
        gap: 10px;
    }

    .footer-right[b-mg78wrzds0] {
        width: 100%;
        display: flex;
        gap: 8px;
    }

    .footer-right .btn-cancel[b-mg78wrzds0] {
        flex: 1;
    }

    .footer-right .btn-save[b-mg78wrzds0] {
        flex: 2;
    }

    .btn-delete[b-mg78wrzds0] {
        width: 100%;
    }
}

/* Combobox loading shimmer (werkgroep / hour-type) */
.combobox-with-loader[b-mg78wrzds0] {
    position: relative;
}

.combobox-shimmer[b-mg78wrzds0] {
    position: absolute;
    left: 12px;
    right: 36px;
    top: 50%;
    transform: translateY(-50%);
    height: 14px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-mg78wrzds0 1.5s infinite;
    border-radius: 4px;
    z-index: 10;
    pointer-events: none;
}

@keyframes shimmer-b-mg78wrzds0 {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}
/* /Components/WeekOverview/WeekOverviewGrid.razor.rz.scp.css */
.grid-container[b-voldjhk8jx] {
    overflow-x: auto;
}

/* 7 equal columns */
.columns-row[b-voldjhk8jx] {
    display: flex;
    gap: 8px;
    min-width: 900px;
}

.day-column[b-voldjhk8jx] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
}

.day-column.today[b-voldjhk8jx] {
    border-color: #f27406;
    box-shadow: 0 0 0 1px #f27406;
}

/* Day header */
.day-header[b-voldjhk8jx] {
    padding: 10px 10px;
    background: #fdfdfd;
    border-bottom: 1px solid #f0f0f0;
    white-space: nowrap;
}

.day-column.today .day-header[b-voldjhk8jx] {
    background: #f27406;
    border-bottom-color: #f27406;
}

.day-code[b-voldjhk8jx] {
    font-size: 0.8rem;
    font-weight: 700;
    color: #555;
    letter-spacing: 0.03em;
}

.day-column.today .day-code[b-voldjhk8jx] {
    color: #fff;
}

.day-date[b-voldjhk8jx] {
    font-size: 0.75rem;
    color: #999;
    margin-left: 4px;
}

.day-column.today .day-date[b-voldjhk8jx] {
    color: rgba(255, 255, 255, 0.8);
}

/* New elements — hidden on desktop */
.collapse-chevron[b-voldjhk8jx] {
    display: none;
}

.day-header-right[b-voldjhk8jx] {
    display: none;
}

.day-header-left[b-voldjhk8jx] {
    display: contents;
}

/* Collapsible wrapper — always open on desktop */
.day-collapsible[b-voldjhk8jx] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* Day body — registration cards */
.day-body[b-voldjhk8jx] {
    flex: 1;
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 300px;
}

/* Empty state */
.day-empty[b-voldjhk8jx] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.day-empty .empty-icon[b-voldjhk8jx] {
    font-size: 1.4rem;
    color: #d1d5db;
}

.day-empty .empty-text[b-voldjhk8jx] {
    font-size: 0.7rem;
    color: #b0b0b0;
}

/* Registration card */
.reg-card[b-voldjhk8jx] {
    position: relative;
    border: 1px solid #e8e8e8;
    border-left: 3px solid #ccc;
    border-radius: 4px;
    padding: 6px 8px;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.reg-card:hover[b-voldjhk8jx] {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.reg-card.locked[b-voldjhk8jx] {
    cursor: default;
    opacity: 0.7;
}

.reg-card.locked:hover[b-voldjhk8jx] {
    transform: none;
    box-shadow: none;
}

.reg-card-top[b-voldjhk8jx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.reg-project[b-voldjhk8jx] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    color: #374151;
}

.reg-hours-badge[b-voldjhk8jx] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #555;
    background: #fbfbfb;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
}

.badge-amounts[b-voldjhk8jx] {
    color: #2563eb;
    background: rgba(37, 99, 235, 0.08);
}

.badge-costs[b-voldjhk8jx] {
    color: #16a34a;
    background: rgba(22, 163, 74, 0.08);
}

/* Type separators between hours/amounts/costs */
.type-separator[b-voldjhk8jx] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 6px 0;
}

.type-separator-line[b-voldjhk8jx] {
    flex: 1;
    height: 1px;
    background: #e8e8e8;
}

.type-separator-icon[b-voldjhk8jx] {
    font-size: 0.65rem;
    color: #ccc;
}

/* Type icon on amount/cost cards */
.reg-type-icon[b-voldjhk8jx] {
    font-size: 0.6rem;
    color: #aaa;
    margin-left: 4px;
}

.project-dot[b-voldjhk8jx] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

.reg-details[b-voldjhk8jx] {
    margin-top: 1px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reg-type[b-voldjhk8jx] {
    font-size: 0.65rem;
    color: #6b7280;
}

.reg-description[b-voldjhk8jx] {
    font-size: 0.65rem;
    color: #9ca3af;
    font-style: italic;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Badges wrapper */
.reg-card-badges[b-voldjhk8jx] {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Rejected card */
.reg-card.rejected[b-voldjhk8jx] {
    border-color: #fecaca;
}

.reg-card.rejected:hover[b-voldjhk8jx] {
    box-shadow: 0 2px 8px rgba(220, 38, 38, 0.12);
}

.reg-rejected-badge[b-voldjhk8jx] {
    font-size: 0.6rem;
    font-weight: 600;
    color: #dc2626;
    background: #fee2e2;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 3px;
}

.reg-rejected-badge i[b-voldjhk8jx] {
    font-size: 0.55rem;
}

.reg-rejection-reason[b-voldjhk8jx] {
    font-size: 0.6rem;
    color: #b91c1c;
    margin-top: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 4px;
}

.reg-rejection-reason i[b-voldjhk8jx] {
    font-size: 0.55rem;
    color: #dc2626;
    flex-shrink: 0;
}

/* Day footer — totals */
.day-footer[b-voldjhk8jx] {
    padding: 8px 10px;
    background: #fdfdfd;
    border-top: 1px solid #f0f0f0;
}

.footer-main[b-voldjhk8jx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 4px;
}

.footer-hours[b-voldjhk8jx] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #333;
}

.footer-sep[b-voldjhk8jx] {
    color: #ccc;
    margin: 0 1px;
}

.footer-contract[b-voldjhk8jx] {
    color: #aaa;
    font-weight: 400;
}

.footer-diff[b-voldjhk8jx] {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
}

.footer-diff.positive[b-voldjhk8jx] {
    color: #16a34a;
    background: rgba(22, 163, 74, 0.1);
}

.footer-diff.negative[b-voldjhk8jx] {
    color: #dc2626;
    background: rgba(220, 38, 38, 0.1);
}

/* Skeleton loading */
@keyframes shimmer-b-voldjhk8jx {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.skeleton-header-block[b-voldjhk8jx] {
    height: 46px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-voldjhk8jx 1.5s infinite;
}

.skeleton-card[b-voldjhk8jx] {
    height: 60px;
    margin: 6px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-voldjhk8jx 1.5s infinite;
    border-radius: 4px;
}

.skeleton-card.short[b-voldjhk8jx] {
    height: 40px;
}

.skeleton-footer-block[b-voldjhk8jx] {
    height: 56px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-voldjhk8jx 1.5s infinite;
}

/* ==========================================
   TABLET — Vertical stack, all expanded
   ========================================== */
@media (max-width: 900px) {
    .grid-container[b-voldjhk8jx] {
        overflow-x: visible;
    }

    .columns-row[b-voldjhk8jx] {
        flex-direction: column;
        min-width: unset;
        gap: 10px;
    }

    .day-column[b-voldjhk8jx] {
        flex: none;
    }

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

    .day-header-left[b-voldjhk8jx] {
        display: flex;
        align-items: center;
    }

    .day-header-right[b-voldjhk8jx] {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .header-total[b-voldjhk8jx] {
        font-size: 0.75rem;
        font-weight: 600;
        color: #555;
    }

    .day-column.today .header-total[b-voldjhk8jx] {
        color: rgba(255, 255, 255, 0.9);
    }

    .header-diff[b-voldjhk8jx] {
        font-size: 0.7rem;
        font-weight: 600;
        padding: 2px 6px;
        border-radius: 4px;
        white-space: nowrap;
    }

    .header-diff.positive[b-voldjhk8jx] {
        color: #16a34a;
        background: rgba(22, 163, 74, 0.1);
    }

    .header-diff.negative[b-voldjhk8jx] {
        color: #dc2626;
        background: rgba(220, 38, 38, 0.1);
    }

    .day-column.today .header-diff.positive[b-voldjhk8jx] {
        color: #fff;
        background: rgba(255, 255, 255, 0.2);
    }

    .day-column.today .header-diff.negative[b-voldjhk8jx] {
        color: #fff;
        background: rgba(255, 255, 255, 0.2);
    }

    .day-body[b-voldjhk8jx] {
        min-height: unset;
    }

    .day-empty[b-voldjhk8jx] {
        padding: 16px 0;
    }
}

/* ==========================================
   MOBILE — Collapsible accordion
   ========================================== */
@media (max-width: 640px) {
    .columns-row[b-voldjhk8jx] {
        gap: 8px;
    }

    /* Show chevron */
    .collapse-chevron[b-voldjhk8jx] {
        display: inline-block;
        font-size: 0.6rem;
        color: #999;
        transition: transform 0.2s ease;
        margin-right: 6px;
        width: 10px;
    }

    .day-column.expanded .collapse-chevron[b-voldjhk8jx] {
        transform: rotate(90deg);
    }

    .day-column.today .collapse-chevron[b-voldjhk8jx] {
        color: rgba(255, 255, 255, 0.8);
    }

    /* Header becomes clickable row */
    .day-header[b-voldjhk8jx] {
        cursor: pointer;
        user-select: none;
        padding: 12px 12px;
    }

    /* Collapse animation */
    .day-collapsible[b-voldjhk8jx] {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.25s ease;
    }

    .day-column.expanded .day-collapsible[b-voldjhk8jx] {
        max-height: 800px;
    }

    /* Hide footer on mobile — totals already in header */
    .day-footer[b-voldjhk8jx] {
        display: none;
    }

    /* Slightly larger cards on mobile for touch targets */
    .reg-card[b-voldjhk8jx] {
        padding: 8px 10px;
    }

    .reg-project[b-voldjhk8jx] {
        font-size: 0.8rem;
    }

    .reg-hours-badge[b-voldjhk8jx] {
        font-size: 0.75rem;
    }

    .reg-type[b-voldjhk8jx] {
        font-size: 0.7rem;
    }

    .reg-description[b-voldjhk8jx] {
        font-size: 0.7rem;
    }
}
/* /Components/WeekOverview/WeekOverviewSummary.razor.rz.scp.css */
.summary-container[b-x6qd1h72gr] {
    background: #fff;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(239, 66, 32, 0.08);
    margin-bottom: 20px;
}

.summary-cards[b-x6qd1h72gr] {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.summary-card[b-x6qd1h72gr] {
    flex: 1;
    min-width: 160px;
    background: #fafafa;
    border: 1px solid #f0f0f0;
    border-radius: 6px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    border-left: 3px solid transparent;
}

/* Card type accents */
.card-hours[b-x6qd1h72gr] {
    border-left-color: #f27406;
}

.card-amounts[b-x6qd1h72gr] {
    border-left-color: #2563eb;
}

.card-costs[b-x6qd1h72gr] {
    border-left-color: #16a34a;
}

/* Card header row */
.card-header-row[b-x6qd1h72gr] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.card-icon[b-x6qd1h72gr] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    flex-shrink: 0;
}

.icon-hours[b-x6qd1h72gr] {
    background: rgba(242, 116, 6, 0.1);
    color: #f27406;
}

.icon-amounts[b-x6qd1h72gr] {
    background: rgba(37, 99, 235, 0.1);
    color: #2563eb;
}

.icon-costs[b-x6qd1h72gr] {
    background: rgba(22, 163, 74, 0.1);
    color: #16a34a;
}

.card-label[b-x6qd1h72gr] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.card-value[b-x6qd1h72gr] {
    font-size: 1.3rem;
    font-weight: 600;
    color: #333;
}

.card-entry-count[b-x6qd1h72gr] {
    font-size: 0.78rem;
    color: #999;
    font-weight: 400;
}

/* Sub info (contract / difference in hours card) */
.card-sub-info[b-x6qd1h72gr] {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #f0f0f0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sub-row[b-x6qd1h72gr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.sub-label[b-x6qd1h72gr] {
    font-size: 0.78rem;
    color: #999;
    font-weight: 400;
}

.sub-value[b-x6qd1h72gr] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #555;
}

.sub-value.positive[b-x6qd1h72gr] {
    color: #16a34a;
}

.sub-value.negative[b-x6qd1h72gr] {
    color: #dc2626;
}

/* Active projects */
.active-projects[b-x6qd1h72gr] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.projects-label[b-x6qd1h72gr] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.project-tag[b-x6qd1h72gr] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 500;
    color: #333;
    border: 1px solid;
}

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

/* Skeleton loading */
@keyframes shimmer-b-x6qd1h72gr {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.skeleton-bar[b-x6qd1h72gr] {
    display: block;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-x6qd1h72gr 1.5s infinite;
    border-radius: 4px;
}

.skeleton-icon[b-x6qd1h72gr] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    flex-shrink: 0;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-x6qd1h72gr 1.5s infinite;
}

.skeleton-label-bar[b-x6qd1h72gr] {
    width: 80px;
    height: 12px;
}

.skeleton-value-bar[b-x6qd1h72gr] {
    width: 96px;
    height: 22px;
}

.skeleton-count-bar[b-x6qd1h72gr] {
    width: 64px;
    height: 12px;
}

.skeleton-sub-bar[b-x6qd1h72gr] {
    width: 100%;
    height: 14px;
}

/* ==========================================
   MOBILE — Stack cards vertically
   ========================================== */
@media (max-width: 640px) {
    .summary-container[b-x6qd1h72gr] {
        padding: 16px;
    }

    .summary-cards[b-x6qd1h72gr] {
        gap: 10px;
        flex-direction: column;
    }

    .summary-card[b-x6qd1h72gr] {
        min-width: unset;
    }
}
/* /Layout/MainLayout.razor.rz.scp.css */
/* ==========================================
   APP LAYOUT
   ========================================== */
.app-layout[b-5dyqtc3eqq] {
    display: flex;
    flex-direction: column;
    height: 100vh;
}

/* ==========================================
   TOP NAVBAR
   ========================================== */
.top-navbar[b-5dyqtc3eqq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 56px;
    padding: 0 20px;
    background: #fff;
    color: #1a1a2e;
    border-bottom: 1px solid #e8e8ed;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
    flex-shrink: 0;
    z-index: 1000;
    overflow: hidden;
}

.navbar-left[b-5dyqtc3eqq] {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    overflow: hidden;
}

.sidebar-toggle[b-5dyqtc3eqq] {
    display: none;
    background: none;
    border: none;
    color: #555;
    font-size: 1.15rem;
    cursor: pointer;
    padding: 6px 8px;
    border-radius: 6px;
    transition: background 0.15s, color 0.15s;
}

.sidebar-toggle:hover[b-5dyqtc3eqq] {
    background: #f5f5f8;
    color: #1a1a2e;
}

.navbar-brand[b-5dyqtc3eqq] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.brand-logo[b-5dyqtc3eqq] {
    display: flex;
    align-items: center;
}

.brand-logo img[b-5dyqtc3eqq] {
    height: 34px;
    width: auto;
    object-fit: contain;
}

.brand-text[b-5dyqtc3eqq] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #1a1a2e;
    letter-spacing: -0.2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.navbar-right[b-5dyqtc3eqq] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.navbar-right[b-5dyqtc3eqq]  .user-display {
    display: flex;
    align-items: center;
    gap: 8px;
}

.navbar-right[b-5dyqtc3eqq]  .user-name {
    font-size: 0.85rem;
    font-weight: 500;
    color: #555;
}

/* ==========================================
   APP BODY (sidebar + content)
   ========================================== */
.app-body[b-5dyqtc3eqq] {
    display: flex;
    flex: 1;
    overflow: hidden;
}

/* ==========================================
   SIDEBAR
   ========================================== */
.sidebar[b-5dyqtc3eqq] {
    width: 240px;
    background: #fff;
    border-right: 1px solid #e8e8ed;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

/* ==========================================
   MAIN CONTENT
   ========================================== */
.main-content[b-5dyqtc3eqq] {
    flex: 1;
    overflow-y: auto;
    background: #FAFAF9;
}

.content[b-5dyqtc3eqq] {
    padding-top: 24px;
    padding-bottom: 24px;
}

/* Backdrop (mobile only, but defined globally) */
.sidebar-backdrop[b-5dyqtc3eqq] {
    display: none;
}

/* ==========================================
   MOBILE (< 768px)
   ========================================== */
@media (max-width: 767px) {
    .top-navbar[b-5dyqtc3eqq] {
        padding: 0 12px;
    }

    .navbar-left[b-5dyqtc3eqq] {
        gap: 10px;
    }

    .sidebar-toggle[b-5dyqtc3eqq] {
        display: flex;
    }

    .sidebar[b-5dyqtc3eqq] {
        position: fixed;
        top: 56px;
        left: 0;
        bottom: 0;
        z-index: 999;
        transform: translateX(-100%);
        transition: transform 0.25s ease;
        box-shadow: none;
    }

    .sidebar.open[b-5dyqtc3eqq] {
        transform: translateX(0);
        box-shadow: 4px 0 24px rgba(0, 0, 0, 0.1);
    }

    .sidebar-backdrop[b-5dyqtc3eqq] {
        display: block;
        position: fixed;
        top: 56px;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.3);
        z-index: 998;
    }

    .content[b-5dyqtc3eqq] {
        padding-top: 0 !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

/* ==========================================
   TABLET (768 - 1109)
   ========================================== */
@media (min-width: 768px) and (max-width: 1109px) {
    .sidebar-toggle[b-5dyqtc3eqq] {
        display: flex;
    }

    .sidebar[b-5dyqtc3eqq] {
        position: fixed;
        top: 56px;
        left: 0;
        bottom: 0;
        z-index: 999;
        transform: translateX(-100%);
        transition: transform 0.25s ease;
        box-shadow: none;
    }

    .sidebar.open[b-5dyqtc3eqq] {
        transform: translateX(0);
        box-shadow: 4px 0 24px rgba(0, 0, 0, 0.1);
    }

    .sidebar-backdrop[b-5dyqtc3eqq] {
        display: block;
        position: fixed;
        top: 56px;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.3);
        z-index: 998;
    }
}

/* ==========================================
   SMALL MOBILE (Galaxy Fold etc)
   ========================================== */
@media (max-width: 360px) {
    .brand-text[b-5dyqtc3eqq] {
        font-size: 0.9rem;
    }

    .navbar-right[b-5dyqtc3eqq]  .user-name {
        display: none;
    }
}

/* ==========================================
   DESKTOP (>= 1110px)
   ========================================== */
@media (min-width: 1110px) {
    .content[b-5dyqtc3eqq] {
        padding-left: 2rem !important;
        padding-right: 2rem !important;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
/* ==========================================
   SIDENAV
   ========================================== */
.sidenav[b-ncnyc250a7] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 8px 0;
}

.nav-items[b-ncnyc250a7] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 12px;
}

/* ==========================================
   NAV LINKS
   ========================================== */
[b-ncnyc250a7] .nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 500;
    color: #555;
    text-decoration: none;
    transition: all 0.15s ease;
    cursor: pointer;
}

[b-ncnyc250a7] .nav-link i {
    width: 18px;
    text-align: center;
    font-size: 0.9rem;
    flex-shrink: 0;
}

[b-ncnyc250a7] .nav-link:hover {
    background: #f5f5f8;
    color: #1a1a2e;
}

[b-ncnyc250a7] .nav-link.active {
    background: rgba(242, 116, 6, 0.1);
    color: #f27406;
    font-weight: 600;
}

[b-ncnyc250a7] .nav-link.active i {
    color: #f27406;
}

/* ==========================================
   EXPANDABLE NAV GROUP (Projects)
   ========================================== */
.nav-group[b-ncnyc250a7] {
    display: flex;
    flex-direction: column;
}

.nav-group-header[b-ncnyc250a7] {
    display: flex;
    align-items: center;
    border-radius: 8px;
    transition: all 0.15s ease;
}

.nav-group-header.active[b-ncnyc250a7] {
    background: rgba(242, 116, 6, 0.1);
}

.nav-group-header.active .nav-group-link[b-ncnyc250a7] {
    color: #f27406;
    font-weight: 600;
}

.nav-group-header.active .nav-group-link i[b-ncnyc250a7] {
    color: #f27406;
}

.nav-group-link[b-ncnyc250a7] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    flex: 1;
    font-size: 0.875rem;
    font-weight: 500;
    color: #555;
    text-decoration: none;
    cursor: pointer;
    min-width: 0;
}

.nav-group-link i[b-ncnyc250a7] {
    width: 18px;
    text-align: center;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.nav-group-header:hover[b-ncnyc250a7] {
    background: #f5f5f8;
}

.nav-group-header.active:hover[b-ncnyc250a7] {
    background: rgba(242, 116, 6, 0.14);
}

.nav-group-toggle[b-ncnyc250a7] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin-right: 8px;
    background: none;
    border: none;
    border-radius: 4px;
    color: #999;
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.nav-group-toggle:hover[b-ncnyc250a7] {
    background: rgba(0, 0, 0, 0.06);
    color: #555;
}

.nav-group-toggle i[b-ncnyc250a7] {
    font-size: 0.65rem;
    transition: transform 0.2s ease;
}

.nav-group-toggle i.rotated[b-ncnyc250a7] {
    transform: rotate(180deg);
}

.nav-sub-items[b-ncnyc250a7] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding-left: 16px;
    margin-top: 2px;
}

[b-ncnyc250a7] .nav-sub-link {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    font-size: 0.8rem;
    border-radius: 6px;
    min-width: 0;
}

[b-ncnyc250a7] .nav-sub-link .sub-project-code {
    font-size: 0.7rem;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
    flex-shrink: 0;
}

[b-ncnyc250a7] .nav-sub-link .sub-project-desc {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

[b-ncnyc250a7] .nav-sub-link.active .sub-project-code {
    filter: brightness(0.9);
}

[b-ncnyc250a7] .nav-sub-link .sub-employee-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

/* ==========================================
   PENDING COUNT BADGES
   ========================================== */
[b-ncnyc250a7] .pending-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    background: #f27406;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 600;
    border-radius: 10px;
    flex-shrink: 0;
    margin-left: auto;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.pending-count.header-count[b-ncnyc250a7] {
    margin-left: 0;
    margin-right: 2px;
}

/* ==========================================
   FOOTER (logout)
   ========================================== */
.nav-footer[b-ncnyc250a7] {
    padding: 0 12px 8px;
}

.nav-divider[b-ncnyc250a7] {
    height: 1px;
    background: #e8e8ed;
    margin: 4px 14px 8px;
}

[b-ncnyc250a7] .logout-link {
    color: #888;
    font-weight: 400;
}

[b-ncnyc250a7] .logout-link:hover {
    background: #fef2f2;
    color: #dc2626;
}

[b-ncnyc250a7] .logout-link i {
    color: inherit;
}
/* /Pages/DepartmentOverview.razor.rz.scp.css */
.department-overview-page[b-yufccx1xbw] {
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 24px;
}

.page-title[b-yufccx1xbw] {
    color: #f27406;
    font-weight: 600;
    margin-bottom: 20px;
}

.section-title[b-yufccx1xbw] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.95rem;
    font-weight: 600;
    color: #555;
    margin: 24px 0 12px;
}

.section-title i[b-yufccx1xbw] {
    color: #f27406;
}

.section-count[b-yufccx1xbw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    margin-left: 6px;
    font-size: 0.7rem;
    font-weight: 700;
    color: #fff;
    background: #f27406;
    border-radius: 11px;
}

/* Awaiting-approval section */
.awaiting-approval-section[b-yufccx1xbw] {
    margin-bottom: 8px;
}

.awaiting-approval-list[b-yufccx1xbw] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.awaiting-approval-card[b-yufccx1xbw] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
    background: #fff;
    border: 1px solid #e8e8ed;
    border-left: 3px solid #f27406;
    border-radius: 8px;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}

.awaiting-approval-card:hover[b-yufccx1xbw] {
    border-color: #d0d0d8;
    border-left-color: #f27406;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transform: translateY(-1px);
}

.awaiting-approval-card-info[b-yufccx1xbw] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.awaiting-approval-emp-name[b-yufccx1xbw] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.awaiting-approval-emp-meta[b-yufccx1xbw] {
    font-size: 0.75rem;
    color: #888;
}

.awaiting-approval-week-pill[b-yufccx1xbw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    font-size: 0.78rem;
    font-weight: 600;
    color: #1e40af;
    background: #dbeafe;
    border: 1px solid #bfdbfe;
    border-radius: 14px;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.15s, border-color 0.15s;
}

.awaiting-approval-week-pill:hover[b-yufccx1xbw] {
    background: #bfdbfe;
    border-color: #93c5fd;
}

.awaiting-approval-week-pill i[b-yufccx1xbw] {
    font-size: 0.7rem;
}

.awaiting-approval-emp-hours[b-yufccx1xbw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    font-size: 0.75rem;
    font-weight: 600;
    color: #666;
    background: #f5f5f7;
    border-radius: 16px;
    white-space: nowrap;
}

.awaiting-approval-emp-hours i[b-yufccx1xbw] {
    font-size: 0.65rem;
    color: #999;
}

.approve-action-btn[b-yufccx1xbw] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 7px 14px;
    border: none;
    border-radius: 6px;
    background: #f27406;
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
    white-space: nowrap;
}

.approve-action-btn:hover:not(:disabled)[b-yufccx1xbw] {
    background: #e06800;
}

.approve-action-btn:disabled[b-yufccx1xbw] {
    background: #f5a85c;
    cursor: not-allowed;
}

/* Confirmation modal (mirrors the pattern used by HourRegistrationForm) */
.confirm-overlay[b-yufccx1xbw] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 20px;
    animation: fadeIn-b-yufccx1xbw 0.15s ease;
}

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

.confirm-dialog[b-yufccx1xbw] {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    max-width: 420px;
    width: 100%;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    text-align: center;
}

.confirm-icon[b-yufccx1xbw] {
    font-size: 2rem;
    color: #f27406;
    margin-bottom: 12px;
}

.confirm-title[b-yufccx1xbw] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #333;
    margin: 0 0 8px;
}

.confirm-message[b-yufccx1xbw] {
    font-size: 0.85rem;
    color: #555;
    margin: 0 0 16px;
    line-height: 1.5;
}

.alert-danger[b-yufccx1xbw] {
    padding: 10px 12px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
    border-radius: 6px;
    font-size: 0.8rem;
    margin-bottom: 12px;
    text-align: left;
}

.confirm-actions[b-yufccx1xbw] {
    display: flex;
    justify-content: center;
    gap: 8px;
}

.confirm-btn[b-yufccx1xbw] {
    flex: 1;
    padding: 9px 16px;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.confirm-btn-cancel[b-yufccx1xbw] {
    border: 1px solid #e5e7eb;
    background: #fff;
    color: #6b7280;
}

.confirm-btn-cancel:hover:not(:disabled)[b-yufccx1xbw] {
    background: #f3f4f6;
}

.confirm-btn-proceed[b-yufccx1xbw] {
    border: none;
    background: #f27406;
    color: #fff;
}

.confirm-btn-proceed:hover:not(:disabled)[b-yufccx1xbw] {
    background: #e06800;
}

.confirm-btn:disabled[b-yufccx1xbw] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Search bar */
.search-bar[b-yufccx1xbw] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 8px;
    margin-bottom: 12px;
    transition: border-color 0.15s;
}

.search-bar:focus-within[b-yufccx1xbw] {
    border-color: #f27406;
}

.search-icon[b-yufccx1xbw] {
    font-size: 0.8rem;
    color: #aaa;
    flex-shrink: 0;
}

.search-input[b-yufccx1xbw] {
    flex: 1;
    border: none;
    outline: none;
    font-size: 0.875rem;
    color: #333;
    background: transparent;
}

.search-input[b-yufccx1xbw]::placeholder {
    color: #bbb;
}

.search-clear[b-yufccx1xbw] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: none;
    background: #f0f0f3;
    border-radius: 50%;
    color: #888;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 0.7rem;
    transition: background 0.15s, color 0.15s;
}

.search-clear:hover[b-yufccx1xbw] {
    background: #e0e0e5;
    color: #555;
}

/* Employee list */
.employee-list[b-yufccx1xbw] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Employee card */
.employee-card[b-yufccx1xbw] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 8px;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}

.employee-card:hover[b-yufccx1xbw] {
    border-color: #d0d0d8;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transform: translateY(-1px);
}

.employee-avatar[b-yufccx1xbw] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: #fff3e6;
    color: #f27406;
    border-radius: 50%;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.employee-details[b-yufccx1xbw] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.employee-name[b-yufccx1xbw] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.employee-meta[b-yufccx1xbw] {
    font-size: 0.78rem;
    color: #888;
    display: flex;
    align-items: center;
    gap: 4px;
}

.meta-separator[b-yufccx1xbw] {
    color: #ccc;
}

.employee-hours[b-yufccx1xbw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    font-size: 0.75rem;
    font-weight: 600;
    color: #666;
    background: #f5f5f7;
    border-radius: 16px;
    white-space: nowrap;
    flex-shrink: 0;
}

.employee-hours i[b-yufccx1xbw] {
    font-size: 0.65rem;
    color: #999;
}

.employee-arrow[b-yufccx1xbw] {
    font-size: 0.7rem;
    color: #ccc;
    flex-shrink: 0;
    transition: color 0.15s, transform 0.15s;
}

.employee-card:hover .employee-arrow[b-yufccx1xbw] {
    color: #888;
    transform: translateX(2px);
}

/* Empty state */
.empty-state[b-yufccx1xbw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(239, 66, 32, 0.08);
}

.empty-icon[b-yufccx1xbw] {
    font-size: 3rem;
    color: #ffe0cc;
    margin-bottom: 16px;
}

.empty-message[b-yufccx1xbw] {
    font-size: 1rem;
    font-weight: 500;
    color: #666;
    margin: 0;
}

/* Skeleton loading */
@keyframes shimmer-b-yufccx1xbw {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

.skeleton-card[b-yufccx1xbw] {
    pointer-events: none;
}

.employee-name-skeleton[b-yufccx1xbw] {
    width: 180px;
    height: 18px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-yufccx1xbw 1.5s infinite;
    border-radius: 4px;
}

.employee-info-skeleton[b-yufccx1xbw] {
    width: 100px;
    height: 14px;
    margin-top: 6px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-yufccx1xbw 1.5s infinite;
    border-radius: 4px;
}

/* Mobile */
@media (max-width: 640px) {
    .department-overview-page[b-yufccx1xbw] {
        padding-bottom: 16px;
    }

    .page-title[b-yufccx1xbw] {
        font-size: 1.1rem;
        margin-bottom: 12px;
    }

    .employee-card[b-yufccx1xbw] {
        gap: 10px;
        padding: 12px 14px;
    }

    .employee-hours[b-yufccx1xbw] {
        display: none;
    }

    .empty-state[b-yufccx1xbw] {
        padding: 40px 16px;
    }

    .awaiting-approval-card[b-yufccx1xbw] {
        flex-wrap: wrap;
        gap: 8px;
    }

    .awaiting-approval-card-info[b-yufccx1xbw] {
        flex: 1 1 100%;
    }

    .awaiting-approval-emp-hours[b-yufccx1xbw] {
        display: none;
    }

    .awaiting-approval-week-pill[b-yufccx1xbw],
    .approve-action-btn[b-yufccx1xbw] {
        font-size: 0.75rem;
    }
}
/* /Pages/EmployeeWeekDetail.razor.rz.scp.css */
.employee-week-detail-page[b-75442dksz4] {
    max-width: 1600px;
    margin: 0 auto;
    padding-bottom: 24px;
}

/* Back link */
.back-link[b-75442dksz4] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    font-weight: 500;
    color: #f27406;
    text-decoration: none;
    margin-bottom: 12px;
    transition: color 0.15s;
}

.back-link:hover[b-75442dksz4] {
    color: #ef4220;
}

.back-link i[b-75442dksz4] {
    font-size: 0.7rem;
}

.page-title[b-75442dksz4] {
    color: #f27406;
    font-weight: 600;
    margin-bottom: 4px;
}

.employee-name-skeleton[b-75442dksz4] {
    display: inline-block;
    width: 160px;
    height: 18px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-75442dksz4 1.5s infinite;
    border-radius: 4px;
    vertical-align: middle;
}

.week-label[b-75442dksz4] {
    font-weight: 500;
    font-size: 0.95rem;
    color: #555;
}

/* Week navigation header */
.week-nav-header[b-75442dksz4] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
}

.week-nav-title[b-75442dksz4] {
    flex: 1;
    text-align: center;
}

.week-nav-btn-wrapper[b-75442dksz4] {
    position: relative;
    flex-shrink: 0;
}

.week-rejected-indicator[b-75442dksz4] {
    position: absolute;
    top: -6px;
    right: -6px;
    font-size: 0.65rem;
    color: #dc2626;
    background: #fff;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.week-nav-btn[b-75442dksz4] {
    width: 40px;
    height: 40px;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    background: #fff;
    color: #f27406;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: background 0.15s, border-color 0.15s;
    flex-shrink: 0;
}

.week-nav-btn:hover:not(:disabled)[b-75442dksz4] {
    background: #fff5ee;
    border-color: #f27406;
}

.week-nav-btn:disabled[b-75442dksz4] {
    opacity: 0.4;
    cursor: not-allowed;
}

.week-date-range[b-75442dksz4] {
    display: block;
    font-size: 0.8rem;
    color: #aaa;
    margin-top: 2px;
    margin-bottom: 6px;
}

/* Status badge */
.week-status-badge[b-75442dksz4] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 12px;
    width: fit-content;
    letter-spacing: 0.02em;
}

.week-status-badge.status-open[b-75442dksz4] {
    color: #f27406;
    background: rgba(242, 116, 6, 0.1);
}

.week-status-badge.status-complete[b-75442dksz4] {
    color: #2563eb;
    background: rgba(37, 99, 235, 0.1);
}

.week-status-badge.status-awaiting-approval[b-75442dksz4] {
    color: #b45309;
    background: rgba(180, 83, 9, 0.12);
}

.week-status-badge.status-fiatted[b-75442dksz4] {
    color: #16a34a;
    background: rgba(22, 163, 74, 0.1);
}

.week-status-badge.status-rejected[b-75442dksz4] {
    color: #dc2626;
    background: rgba(220, 38, 38, 0.1);
}

.week-status-badge.status-processed[b-75442dksz4] {
    color: #475569;
    background: rgba(71, 85, 105, 0.1);
}

@keyframes shimmer-b-75442dksz4 {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

.week-label-skeleton[b-75442dksz4] {
    display: block;
    width: 100px;
    height: 16px;
    margin: 0 auto;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-75442dksz4 1.5s infinite;
    border-radius: 4px;
}

.week-date-skeleton[b-75442dksz4] {
    display: block;
    width: 140px;
    height: 12px;
    margin: 4px auto 6px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-75442dksz4 1.5s infinite;
    border-radius: 4px;
}

.status-badge-skeleton[b-75442dksz4] {
    display: inline-block;
    width: 72px;
    height: 22px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-75442dksz4 1.5s infinite;
    border-radius: 12px;
}

/* Error banner */
.lines-error-banner[b-75442dksz4] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    margin-bottom: 16px;
    font-size: 0.85rem;
    font-weight: 500;
    color: #dc2626;
}

.lines-error-banner i[b-75442dksz4] {
    font-size: 0.9rem;
}

/* Empty state */
.empty-state[b-75442dksz4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(239, 66, 32, 0.08);
}

.empty-icon[b-75442dksz4] {
    font-size: 3rem;
    color: #ffe0cc;
    margin-bottom: 16px;
}

.empty-message[b-75442dksz4] {
    font-size: 1rem;
    font-weight: 500;
    color: #666;
}

/* Mobile */
@media (max-width: 640px) {
    .employee-week-detail-page[b-75442dksz4] {
        padding-bottom: 16px;
    }

    .page-title[b-75442dksz4] {
        font-size: 1.1rem;
        margin-bottom: 2px;
    }

    .week-nav-header[b-75442dksz4] {
        gap: 8px;
        margin-bottom: 12px;
    }

    .week-nav-btn[b-75442dksz4] {
        width: 36px;
        height: 36px;
    }

    .week-label[b-75442dksz4] {
        font-size: 0.85rem;
    }

    .empty-state[b-75442dksz4] {
        padding: 40px 16px;
    }
}

/* ============================
   Department-manager approval bar
   ============================ */
.approval-action-bar[b-75442dksz4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    margin: 12px 0;
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    border-left: 3px solid #10b981;
    border-radius: 8px;
}

.approval-action-info[b-75442dksz4] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #065f46;
}

.approval-action-info i[b-75442dksz4] {
    color: #10b981;
}

.approve-action-btn[b-75442dksz4] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 8px 16px;
    border: none;
    border-radius: 6px;
    background: #f27406;
    color: #fff;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
    white-space: nowrap;
}

.approve-action-btn:hover:not(:disabled)[b-75442dksz4] {
    background: #e06800;
}

.approve-action-btn:disabled[b-75442dksz4] {
    background: #f5a85c;
    cursor: not-allowed;
}

/* ============================
   Confirmation modal
   ============================ */
.confirm-overlay[b-75442dksz4] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 20px;
    animation: confirmFadeIn-b-75442dksz4 0.15s ease;
}

@keyframes confirmFadeIn-b-75442dksz4 {
    from { opacity: 0; }
    to { opacity: 1; }
}

.confirm-dialog[b-75442dksz4] {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    max-width: 420px;
    width: 100%;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    text-align: center;
}

.confirm-icon[b-75442dksz4] {
    font-size: 2rem;
    color: #f27406;
    margin-bottom: 12px;
}

.confirm-title[b-75442dksz4] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #333;
    margin: 0 0 8px;
}

.confirm-message[b-75442dksz4] {
    font-size: 0.85rem;
    color: #555;
    margin: 0 0 16px;
    line-height: 1.5;
}

.alert-danger[b-75442dksz4] {
    padding: 10px 12px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
    border-radius: 6px;
    font-size: 0.8rem;
    margin-bottom: 12px;
    text-align: left;
}

.confirm-actions[b-75442dksz4] {
    display: flex;
    justify-content: center;
    gap: 8px;
}

.confirm-btn[b-75442dksz4] {
    flex: 1;
    padding: 9px 16px;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.confirm-btn-cancel[b-75442dksz4] {
    border: 1px solid #e5e7eb;
    background: #fff;
    color: #6b7280;
}

.confirm-btn-cancel:hover:not(:disabled)[b-75442dksz4] {
    background: #f3f4f6;
}

.confirm-btn-proceed[b-75442dksz4] {
    border: none;
    background: #f27406;
    color: #fff;
}

.confirm-btn-proceed:hover:not(:disabled)[b-75442dksz4] {
    background: #e06800;
}

.confirm-btn:disabled[b-75442dksz4] {
    opacity: 0.6;
    cursor: not-allowed;
}
/* /Pages/Home.razor.rz.scp.css */
/* Week selector skeleton — mirrors the real .week-selector-container layout */
@keyframes shimmer-b-bwde2x78ul {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.week-selector-skeleton[b-bwde2x78ul] {
    background: #fff;
    padding: 14px 16px;
    margin: 0 auto 12px auto;
    max-width: 1200px;
    overflow: hidden;
}

.wss-nav-row[b-bwde2x78ul] {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 4px;
}

.wss-chev[b-bwde2x78ul] {
    width: 32px;
    height: 32px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-bwde2x78ul 1.5s infinite;
    border-radius: 8px;
    flex-shrink: 0;
}

.wss-title[b-bwde2x78ul] {
    flex: 1;
    max-width: 220px;
    margin: 0 auto;
    height: 18px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-bwde2x78ul 1.5s infinite;
    border-radius: 4px;
}

.wss-days[b-bwde2x78ul] {
    display: flex;
    gap: 6px;
    padding: 4px 0 6px 0;
    overflow-x: hidden;
}

.wss-day[b-bwde2x78ul] {
    flex: 0 0 auto;
    width: 60px;
    height: 68px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-bwde2x78ul 1.5s infinite;
    border-radius: 8px;
}

.wss-bottom[b-bwde2x78ul] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #fff0e6;
}

.wss-status[b-bwde2x78ul] {
    width: 64px;
    height: 22px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-bwde2x78ul 1.5s infinite;
    border-radius: 12px;
}

.wss-summary[b-bwde2x78ul] {
    width: 130px;
    height: 16px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-bwde2x78ul 1.5s infinite;
    border-radius: 4px;
}

@media (min-width: 750px) {
    .wss-days[b-bwde2x78ul] {
        gap: 8px;
        justify-content: center;
        overflow-x: visible;
    }

    .wss-day[b-bwde2x78ul] {
        width: 84px;
        height: 92px;
    }
}

@media (max-width: 640px) {
    .week-selector-skeleton[b-bwde2x78ul] {
        margin-left: -1rem;
        margin-right: -1rem;
        margin-bottom: 0;
        padding-bottom: 8px;
        max-width: none;
    }

    .wss-day[b-bwde2x78ul] {
        width: 52px;
    }
}

/* Error Container */
.error-container[b-bwde2x78ul] {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Bottom Panels - Side by Side, equal height (form drives, registrations matches and scrolls if needed) */
.bottom-panels[b-bwde2x78ul] {
    display: flex;
    align-items: stretch;
    gap: 20px;
    margin: 1.5rem auto 0 auto;
    max-width: 1200px;
}

.panel-left[b-bwde2x78ul],
.panel-right[b-bwde2x78ul] {
    flex: 1;
    min-width: 0;
}

/* Confirmation dialog */
.confirm-overlay[b-bwde2x78ul] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    padding: 16px;
}

.confirm-dialog[b-bwde2x78ul] {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    max-width: 400px;
    width: 100%;
    text-align: center;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

.confirm-icon[b-bwde2x78ul] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(242, 116, 6, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
}

.confirm-icon i[b-bwde2x78ul] {
    font-size: 1.25rem;
    color: #f27406;
}

.confirm-title[b-bwde2x78ul] {
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a2e;
    margin: 0 0 8px 0;
}

.confirm-message[b-bwde2x78ul] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0 0 20px 0;
    line-height: 1.5;
}

.confirm-error[b-bwde2x78ul] {
    font-size: 0.8rem;
    color: #dc2626;
    background: rgba(220, 38, 38, 0.08);
    padding: 8px 12px;
    border-radius: 6px;
    margin: 0 0 16px 0;
}

.confirm-actions[b-bwde2x78ul] {
    display: flex;
    gap: 10px;
}

.confirm-btn[b-bwde2x78ul] {
    flex: 1;
    padding: 10px 16px;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    border: none;
}

.confirm-btn-cancel[b-bwde2x78ul] {
    background: #f0f0f0;
    color: #333;
}

.confirm-btn-cancel:hover[b-bwde2x78ul] {
    background: #e0e0e0;
}

.confirm-btn-proceed[b-bwde2x78ul] {
    background: #f27406;
    color: #fff;
}

.confirm-btn-proceed:hover[b-bwde2x78ul] {
    background: #ef4220;
}

.confirm-btn-proceed:disabled[b-bwde2x78ul] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Responsive - stack on smaller screens */
@media (max-width: 900px) {
    .bottom-panels[b-bwde2x78ul] {
        flex-direction: column;
        align-items: stretch;
    }
}

/* Mobile — attach form directly under the week selector */
@media (max-width: 640px) {
    .bottom-panels[b-bwde2x78ul] {
        margin-top: 10px;
    }
}
/* /Pages/Profile.razor.rz.scp.css */
.profile-page[b-w331p4r9f4] {
    max-width: 720px;
    margin: 0 auto;
    padding-bottom: 24px;
}

.page-title[b-w331p4r9f4] {
    color: #f27406;
    font-weight: 600;
    margin-bottom: 20px;
}

/* Card grid */
.profile-grid[b-w331p4r9f4] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.profile-card[b-w331p4r9f4] {
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 8px;
    overflow: hidden;
}

.profile-card-header[b-w331p4r9f4] {
    padding: 14px 20px;
    font-weight: 600;
    font-size: 0.95rem;
    color: #333;
    border-bottom: 1px solid #f0f0f0;
}

.profile-card-body[b-w331p4r9f4] {
    padding: 16px 20px;
}

/* User info rows */
.user-info-row[b-w331p4r9f4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid #f5f5f5;
}

.user-info-row:last-child[b-w331p4r9f4] {
    border-bottom: none;
    padding-bottom: 0;
}

.user-info-row:first-child[b-w331p4r9f4] {
    padding-top: 0;
}

.info-label[b-w331p4r9f4] {
    font-size: 0.85rem;
    color: #888;
    font-weight: 500;
}

.info-value[b-w331p4r9f4] {
    font-size: 0.9rem;
    color: #333;
    font-weight: 500;
}

/* Roles */
.roles-list[b-w331p4r9f4] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.role-badge[b-w331p4r9f4] {
    display: inline-block;
    padding: 5px 14px;
    font-size: 0.82rem;
    font-weight: 500;
    color: #f27406;
    background: rgba(242, 116, 6, 0.08);
    border: 1px solid rgba(242, 116, 6, 0.2);
    border-radius: 20px;
}

/* Settings */
.setting-description[b-w331p4r9f4] {
    font-size: 0.85rem;
    color: #999;
    margin-bottom: 12px;
}

.button-group[b-w331p4r9f4] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.setting-btn[b-w331p4r9f4] {
    padding: 7px 18px;
    font-size: 0.85rem;
    font-weight: 500;
    border: 1.5px solid #e0e0e0;
    border-radius: 6px;
    background: #fff;
    color: #555;
    cursor: pointer;
    transition: all 0.15s;
}

.setting-btn:hover[b-w331p4r9f4] {
    border-color: #f27406;
    color: #f27406;
}

.setting-btn.active[b-w331p4r9f4] {
    background: #f27406;
    border-color: #f27406;
    color: #fff;
}

/* Skeleton loaders */
.info-skeleton[b-w331p4r9f4] {
    height: 16px;
    width: 100%;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-w331p4r9f4 1.5s infinite;
    border-radius: 4px;
    margin-bottom: 12px;
}

.info-skeleton.short[b-w331p4r9f4] {
    width: 60%;
}

@keyframes shimmer-b-w331p4r9f4 {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* Responsive */
@media (max-width: 640px) {
    .profile-page[b-w331p4r9f4] {
        padding: 0 4px;
    }

    .profile-card-header[b-w331p4r9f4] {
        padding: 12px 16px;
    }

    .profile-card-body[b-w331p4r9f4] {
        padding: 12px 16px;
    }

    .user-info-row[b-w331p4r9f4] {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
    }
}
/* /Pages/ProjectDetail.razor.rz.scp.css */
.project-detail-page[b-2xd3pxsoau] {
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 24px;
}

/* ── Back link ── */
.back-link[b-2xd3pxsoau] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.82rem;
    font-weight: 500;
    color: #888;
    text-decoration: none;
    margin-bottom: 12px;
    transition: color 0.15s;
}

.back-link:hover[b-2xd3pxsoau] {
    color: #f27406;
}

.back-link i[b-2xd3pxsoau] {
    font-size: 0.72rem;
}

/* ── Header card ── */
.detail-header-card[b-2xd3pxsoau] {
    background: #fff;
    border: 1px solid #e8e8ed;
    border-left: 4px solid #ccc;
    border-radius: 10px;
    padding: 20px 24px;
    margin-bottom: 20px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

.header-card-top[b-2xd3pxsoau] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}

.header-card-info[b-2xd3pxsoau] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    flex-shrink: 1;
}

.detail-title[b-2xd3pxsoau] {
    color: #333;
    font-weight: 600;
    margin: 0;
    font-size: 1.3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.detail-code[b-2xd3pxsoau] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    font-size: 0.78rem;
    font-weight: 700;
    border-radius: 6px;
    letter-spacing: 0.02em;
    white-space: nowrap;
    flex-shrink: 0;
}

.header-stats[b-2xd3pxsoau] {
    display: flex;
    align-items: flex-start;
    gap: 28px;
    flex-shrink: 0;
}

.header-stat[b-2xd3pxsoau] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.stat-label[b-2xd3pxsoau] {
    font-size: 0.72rem;
    font-weight: 500;
    color: #999;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 5px;
}

.stat-label i[b-2xd3pxsoau] {
    font-size: 0.65rem;
    color: #bbb;
}

.stat-value[b-2xd3pxsoau] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #333;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.header-card-meta[b-2xd3pxsoau] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #f0f0f0;
}

.header-card-meta-left[b-2xd3pxsoau] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.meta-item[b-2xd3pxsoau] {
    font-size: 0.78rem;
    font-weight: 500;
    color: #888;
    display: flex;
    align-items: center;
    gap: 5px;
}

.meta-item i[b-2xd3pxsoau] {
    font-size: 0.7rem;
    color: #bbb;
}

.meta-separator[b-2xd3pxsoau] {
    color: #ccc;
    font-size: 0.8rem;
}

.meta-skeleton[b-2xd3pxsoau] {
    display: inline-block;
    width: 86px;
    height: 0.78rem;
    border-radius: 4px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-2xd3pxsoau 1.5s infinite;
    vertical-align: middle;
}

.stat-skeleton[b-2xd3pxsoau] {
    display: inline-block;
    height: 1.15rem;
    border-radius: 4px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-2xd3pxsoau 1.5s infinite;
}

.stat-skeleton-sm[b-2xd3pxsoau] { width: 70px; }
.stat-skeleton-md[b-2xd3pxsoau] { width: 80px; }
.stat-skeleton-lg[b-2xd3pxsoau] { width: 110px; }

.recalc-btn[b-2xd3pxsoau] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    font-size: 0.78rem;
    font-weight: 600;
    color: #555;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s;
}

.recalc-btn:hover:not(:disabled)[b-2xd3pxsoau] {
    background: #fafafa;
    border-color: #f27406;
    color: #f27406;
}

.recalc-btn:disabled[b-2xd3pxsoau] {
    opacity: 0.6;
    cursor: not-allowed;
}

.recalc-btn i[b-2xd3pxsoau] {
    font-size: 0.75rem;
}

.recalc-message[b-2xd3pxsoau] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    padding: 6px 10px;
    font-size: 0.78rem;
    border-radius: 6px;
}

.recalc-message-success[b-2xd3pxsoau] {
    background: rgba(22, 163, 74, 0.08);
    color: #16a34a;
}

.recalc-message-error[b-2xd3pxsoau] {
    background: rgba(220, 38, 38, 0.08);
    color: #dc2626;
}

/* ── Detail tabs ── */
.detail-tabs[b-2xd3pxsoau] {
    display: flex;
    gap: 4px;
    margin-bottom: 16px;
    border-bottom: 1px solid #e8e8ed;
}

.detail-tab[b-2xd3pxsoau] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border: none;
    background: transparent;
    color: #888;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: color 0.15s, border-color 0.15s;
}

.detail-tab i[b-2xd3pxsoau] {
    font-size: 0.82rem;
}

.detail-tab:hover[b-2xd3pxsoau] {
    color: #555;
}

.detail-tab.active[b-2xd3pxsoau] {
    color: #f27406;
    border-bottom-color: #f27406;
}

/* ── ProjectNotFound empty state ── */
.empty-state[b-2xd3pxsoau] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(239, 66, 32, 0.08);
}

.empty-icon[b-2xd3pxsoau] {
    font-size: 3rem;
    color: #ffe0cc;
    margin-bottom: 16px;
}

.empty-message[b-2xd3pxsoau] {
    font-size: 1rem;
    font-weight: 500;
    color: #666;
    margin: 0;
}

/* ── Initial-load skeleton ── */
@keyframes shimmer-b-2xd3pxsoau {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.skeleton-header-card[b-2xd3pxsoau] {
    border-left-color: #e0e0e0 !important;
}

.detail-code-skeleton[b-2xd3pxsoau] {
    width: 70px;
    height: 24px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-2xd3pxsoau 1.5s infinite;
    border-radius: 6px;
    flex-shrink: 0;
}

.detail-desc-skeleton[b-2xd3pxsoau] {
    width: 220px;
    height: 24px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-2xd3pxsoau 1.5s infinite;
    border-radius: 4px;
}

.filter-skeleton[b-2xd3pxsoau] {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

.skeleton-select[b-2xd3pxsoau] {
    width: 180px;
    height: 38px;
    border-radius: 8px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-2xd3pxsoau 1.5s infinite;
}

.cards-skeleton[b-2xd3pxsoau] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.card-skeleton[b-2xd3pxsoau] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid #f0f0f0;
}

.skeleton-circle[b-2xd3pxsoau] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-2xd3pxsoau 1.5s infinite;
    flex-shrink: 0;
}

.skeleton-lines[b-2xd3pxsoau] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.skeleton-line[b-2xd3pxsoau] {
    height: 12px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-2xd3pxsoau 1.5s infinite;
    border-radius: 4px;
}

.skeleton-line.short[b-2xd3pxsoau] { width: 60%; }
.skeleton-line.medium[b-2xd3pxsoau] { width: 80%; }

/* ── Mobile ── */
@media (max-width: 768px) {
    .project-detail-page[b-2xd3pxsoau] {
        padding-bottom: 16px;
    }

    .header-card-top[b-2xd3pxsoau] {
        flex-direction: column;
        gap: 16px;
    }

    .header-card-meta[b-2xd3pxsoau] {
        flex-direction: column;
        align-items: flex-start;
    }

    .header-card-info[b-2xd3pxsoau] {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }

    .detail-title[b-2xd3pxsoau] {
        font-size: 1.1rem;
        white-space: normal;
    }

    .header-stats[b-2xd3pxsoau] {
        gap: 20px;
    }

    .stat-value[b-2xd3pxsoau] {
        font-size: 1rem;
    }

    .detail-tab[b-2xd3pxsoau] {
        flex: 1;
        justify-content: center;
        padding: 10px 8px;
        font-size: 0.82rem;
    }

    .detail-tab span[b-2xd3pxsoau] {
        white-space: nowrap;
    }
}

@media (max-width: 640px) {
    .header-stats[b-2xd3pxsoau] {
        flex-wrap: wrap;
        gap: 14px;
    }
}

@media (max-width: 360px) {
    .project-detail-page[b-2xd3pxsoau] {
        padding-bottom: 12px;
    }

    .detail-header-card[b-2xd3pxsoau] {
        padding: 14px 12px;
    }

    .detail-title[b-2xd3pxsoau] {
        font-size: 0.95rem;
    }

    .detail-code[b-2xd3pxsoau] {
        font-size: 0.7rem;
        padding: 3px 8px;
    }
}
/* /Pages/ProjectOverview.razor.rz.scp.css */
.project-overview-page[b-9ast9u26ty] {
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 24px;
}

.page-title[b-9ast9u26ty] {
    color: #f27406;
    font-weight: 600;
    margin-bottom: 20px;
}

/* Filter bar */
.filter-bar[b-9ast9u26ty] {
    margin-bottom: 16px;
}

.filter-select[b-9ast9u26ty] {
    padding: 7px 32px 7px 12px;
    border: 1.5px solid #e0e0e0;
    border-radius: 8px;
    background: #fff;
    font-size: 0.85rem;
    font-weight: 500;
    color: #444;
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    transition: border-color 0.15s;
}

.filter-select:hover[b-9ast9u26ty] {
    border-color: #ccc;
}

.filter-select:focus[b-9ast9u26ty] {
    outline: none;
    border-color: #f27406;
}

/* Section header */
.section-header[b-9ast9u26ty] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #888;
    margin: 24px 0 8px 0;
    padding-bottom: 6px;
    border-bottom: 1px solid #e8e8ed;
}

.section-header i[b-9ast9u26ty] {
    font-size: 0.75rem;
    color: #aaa;
}

/* Project list */
.project-list[b-9ast9u26ty] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Empty state */
.empty-state[b-9ast9u26ty] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(239, 66, 32, 0.08);
}

.empty-icon[b-9ast9u26ty] {
    font-size: 3rem;
    color: #ffe0cc;
    margin-bottom: 16px;
}

.empty-message[b-9ast9u26ty] {
    font-size: 1rem;
    font-weight: 500;
    color: #666;
    margin: 0 0 4px 0;
}

.empty-hint[b-9ast9u26ty] {
    font-size: 0.85rem;
    color: #999;
    margin: 0;
}

/* Skeleton loading */
@keyframes shimmer-b-9ast9u26ty {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

.skeleton-card[b-9ast9u26ty] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 16px;
    padding: 14px 18px;
    background: #fff;
    border: 1px solid #e8e8ed;
    border-radius: 8px;
    pointer-events: none;
}

.project-code-skeleton[b-9ast9u26ty] {
    width: 80px;
    height: 28px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-9ast9u26ty 1.5s infinite;
    border-radius: 6px;
}

.project-desc-skeleton[b-9ast9u26ty] {
    flex: 1;
    height: 18px;
    max-width: 300px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-9ast9u26ty 1.5s infinite;
    border-radius: 4px;
}

/* Mobile */
@media (max-width: 640px) {
    .project-overview-page[b-9ast9u26ty] {
        padding-bottom: 16px;
    }

    .page-title[b-9ast9u26ty] {
        font-size: 1.1rem;
        margin-bottom: 12px;
    }

    .empty-state[b-9ast9u26ty] {
        padding: 40px 16px;
    }

    .skeleton-card[b-9ast9u26ty] {
        gap: 10px;
        padding: 12px 14px;
    }
}
/* /Pages/WeekOverview.razor.rz.scp.css */
.week-overview-page[b-byoq5x1l89] {
    max-width: 1600px;
    margin: 0 auto;
    padding-bottom: 24px;
}

.page-title[b-byoq5x1l89] {
    color: #f27406;
    font-weight: 600;
    margin-bottom: 4px;
}

.week-label[b-byoq5x1l89] {
    font-weight: 500;
    font-size: 0.95rem;
    color: #555;
}

/* Week navigation header */
.week-nav-header[b-byoq5x1l89] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
}

.week-nav-title[b-byoq5x1l89] {
    flex: 1;
    text-align: center;
}

.week-nav-btn-wrapper[b-byoq5x1l89] {
    position: relative;
    flex-shrink: 0;
}

.week-rejected-indicator[b-byoq5x1l89] {
    position: absolute;
    top: -6px;
    right: -6px;
    font-size: 0.65rem;
    color: #dc2626;
    background: #fff;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.week-nav-btn[b-byoq5x1l89] {
    width: 40px;
    height: 40px;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    background: #fff;
    color: #f27406;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: background 0.15s, border-color 0.15s;
    flex-shrink: 0;
}

.week-nav-btn:hover:not(:disabled)[b-byoq5x1l89] {
    background: #fff5ee;
    border-color: #f27406;
}

.week-nav-btn:disabled[b-byoq5x1l89] {
    opacity: 0.4;
    cursor: not-allowed;
}

.week-date-range[b-byoq5x1l89] {
    display: block;
    font-size: 0.8rem;
    color: #aaa;
    margin-top: 2px;
    margin-bottom: 6px;
}

/* Status badge */
.week-status-badge[b-byoq5x1l89] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 12px;
    width: fit-content;
    letter-spacing: 0.02em;
}

.week-status-badge.status-open[b-byoq5x1l89] {
    color: #f27406;
    background: rgba(242, 116, 6, 0.1);
}

.week-status-badge.status-complete[b-byoq5x1l89] {
    color: #2563eb;
    background: rgba(37, 99, 235, 0.1);
}

.week-status-badge.status-awaiting-approval[b-byoq5x1l89] {
    color: #b45309;
    background: rgba(180, 83, 9, 0.12);
}

.week-status-badge.status-fiatted[b-byoq5x1l89] {
    color: #16a34a;
    background: rgba(22, 163, 74, 0.1);
}

.week-status-badge.status-rejected[b-byoq5x1l89] {
    color: #dc2626;
    background: rgba(220, 38, 38, 0.1);
}

.week-status-badge.status-processed[b-byoq5x1l89] {
    color: #475569;
    background: rgba(71, 85, 105, 0.1);
}

@keyframes shimmer-b-byoq5x1l89 {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

.week-label-skeleton[b-byoq5x1l89] {
    display: block;
    width: 100px;
    height: 16px;
    margin: 0 auto;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-byoq5x1l89 1.5s infinite;
    border-radius: 4px;
}

.week-date-skeleton[b-byoq5x1l89] {
    display: block;
    width: 140px;
    height: 12px;
    margin: 4px auto 6px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-byoq5x1l89 1.5s infinite;
    border-radius: 4px;
}

.status-badge-skeleton[b-byoq5x1l89] {
    display: inline-block;
    width: 72px;
    height: 22px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-byoq5x1l89 1.5s infinite;
    border-radius: 12px;
}

/* Locked banner */
.lines-error-banner[b-byoq5x1l89] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    margin-bottom: 16px;
    font-size: 0.85rem;
    font-weight: 500;
    color: #dc2626;
}

.lines-error-banner i[b-byoq5x1l89] {
    font-size: 0.9rem;
}

.week-locked-banner[b-byoq5x1l89] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: rgba(242, 116, 6, 0.08);
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    margin-bottom: 16px;
    font-size: 0.85rem;
    font-weight: 500;
    color: #f27406;
}

.week-locked-banner i[b-byoq5x1l89] {
    font-size: 0.9rem;
}

.locked-hint[b-byoq5x1l89] {
    color: #888;
    font-size: 0.8rem;
    font-weight: 400;
    margin-left: auto;
}

/* Complete action */
.complete-action[b-byoq5x1l89] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 16px;
}

.complete-btn[b-byoq5x1l89] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #fff;
    background: #f27406;
    border: none;
    padding: 8px 18px;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s ease;
    white-space: nowrap;
}

.complete-btn:hover[b-byoq5x1l89] {
    background: #ef4220;
}

/* Empty state */
.empty-state[b-byoq5x1l89] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 20px;
    background: #fff;
    border: 1px solid #ffe0cc;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(239, 66, 32, 0.08);
}

.empty-icon[b-byoq5x1l89] {
    font-size: 3rem;
    color: #ffe0cc;
    margin-bottom: 16px;
}

.empty-message[b-byoq5x1l89] {
    font-size: 1rem;
    font-weight: 500;
    color: #666;
}

/* Confirmation dialog */
.confirm-overlay[b-byoq5x1l89] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    padding: 16px;
}

.confirm-dialog[b-byoq5x1l89] {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    max-width: 400px;
    width: 100%;
    text-align: center;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

.confirm-icon[b-byoq5x1l89] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(242, 116, 6, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
}

.confirm-icon i[b-byoq5x1l89] {
    font-size: 1.25rem;
    color: #f27406;
}

.confirm-title[b-byoq5x1l89] {
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a2e;
    margin: 0 0 8px 0;
}

.confirm-message[b-byoq5x1l89] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0 0 20px 0;
    line-height: 1.5;
}

.confirm-actions[b-byoq5x1l89] {
    display: flex;
    gap: 10px;
}

.confirm-btn[b-byoq5x1l89] {
    flex: 1;
    padding: 10px 16px;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    border: none;
}

.confirm-btn-cancel[b-byoq5x1l89] {
    background: #f0f0f0;
    color: #333;
}

.confirm-btn-cancel:hover[b-byoq5x1l89] {
    background: #e0e0e0;
}

.confirm-btn-proceed[b-byoq5x1l89] {
    background: #f27406;
    color: #fff;
}

.confirm-btn-proceed:hover[b-byoq5x1l89] {
    background: #ef4220;
}

.confirm-btn-proceed:disabled[b-byoq5x1l89] {
    opacity: 0.6;
    cursor: not-allowed;
}

.confirm-error[b-byoq5x1l89] {
    font-size: 0.8rem;
    color: #dc2626;
    background: rgba(220, 38, 38, 0.08);
    padding: 8px 12px;
    border-radius: 6px;
    margin: 0 0 16px 0;
}

/* ==========================================
   MOBILE
   ========================================== */
@media (max-width: 640px) {
    .week-overview-page[b-byoq5x1l89] {
        padding-bottom: 16px;
    }

    .page-title[b-byoq5x1l89] {
        font-size: 1.1rem;
        margin-bottom: 2px;
    }

    .week-nav-header[b-byoq5x1l89] {
        gap: 8px;
        margin-bottom: 12px;
    }

    .week-nav-btn[b-byoq5x1l89] {
        width: 36px;
        height: 36px;
    }

    .week-label[b-byoq5x1l89] {
        font-size: 0.85rem;
    }

    .week-locked-banner[b-byoq5x1l89] {
        flex-wrap: wrap;
        font-size: 0.8rem;
    }

    .locked-hint[b-byoq5x1l89] {
        margin-left: 0;
        width: 100%;
        margin-top: 4px;
    }

    .empty-state[b-byoq5x1l89] {
        padding: 40px 16px;
    }
}