/* /Components/Account/Pages/Manage/Index.razor.rz.scp.css */
.profile-page[b-ypyy510sum] {
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.profile-header[b-ypyy510sum] {
    margin-bottom: 2rem;
}

.profile-header h1[b-ypyy510sum] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 600;
    color: #333;
}

.profile-subtitle[b-ypyy510sum] {
    margin: 0.25rem 0 0 0;
    color: #6c757d;
    font-size: 0.95rem;
}

.profile-sections[b-ypyy510sum] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Section Card */
.profile-section[b-ypyy510sum] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.section-header[b-ypyy510sum] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    background-color: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
}

.section-icon[b-ypyy510sum] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: #1b4a98;
    color: white;
    border-radius: 10px;
    flex-shrink: 0;
}

.section-icon svg[b-ypyy510sum] {
    color: white;
}

.section-header h2[b-ypyy510sum] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #333;
}

.section-header p[b-ypyy510sum] {
    margin: 0.25rem 0 0 0;
    font-size: 0.85rem;
    color: #6c757d;
}

.section-content[b-ypyy510sum] {
    padding: 1.5rem;
}

/* Form Elements */
.form-group[b-ypyy510sum] {
    margin-bottom: 1rem;
}

.form-group:last-child[b-ypyy510sum] {
    margin-bottom: 0;
}

.form-group label[b-ypyy510sum] {
    display: block;
    margin-bottom: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #333;
}

.form-control[b-ypyy510sum] {
    width: 100%;
    padding: 0.625rem 0.875rem;
    font-size: 0.9rem;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    background-color: white;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-control:focus[b-ypyy510sum] {
    outline: none;
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

.form-control:disabled[b-ypyy510sum] {
    background-color: #f8f9fa;
    color: #6c757d;
}

.form-hint[b-ypyy510sum] {
    margin: 0.5rem 0 0 0;
    font-size: 0.8rem;
    color: #6c757d;
}

.form-row[b-ypyy510sum] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

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

/* Input with Badge */
.input-with-badge[b-ypyy510sum] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.input-with-badge .form-control[b-ypyy510sum] {
    flex: 1;
}

/* Badges */
.badge[b-ypyy510sum] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 500;
    border-radius: 20px;
    white-space: nowrap;
}

.badge-success[b-ypyy510sum] {
    background-color: #d4edda;
    color: #155724;
}

.badge-warning[b-ypyy510sum] {
    background-color: #fff3cd;
    color: #856404;
}

/* Buttons */
.btn[b-ypyy510sum] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-primary[b-ypyy510sum] {
    background-color: #1b4a98;
    color: white;
}

.btn-primary:hover[b-ypyy510sum] {
    background-color: #153a7a;
}

.btn-primary:disabled[b-ypyy510sum] {
    background-color: #6c757d;
    cursor: not-allowed;
}

.btn-outline[b-ypyy510sum] {
    background-color: white;
    color: #495057;
    border: 1px solid #dee2e6;
}

.btn-outline:hover[b-ypyy510sum] {
    background-color: #f8f9fa;
    border-color: #adb5bd;
}

.btn-lg[b-ypyy510sum] {
    padding: 0.875rem 2rem;
    font-size: 1rem;
}

.button-group[b-ypyy510sum] {
    display: flex;
    gap: 0.75rem;
    margin-top: 1rem;
}

/* Profile Actions */
.profile-actions[b-ypyy510sum] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.5rem;
}

/* Loading */
.loading-container[b-ypyy510sum] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6c757d;
}

.spinner[b-ypyy510sum] {
    width: 32px;
    height: 32px;
    border: 3px solid #e9ecef;
    border-top-color: #1b4a98;
    border-radius: 50%;
    animation: spin-b-ypyy510sum 0.8s linear infinite;
}

.spinner-sm[b-ypyy510sum] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-ypyy510sum 0.8s linear infinite;
}

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

/* Alerts */
.alert[b-ypyy510sum] {
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.875rem;
    margin-top: 0.75rem;
}

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

/* Responsive */
@media (max-width: 768px) {
    .profile-page[b-ypyy510sum] {
        padding: 1rem;
    }
    
    .form-row[b-ypyy510sum],
    .form-row-3[b-ypyy510sum] {
        grid-template-columns: 1fr;
    }
    
    .section-header[b-ypyy510sum] {
        padding: 1rem;
    }
    
    .section-content[b-ypyy510sum] {
        padding: 1rem;
    }
    
    .input-with-badge[b-ypyy510sum] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }
    
    .profile-actions[b-ypyy510sum] {
        justify-content: stretch;
    }
    
    .profile-actions .btn[b-ypyy510sum] {
        width: 100%;
    }
}
/* /Components/Dashboard/Widgets/LeaveTimeWidget.razor.rz.scp.css */
/* PTO display */
.pto-display[b-7m1hejyd46] {
    padding: 4px 0;
}

/* Total banner */
.pto-total-banner[b-7m1hejyd46] {
    text-align: center;
    padding: 10px 0 12px;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 10px;
}

.pto-total-value[b-7m1hejyd46] {
    display: block;
    font-size: 1.5rem;
    font-weight: 700;
    color: #1b4a98;
    line-height: 1.2;
}

.pto-total-label[b-7m1hejyd46] {
    display: block;
    font-size: 0.75rem;
    color: #9ca3af;
    margin-top: 2px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Per-type breakdown */
.pto-breakdown[b-7m1hejyd46] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pto-type-row[b-7m1hejyd46] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 0;
}

.pto-type-name[b-7m1hejyd46] {
    font-size: 0.8rem;
    color: #6b7280;
    font-weight: 500;
}

.pto-type-value[b-7m1hejyd46] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #374151;
}

/* PTO link buttons */
.pto-actions[b-7m1hejyd46] {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
}

.btn-pto-link[b-7m1hejyd46] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: none;
    border: none;
    color: #1b4a98;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 6px;
    transition: background-color 0.15s ease;
}

.btn-pto-link:hover[b-7m1hejyd46] {
    background-color: #e8f0fe;
}

/* States */
.loading-state[b-7m1hejyd46] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    color: #6b7280;
    font-size: 0.85rem;
}

.empty-state[b-7m1hejyd46] {
    text-align: center;
    padding: 16px;
    color: #9ca3af;
    font-size: 0.85rem;
}

.spinner[b-7m1hejyd46] {
    width: 16px;
    height: 16px;
    border: 2px solid #e5e7eb;
    border-top-color: #1b4a98;
    border-radius: 50%;
    animation: spin-b-7m1hejyd46 0.6s linear infinite;
}

@keyframes spin-b-7m1hejyd46 {
    to { transform: rotate(360deg); }
}
/* /Components/Dashboard/Widgets/MyWorkLogsWidget.razor.rz.scp.css */
/* Sections */
.worklogs-section[b-cwvjkwrxz4] {
    margin-bottom: 1.25rem;
}

.worklogs-section:last-of-type[b-cwvjkwrxz4] {
    margin-bottom: 1rem;
}

.section-header[b-cwvjkwrxz4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e9ecef;
}

.section-header h4[b-cwvjkwrxz4] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #333;
}

.section-summary[b-cwvjkwrxz4] {
    font-size: 0.75rem;
    color: #6c757d;
}

/* Work Logs List */
.worklogs-list[b-cwvjkwrxz4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.worklog-item[b-cwvjkwrxz4] {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 0.25rem 0.75rem;
    padding: 0.625rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.15s ease, transform 0.1s ease;
}

.worklog-item:hover[b-cwvjkwrxz4] {
    background-color: #e9ecef;
    transform: translateX(2px);
}

.worklog-date[b-cwvjkwrxz4] {
    grid-column: 1 / -1;
    font-size: 0.7rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.125rem;
}

.worklog-project[b-cwvjkwrxz4] {
    grid-column: 1;
    grid-row: 1;
}

.project-name[b-cwvjkwrxz4] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #1b4a98;
}

.no-project[b-cwvjkwrxz4] {
    font-size: 0.8rem;
    font-style: italic;
    color: #6c757d;
}

.worklog-desc[b-cwvjkwrxz4] {
    grid-column: 1;
    grid-row: 2;
    font-size: 0.8rem;
    color: #495057;
    line-height: 1.4;
}

.worklog-time[b-cwvjkwrxz4] {
    grid-column: 2;
    grid-row: 1 / 3;
    align-self: center;
    font-size: 0.8rem;
    font-weight: 600;
    color: #28a745;
    white-space: nowrap;
}

/* With date row adjustment */
.worklog-item:has(.worklog-date) .worklog-project[b-cwvjkwrxz4] {
    grid-row: 2;
}

.worklog-item:has(.worklog-date) .worklog-desc[b-cwvjkwrxz4] {
    grid-row: 3;
}

.worklog-item:has(.worklog-date) .worklog-time[b-cwvjkwrxz4] {
    grid-row: 2 / 4;
}

/* More Link */
.more-link[b-cwvjkwrxz4] {
    text-align: center;
    padding-top: 0.5rem;
}

.more-link a[b-cwvjkwrxz4] {
    font-size: 0.8rem;
    color: #1b4a98;
    text-decoration: none;
}

.more-link a:hover[b-cwvjkwrxz4] {
    text-decoration: underline;
}

/* Empty Section */
.empty-section[b-cwvjkwrxz4] {
    padding: 1rem;
    text-align: center;
    background-color: #f8f9fa;
    border-radius: 8px;
}

.empty-section span[b-cwvjkwrxz4] {
    font-size: 0.8rem;
    color: #6c757d;
}

/* Widget Footer */
.widget-footer[b-cwvjkwrxz4] {
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: center;
}

.btn-add[b-cwvjkwrxz4] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: #1b4a98;
    background-color: #e8f0fe;
    border: none;
    border-radius: 6px;
    text-decoration: none;
    transition: background-color 0.15s ease;
}

.btn-add:hover[b-cwvjkwrxz4] {
    background-color: #d4e5ff;
}

/* Loading State */
.loading-state[b-cwvjkwrxz4] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 3rem;
    color: #6c757d;
}

.spinner[b-cwvjkwrxz4] {
    width: 16px;
    height: 16px;
    border: 2px solid #e9ecef;
    border-top-color: #1b4a98;
    border-radius: 50%;
    animation: spin-b-cwvjkwrxz4 0.8s linear infinite;
}

@keyframes spin-b-cwvjkwrxz4 {
    to { transform: rotate(360deg); }
}
/* /Components/Dashboard/Widgets/QuickLinksWidget.razor.rz.scp.css */
/* Quick links list */
.quick-links-list[b-5ashktlelm] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 4px 0;
}

/* Individual link item */
.quick-link-item[b-5ashktlelm] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    text-decoration: none;
    color: #374151;
    transition: background-color 0.15s ease;
}

.quick-link-item:hover[b-5ashktlelm] {
    background-color: #f0f5ff;
    color: #1b4a98;
    text-decoration: none;
}

.quick-link-item:hover .quick-link-icon[b-5ashktlelm] {
    color: #1b4a98;
}

.quick-link-item:hover .quick-link-arrow[b-5ashktlelm] {
    opacity: 1;
}

/* Icon */
.quick-link-icon[b-5ashktlelm] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background-color: #f0f2f5;
    color: #6b7280;
    flex-shrink: 0;
    transition: color 0.15s ease, background-color 0.15s ease;
}

.quick-link-item:hover .quick-link-icon[b-5ashktlelm] {
    background-color: #d4e5ff;
}

/* Text */
.quick-link-text[b-5ashktlelm] {
    flex: 1;
    font-size: 0.85rem;
    font-weight: 500;
}

/* Arrow */
.quick-link-arrow[b-5ashktlelm] {
    display: flex;
    align-items: center;
    color: #9ca3af;
    opacity: 0;
    transition: opacity 0.15s ease;
}
/* /Components/Dashboard/Widgets/TeamActivityWidget.razor.rz.scp.css */
/* Activity Summary */
.activity-summary[b-mzkyw1elah] {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
}

.stat-number.pto-count[b-mzkyw1elah] {
    color: #f59e0b;
}

/* PTO Section Header */
.pto-section-header[b-mzkyw1elah] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.5rem;
    padding: 0.375rem 0.5rem;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #92400e;
    background-color: #fffbeb;
    border-radius: 6px;
    border: 1px solid #fde68a;
}

/* PTO Staff Items */
.staff-item.is-pto[b-mzkyw1elah] {
    opacity: 0.85;
}

.avatar-initials.pto-avatar[b-mzkyw1elah] {
    background: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
}

.status-indicator.pto[b-mzkyw1elah] {
    background-color: #f59e0b;
}

.status-pto[b-mzkyw1elah] {
    color: #b45309;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.summary-stat[b-mzkyw1elah] {
    display: flex;
    align-items: baseline;
    gap: 0.375rem;
}

.stat-number[b-mzkyw1elah] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #333;
}

.stat-number.clocked-in[b-mzkyw1elah] {
    color: #28a745;
}

.stat-text[b-mzkyw1elah] {
    font-size: 0.8rem;
    color: #6c757d;
}

/* Staff List */
.staff-list[b-mzkyw1elah] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 280px;
    overflow-y: auto;
}

.staff-item[b-mzkyw1elah] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem;
    border-radius: 8px;
    transition: background-color 0.15s ease;
}

.staff-item:hover[b-mzkyw1elah] {
    background-color: #f8f9fa;
}

.staff-item.is-active[b-mzkyw1elah] {
    background-color: #f0fff4;
}

/* Staff Avatar */
.staff-avatar[b-mzkyw1elah] {
    position: relative;
    flex-shrink: 0;
}

.avatar-initials[b-mzkyw1elah] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 600;
}

.status-indicator[b-mzkyw1elah] {
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid white;
}

.status-indicator.active[b-mzkyw1elah] {
    background-color: #28a745;
}

/* Staff Info */
.staff-info[b-mzkyw1elah] {
    flex: 1;
    min-width: 0;
}

.staff-name[b-mzkyw1elah] {
    font-weight: 500;
    font-size: 0.875rem;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.staff-status[b-mzkyw1elah] {
    font-size: 0.75rem;
    margin-top: 0.125rem;
}

.status-active[b-mzkyw1elah] {
    color: #28a745;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.status-inactive[b-mzkyw1elah] {
    color: #6c757d;
}

/* Staff Time */
.staff-time[b-mzkyw1elah] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

/* Pulse Dot */
.pulse-dot[b-mzkyw1elah] {
    width: 6px;
    height: 6px;
    background-color: #28a745;
    border-radius: 50%;
    display: inline-block;
    animation: pulse-b-mzkyw1elah 2s ease-in-out infinite;
}

@keyframes pulse-b-mzkyw1elah {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(1.2); }
}

/* Loading State */
.loading-state[b-mzkyw1elah] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #6c757d;
}

.spinner[b-mzkyw1elah] {
    width: 16px;
    height: 16px;
    border: 2px solid #e9ecef;
    border-top-color: #1b4a98;
    border-radius: 50%;
    animation: spin-b-mzkyw1elah 0.8s linear infinite;
}

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

/* Empty State */
.empty-state[b-mzkyw1elah] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    color: #6c757d;
    text-align: center;
}

.empty-state svg[b-mzkyw1elah] {
    margin-bottom: 0.5rem;
    opacity: 0.5;
}

.empty-state p[b-mzkyw1elah] {
    margin: 0;
    font-size: 0.875rem;
}

/* Scrollbar styling */
.staff-list[b-mzkyw1elah]::-webkit-scrollbar {
    width: 4px;
}

.staff-list[b-mzkyw1elah]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 2px;
}

.staff-list[b-mzkyw1elah]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 2px;
}

.staff-list[b-mzkyw1elah]::-webkit-scrollbar-thumb:hover {
    background: #a1a1a1;
}
/* /Components/Dashboard/Widgets/TimeTrackingWidget.razor.rz.scp.css */
/* Clocked-in banner */
.clocked-in-banner[b-91bmviqwdo] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    background-color: #d4edda;
    color: #155724;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 500;
    margin-bottom: 12px;
}

.pulse-dot[b-91bmviqwdo] {
    width: 8px;
    height: 8px;
    background-color: #28a745;
    border-radius: 50%;
    flex-shrink: 0;
    animation: pulse-b-91bmviqwdo 2s infinite;
}

@keyframes pulse-b-91bmviqwdo {
    0% { box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.7); }
    70% { box-shadow: 0 0 0 6px rgba(40, 167, 69, 0); }
    100% { box-shadow: 0 0 0 0 rgba(40, 167, 69, 0); }
}

/* Section labels */
.section-label[b-91bmviqwdo] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}

/* Today grid */
.today-grid[b-91bmviqwdo] {
    display: flex;
    gap: 16px;
}

.metric-box[b-91bmviqwdo] {
    flex: 1;
    text-align: center;
}

.metric-label[b-91bmviqwdo] {
    font-size: 0.7rem;
    color: #6b7280;
    margin-bottom: 2px;
}

.metric-value[b-91bmviqwdo] {
    font-size: 1.4rem;
    font-weight: 700;
    color: #1b4a98;
    line-height: 1.2;
}

.metric-value-sm[b-91bmviqwdo] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #374151;
    line-height: 1.2;
}

.metric-pct[b-91bmviqwdo] {
    font-size: 0.75rem;
    font-weight: 600;
    margin-top: 2px;
}

/* Logged percentage bar */
.logged-bar-container[b-91bmviqwdo] {
    width: 100%;
    height: 6px;
    background-color: #e5e7eb;
    border-radius: 3px;
    overflow: hidden;
    margin-top: 10px;
}

.logged-bar-fill[b-91bmviqwdo] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.4s ease;
}

.logged-bar-fill.pct-excellent[b-91bmviqwdo] { background-color: #16a34a; }
.logged-bar-fill.pct-good[b-91bmviqwdo] { background-color: #22c55e; }
.logged-bar-fill.pct-fair[b-91bmviqwdo] { background-color: #eab308; }
.logged-bar-fill.pct-warn[b-91bmviqwdo] { background-color: #f97316; }
.logged-bar-fill.pct-low[b-91bmviqwdo] { background-color: #ef4444; }

/* Divider */
.divider[b-91bmviqwdo] {
    height: 1px;
    background-color: #f0f0f0;
    margin: 10px 0;
}

/* Week/Month detail rows */
.week-row[b-91bmviqwdo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2px 0;
    font-size: 0.82rem;
}

.detail-label[b-91bmviqwdo] {
    color: #6b7280;
}

.detail-value[b-91bmviqwdo] {
    font-weight: 600;
    color: #1f2937;
}

.inline-pct[b-91bmviqwdo] {
    font-weight: 500;
    font-size: 0.78rem;
}

.highlight-row[b-91bmviqwdo] {
    margin-top: 4px;
    padding: 4px 8px;
    background: #f9fafb;
    border-radius: 6px;
}

.logged-pct-value[b-91bmviqwdo] {
    font-weight: 700;
}

/* Percent color classes for text */
.pct-excellent[b-91bmviqwdo] { color: #16a34a; }
.pct-good[b-91bmviqwdo] { color: #22c55e; }
.pct-fair[b-91bmviqwdo] { color: #ca8a04; }
.pct-warn[b-91bmviqwdo] { color: #ea580c; }
.pct-low[b-91bmviqwdo] { color: #dc2626; }

/* Loading & empty states */
.loading-state[b-91bmviqwdo] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2rem;
    color: #6c757d;
}

.spinner[b-91bmviqwdo] {
    width: 20px;
    height: 20px;
    border: 2px solid #e9ecef;
    border-top: 2px solid #1b4a98;
    border-radius: 50%;
    animation: spin-b-91bmviqwdo 0.8s linear infinite;
}

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

.empty-state[b-91bmviqwdo] {
    text-align: center;
    padding: 2rem;
    color: #6c757d;
}
/* /Components/Dashboard/Widgets/TopCustomersWidget.razor.rz.scp.css */
/* Period Selector */
.period-selector[b-wq4j7rhmq7] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e9ecef;
}

.period-btn[b-wq4j7rhmq7] {
    flex: 1;
    padding: 0.375rem 0.5rem;
    font-size: 0.7rem;
    font-weight: 500;
    color: #6c757d;
    background-color: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.period-btn:hover[b-wq4j7rhmq7] {
    background-color: #e9ecef;
    color: #495057;
}

.period-btn.active[b-wq4j7rhmq7] {
    background-color: #1b4a98;
    border-color: #1b4a98;
    color: white;
}

/* Customers List */
.customers-list[b-wq4j7rhmq7] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.customer-item[b-wq4j7rhmq7] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.customer-item:hover[b-wq4j7rhmq7] {
    background-color: #f8f9fa;
}

/* Rank */
.customer-rank[b-wq4j7rhmq7] {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: 600;
    color: #6c757d;
    background-color: #e9ecef;
    border-radius: 4px;
    flex-shrink: 0;
}

.customer-item:nth-child(1) .customer-rank[b-wq4j7rhmq7] {
    background-color: #ffd700;
    color: #856404;
}

.customer-item:nth-child(2) .customer-rank[b-wq4j7rhmq7] {
    background-color: #c0c0c0;
    color: #495057;
}

.customer-item:nth-child(3) .customer-rank[b-wq4j7rhmq7] {
    background-color: #cd7f32;
    color: white;
}

/* Customer Info */
.customer-info[b-wq4j7rhmq7] {
    flex: 1;
    min-width: 0;
}

.customer-name[b-wq4j7rhmq7] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 0.25rem;
}

/* Progress Bar */
.customer-bar[b-wq4j7rhmq7] {
    height: 4px;
    background-color: #e9ecef;
    border-radius: 2px;
    overflow: hidden;
}

.bar-fill[b-wq4j7rhmq7] {
    height: 100%;
    background: linear-gradient(90deg, #1b4a98, #2d6fd6);
    border-radius: 2px;
    transition: width 0.3s ease;
}

/* Hours */
.customer-hours[b-wq4j7rhmq7] {
    text-align: right;
    flex-shrink: 0;
}

.hours-value[b-wq4j7rhmq7] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #333;
}

.hours-label[b-wq4j7rhmq7] {
    font-size: 0.65rem;
    color: #6c757d;
    margin-left: 0.125rem;
}

/* Widget Summary */
.widget-summary[b-wq4j7rhmq7] {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e9ecef;
    text-align: center;
    font-size: 0.75rem;
    color: #6c757d;
}

/* Loading State */
.loading-state[b-wq4j7rhmq7] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #6c757d;
}

.spinner[b-wq4j7rhmq7] {
    width: 16px;
    height: 16px;
    border: 2px solid #e9ecef;
    border-top-color: #1b4a98;
    border-radius: 50%;
    animation: spin-b-wq4j7rhmq7 0.8s linear infinite;
}

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

/* Empty State */
.empty-state[b-wq4j7rhmq7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    color: #6c757d;
    text-align: center;
}

.empty-state p[b-wq4j7rhmq7] {
    margin: 0;
    font-size: 0.875rem;
}
/* /Components/Dashboard/Widgets/WidgetBase.razor.rz.scp.css */
.dashboard-widget[b-qhj6g69j0z] {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.widget-header[b-qhj6g69j0z] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #f0f0f0;
}

.widget-icon[b-qhj6g69j0z] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background-color: #1b4a98;
    color: white;
    border-radius: 8px;
}

.widget-icon svg[b-qhj6g69j0z] {
    width: 20px;
    height: 20px;
}

.widget-title[b-qhj6g69j0z] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #333;
}

.widget-content[b-qhj6g69j0z] {
    flex: 1;
}
/* /Components/Dashboard/Widgets/WorkTrackerLauncherWidget.razor.rz.scp.css */
/* Compact layout */
.tracker-compact[b-f3mze6le0v] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Recent projects quick-launch */
.recent-projects[b-f3mze6le0v] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.recent-label[b-f3mze6le0v] {
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.recent-buttons[b-f3mze6le0v] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.btn-recent[b-f3mze6le0v] {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 6px 10px;
    background: #f0f5ff;
    border: 1px solid #dbeafe;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: left;
    font-size: 12px;
    line-height: 1.3;
}

.btn-recent:hover[b-f3mze6le0v] {
    background: #dbeafe;
    border-color: #93c5fd;
}

.recent-customer[b-f3mze6le0v] {
    color: #6b7280;
    flex-shrink: 0;
    white-space: nowrap;
}

.recent-customer[b-f3mze6le0v]::after {
    content: "—";
    margin-left: 6px;
    color: #d1d5db;
}

.recent-project[b-f3mze6le0v] {
    color: #1e40af;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Customer + Project + Launch in one row */
.tracker-row[b-f3mze6le0v] {
    display: flex;
    gap: 6px;
    align-items: center;
}

.tracker-row .form-select[b-f3mze6le0v] {
    flex: 1;
    min-width: 0;
    padding: 5px 8px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 13px;
    color: #1f2937;
    background: #fff;
}

.tracker-row .form-select:focus[b-f3mze6le0v] {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15);
}

.tracker-row .form-select:disabled[b-f3mze6le0v] {
    background: #f3f4f6;
    color: #9ca3af;
}

/* Launch icon button */
.btn-launch[b-f3mze6le0v] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    padding: 0;
    background-color: #1e40af;
    background: linear-gradient(135deg, #1e40af 0%, #3b82f6 100%);
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-launch:hover:not(:disabled)[b-f3mze6le0v] {
    filter: brightness(1.1);
}

.btn-launch:disabled[b-f3mze6le0v] {
    opacity: 0.4;
    cursor: not-allowed;
}

/* General task button — compact */
.btn-general-task[b-f3mze6le0v] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 6px 12px;
    background-color: #059669;
    background: linear-gradient(135deg, #059669 0%, #10b981 100%);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-general-task:hover:not(:disabled)[b-f3mze6le0v] {
    filter: brightness(1.1);
}

.btn-general-task:disabled[b-f3mze6le0v] {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Loading state */
.loading-state[b-f3mze6le0v] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6b7280;
    font-size: 13px;
    padding: 8px 0;
}
/* /Components/Layout/Footer.razor.rz.scp.css */
.app-footer[b-sxypclxznt] {
    padding: 1rem 1.5rem;
    background-color: #f8f9fa;
    border-top: 1px solid #e9ecef;
    margin-top: auto;
}

.footer-content[b-sxypclxznt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 100%;
    font-size: 0.8rem;
    color: #6c757d;
}

.copyright[b-sxypclxznt] {
    font-weight: 400;
}

.version[b-sxypclxznt] {
    font-weight: 500;
    color: #adb5bd;
}

@media (max-width: 576px) {
    .footer-content[b-sxypclxznt] {
        flex-direction: column;
        gap: 0.25rem;
        text-align: center;
    }
}
/* /Components/Layout/ImpersonationBanner.razor.rz.scp.css */
.impersonation-banner[b-bi2gr4zcwa] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 0.5rem 1.5rem;
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: #fff;
    font-size: 0.875rem;
    font-weight: 500;
    z-index: 1040;
    flex-shrink: 0;
}

.impersonation-banner-content[b-bi2gr4zcwa] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.impersonation-banner-content svg[b-bi2gr4zcwa] {
    flex-shrink: 0;
}

.impersonation-banner-actions[b-bi2gr4zcwa] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.impersonation-permissions-btn[b-bi2gr4zcwa],
.impersonation-stop-btn[b-bi2gr4zcwa] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.75rem;
    font-size: 0.8125rem;
    font-weight: 600;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    white-space: nowrap;
}

.impersonation-stop-btn[b-bi2gr4zcwa] {
    color: #d97706;
    background-color: #fff;
}

.impersonation-stop-btn:hover[b-bi2gr4zcwa] {
    background-color: #fef3c7;
    color: #92400e;
}

.impersonation-permissions-btn[b-bi2gr4zcwa] {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.2);
}

.impersonation-permissions-btn:hover[b-bi2gr4zcwa] {
    background-color: rgba(255, 255, 255, 0.35);
}

/* Permissions panel backdrop */
.permissions-panel-backdrop[b-bi2gr4zcwa] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 1050;
}

/* Permissions panel - slides in from right */
.permissions-panel[b-bi2gr4zcwa] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 380px;
    max-width: 90vw;
    background: #fff;
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    display: flex;
    flex-direction: column;
    animation: slideIn-b-bi2gr4zcwa 0.2s ease-out;
}

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

.permissions-panel-header[b-bi2gr4zcwa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
    flex-shrink: 0;
}

.permissions-panel-header h3[b-bi2gr4zcwa] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: #111827;
}

.permissions-panel-close[b-bi2gr4zcwa] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.25rem;
    background: none;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: #6b7280;
    transition: all 0.15s ease;
}

.permissions-panel-close:hover[b-bi2gr4zcwa] {
    background: #e5e7eb;
    color: #111827;
}

.permissions-panel-body[b-bi2gr4zcwa] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 1.25rem;
}

.permissions-loading[b-bi2gr4zcwa] {
    text-align: center;
    padding: 2rem;
    color: #6b7280;
    font-size: 0.875rem;
}

.permissions-summary[b-bi2gr4zcwa] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e5e7eb;
}

.permissions-count[b-bi2gr4zcwa] {
    font-size: 1.125rem;
    font-weight: 700;
    color: #059669;
}

.permissions-total[b-bi2gr4zcwa] {
    font-size: 0.8125rem;
    color: #6b7280;
}

.permissions-category[b-bi2gr4zcwa] {
    margin-bottom: 1rem;
}

.permissions-category-header[b-bi2gr4zcwa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.375rem 0;
    margin-bottom: 0.25rem;
    border-bottom: 1px solid #f3f4f6;
}

.permissions-category-name[b-bi2gr4zcwa] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.permissions-category-count[b-bi2gr4zcwa] {
    font-size: 0.75rem;
    color: #6b7280;
    background: #f3f4f6;
    padding: 0.0625rem 0.375rem;
    border-radius: 8px;
}

.permissions-category-items[b-bi2gr4zcwa] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.permissions-item[b-bi2gr4zcwa] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3125rem 0.5rem;
    border-radius: 6px;
    font-size: 0.8125rem;
}

.permissions-item.granted[b-bi2gr4zcwa] {
    color: #059669;
}

.permissions-item.granted svg[b-bi2gr4zcwa] {
    color: #059669;
}

.permissions-item.denied[b-bi2gr4zcwa] {
    color: #9ca3af;
}

.permissions-item.denied svg[b-bi2gr4zcwa] {
    color: #d1d5db;
}

.permissions-item-name[b-bi2gr4zcwa] {
    line-height: 1.3;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-u4te6mkwhv] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main[b-u4te6mkwhv] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.sidebar[b-u4te6mkwhv] {
    background-color: #1b4a98;
}

.content[b-u4te6mkwhv] {
    flex: 1;
    padding-bottom: 2rem;
}

@media (max-width: 640.98px) {
    .top-row[b-u4te6mkwhv] {
        justify-content: space-between;
    }
}

@media (min-width: 641px) {
    .page[b-u4te6mkwhv] {
        flex-direction: row;
    }

    .sidebar[b-u4te6mkwhv] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }
    
    main[b-u4te6mkwhv] {
        min-height: 100vh;
        min-width: 0;
    }
}

#blazor-error-ui[b-u4te6mkwhv] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-u4te6mkwhv] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-fn2wvv4tah] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-fn2wvv4tah] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-fn2wvv4tah] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
    display: flex;
    align-items: center;
}

.navbar-brand[b-fn2wvv4tah] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.navbar-logo[b-fn2wvv4tah] {
    max-height: 2rem;
    width: auto;
}

.nav-icon[b-fn2wvv4tah] {
    margin-right: 0.75rem;
    opacity: 0.7;
    flex-shrink: 0;
}

.nav-item[b-fn2wvv4tah] {
    font-size: 0.9rem;
    padding-bottom: 0.25rem;
}

    .nav-item:first-of-type[b-fn2wvv4tah] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-fn2wvv4tah] {
        padding-bottom: 1rem;
    }

    .nav-item[b-fn2wvv4tah]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 6px;
        min-height: 2.75rem;
        display: flex;
        align-items: center;
        width: 100%;
        padding: 0.5rem 0.75rem;
        cursor: pointer;
        transition: all 0.15s ease-in-out;
    }

.nav-item[b-fn2wvv4tah]  a.active {
    background-color: rgba(255,255,255,0.25);
    color: white;
}

.nav-item[b-fn2wvv4tah]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-item[b-fn2wvv4tah]  .nav-link:hover .nav-icon {
    opacity: 1;
}

/* Expandable nav link */
.nav-link-expandable[b-fn2wvv4tah] {
    justify-content: flex-start;
}

.nav-expand-icon[b-fn2wvv4tah] {
    margin-left: auto;
    margin-right: 0.5rem;
    font-size: 0.6rem;
    opacity: 0.5;
    transition: transform 0.2s ease;
}

.nav-expand-icon.expanded[b-fn2wvv4tah] {
    transform: rotate(90deg);
}

/* Submenu styles */
.nav-submenu[b-fn2wvv4tah] {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    margin: 0 0.75rem 0.5rem 0.75rem;
    padding: 0.25rem 0;
}

.nav-submenu .nav-item[b-fn2wvv4tah] {
    padding: 0.125rem 0;
}

.nav-submenu .nav-item:first-of-type[b-fn2wvv4tah] {
    padding-top: 0.25rem;
}

.nav-submenu .nav-item:last-of-type[b-fn2wvv4tah] {
    padding-bottom: 0.25rem;
}

.nav-link-sub[b-fn2wvv4tah] {
    padding-left: 0.5rem !important;
    font-size: 0.85rem;
    min-height: 2.5rem !important;
}

.nav-link-sub .nav-icon[b-fn2wvv4tah] {
    width: 18px;
    height: 18px;
    margin-right: 0.5rem;
}

.nav-scrollable[b-fn2wvv4tah] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-fn2wvv4tah] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-fn2wvv4tah] {
        display: none;
    }

    .nav-scrollable[b-fn2wvv4tah] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Components/Layout/PublicLayout.razor.rz.scp.css */
.public-page[b-vezo4ynbb4] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background-color: #f8f9fa;
    font-family: 'Encode Sans', sans-serif;
}

/* Header */
.public-header[b-vezo4ynbb4] {
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    position: relative;
    z-index: 100;
}

.public-header .header-content[b-vezo4ynbb4] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.public-header .logo-link[b-vezo4ynbb4] {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.public-header .logo[b-vezo4ynbb4] {
    height: 80px;
    width: auto;
}

/* Hero Section */
.public-hero[b-vezo4ynbb4] {
    padding: 3rem 2rem;
    background: linear-gradient(rgba(27, 110, 194, 0.85), rgba(27, 110, 194, 0.85)), 
                url('/new-website-design-collage2.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
}

.public-hero h1[b-vezo4ynbb4] {
    margin: 0;
    font-size: 2.5rem;
    font-weight: 700;
    color: #ffffff;
    text-align: center;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

/* Main Content */
.public-main[b-vezo4ynbb4] {
    flex: 1;
    padding: 2rem 0;
}

.public-content[b-vezo4ynbb4] {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 1rem;
    box-sizing: border-box;
}

/* Footer */
.public-footer[b-vezo4ynbb4] {
    background: #2c3e50;
    color: #ffffff;
    padding: 2rem 0;
    margin-top: auto;
}

.public-footer .footer-content[b-vezo4ynbb4] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    text-align: center;
}

.public-footer .footer-brand[b-vezo4ynbb4] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.public-footer .company-name[b-vezo4ynbb4] {
    font-size: 1.25rem;
    font-weight: 600;
}

.public-footer .tagline[b-vezo4ynbb4] {
    font-size: 0.875rem;
    color: #94a3b8;
}

.public-footer .footer-links[b-vezo4ynbb4] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    justify-content: center;
}

.public-footer .footer-links a[b-vezo4ynbb4] {
    color: #94a3b8;
    text-decoration: none;
    font-size: 0.875rem;
    transition: color 0.2s ease;
}

.public-footer .footer-links a:hover[b-vezo4ynbb4] {
    color: #ffffff;
}

.public-footer .footer-copyright[b-vezo4ynbb4] {
    font-size: 0.75rem;
    color: #64748b;
    padding-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    width: 100%;
}

/* Responsive */
@media (min-width: 768px) {
    .public-footer .footer-content[b-vezo4ynbb4] {
        flex-direction: row;
        justify-content: space-between;
        text-align: left;
    }

    .public-footer .footer-brand[b-vezo4ynbb4] {
        align-items: flex-start;
    }

    .public-footer .footer-copyright[b-vezo4ynbb4] {
        border-top: none;
        padding-top: 0;
        width: auto;
        text-align: right;
    }
}
/* /Components/Layout/SubmitTicketModal.razor.rz.scp.css */
.ticket-backdrop[b-w5jwry5dp1] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.ticket-modal[b-w5jwry5dp1] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 600px;
    max-height: 90vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.ticket-modal-header[b-w5jwry5dp1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
}

    .ticket-modal-header h2[b-w5jwry5dp1] {
        margin: 0;
        font-size: 18px;
        font-weight: 600;
        color: #111827;
        display: flex;
        align-items: center;
        gap: 8px;
    }

        .ticket-modal-header h2 svg[b-w5jwry5dp1] {
            color: #3b82f6;
        }

.ticket-modal-close[b-w5jwry5dp1] {
    background: none;
    border: none;
    font-size: 24px;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

    .ticket-modal-close:hover[b-w5jwry5dp1] {
        color: #111827;
    }

.ticket-modal-body[b-w5jwry5dp1] {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

    .ticket-modal-body .form-group[b-w5jwry5dp1] {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }

        .ticket-modal-body .form-group label[b-w5jwry5dp1] {
            font-size: 13px;
            font-weight: 600;
            color: #374151;
        }

        .ticket-modal-body .form-group .form-control[b-w5jwry5dp1] {
            padding: 8px 12px;
            border: 1px solid #d1d5db;
            border-radius: 8px;
            font-size: 14px;
            transition: border-color 0.15s;
        }

            .ticket-modal-body .form-group .form-control:focus[b-w5jwry5dp1] {
                outline: none;
                border-color: #3b82f6;
                box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
            }

        .ticket-modal-body .form-group textarea.form-control[b-w5jwry5dp1] {
            resize: vertical;
            min-height: 100px;
        }

    .ticket-modal-body .validation-message[b-w5jwry5dp1] {
        font-size: 12px;
        color: #dc2626;
        margin-top: 2px;
    }

.ticket-modal-footer[b-w5jwry5dp1] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 16px 24px;
    border-top: 1px solid #e5e7eb;
}

    .ticket-modal-footer .btn[b-w5jwry5dp1] {
        padding: 8px 20px;
        border-radius: 8px;
        font-size: 14px;
        font-weight: 500;
        border: none;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .ticket-modal-footer .btn-secondary[b-w5jwry5dp1] {
        background-color: #f3f4f6;
        color: #374151;
    }

        .ticket-modal-footer .btn-secondary:hover[b-w5jwry5dp1] {
            background-color: #e5e7eb;
        }

    .ticket-modal-footer .btn-primary[b-w5jwry5dp1] {
        background-color: #3b82f6;
        color: #ffffff;
    }

        .ticket-modal-footer .btn-primary:hover:not(:disabled)[b-w5jwry5dp1] {
            background-color: #2563eb;
        }

        .ticket-modal-footer .btn-primary:disabled[b-w5jwry5dp1] {
            opacity: 0.6;
            cursor: not-allowed;
        }

.spinner-border-sm[b-w5jwry5dp1] {
    width: 14px;
    height: 14px;
    border-width: 2px;
}
/* /Components/Layout/TimeClockWidget.razor.rz.scp.css */
.clock-widget[b-0u3om8tpdo] {
    display: flex;
    align-items: center;
    height: 100%;
}

.clock-widget-btn[b-0u3om8tpdo] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.75rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #495057;
    background: transparent;
    border: 1px solid #dee2e6;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    white-space: nowrap;
}

.clock-widget-btn:hover[b-0u3om8tpdo] {
    background-color: #e9ecef;
}

.clock-widget-btn:disabled[b-0u3om8tpdo] {
    opacity: 0.6;
    cursor: wait;
}

.clock-indicator[b-0u3om8tpdo] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    transition: background-color 0.2s ease;
}

/* Clocked-in state */
.clocked-in .clock-indicator[b-0u3om8tpdo] {
    background-color: #28a745;
    box-shadow: 0 0 4px rgba(40, 167, 69, 0.5);
}

.clocked-in .clock-widget-btn[b-0u3om8tpdo] {
    border-color: #a3d9b1;
    color: #1e7e34;
}

.clocked-in .clock-widget-btn:hover[b-0u3om8tpdo] {
    background-color: #e6f4ea;
}

/* Clocked-out state */
.clocked-out .clock-indicator[b-0u3om8tpdo] {
    background-color: #adb5bd;
}

.clocked-out .clock-widget-btn[b-0u3om8tpdo] {
    color: #6c757d;
}

.clock-icon[b-0u3om8tpdo] {
    opacity: 0.7;
    flex-shrink: 0;
}

.clock-label[b-0u3om8tpdo] {
    line-height: 1;
}

/* On mobile, show only the indicator dot + icon — hide the text label */
@media (max-width: 640.98px) {
    .clock-label[b-0u3om8tpdo] {
        display: none;
    }

    .clock-widget-btn[b-0u3om8tpdo] {
        padding: 0.35rem 0.5rem;
    }
}
/* /Components/Layout/Toast.razor.rz.scp.css */
.toast-container[b-u6wps37pxd] {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 9999;
    animation: slideIn-b-u6wps37pxd 0.3s ease-out;
}

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

.toast[b-u6wps37pxd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    min-width: 280px;
    max-width: 400px;
    color: #fff;
    font-size: 0.9rem;
}

.toast.success[b-u6wps37pxd] {
    background-color: #28a745;
}

.toast.error[b-u6wps37pxd] {
    background-color: #dc3545;
}

.toast.warning[b-u6wps37pxd] {
    background-color: #ffc107;
    color: #333;
}

.toast.info[b-u6wps37pxd] {
    background-color: #17a2b8;
}

.toast-icon[b-u6wps37pxd] {
    font-size: 1.25rem;
    font-weight: bold;
}

.toast-message[b-u6wps37pxd] {
    flex: 1;
}

.toast-close[b-u6wps37pxd] {
    background: none;
    border: none;
    color: inherit;
    font-size: 1.5rem;
    cursor: pointer;
    opacity: 0.7;
    padding: 0;
    line-height: 1;
    transition: opacity 0.15s;
}

.toast-close:hover[b-u6wps37pxd] {
    opacity: 1;
}
/* /Components/Layout/TopMenu.razor.rz.scp.css */
.top-row[b-qoolvk1kwq] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #e0e0e0;
    height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.5rem;
}

.top-menu-left[b-qoolvk1kwq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    height: 100%;
}

.top-menu-right[b-qoolvk1kwq] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    height: 100%;
}

.nav-link-top[b-qoolvk1kwq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #495057;
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.15s ease-in-out;
    background: transparent;
    border: none;
    cursor: pointer;
}

.nav-link-top:hover[b-qoolvk1kwq] {
    background-color: #e9ecef;
    color: #1b4a98;
}

.nav-link-top svg[b-qoolvk1kwq] {
    opacity: 0.7;
}

.nav-link-top:hover svg[b-qoolvk1kwq] {
    opacity: 1;
}

.nav-link-messages[b-qoolvk1kwq] {
    position: relative;
}

.nav-link-tasks[b-qoolvk1kwq] {
    position: relative;
}

.task-badge[b-qoolvk1kwq] {
    background: #f59e0b;
}

.nav-link-whatsnew[b-qoolvk1kwq] {
    position: relative;
}

.new-dot[b-qoolvk1kwq] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #1b4a98;
    display: inline-block;
    margin-left: -2px;
    animation: pulse-dot-b-qoolvk1kwq 2s ease-in-out infinite;
}

@keyframes pulse-dot-b-qoolvk1kwq {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

.unread-badge[b-qoolvk1kwq] {
    background: #dc2626;
    color: #fff;
    font-size: 0.6rem;
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 10px;
    line-height: 1.4;
    min-width: 16px;
    text-align: center;
}

.nav-link-top .caret[b-qoolvk1kwq] {
    font-size: 0.5rem;
    opacity: 0.7;
    margin-left: 0.25rem;
}

.dropdown[b-qoolvk1kwq] {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
}

.dropdown-menu[b-qoolvk1kwq] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    min-width: 200px;
    z-index: 1000;
    padding: 0.5rem 0;
    animation: fadeIn-b-qoolvk1kwq 0.15s ease-out;
}

.dropdown-menu-right[b-qoolvk1kwq] {
    left: auto;
    right: 0;
}

@keyframes fadeIn-b-qoolvk1kwq {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.dropdown-item[b-qoolvk1kwq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.625rem 1rem;
    font-size: 0.875rem;
    color: #495057;
    text-decoration: none;
    text-align: left;
    background: none;
    border: none;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

.dropdown-item:hover[b-qoolvk1kwq] {
    background-color: #f8f9fa;
    color: #1b4a98;
}

.dropdown-item svg[b-qoolvk1kwq] {
    opacity: 0.6;
}

.dropdown-item:hover svg[b-qoolvk1kwq] {
    opacity: 1;
}

.dropdown-item-danger[b-qoolvk1kwq] {
    color: #dc3545;
}

.dropdown-item-danger:hover[b-qoolvk1kwq] {
    background-color: #fff5f5;
    color: #dc3545;
}

.dropdown-divider[b-qoolvk1kwq] {
    height: 1px;
    margin: 0.5rem 0;
    background-color: #e0e0e0;
}

/* On mobile (sidebar collapsed to hamburger menu), show icons only for Messages/What's New/Dashboard/Help */
@media (max-width: 640.98px) {
    .nav-link-label[b-qoolvk1kwq] {
        display: none;
    }

    .top-menu-right > .nav-link-top:has(.nav-link-label)[b-qoolvk1kwq] {
        padding: 0.5rem;
        gap: 0;
    }
}
/* /Components/Pages/Admin/CommissionApprovals.razor.rz.scp.css */
.commission-table-container[b-uw2x04sxxk] {
    overflow-x: auto;
    border-radius: 10px;
    box-shadow: 0 1px 6px rgba(0,0,0,0.07);
}

.commission-table[b-uw2x04sxxk] {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    font-size: 14px;
}

.commission-table thead tr[b-uw2x04sxxk] {
    background: #f8f9fa;
    border-bottom: 2px solid #e9ecef;
}

.commission-table th[b-uw2x04sxxk] {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

.commission-table td[b-uw2x04sxxk] {
    padding: 12px 16px;
    border-bottom: 1px solid #f0f0f0;
    color: #374151;
    vertical-align: middle;
}

.commission-table tbody tr:last-child td[b-uw2x04sxxk] {
    border-bottom: none;
}

.commission-table tbody tr:hover[b-uw2x04sxxk] {
    background: #f8f9fa;
}

.project-cell[b-uw2x04sxxk] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.project-name[b-uw2x04sxxk] {
    font-weight: 500;
}

.customer-name[b-uw2x04sxxk] {
    font-size: 12px;
    color: #6b7280;
}

.amount-cell[b-uw2x04sxxk] {
    font-weight: 600;
}

.rate-cell[b-uw2x04sxxk] {
    font-size: 13px;
    color: #6b7280;
    white-space: nowrap;
}

.note-cell[b-uw2x04sxxk] {
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #6b7280;
}

.actions-col[b-uw2x04sxxk] {
    white-space: nowrap;
}

.actions-col .btn + .btn[b-uw2x04sxxk] {
    margin-left: 6px;
}

.small[b-uw2x04sxxk] {
    font-size: 13px;
}

/* Commission Modal */
.commission-backdrop[b-uw2x04sxxk] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.commission-modal[b-uw2x04sxxk] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 480px;
    max-height: 90vh;
    overflow-y: auto;
}
/* /Components/Pages/Admin/MasterLists.razor.rz.scp.css */
/* Page-header-left override */
.page-header-left[b-e4ktuoi1v5] {
    flex: 1;
}

/* Button variants specific to this page */
.btn-danger[b-e4ktuoi1v5] {
    background-color: #dc3545;
    color: white;
}

.btn-danger:hover[b-e4ktuoi1v5] {
    background-color: #c82333;
}

.btn-outline.btn-danger[b-e4ktuoi1v5] {
    background-color: white;
    color: #dc3545;
    border: 1px solid #dc3545;
}

.btn-outline.btn-danger:hover[b-e4ktuoi1v5] {
    background-color: #f8d7da;
}

.btn-primary:disabled[b-e4ktuoi1v5] {
    background-color: #a0b4d4;
    cursor: not-allowed;
}

/* Template Layout */
.template-layout[b-e4ktuoi1v5] {
    display: flex;
    gap: 1.5rem;
    min-height: 500px;
}

.template-sidebar[b-e4ktuoi1v5] {
    width: 280px;
    flex-shrink: 0;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    padding: 1rem;
}

.template-sidebar h3[b-e4ktuoi1v5] {
    margin: 0 0 1rem 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.template-list[b-e4ktuoi1v5] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.template-item[b-e4ktuoi1v5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem;
    border: none;
    background: transparent;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: left;
    color: #333;
}

.template-item:hover[b-e4ktuoi1v5] {
    background-color: #f8f9fa;
}

.template-item.active[b-e4ktuoi1v5] {
    background-color: #e3f2fd;
    color: #1b4a98;
}

.template-item span[b-e4ktuoi1v5] {
    flex: 1;
    font-size: 0.9rem;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-item .item-count[b-e4ktuoi1v5] {
    flex: 0 0 auto;
    background: #e9ecef;
    color: #6c757d;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
    font-size: 0.75rem;
    font-weight: 600;
    min-width: 24px;
    text-align: center;
}

.template-item.active .item-count[b-e4ktuoi1v5] {
    background: #1b4a98;
    color: white;
}

.empty-sidebar[b-e4ktuoi1v5] {
    padding: 1rem;
    text-align: center;
    color: #6c757d;
    font-size: 0.875rem;
}

.empty-sidebar p[b-e4ktuoi1v5] {
    margin: 0.25rem 0;
}

/* Template Content */
.template-content[b-e4ktuoi1v5] {
    flex: 1;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    padding: 1.5rem;
    min-width: 0;
}

.content-header[b-e4ktuoi1v5] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
}

.content-header-left[b-e4ktuoi1v5] {
    flex: 1;
    min-width: 0;
}

.content-header h2[b-e4ktuoi1v5] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #333;
}

.template-description[b-e4ktuoi1v5] {
    margin: 0.25rem 0 0 0;
    font-size: 0.875rem;
    color: #6c757d;
}

.content-header-right[b-e4ktuoi1v5] {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
}

.item-count-badge[b-e4ktuoi1v5] {
    background: #e9ecef;
    color: #6c757d;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 500;
}

/* Checklist Container */
.checklist-container[b-e4ktuoi1v5] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.checklist-item[b-e4ktuoi1v5] {
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.checklist-item.drag-over[b-e4ktuoi1v5] {
    border-color: #1b4a98;
    box-shadow: 0 0 0 2px rgba(27, 74, 152, 0.2);
}

.checklist-item.sub-level[b-e4ktuoi1v5] {
    background: #fff;
}

.item-content[b-e4ktuoi1v5] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.875rem 1rem;
}

.drag-handle[b-e4ktuoi1v5] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 28px;
    color: #adb5bd;
    cursor: grab;
    flex-shrink: 0;
    opacity: 0;
    transition: opacity 0.15s ease, color 0.15s ease;
}

.drag-handle:active[b-e4ktuoi1v5] {
    cursor: grabbing;
}

.item-content:hover .drag-handle[b-e4ktuoi1v5] {
    opacity: 1;
}

.drag-handle:hover[b-e4ktuoi1v5] {
    color: #6c757d;
}

/* Expand/Collapse Toggle */
.expand-toggle[b-e4ktuoi1v5] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: none;
    background: transparent;
    color: #6c757d;
    cursor: pointer;
    border-radius: 4px;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.expand-toggle:hover[b-e4ktuoi1v5] {
    background-color: #e9ecef;
    color: #1b4a98;
}

.expand-toggle svg[b-e4ktuoi1v5] {
    transition: transform 0.2s ease;
}

.expand-toggle svg.expanded[b-e4ktuoi1v5] {
    transform: rotate(90deg);
}

.expand-placeholder[b-e4ktuoi1v5] {
    width: 24px;
    flex-shrink: 0;
}

.item-icon[b-e4ktuoi1v5] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    color: #1b4a98;
    flex-shrink: 0;
}

.item-details[b-e4ktuoi1v5] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.item-name[b-e4ktuoi1v5] {
    font-weight: 500;
    color: #333;
    font-size: 0.9rem;
}

.item-description[b-e4ktuoi1v5] {
    font-size: 0.8rem;
    color: #6c757d;
}

.item-child-count[b-e4ktuoi1v5] {
    font-size: 0.7rem;
    color: #adb5bd;
    font-style: italic;
}

.item-actions[b-e4ktuoi1v5] {
    display: flex;
    gap: 0.25rem;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.item-content:hover .item-actions[b-e4ktuoi1v5] {
    opacity: 1;
}

.sub-items[b-e4ktuoi1v5] {
    padding-left: 0.5rem;
    padding-bottom: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.sub-items .checklist-item[b-e4ktuoi1v5] {
    position: relative;
    z-index: 1;
}

/* Modal extensions */
.modal[b-e4ktuoi1v5] {
    display: flex;
    flex-direction: column;
}

.modal-sm[b-e4ktuoi1v5] {
    max-width: 400px;
}

.modal-footer[b-e4ktuoi1v5] {
    background: #f8f9fa;
}

/* Form group margin-based spacing in modal */
.form-group[b-e4ktuoi1v5] {
    margin-bottom: 1rem;
}

.form-group label[b-e4ktuoi1v5] {
    display: block;
    margin-bottom: 0.375rem;
}

.form-row .form-group[b-e4ktuoi1v5] {
    flex: 1;
}

.help-text[b-e4ktuoi1v5] {
    font-size: 0.8rem;
    color: #6c757d;
}

/* Responsive */
@media (max-width: 992px) {
    .template-layout[b-e4ktuoi1v5] {
        flex-direction: column;
    }

    .template-sidebar[b-e4ktuoi1v5] {
        width: 100%;
    }

    .template-list[b-e4ktuoi1v5] {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .template-item[b-e4ktuoi1v5] {
        flex: 0 0 auto;
    }
}

@media (max-width: 768px) {
    .item-actions[b-e4ktuoi1v5] {
        opacity: 1;
    }

    .content-header[b-e4ktuoi1v5] {
        flex-direction: column;
    }

    .content-header-right[b-e4ktuoi1v5] {
        width: 100%;
        justify-content: flex-start;
    }
}
/* /Components/Pages/Admin/ProjectStatuses.razor.rz.scp.css */
/* Badge styles */
.badge[b-rzxbkqphgo] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
}

.badge-completed[b-rzxbkqphgo] {
    background-color: #f0fdf4;
    color: #16a34a;
}

.badge-not-completed[b-rzxbkqphgo] {
    background-color: #f3f4f6;
    color: #6b7280;
}

/* Table cells */
.sort-order-cell[b-rzxbkqphgo] {
    color: #6b7280;
    font-size: 13px;
    width: 70px;
    text-align: center;
}

.status-name[b-rzxbkqphgo] {
    font-weight: 500;
}

.status-description[b-rzxbkqphgo] {
    color: #6b7280;
    max-width: 400px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Actions column */
.actions-col[b-rzxbkqphgo] {
    width: 100px;
    text-align: center;
}

.actions-cell[b-rzxbkqphgo] {
    display: flex;
    gap: 4px;
    justify-content: center;
}

/* Modal backdrop & dialog — avoids Bootstrap .modal conflict */
.ps-backdrop[b-rzxbkqphgo] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.ps-dialog[b-rzxbkqphgo] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 550px;
    max-height: 90vh;
    overflow-y: auto;
}

.ps-dialog-sm[b-rzxbkqphgo] {
    max-width: 440px;
}

.modal-header[b-rzxbkqphgo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 12px;
    border-bottom: 1px solid #e5e7eb;
}

.modal-header h3[b-rzxbkqphgo] {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
}

.modal-header-danger h3[b-rzxbkqphgo] {
    color: #dc2626;
}

.modal-close[b-rzxbkqphgo] {
    background: none;
    border: none;
    font-size: 24px;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.modal-close:hover[b-rzxbkqphgo] {
    color: #111827;
}

.modal-body[b-rzxbkqphgo] {
    padding: 20px 24px;
}

.modal-body p[b-rzxbkqphgo] {
    margin: 0 0 8px;
}

.modal-footer[b-rzxbkqphgo] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 24px 20px;
    border-top: 1px solid #e5e7eb;
}

/* Form styles */
.form-group[b-rzxbkqphgo] {
    margin-bottom: 16px;
}

.form-group label[b-rzxbkqphgo] {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 4px;
}

.form-group .required[b-rzxbkqphgo] {
    color: #dc2626;
}

.form-check-group[b-rzxbkqphgo] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.form-check-label[b-rzxbkqphgo] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    cursor: pointer;
}

.form-check-input[b-rzxbkqphgo] {
    width: 18px;
    height: 18px;
    accent-color: #2563eb;
    cursor: pointer;
}

.form-text[b-rzxbkqphgo] {
    font-size: 12px;
}

.text-muted[b-rzxbkqphgo] {
    color: #6b7280;
}

/* Spinner for save/delete buttons */
.spinner-sm[b-rzxbkqphgo] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-rzxbkqphgo 0.6s linear infinite;
    margin-right: 4px;
    vertical-align: middle;
}

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

/* Color picker */
.color-picker-row[b-rzxbkqphgo] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.form-control-color[b-rzxbkqphgo] {
    width: 48px;
    height: 36px;
    padding: 2px;
    border-radius: 6px;
    cursor: pointer;
}
/* /Components/Pages/Admin/PtoRequests.razor.rz.scp.css */
/* Tabs */
.pto-admin-tabs[b-kl3irup2ca] {
    display: flex;
    gap: 0;
    border-bottom: 2px solid #e9ecef;
    margin-bottom: 0;
}

.pto-admin-tab[b-kl3irup2ca] {
    padding: 0.625rem 1.25rem;
    font-size: 0.85rem;
    font-weight: 500;
    color: #6b7280;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    transition: all 0.15s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.pto-admin-tab:hover[b-kl3irup2ca] {
    color: #1b4a98;
}

.pto-admin-tab.active[b-kl3irup2ca] {
    color: #1b4a98;
    border-bottom-color: #1b4a98;
    font-weight: 600;
}

.tab-badge[b-kl3irup2ca] {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 1px 7px;
    border-radius: 10px;
    line-height: 1.4;
}

.tab-badge.pending[b-kl3irup2ca] {
    background: #fbbf24;
    color: #78350f;
}

.tab-badge.upcoming[b-kl3irup2ca] {
    background: #d1fae5;
    color: #065f46;
}

/* Tab Content */
.pto-admin-tab-content[b-kl3irup2ca] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-top: none;
    border-radius: 0 0 10px 10px;
    padding: 1.25rem;
    min-height: 300px;
}

/* Empty State */
.empty-state[b-kl3irup2ca] {
    text-align: center;
    padding: 3rem 1rem;
    color: #9ca3af;
}

.empty-state svg[b-kl3irup2ca] {
    margin-bottom: 1rem;
    opacity: 0.5;
}

.empty-state p[b-kl3irup2ca] {
    font-size: 0.95rem;
    margin: 0;
}

/* Request Cards (Pending) */
.request-cards[b-kl3irup2ca] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.request-card[b-kl3irup2ca] {
    border: 1px solid #e9ecef;
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.request-card:hover[b-kl3irup2ca] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.request-card-header[b-kl3irup2ca] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    background: #f8f9fa;
    border-bottom: 1px solid #f0f0f0;
}

.requester-info[b-kl3irup2ca] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.requester-name[b-kl3irup2ca] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1a1a2e;
}

.request-date[b-kl3irup2ca] {
    font-size: 0.75rem;
    color: #9ca3af;
}

.request-card-body[b-kl3irup2ca] {
    padding: 0.875rem 1.25rem;
}

.request-detail-grid[b-kl3irup2ca] {
    display: flex;
    gap: 2rem;
    margin-bottom: 0.5rem;
}

.request-detail[b-kl3irup2ca] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.detail-label[b-kl3irup2ca] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.detail-value[b-kl3irup2ca] {
    font-size: 0.85rem;
    color: #374151;
}

.request-reason[b-kl3irup2ca] {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #f3f4f6;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.request-card-actions[b-kl3irup2ca] {
    display: flex;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid #f0f0f0;
    background: #fafbfc;
}

.request-card-actions .btn[b-kl3irup2ca] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8rem;
}

/* Badge */
.badge-type[b-kl3irup2ca] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
    background: #e8f0fe;
    color: #1b4a98;
}

/* View Mode Toggle */
.view-mode-bar[b-kl3irup2ca] {
    display: flex;
    gap: 0;
    margin-bottom: 1rem;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
    width: fit-content;
}

.view-mode-btn[b-kl3irup2ca] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4rem 1rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: #6b7280;
    background: #f8f9fa;
    border: none;
    border-right: 1px solid #dee2e6;
    cursor: pointer;
    transition: all 0.15s ease;
}

.view-mode-btn:last-child[b-kl3irup2ca] {
    border-right: none;
}

.view-mode-btn:hover[b-kl3irup2ca] {
    background: #e9ecef;
    color: #374151;
}

.view-mode-btn.active[b-kl3irup2ca] {
    background: #1b4a98;
    color: #fff;
}

/* List table */
.pto-table-container[b-kl3irup2ca] {
    overflow-x: auto;
}

.pto-table-container .data-table[b-kl3irup2ca] {
    margin-bottom: 0;
    border: none;
}

.pto-table-container .data-table thead th[b-kl3irup2ca] {
    background: #f8f9fa;
    font-size: 0.75rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.5rem 1rem;
    border-bottom: 1px solid #e9ecef;
}

.pto-table-container .data-table tbody td[b-kl3irup2ca] {
    padding: 0.625rem 1rem;
    font-size: 0.85rem;
    color: #374151;
    border-bottom: 1px solid #f3f4f6;
}

.staff-cell[b-kl3irup2ca] {
    font-weight: 600;
}

.hours-cell[b-kl3irup2ca] {
    font-weight: 600;
    color: #dc2626;
}

.description-cell[b-kl3irup2ca] {
    max-width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Deny Modal */
.deny-backdrop[b-kl3irup2ca] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.deny-modal[b-kl3irup2ca] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 480px;
    max-height: 90vh;
    overflow-y: auto;
}

.deny-modal .modal-header[b-kl3irup2ca] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.deny-modal .modal-header h3[b-kl3irup2ca] {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
    color: #1a1a2e;
}

.deny-modal .modal-close[b-kl3irup2ca] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    line-height: 1;
    padding: 0;
}

.deny-modal .modal-body[b-kl3irup2ca] {
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.deny-modal .modal-footer[b-kl3irup2ca] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
}

.deny-summary[b-kl3irup2ca] {
    padding: 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #374151;
}

.form-group label[b-kl3irup2ca] {
    display: block;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.375rem;
}

/* Grant PTO Modal */
.grant-backdrop[b-kl3irup2ca] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.grant-modal[b-kl3irup2ca] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 520px;
    max-height: 90vh;
    overflow-y: auto;
}

.grant-modal .modal-header[b-kl3irup2ca] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.grant-modal .modal-header h3[b-kl3irup2ca] {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
    color: #1a1a2e;
}

.grant-modal .modal-close[b-kl3irup2ca] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    line-height: 1;
    padding: 0;
}

.grant-modal .modal-body[b-kl3irup2ca] {
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.grant-modal .modal-footer[b-kl3irup2ca] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
}

.form-row-inline[b-kl3irup2ca] {
    display: flex;
    gap: 1rem;
}

.form-row-inline .form-group[b-kl3irup2ca] {
    flex: 1;
    min-width: 0;
}

.required[b-kl3irup2ca] {
    color: #dc3545;
}

/* Delete button */
.actions-cell[b-kl3irup2ca] {
    width: 50px;
    text-align: center;
}

.btn-icon[b-kl3irup2ca] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: none;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-icon-danger[b-kl3irup2ca] {
    color: #9ca3af;
}

.btn-icon-danger:hover[b-kl3irup2ca] {
    background: #fef2f2;
    color: #dc2626;
}

.btn-icon-danger:disabled[b-kl3irup2ca] {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Delete Modal */
.delete-backdrop[b-kl3irup2ca] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.delete-modal[b-kl3irup2ca] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 480px;
    max-height: 90vh;
    overflow-y: auto;
}

.delete-modal .modal-header[b-kl3irup2ca] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.delete-modal .modal-header h3[b-kl3irup2ca] {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
    color: #1a1a2e;
}

.delete-modal .modal-close[b-kl3irup2ca] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    line-height: 1;
    padding: 0;
}

.delete-modal .modal-body[b-kl3irup2ca] {
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.delete-modal .modal-body p[b-kl3irup2ca] {
    margin: 0;
    font-size: 0.9rem;
    color: #374151;
}

.delete-modal .modal-footer[b-kl3irup2ca] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
}

.delete-summary[b-kl3irup2ca] {
    padding: 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #374151;
}

.delete-warning[b-kl3irup2ca] {
    font-size: 0.8rem !important;
    color: #b91c1c !important;
    font-style: italic;
}
/* /Components/Pages/Admin/RoleEdit.razor.rz.scp.css */
/* Role Edit Page */

.role-edit-page[b-e7r8uw6fax] {
    max-width: 100%;
    padding: 1rem;
}

/* Loading/Error States */
.loading-state[b-e7r8uw6fax],
.error-state[b-e7r8uw6fax] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem 0;
    color: #6c757d;
    font-size: 0.95rem;
}

/* Page Header */
.page-header[b-e7r8uw6fax] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
}

.page-header-left[b-e7r8uw6fax] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-header-left h1[b-e7r8uw6fax] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #1a1a2e;
}

.page-subtitle[b-e7r8uw6fax] {
    margin: 0.25rem 0 0 0;
    color: #6c757d;
    font-size: 0.9rem;
}

.page-header-right[b-e7r8uw6fax] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.btn-icon[b-e7r8uw6fax] {
    padding: 0.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Role Basic Info */
.role-edit-content[b-e7r8uw6fax] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.role-basic-info[b-e7r8uw6fax] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 1.5rem;
    display: flex;
    align-items: center;
    gap: 2rem;
}

.role-basic-info .form-group[b-e7r8uw6fax] {
    flex: 1;
    margin-bottom: 0;
}

.role-basic-info label[b-e7r8uw6fax] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.5rem;
    display: block;
}

.role-basic-info .form-control[b-e7r8uw6fax] {
    font-size: 1rem;
}

.role-stats[b-e7r8uw6fax] {
    display: flex;
    gap: 2rem;
}

.stat-item[b-e7r8uw6fax] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #495057;
    font-size: 0.875rem;
    white-space: nowrap;
}

.stat-item svg[b-e7r8uw6fax] {
    color: #1b4a98;
}

/* Permissions Header */
.permissions-header[b-e7r8uw6fax] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #e9ecef;
}

.permissions-header h2[b-e7r8uw6fax] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: #1a1a2e;
}

.permissions-actions[b-e7r8uw6fax] {
    display: flex;
    gap: 0.5rem;
}

.permissions-actions .btn-sm[b-e7r8uw6fax] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
}

/* Permissions Grid */
.permissions-grid[b-e7r8uw6fax] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Permission Category */
.permission-category[b-e7r8uw6fax] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}

.permission-category:hover[b-e7r8uw6fax] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.permission-category.expanded[b-e7r8uw6fax] {
    border-color: #1b4a98;
    box-shadow: 0 2px 12px rgba(27, 74, 152, 0.1);
}

/* Category Header */
.category-header[b-e7r8uw6fax] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    cursor: pointer;
    background: #f8f9fa;
    transition: background-color 0.15s ease;
    user-select: none;
}

.category-header:hover[b-e7r8uw6fax] {
    background: #e9ecef;
}

.permission-category.expanded .category-header[b-e7r8uw6fax] {
    background: #fff;
    border-bottom: 1px solid #e9ecef;
}

.category-left[b-e7r8uw6fax],
.category-right[b-e7r8uw6fax] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.category-toggle[b-e7r8uw6fax] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    transition: transform 0.2s ease;
}

.category-toggle svg[b-e7r8uw6fax] {
    color: #6c757d;
}

.permission-category.expanded .category-toggle[b-e7r8uw6fax] {
    transform: rotate(90deg);
}

.category-name[b-e7r8uw6fax] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1a1a2e;
}

.category-count[b-e7r8uw6fax] {
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    background: #e9ecef;
    color: #495057;
    white-space: nowrap;
}

.category-count.all-selected[b-e7r8uw6fax] {
    background: #d1e7dd;
    color: #0f5132;
}

.category-count.some-selected[b-e7r8uw6fax] {
    background: #fff3cd;
    color: #856404;
}

.btn-category-select[b-e7r8uw6fax] {
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.25rem 0.75rem;
    border-radius: 6px;
    border: 1px solid #dee2e6;
    background: #fff;
    color: #495057;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.btn-category-select:hover[b-e7r8uw6fax] {
    background: #1b4a98;
    color: #fff;
    border-color: #1b4a98;
}

/* Permission Grid (Multi-column layout for wide screens) */
.permission-grid[b-e7r8uw6fax] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 0;
    padding: 0;
}

/* Permission Item */
.permission-item[b-e7r8uw6fax] {
    display: flex;
    padding: 1rem 1.25rem;
    cursor: pointer;
    border-bottom: 1px solid #f1f3f5;
    border-right: 1px solid #f1f3f5;
    margin: 0;
    transition: background-color 0.1s ease;
}

.permission-item:hover[b-e7r8uw6fax] {
    background: #f8f9fa;
}

.permission-item.checked[b-e7r8uw6fax] {
    background: #f0f7ff;
}

.permission-item.checked:hover[b-e7r8uw6fax] {
    background: #e6f2ff;
}

.permission-item input[type="checkbox"][b-e7r8uw6fax] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.permission-content[b-e7r8uw6fax] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    width: 100%;
}

.permission-check[b-e7r8uw6fax] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    border: 2px solid #ced4da;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
    background: #fff;
    margin-top: 0.1rem;
}

.permission-item.checked .permission-check[b-e7r8uw6fax] {
    background: #1b4a98;
    border-color: #1b4a98;
}

.permission-check svg[b-e7r8uw6fax] {
    opacity: 0;
    transform: scale(0.8);
    transition: all 0.15s ease;
    color: #fff;
}

.permission-item.checked .permission-check svg[b-e7r8uw6fax] {
    opacity: 1;
    transform: scale(1);
}

.permission-details[b-e7r8uw6fax] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    flex: 1;
    min-width: 0;
}

.permission-name[b-e7r8uw6fax] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #1a1a2e;
    line-height: 1.3;
}

.permission-desc[b-e7r8uw6fax] {
    font-size: 0.75rem;
    color: #6c757d;
    line-height: 1.4;
}

/* Alert */
.alert[b-e7r8uw6fax] {
    padding: 1rem 1.25rem;
    border-radius: 8px;
    font-size: 0.875rem;
    margin-bottom: 1rem;
}

.alert-danger[b-e7r8uw6fax] {
    background: #f8d7da;
    color: #842029;
    border: 1px solid #f5c2c7;
}

/* Responsive adjustments */
@media (max-width: 1400px) {
    .permission-grid[b-e7r8uw6fax] {
        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    }
}

@media (max-width: 1200px) {
    .permission-grid[b-e7r8uw6fax] {
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    }
}

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

    .role-basic-info[b-e7r8uw6fax] {
        flex-direction: column;
        align-items: flex-start;
    }

    .role-stats[b-e7r8uw6fax] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .permissions-header[b-e7r8uw6fax] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .permissions-actions[b-e7r8uw6fax] {
        flex-wrap: wrap;
        width: 100%;
    }

    .permissions-actions .btn-sm[b-e7r8uw6fax] {
        flex: 1;
    }
}
/* /Components/Pages/Admin/Roles.razor.rz.scp.css */
/* Button variants */
.btn-danger[b-acmkwzzdv0] {
    background-color: #dc3545;
    color: white;
}

.btn-danger:hover[b-acmkwzzdv0] {
    background-color: #c82333;
}

.btn-danger-outline:disabled[b-acmkwzzdv0] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Roles Grid */
.roles-grid[b-acmkwzzdv0] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 1.25rem;
}

.role-card[b-acmkwzzdv0] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.role-card-header[b-acmkwzzdv0] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}

.role-icon[b-acmkwzzdv0] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.role-info[b-acmkwzzdv0] {
    flex: 1;
    min-width: 0;
}

.role-info h3[b-acmkwzzdv0] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
}

.role-stats[b-acmkwzzdv0] {
    display: flex;
    gap: 1rem;
    margin-top: 0.5rem;
}

.role-stats .stat[b-acmkwzzdv0] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8rem;
    color: #6c757d;
}

.role-card-actions[b-acmkwzzdv0] {
    display: flex;
    gap: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e9ecef;
}

/* Roles modal backdrop */
.roles-backdrop[b-acmkwzzdv0] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

/* Roles modal container */
.roles-modal[b-acmkwzzdv0] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 600px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.roles-modal-lg[b-acmkwzzdv0] {
    max-width: 700px;
}

.roles-modal-sm[b-acmkwzzdv0] {
    max-width: 400px;
}

.roles-modal .modal-header[b-acmkwzzdv0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e9ecef;
    flex-shrink: 0;
}

.roles-modal .modal-header h2[b-acmkwzzdv0] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.roles-modal .modal-close[b-acmkwzzdv0] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6c757d;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.15s ease;
}

.roles-modal .modal-close:hover[b-acmkwzzdv0] {
    background-color: #f0f0f0;
    color: #333;
}

.roles-modal .modal-body[b-acmkwzzdv0] {
    padding: 1.25rem;
    overflow-y: auto;
    max-height: 60vh;
    flex: 1;
}

.roles-modal .modal-footer[b-acmkwzzdv0] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 1rem 1.25rem;
    border-top: 1px solid #e9ecef;
    background-color: #f8f9fa;
    flex-shrink: 0;
}

/* Form group margin-based spacing */
.form-group[b-acmkwzzdv0] {
    margin-bottom: 1.25rem;
}

.form-group label[b-acmkwzzdv0] {
    display: block;
    margin-bottom: 0.375rem;
}

/* Permissions Section */
.permissions-section[b-acmkwzzdv0] {
    margin-top: 1.5rem;
}

.permissions-section h3[b-acmkwzzdv0] {
    margin: 0 0 0.25rem;
    font-size: 1rem;
    font-weight: 600;
    color: #333;
}

.permissions-hint[b-acmkwzzdv0] {
    margin: 0 0 1rem;
    font-size: 0.85rem;
    color: #6c757d;
}

.permission-category[b-acmkwzzdv0] {
    margin-bottom: 0.5rem;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    overflow: hidden;
}

.category-header[b-acmkwzzdv0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s ease;
}

.category-header:hover[b-acmkwzzdv0] {
    background-color: #e9ecef;
}

.category-toggle[b-acmkwzzdv0] {
    font-size: 0.7rem;
    color: #6c757d;
    transition: transform 0.15s ease;
}

.category-toggle.expanded[b-acmkwzzdv0] {
    transform: rotate(90deg);
}

.category-name[b-acmkwzzdv0] {
    flex: 1;
    font-weight: 600;
    color: #333;
}

.category-count[b-acmkwzzdv0] {
    font-size: 0.8rem;
    color: #6c757d;
    background-color: #e9ecef;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
}

.permission-list[b-acmkwzzdv0] {
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.permission-item[b-acmkwzzdv0] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.permission-item:hover[b-acmkwzzdv0] {
    background-color: #f8f9fa;
}

.permission-item input[type="checkbox"][b-acmkwzzdv0] {
    margin-top: 0.125rem;
    width: 18px;
    height: 18px;
    accent-color: #1b4a98;
    cursor: pointer;
}

.permission-details[b-acmkwzzdv0] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.permission-name[b-acmkwzzdv0] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #333;
}

.permission-desc[b-acmkwzzdv0] {
    font-size: 0.8rem;
    color: #6c757d;
}

/* Alerts */
.alert[b-acmkwzzdv0] {
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.875rem;
    margin-top: 1rem;
}

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

.text-danger[b-acmkwzzdv0] {
    color: #dc3545;
    font-size: 0.85rem;
}

/* Small loading container */
.loading-container-sm[b-acmkwzzdv0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    gap: 0.75rem;
    color: #6c757d;
}

/* Members Modal */
.section-label[b-acmkwzzdv0] {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #333;
}

.add-member-section[b-acmkwzzdv0] {
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.add-member-row[b-acmkwzzdv0] {
    display: flex;
    gap: 0.75rem;
}

.add-member-row .form-select[b-acmkwzzdv0] {
    flex: 1;
}

.members-section[b-acmkwzzdv0] {
    margin-top: 0.5rem;
}

.empty-members[b-acmkwzzdv0] {
    text-align: center;
    padding: 2rem;
    color: #6c757d;
    background-color: #f8f9fa;
    border-radius: 8px;
}

.empty-members p[b-acmkwzzdv0] {
    margin: 0;
}

.members-list[b-acmkwzzdv0] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 300px;
    overflow-y: auto;
}

.member-item[b-acmkwzzdv0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    transition: background-color 0.15s ease;
}

.member-item:hover[b-acmkwzzdv0] {
    background-color: #e9ecef;
}

.member-avatar[b-acmkwzzdv0] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    font-weight: 600;
    flex-shrink: 0;
}

.member-info[b-acmkwzzdv0] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.member-name[b-acmkwzzdv0] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #333;
}

.member-email[b-acmkwzzdv0] {
    font-size: 0.8rem;
    color: #6c757d;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.btn-remove[b-acmkwzzdv0] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.btn-remove:hover[b-acmkwzzdv0] {
    background-color: #fff5f5;
    color: #dc3545;
}

/* Responsive */
@media (max-width: 768px) {
    .roles-grid[b-acmkwzzdv0] {
        grid-template-columns: 1fr;
    }

    .role-stats[b-acmkwzzdv0] {
        flex-direction: column;
        gap: 0.25rem;
    }

    .role-card-actions[b-acmkwzzdv0] {
        flex-direction: column;
    }

    .role-card-actions .btn[b-acmkwzzdv0] {
        width: 100%;
    }

    .add-member-row[b-acmkwzzdv0] {
        flex-direction: column;
    }
}
/* /Components/Pages/Admin/SocialReviewReminders.razor.rz.scp.css */
.page-header[b-p9nvqltjew] {
    margin-bottom: 32px;
}

.page-header-left[b-p9nvqltjew] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.back-link[b-p9nvqltjew] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #64748b;
    text-decoration: none;
    font-size: 13px;
    margin-bottom: 8px;
    transition: color 0.15s;
}

    .back-link:hover[b-p9nvqltjew] {
        color: #334155;
    }

.page-header h1[b-p9nvqltjew] {
    margin: 0;
    font-size: 24px;
    font-weight: 700;
    color: #1e293b;
}

.page-subtitle[b-p9nvqltjew] {
    margin: 4px 0 0 0;
    color: #64748b;
    font-size: 14px;
}

.loading-container[b-p9nvqltjew] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 60px 20px;
    color: #64748b;
}

.reminder-controls[b-p9nvqltjew] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px 24px;
    margin-bottom: 24px;
}

.settings-summary[b-p9nvqltjew] {
    display: flex;
    gap: 32px;
    flex-wrap: wrap;
}

.setting-item[b-p9nvqltjew] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.setting-label[b-p9nvqltjew] {
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.setting-value[b-p9nvqltjew] {
    font-size: 16px;
    font-weight: 600;
    color: #1e293b;
}

.badge-count[b-p9nvqltjew] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fef3c7;
    color: #d97706;
    border-radius: 20px;
    padding: 2px 14px;
    font-size: 16px;
    font-weight: 700;
    min-width: 32px;
}

.action-buttons[b-p9nvqltjew] {
    display: flex;
    gap: 10px;
}

.empty-state[b-p9nvqltjew] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 60px 20px;
    color: #64748b;
    text-align: center;
}

    .empty-state svg[b-p9nvqltjew] {
        color: #22c55e;
    }

    .empty-state h3[b-p9nvqltjew] {
        margin: 0;
        font-size: 18px;
        font-weight: 600;
        color: #1e293b;
    }

    .empty-state p[b-p9nvqltjew] {
        margin: 0;
        font-size: 14px;
    }

.reminders-table-container[b-p9nvqltjew] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
}

.reminders-table[b-p9nvqltjew] {
    width: 100%;
    border-collapse: collapse;
}

    .reminders-table thead[b-p9nvqltjew] {
        background: #f8fafc;
    }

    .reminders-table th[b-p9nvqltjew] {
        padding: 12px 16px;
        text-align: left;
        font-size: 12px;
        font-weight: 600;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 1px solid #e2e8f0;
    }

    .reminders-table td[b-p9nvqltjew] {
        padding: 12px 16px;
        font-size: 14px;
        color: #374151;
        border-bottom: 1px solid #f1f5f9;
    }

    .reminders-table tbody tr:hover[b-p9nvqltjew] {
        background: #f8fafc;
    }

    .reminders-table a[b-p9nvqltjew] {
        color: #3b82f6;
        text-decoration: none;
        font-weight: 500;
    }

        .reminders-table a:hover[b-p9nvqltjew] {
            text-decoration: underline;
        }

.scope-badge[b-p9nvqltjew] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
}

.scope-client[b-p9nvqltjew] {
    background: #dbeafe;
    color: #1d4ed8;
}

.scope-internal[b-p9nvqltjew] {
    background: #f3e8ff;
    color: #7c3aed;
}

.recipient-name[b-p9nvqltjew] {
    display: block;
    font-weight: 500;
}

.recipient-email[b-p9nvqltjew] {
    display: block;
    font-size: 12px;
    color: #94a3b8;
}

.event-badge[b-p9nvqltjew] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.event-sent[b-p9nvqltjew] {
    background: #dbeafe;
    color: #1d4ed8;
}

.event-reminder[b-p9nvqltjew] {
    background: #fef3c7;
    color: #d97706;
}

.nowrap[b-p9nvqltjew] {
    white-space: nowrap;
}

.days-badge[b-p9nvqltjew] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    background: #f1f5f9;
    color: #475569;
}

.status-badge[b-p9nvqltjew] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.status-eligible[b-p9nvqltjew] {
    background: #dcfce7;
    color: #166534;
}

.status-waiting[b-p9nvqltjew] {
    background: #f1f5f9;
    color: #64748b;
}

.run-result[b-p9nvqltjew] {
    margin-top: 24px;
    padding: 16px 20px;
    border-radius: 8px;
    font-size: 14px;
}

    .run-result p[b-p9nvqltjew] {
        margin: 0;
    }

.run-success[b-p9nvqltjew] {
    background: #dcfce7;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.run-error[b-p9nvqltjew] {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.btn[b-p9nvqltjew] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    text-decoration: none;
}

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

.btn-primary[b-p9nvqltjew] {
    background: linear-gradient(135deg, #164e9b 0%, #1e40af 100%);
    color: #ffffff;
}

    .btn-primary:hover:not(:disabled)[b-p9nvqltjew] {
        background: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%);
    }

.btn-secondary[b-p9nvqltjew] {
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
}

    .btn-secondary:hover:not(:disabled)[b-p9nvqltjew] {
        background: #e2e8f0;
    }

.spinner-small[b-p9nvqltjew] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: #ffffff;
    animation: spin 0.8s linear infinite;
}

.spinner[b-p9nvqltjew] {
    width: 32px;
    height: 32px;
    border: 3px solid #e2e8f0;
    border-radius: 50%;
    border-top-color: #3b82f6;
    animation: spin 0.8s linear infinite;
}

.btn-icon[b-p9nvqltjew] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: none;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    transition: all 0.15s;
    color: #94a3b8;
}

.btn-icon-danger:hover[b-p9nvqltjew] {
    background: #fee2e2;
    color: #dc2626;
}

.btn-danger[b-p9nvqltjew] {
    background: #dc2626;
    color: #ffffff;
}

    .btn-danger:hover:not(:disabled)[b-p9nvqltjew] {
        background: #b91c1c;
    }

.text-muted[b-p9nvqltjew] {
    color: #64748b;
    font-size: 13px;
}

.confirm-backdrop[b-p9nvqltjew] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.confirm-modal[b-p9nvqltjew] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-header[b-p9nvqltjew] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #e2e8f0;
}

    .modal-header h5[b-p9nvqltjew] {
        margin: 0;
        font-size: 18px;
        font-weight: 600;
        color: #1e293b;
    }

.modal-close[b-p9nvqltjew] {
    background: none;
    border: none;
    font-size: 22px;
    color: #94a3b8;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

    .modal-close:hover[b-p9nvqltjew] {
        color: #475569;
    }

.modal-body[b-p9nvqltjew] {
    padding: 20px 24px;
}

    .modal-body p[b-p9nvqltjew] {
        margin: 0 0 8px 0;
        font-size: 14px;
        color: #374151;
        line-height: 1.5;
    }

    .modal-body p:last-child[b-p9nvqltjew] {
        margin-bottom: 0;
    }

.modal-footer[b-p9nvqltjew] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 24px;
    border-top: 1px solid #e2e8f0;
}

@@keyframes spin {
    to[b-p9nvqltjew] {
        transform: rotate(360deg);
    }
}
/* /Components/Pages/Admin/Staff.razor.rz.scp.css */
/* Staff Grid */
.staff-grid[b-za3fnyisze] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.25rem;
}

/* Staff Card */
.staff-card[b-za3fnyisze] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s ease;
    border: 1px solid transparent;
}

.staff-card:hover[b-za3fnyisze] {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    border-color: #1b4a98;
    transform: translateY(-2px);
}

.staff-card-header[b-za3fnyisze] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 1.25rem 1.25rem 0;
}

.staff-avatar[b-za3fnyisze] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    font-weight: 600;
}

.staff-status[b-za3fnyisze] {
    padding: 0.25rem 0.625rem;
    border-radius: 20px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.staff-status.active[b-za3fnyisze] {
    background-color: #d4edda;
    color: #155724;
}

.staff-status.inactive[b-za3fnyisze] {
    background-color: #f8d7da;
    color: #721c24;
}

.staff-card-body[b-za3fnyisze] {
    padding: 1rem 1.25rem;
}

.staff-name[b-za3fnyisze] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
}

.staff-title[b-za3fnyisze] {
    margin: 0.25rem 0 0;
    font-size: 0.875rem;
    color: #6c757d;
}

.staff-details[b-za3fnyisze] {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.staff-detail[b-za3fnyisze] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #6c757d;
}

.staff-detail svg[b-za3fnyisze] {
    opacity: 0.6;
    flex-shrink: 0;
}

.staff-detail span[b-za3fnyisze] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.staff-card-footer[b-za3fnyisze] {
    padding: 0.75rem 1.25rem 1.25rem;
}

.staff-badges[b-za3fnyisze] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* Filter bar background override */
.filter-bar[b-za3fnyisze] {
    background-color: #f8f9fa;
}

/* Responsive */
@media (max-width: 768px) {
    .staff-grid[b-za3fnyisze] {
        grid-template-columns: 1fr;
    }

    .search-group[b-za3fnyisze] {
        min-width: 100%;
    }
}
/* /Components/Pages/Admin/StaffAdditionalPay.razor.rz.scp.css */
/* StaffAdditionalPay scoped styles */

.loading-container[b-aftr8i5b1k] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    gap: 1rem;
    color: #6b7280;
}

.spinner[b-aftr8i5b1k] {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: #3b82f6;
    border-radius: 50%;
    animation: spin-b-aftr8i5b1k 0.8s linear infinite;
}

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

.error-state[b-aftr8i5b1k] {
    text-align: center;
    padding: 3rem;
}

.error-state h2[b-aftr8i5b1k] {
    color: #374151;
    margin-bottom: 0.5rem;
}

.error-state p[b-aftr8i5b1k] {
    color: #6b7280;
    margin-bottom: 1.5rem;
}

.page-header[b-aftr8i5b1k] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header-left[b-aftr8i5b1k] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.page-header-left h1[b-aftr8i5b1k] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.page-header-right[b-aftr8i5b1k] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.back-link[b-aftr8i5b1k] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.875rem;
    color: #6b7280;
    text-decoration: none;
    transition: color 0.15s;
}

.back-link:hover[b-aftr8i5b1k] {
    color: #3b82f6;
}

.btn[b-aftr8i5b1k] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 8px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.15s;
    text-decoration: none;
    white-space: nowrap;
}

.btn-primary[b-aftr8i5b1k] {
    background: #3b82f6;
    color: #fff;
    border-color: #3b82f6;
}

.btn-primary:hover[b-aftr8i5b1k] {
    background: #2563eb;
    border-color: #2563eb;
}

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

.btn-outline[b-aftr8i5b1k] {
    background: #fff;
    color: #374151;
    border-color: #d1d5db;
}

.btn-outline:hover[b-aftr8i5b1k] {
    background: #f9fafb;
    border-color: #9ca3af;
}

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

.btn-danger[b-aftr8i5b1k] {
    background: #ef4444;
    color: #fff;
    border-color: #ef4444;
}

.btn-danger:hover[b-aftr8i5b1k] {
    background: #dc2626;
    border-color: #dc2626;
}

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

/* Empty state */
.empty-state[b-aftr8i5b1k] {
    text-align: center;
    padding: 3rem;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    color: #6b7280;
}

.empty-state svg[b-aftr8i5b1k] {
    margin-bottom: 1rem;
    opacity: 0.4;
}

.empty-state h3[b-aftr8i5b1k] {
    color: #374151;
    margin-bottom: 0.5rem;
}

/* Table */
.addpay-table-container[b-aftr8i5b1k] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
}

.addpay-table[b-aftr8i5b1k] {
    width: 100%;
    border-collapse: collapse;
}

.addpay-table thead[b-aftr8i5b1k] {
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
}

.addpay-table th[b-aftr8i5b1k] {
    padding: 0.75rem 1rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    text-align: left;
}

.addpay-table td[b-aftr8i5b1k] {
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    color: #374151;
    border-bottom: 1px solid #f3f4f6;
}

.addpay-table tbody tr:last-child td[b-aftr8i5b1k] {
    border-bottom: none;
}

.addpay-table tbody tr:hover[b-aftr8i5b1k] {
    background: #f9fafb;
}

.note-cell[b-aftr8i5b1k] {
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.actions-col[b-aftr8i5b1k] {
    width: 100px;
    text-align: center;
}

.btn-icon[b-aftr8i5b1k] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    border-radius: 6px;
    cursor: pointer;
    color: #6b7280;
    transition: all 0.15s;
}

.btn-icon:hover[b-aftr8i5b1k] {
    background: #f3f4f6;
    color: #3b82f6;
}

.btn-icon-danger:hover[b-aftr8i5b1k] {
    background: #fef2f2;
    color: #ef4444;
}

/* Badges */
.badge[b-aftr8i5b1k] {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 500;
    border-radius: 9999px;
}

.badge-recurring[b-aftr8i5b1k] {
    background: #dbeafe;
    color: #1d4ed8;
}

.badge-onetime[b-aftr8i5b1k] {
    background: #f3f4f6;
    color: #6b7280;
}

.badge-commission[b-aftr8i5b1k] {
    background: #fef3c7;
    color: #92400e;
    margin-left: 6px;
}

/* Modal */
.addpay-backdrop[b-aftr8i5b1k] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.addpay-modal[b-aftr8i5b1k] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 600px;
    max-height: 90vh;
    overflow-y: auto;
}

.addpay-modal-sm[b-aftr8i5b1k] {
    max-width: 480px;
}

.modal-header[b-aftr8i5b1k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.modal-header h3[b-aftr8i5b1k] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #111827;
}

.modal-close[b-aftr8i5b1k] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #9ca3af;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.modal-close:hover[b-aftr8i5b1k] {
    color: #374151;
}

.modal-body[b-aftr8i5b1k] {
    padding: 1.5rem;
}

.modal-footer[b-aftr8i5b1k] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e5e7eb;
}

/* Form elements */
.form-group[b-aftr8i5b1k] {
    margin-bottom: 1rem;
}

.form-group label[b-aftr8i5b1k] {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.375rem;
}

.form-control[b-aftr8i5b1k] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    color: #111827;
    background: #fff;
    transition: border-color 0.15s, box-shadow 0.15s;
    box-sizing: border-box;
}

.form-control:focus[b-aftr8i5b1k] {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.form-select[b-aftr8i5b1k] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    color: #111827;
    background: #fff;
}

textarea.form-control[b-aftr8i5b1k] {
    resize: vertical;
}

.form-row[b-aftr8i5b1k] {
    display: grid;
    gap: 1rem;
}

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

.checkbox-label[b-aftr8i5b1k] {
    display: inline-flex !important;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}

.checkbox-label input[type="checkbox"][b-aftr8i5b1k] {
    width: 16px;
    height: 16px;
    accent-color: #3b82f6;
}

.alert[b-aftr8i5b1k] {
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.875rem;
    margin-bottom: 1rem;
}

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

.text-muted[b-aftr8i5b1k] {
    color: #9ca3af;
    font-size: 0.875rem;
}

.spinner-sm[b-aftr8i5b1k] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-aftr8i5b1k 0.6s linear infinite;
}

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

    .addpay-table-container[b-aftr8i5b1k] {
        overflow-x: auto;
    }
}
/* /Components/Pages/Admin/StaffEdit.razor.rz.scp.css */
/* Edit Form */
.edit-form[b-x0x59xiqyy] {
    max-width: 900px;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Section content padding */
.section-content[b-x0x59xiqyy] {
    padding: 1.5rem;
}

/* Section header uses h2 instead of h3 */
.section-header h2[b-x0x59xiqyy] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #333;
}

/* Form group margin-based spacing (differs from shared gap-based) */
.form-group[b-x0x59xiqyy] {
    margin-bottom: 1rem;
}

.form-group:last-child[b-x0x59xiqyy] {
    margin-bottom: 0;
}

.form-group label[b-x0x59xiqyy] {
    display: block;
    margin-bottom: 0.375rem;
}

/* Form row variants */
.form-row-3[b-x0x59xiqyy] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.form-row-4[b-x0x59xiqyy] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}

/* Toggle with custom slider */
.toggle-slider[b-x0x59xiqyy] {
    position: relative;
    width: 44px;
    height: 24px;
    background-color: #dee2e6;
    border-radius: 24px;
    transition: background-color 0.2s ease;
}

.toggle-slider[b-x0x59xiqyy]::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    background-color: white;
    border-radius: 50%;
    transition: transform 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.toggle input:checked + .toggle-slider[b-x0x59xiqyy] {
    background-color: #1b4a98;
}

.toggle input:checked + .toggle-slider[b-x0x59xiqyy]::before {
    transform: translateX(20px);
}

.toggle input[b-x0x59xiqyy] {
    display: none;
}

/* Alert */
.alert[b-x0x59xiqyy] {
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.875rem;
}

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

/* Responsive */
@media (max-width: 768px) {
    .form-row-3[b-x0x59xiqyy],
    .form-row-4[b-x0x59xiqyy] {
        grid-template-columns: 1fr;
    }

    .toggle-group[b-x0x59xiqyy] {
        flex-direction: column;
        gap: 1rem;
    }
}

/* Email Signature hint */
.signature-hint[b-x0x59xiqyy] {
    display: block;
    font-size: 0.82rem;
    color: #64748b;
    margin-bottom: 0.5rem;
}

    .signature-hint code[b-x0x59xiqyy] {
        background: #f1f5f9;
        padding: 0.1rem 0.35rem;
        border-radius: 4px;
        font-size: 0.82rem;
        color: #1b4a98;
    }

/* Radzen HTML Editor override */
[b-x0x59xiqyy] .rz-html-editor {
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #dee2e6;
}

[b-x0x59xiqyy] .rz-html-editor:focus-within {
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

[b-x0x59xiqyy] .rz-html-editor .rz-html-editor-toolbar {
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

[b-x0x59xiqyy] .rz-html-editor .rz-html-editor-content {
    min-height: 150px;
}
/* /Components/Pages/Admin/StaffPermissions.razor.rz.scp.css */
/* Legend */
.permissions-legend[b-evt2f0o5ke] {
    display: flex;
    gap: 1.5rem;
    padding: 1rem 1.25rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
}

.permissions-legend .legend-item[b-evt2f0o5ke] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #495057;
}

.legend-swatch[b-evt2f0o5ke] {
    width: 12px;
    height: 12px;
    border-radius: 3px;
}

.legend-swatch.role-granted[b-evt2f0o5ke] {
    background-color: #e8f5e9;
    border: 2px solid #4caf50;
}

.legend-swatch.direct-granted[b-evt2f0o5ke] {
    background-color: #e3f2fd;
    border: 2px solid #2196f3;
}

.legend-swatch.not-granted[b-evt2f0o5ke] {
    background-color: #f5f5f5;
    border: 2px solid #bdbdbd;
}

/* Filter */
.permissions-filter[b-evt2f0o5ke] {
    margin-bottom: 1.25rem;
}

.permissions-filter .search-input-wrapper[b-evt2f0o5ke] {
    position: relative;
    max-width: 400px;
}

.permissions-filter .search-icon[b-evt2f0o5ke] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #adb5bd;
    pointer-events: none;
}

.permissions-filter .search-input[b-evt2f0o5ke] {
    padding-left: 38px;
}

/* Toolbar */
.permissions-toolbar[b-evt2f0o5ke] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.btn-link[b-evt2f0o5ke] {
    background: none;
    border: none;
    color: #4a90d9;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 500;
    padding: 0;
}

.btn-link:hover[b-evt2f0o5ke] {
    text-decoration: underline;
    color: #2d6cb4;
}

.toolbar-divider[b-evt2f0o5ke] {
    color: #ced4da;
    font-size: 0.85rem;
}

/* Categories */
.permissions-categories[b-evt2f0o5ke] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.permission-category[b-evt2f0o5ke] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    overflow: hidden;
}

.category-header[b-evt2f0o5ke] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    width: 100%;
    padding: 0.875rem 1.25rem;
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: #212529;
    background: #f8f9fa;
    border: none;
    border-bottom: 1px solid #e9ecef;
    cursor: pointer;
    text-align: left;
    transition: background-color 0.15s ease;
}

.category-header:hover[b-evt2f0o5ke] {
    background: #eef0f2;
}

.category-expand-icon[b-evt2f0o5ke] {
    font-size: 0.65rem;
    color: #6c757d;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.category-expand-icon.expanded[b-evt2f0o5ke] {
    transform: rotate(90deg);
}

.category-name[b-evt2f0o5ke] {
    flex: 1;
}

.category-count[b-evt2f0o5ke] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #6c757d;
    background: #e9ecef;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
}

/* Permission rows */
.permission-list[b-evt2f0o5ke] {
    display: flex;
    flex-direction: column;
}

.permission-row[b-evt2f0o5ke] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid #f0f0f0;
    transition: background-color 0.15s ease;
    gap: 1rem;
}

.permission-row:last-child[b-evt2f0o5ke] {
    border-bottom: none;
}

.permission-row:hover[b-evt2f0o5ke] {
    background-color: #fafbfc;
}

.permission-row.role-assigned[b-evt2f0o5ke] {
    background-color: #f6fef6;
}

.permission-row.direct-assigned[b-evt2f0o5ke] {
    background-color: #f0f7ff;
}

.permission-row.not-assigned[b-evt2f0o5ke] {
    background-color: #fff;
}

/* Permission info */
.permission-info[b-evt2f0o5ke] {
    flex: 1;
    min-width: 0;
}

.permission-name[b-evt2f0o5ke] {
    font-weight: 500;
    color: #212529;
    font-size: 0.9rem;
}

.permission-description[b-evt2f0o5ke] {
    color: #6c757d;
    font-size: 0.8rem;
    margin-top: 0.125rem;
}

.permission-source[b-evt2f0o5ke] {
    font-size: 0.75rem;
    color: #868e96;
    margin-top: 0.25rem;
    font-style: italic;
}

/* Permission actions */
.permission-actions[b-evt2f0o5ke] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}

.permission-badge[b-evt2f0o5ke] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.625rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 500;
    white-space: nowrap;
}

.role-badge[b-evt2f0o5ke] {
    background-color: #e8f5e9;
    color: #2e7d32;
}

/* Toggle switch */
.toggle[b-evt2f0o5ke] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    user-select: none;
}

.toggle input[type="checkbox"][b-evt2f0o5ke] {
    display: none;
}

.toggle-slider[b-evt2f0o5ke] {
    position: relative;
    width: 40px;
    height: 22px;
    background-color: #dee2e6;
    border-radius: 11px;
    transition: background-color 0.2s ease;
}

.toggle-slider[b-evt2f0o5ke]::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    background-color: #fff;
    border-radius: 50%;
    transition: transform 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.toggle input:checked + .toggle-slider[b-evt2f0o5ke] {
    background-color: #2196f3;
}

.toggle input:checked + .toggle-slider[b-evt2f0o5ke]::before {
    transform: translateX(18px);
}

.toggle input:disabled + .toggle-slider[b-evt2f0o5ke] {
    opacity: 0.5;
    cursor: not-allowed;
}

.toggle-label[b-evt2f0o5ke] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 500;
}

/* Responsive */
@media (max-width: 768px) {
    .permission-row[b-evt2f0o5ke] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .permission-actions[b-evt2f0o5ke] {
        width: 100%;
        justify-content: flex-end;
    }

    .permissions-legend[b-evt2f0o5ke] {
        flex-direction: column;
        gap: 0.5rem;
    }
}
/* /Components/Pages/Admin/StaffReports.razor.rz.scp.css */
/* Back link margin override */
.back-link[b-pslk5c9ajc] {
    margin-bottom: 0.5rem;
}

/* Staff Selector */
.staff-selector[b-pslk5c9ajc] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.staff-selector label[b-pslk5c9ajc] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
}

.staff-selector select[b-pslk5c9ajc] {
    padding: 0.5rem 2rem 0.5rem 0.75rem;
    font-size: 0.875rem;
    font-weight: 500;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: white;
    color: #333;
    cursor: pointer;
    min-width: 200px;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236c757d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
}

.staff-selector select:focus[b-pslk5c9ajc] {
    outline: none;
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

/* Controls Section */
.controls-section[b-pslk5c9ajc] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

.date-presets[b-pslk5c9ajc] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.preset-btn[b-pslk5c9ajc] {
    padding: 0.5rem 1rem;
    font-size: 0.8rem;
    font-weight: 500;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: white;
    color: #495057;
    cursor: pointer;
    transition: all 0.15s ease;
}

.preset-btn:hover[b-pslk5c9ajc] {
    background: #f8f9fa;
    border-color: #1b4a98;
    color: #1b4a98;
}

.preset-btn.active[b-pslk5c9ajc] {
    background: #1b4a98;
    border-color: #1b4a98;
    color: white;
}

.date-inputs[b-pslk5c9ajc] {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    flex-wrap: wrap;
}

.date-field[b-pslk5c9ajc] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.date-field label[b-pslk5c9ajc] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
}

.date-field input[b-pslk5c9ajc] {
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    min-width: 150px;
}

.date-field input:focus[b-pslk5c9ajc] {
    outline: none;
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

.date-range-display[b-pslk5c9ajc] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
    font-size: 0.875rem;
    color: #6c757d;
}

.date-range-days[b-pslk5c9ajc] {
    margin-left: 0.5rem;
    color: #adb5bd;
}

/* Section Header with Info */
.section-header-with-info[b-pslk5c9ajc] {
    margin-bottom: 1.25rem;
}

.section-header-with-info h2[b-pslk5c9ajc] {
    margin: 0 0 0.25rem;
}

.section-description[b-pslk5c9ajc] {
    margin: 0;
    font-size: 0.85rem;
    color: #6c757d;
}

/* Daily Activity Table */
.daily-table-container[b-pslk5c9ajc] {
    overflow-x: auto;
    margin-bottom: 1rem;
}

.daily-table[b-pslk5c9ajc] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.daily-table th[b-pslk5c9ajc],
.daily-table td[b-pslk5c9ajc] {
    padding: 0.625rem 0.75rem;
    text-align: left;
    border-bottom: 1px solid #e9ecef;
}

.daily-table th[b-pslk5c9ajc] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.75rem;
    text-transform: uppercase;
    background: #f8f9fa;
    position: sticky;
    top: 0;
}

.daily-table tbody tr:hover[b-pslk5c9ajc] {
    background: #f8f9fa;
}

.daily-table tbody tr.weekend[b-pslk5c9ajc] {
    background: #fafafa;
}

.daily-table tbody tr.weekend:hover[b-pslk5c9ajc] {
    background: #f0f0f0;
}

.date-label[b-pslk5c9ajc] {
    font-weight: 500;
    color: #333;
}

.day-label[b-pslk5c9ajc] {
    color: #6c757d;
    font-size: 0.8rem;
}

.time-value[b-pslk5c9ajc] {
    font-size: 0.8rem;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
}

.time-value.time-clock[b-pslk5c9ajc] {
    background: rgba(27, 74, 152, 0.1);
    color: #1b4a98;
}

.time-value.work-log[b-pslk5c9ajc] {
    background: rgba(40, 167, 69, 0.1);
    color: #28a745;
}

.time-value.empty[b-pslk5c9ajc] {
    color: #dee2e6;
}

.time-value.billable[b-pslk5c9ajc] {
    background: rgba(40, 167, 69, 0.15);
    color: #155724;
}

.daily-bar-container[b-pslk5c9ajc] {
    height: 16px;
    background: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
    min-width: 120px;
}

.daily-bar[b-pslk5c9ajc] {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
    position: absolute;
    top: 0;
}

.daily-bar.time-clock-bar[b-pslk5c9ajc] {
    background: linear-gradient(90deg, #1b4a98 0%, #2d6fd6 100%);
    left: 0;
}

.daily-bar.work-log-bar[b-pslk5c9ajc] {
    background: linear-gradient(90deg, #28a745 0%, #34ce57 100%);
}

/* Daily Legend */
.daily-legend[b-pslk5c9ajc] {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid #e9ecef;
}

/* Daily Stats */
.daily-stats[b-pslk5c9ajc] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
    padding-top: 1rem;
}

.daily-stat[b-pslk5c9ajc] {
    text-align: center;
    padding: 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.daily-stat.warning[b-pslk5c9ajc] {
    background: #fff3cd;
}

.daily-stat.success[b-pslk5c9ajc] {
    background: #d4edda;
}

.daily-stat-label[b-pslk5c9ajc] {
    display: block;
    font-size: 0.7rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    margin-bottom: 0.25rem;
}

.daily-stat.warning .daily-stat-label[b-pslk5c9ajc] {
    color: #856404;
}

.daily-stat.success .daily-stat-label[b-pslk5c9ajc] {
    color: #155724;
}

.daily-stat-value[b-pslk5c9ajc] {
    display: block;
    font-size: 1.125rem;
    font-weight: 700;
    color: #333;
}

.daily-stat.warning .daily-stat-value[b-pslk5c9ajc] {
    color: #856404;
}

.daily-stat.success .daily-stat-value[b-pslk5c9ajc] {
    color: #155724;
}

/* Ratio Badge */
.ratio-badge[b-pslk5c9ajc] {
    display: inline-block;
    padding: 0.2rem 0.5rem;
    border-radius: 10px;
    font-size: 0.7rem;
    font-weight: 600;
}

.ratio-badge.excellent[b-pslk5c9ajc] {
    background: #d4edda;
    color: #155724;
}

.ratio-badge.good[b-pslk5c9ajc] {
    background: #cce5ff;
    color: #004085;
}

.ratio-badge.warning[b-pslk5c9ajc] {
    background: #fff3cd;
    color: #856404;
}

.ratio-badge.poor[b-pslk5c9ajc] {
    background: #f8d7da;
    color: #721c24;
}

.ratio-badge.info[b-pslk5c9ajc] {
    background: #e9ecef;
    color: #6c757d;
}

/* Billable ratio badges */
.ratio-badge.billable-high[b-pslk5c9ajc] {
    background: #d4edda;
    color: #155724;
}

.ratio-badge.billable-medium[b-pslk5c9ajc] {
    background: #fff3cd;
    color: #856404;
}

.ratio-badge.billable-low[b-pslk5c9ajc] {
    background: #f8d7da;
    color: #721c24;
}

/* Comparison Bar */
.comparison-bar-container[b-pslk5c9ajc] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 140px;
}

.comparison-row[b-pslk5c9ajc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.comparison-label[b-pslk5c9ajc] {
    font-size: 0.65rem;
    color: #6c757d;
    width: 40px;
    flex-shrink: 0;
}

.comparison-bar-track[b-pslk5c9ajc] {
    flex: 1;
    height: 8px;
    background: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
}

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

.comparison-bar.time-clock-bar[b-pslk5c9ajc] {
    background: linear-gradient(90deg, #1b4a98 0%, #2d6fd6 100%);
}

.comparison-bar.work-log-bar[b-pslk5c9ajc] {
    background: linear-gradient(90deg, #28a745 0%, #34ce57 100%);
}

/* Summary Section */
.summary-section[b-pslk5c9ajc] {
    margin-bottom: 1.5rem;
}

.summary-section h2[b-pslk5c9ajc],
.report-section h2[b-pslk5c9ajc] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #333;
    margin: 0 0 1rem;
}

.summary-cards[b-pslk5c9ajc] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.summary-card[b-pslk5c9ajc] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    padding: 1.25rem;
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}

.summary-card.highlight[b-pslk5c9ajc] {
    background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
}

.summary-icon[b-pslk5c9ajc] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.summary-icon.time-clock[b-pslk5c9ajc] {
    background: rgba(27, 74, 152, 0.1);
    color: #1b4a98;
}

.summary-icon.work-log[b-pslk5c9ajc] {
    background: rgba(108, 117, 125, 0.1);
    color: #6c757d;
}

.summary-icon.billable[b-pslk5c9ajc] {
    background: rgba(21, 87, 36, 0.15);
    color: #155724;
}

.summary-icon.avg[b-pslk5c9ajc] {
    background: rgba(253, 126, 20, 0.1);
    color: #fd7e14;
}

.summary-content[b-pslk5c9ajc] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.summary-label[b-pslk5c9ajc] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 500;
}

.summary-card.highlight .summary-label[b-pslk5c9ajc] {
    color: #155724;
}

.summary-value[b-pslk5c9ajc] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #333;
    line-height: 1.2;
}

.summary-card.highlight .summary-value[b-pslk5c9ajc] {
    color: #155724;
}

.summary-detail[b-pslk5c9ajc] {
    font-size: 0.75rem;
    color: #adb5bd;
}

.summary-card.highlight .summary-detail[b-pslk5c9ajc] {
    color: #155724;
    opacity: 0.8;
}

/* Report Sections */
.report-section[b-pslk5c9ajc] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

/* Weekly Table */
.weekly-table-container[b-pslk5c9ajc] {
    overflow-x: auto;
}

.weekly-table[b-pslk5c9ajc] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.weekly-table th[b-pslk5c9ajc],
.weekly-table td[b-pslk5c9ajc] {
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid #e9ecef;
}

.weekly-table th[b-pslk5c9ajc] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.75rem;
    text-transform: uppercase;
    background: #f8f9fa;
}

.weekly-table tbody tr:hover[b-pslk5c9ajc] {
    background: #f8f9fa;
}

.weekly-table tfoot td[b-pslk5c9ajc] {
    background: #f8f9fa;
    border-top: 2px solid #dee2e6;
}

.text-right[b-pslk5c9ajc] {
    text-align: right;
}

.week-label[b-pslk5c9ajc] {
    font-weight: 500;
    color: #333;
}

.percent-badge[b-pslk5c9ajc] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
    font-size: 0.7rem;
    font-weight: 600;
}

.percent-badge.high[b-pslk5c9ajc] {
    background: #d4edda;
    color: #155724;
}

.percent-badge.medium[b-pslk5c9ajc] {
    background: #fff3cd;
    color: #856404;
}

.percent-badge.low[b-pslk5c9ajc] {
    background: #f8d7da;
    color: #721c24;
}

.table-bar-container[b-pslk5c9ajc] {
    height: 16px;
    background: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
    min-width: 100px;
}

.table-bar-container.stacked[b-pslk5c9ajc] {
    display: flex;
}

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

.time-clock-bar[b-pslk5c9ajc] {
    background: linear-gradient(90deg, #1b4a98 0%, #2d6fd6 100%);
}

.billable-bar[b-pslk5c9ajc] {
    background: linear-gradient(90deg, #28a745 0%, #34ce57 100%);
    position: absolute;
    left: 0;
}

.non-billable-bar[b-pslk5c9ajc] {
    background: #adb5bd;
    position: absolute;
}

/* Type Grid */
.type-grid[b-pslk5c9ajc] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
}

.type-card[b-pslk5c9ajc] {
    background: #f8f9fa;
    border-radius: 10px;
    padding: 1rem;
    border: 1px solid #e9ecef;
}

.type-card-header[b-pslk5c9ajc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.type-indicator[b-pslk5c9ajc] {
    width: 12px;
    height: 12px;
    border-radius: 3px;
}

.type-billable[b-pslk5c9ajc] { background: #28a745; }
.type-non-billable[b-pslk5c9ajc] { background: #6c757d; }
.type-internal[b-pslk5c9ajc] { background: #1b4a98; }
.type-warranty[b-pslk5c9ajc] { background: #fd7e14; }
.type-retainer[b-pslk5c9ajc] { background: #6f42c1; }
.type-unknown[b-pslk5c9ajc] { background: #adb5bd; }

.type-card-name[b-pslk5c9ajc] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #333;
    flex: 1;
}

.type-card-percent[b-pslk5c9ajc] {
    font-size: 0.75rem;
    color: #6c757d;
}

.type-card-value[b-pslk5c9ajc] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #333;
}

.type-card-detail[b-pslk5c9ajc] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-bottom: 0.75rem;
}

.type-card-bar-container[b-pslk5c9ajc] {
    height: 6px;
    background: #e9ecef;
    border-radius: 3px;
    overflow: hidden;
}

.type-card-bar[b-pslk5c9ajc] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s ease;
}

.no-data-card[b-pslk5c9ajc] {
    grid-column: 1 / -1;
    text-align: center;
    padding: 2rem;
    color: #6c757d;
}

/* Monthly Chart */
.monthly-chart[b-pslk5c9ajc] {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
    justify-content: center;
    padding: 1rem 0;
    min-height: 200px;
}

.month-column[b-pslk5c9ajc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    max-width: 80px;
}

.month-bars[b-pslk5c9ajc] {
    display: flex;
    gap: 4px;
    align-items: flex-end;
    height: 150px;
}

.month-bar[b-pslk5c9ajc] {
    width: 24px;
    border-radius: 4px 4px 0 0;
    transition: height 0.3s ease;
    cursor: pointer;
}

.month-bar.time-clock[b-pslk5c9ajc] {
    background: linear-gradient(180deg, #1b4a98 0%, #2d6fd6 100%);
}

.month-bar.work-log[b-pslk5c9ajc] {
    background: linear-gradient(180deg, #28a745 0%, #34ce57 100%);
}

.month-label[b-pslk5c9ajc] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #333;
}

.month-values[b-pslk5c9ajc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 0.65rem;
}

.time-clock-value[b-pslk5c9ajc] { color: #1b4a98; }
.work-log-value[b-pslk5c9ajc] { color: #28a745; }

.monthly-legend[b-pslk5c9ajc] {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
}

.legend-item[b-pslk5c9ajc] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8rem;
    color: #6c757d;
}

.legend-color[b-pslk5c9ajc] {
    width: 14px;
    height: 14px;
    border-radius: 4px;
}

.legend-color.time-clock[b-pslk5c9ajc] { background: #1b4a98; }
.legend-color.work-log[b-pslk5c9ajc] { background: #28a745; }
.legend-color.billable[b-pslk5c9ajc] { background: #28a745; }
.legend-color.non-billable[b-pslk5c9ajc] { background: #adb5bd; }

/* Heatmap */
.heatmap-container[b-pslk5c9ajc] { overflow-x: auto; }

.heatmap-grid[b-pslk5c9ajc] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.heatmap-row[b-pslk5c9ajc] {
    display: flex;
    gap: 4px;
    align-items: center;
}

.heatmap-row.header[b-pslk5c9ajc] { margin-bottom: 4px; }

.heatmap-label[b-pslk5c9ajc] {
    width: 60px;
    font-size: 0.7rem;
    color: #6c757d;
    text-align: right;
    padding-right: 8px;
    flex-shrink: 0;
}

.heatmap-header[b-pslk5c9ajc] {
    width: 36px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 600;
    color: #6c757d;
}

.heatmap-cell[b-pslk5c9ajc] {
    width: 36px;
    height: 36px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 600;
    color: white;
    background: color-mix(in srgb, #1b4a98 calc(var(--intensity) * 100%), #e9ecef);
    cursor: pointer;
    transition: transform 0.15s ease;
}

.heatmap-cell:hover[b-pslk5c9ajc] { transform: scale(1.1); }

.heatmap-cell.empty[b-pslk5c9ajc] {
    background: #f8f9fa;
    border: 1px dashed #dee2e6;
}

.heatmap-cell span[b-pslk5c9ajc] {
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.heatmap-legend[b-pslk5c9ajc] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 1rem;
    font-size: 0.75rem;
    color: #6c757d;
}

.heatmap-scale[b-pslk5c9ajc] { display: flex; gap: 2px; }

.scale-cell[b-pslk5c9ajc] {
    width: 16px;
    height: 16px;
    border-radius: 3px;
    background: color-mix(in srgb, #1b4a98 calc(var(--intensity) * 100%), #e9ecef);
}

/* Client Breakdown Table */
.client-table-container[b-pslk5c9ajc] {
    overflow-x: auto;
    margin-bottom: 1rem;
}

.client-table[b-pslk5c9ajc] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.client-table th[b-pslk5c9ajc],
.client-table td[b-pslk5c9ajc] {
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid #e9ecef;
}

.client-table th[b-pslk5c9ajc] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.75rem;
    text-transform: uppercase;
    background: #f8f9fa;
}

.client-table tbody tr:hover[b-pslk5c9ajc] { background: #f8f9fa; }

.client-table tfoot td[b-pslk5c9ajc] {
    background: #f8f9fa;
    border-top: 2px solid #dee2e6;
}

.client-info[b-pslk5c9ajc] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.client-name[b-pslk5c9ajc] {
    font-weight: 500;
    color: #333;
    text-decoration: none;
}

a.client-name:hover[b-pslk5c9ajc] {
    color: #1b4a98;
    text-decoration: underline;
}

.client-percent[b-pslk5c9ajc] {
    font-size: 0.7rem;
    color: #6c757d;
}

.client-bar-container[b-pslk5c9ajc] {
    height: 16px;
    background: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
    min-width: 120px;
}

.client-bar[b-pslk5c9ajc] {
    height: 100%;
    border-radius: 4px;
    position: absolute;
    top: 0;
    transition: width 0.3s ease;
}

.client-bar.billable[b-pslk5c9ajc] {
    background: linear-gradient(90deg, #28a745 0%, #34ce57 100%);
    left: 0;
}

.client-bar.non-billable[b-pslk5c9ajc] { background: #adb5bd; }

.client-legend[b-pslk5c9ajc] {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    padding-top: 0.75rem;
}

/* Responsive */
@media (max-width: 992px) {
    .monthly-chart[b-pslk5c9ajc] {
        overflow-x: auto;
        justify-content: flex-start;
    }

    .month-column[b-pslk5c9ajc] { min-width: 60px; }
}

@media (max-width: 768px) {
    .date-presets[b-pslk5c9ajc] { flex-wrap: wrap; }

    .preset-btn[b-pslk5c9ajc] {
        flex: 1;
        min-width: 80px;
        text-align: center;
    }

    .date-inputs[b-pslk5c9ajc] {
        flex-direction: column;
        align-items: stretch;
    }

    .date-field input[b-pslk5c9ajc] { width: 100%; }
    .summary-cards[b-pslk5c9ajc] { grid-template-columns: 1fr; }
    .type-grid[b-pslk5c9ajc] { grid-template-columns: 1fr; }

    .weekly-table th:nth-child(6)[b-pslk5c9ajc],
    .weekly-table th:nth-child(7)[b-pslk5c9ajc],
    .weekly-table td:nth-child(6)[b-pslk5c9ajc],
    .weekly-table td:nth-child(7)[b-pslk5c9ajc] {
        display: none;
    }

    .heatmap-cell[b-pslk5c9ajc] { width: 28px; height: 28px; }
    .heatmap-header[b-pslk5c9ajc] { width: 28px; }
}
/* /Components/Pages/Admin/StaffView.razor.rz.scp.css */
/* Profile-specific: title subtitle */
.profile-title[b-6q92kvr5zy] {
    margin: 0.25rem 0 0;
    color: #6c757d;
    font-size: 0.9rem;
}

/* Impersonate button */
.btn-warning-outline[b-6q92kvr5zy] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #d97706;
    background-color: transparent;
    border: 1px solid #d97706;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    text-decoration: none;
}

.btn-warning-outline:hover[b-6q92kvr5zy] {
    background-color: #d97706;
    color: #fff;
}

/* Reports Section */
.reports-section .section-header .loading-indicator[b-6q92kvr5zy] {
    margin-left: auto;
    font-size: 0.75rem;
    color: #6c757d;
}

.reports-content[b-6q92kvr5zy] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Stats Cards */
.stats-cards[b-6q92kvr5zy] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
}

.stat-card[b-6q92kvr5zy] {
    background: #f8f9fa;
    border-radius: 10px;
    padding: 1rem;
    border: 1px solid #e9ecef;
}

.stat-card.highlight[b-6q92kvr5zy] {
    background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    border-color: #b1dfbb;
}

.stat-header[b-6q92kvr5zy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    font-size: 0.8rem;
    color: #6c757d;
}

.stat-header svg[b-6q92kvr5zy] {
    color: #1b4a98;
}

.stat-card.highlight .stat-header svg[b-6q92kvr5zy] {
    color: #155724;
}

.clock-status[b-6q92kvr5zy] {
    margin-left: auto;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
}

.clock-status.clocked-in[b-6q92kvr5zy] {
    background-color: #28a745;
    color: white;
}

.stat-value[b-6q92kvr5zy] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #333;
}

.stat-card.highlight .stat-value[b-6q92kvr5zy] {
    color: #155724;
}

.stat-detail[b-6q92kvr5zy] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

.stat-card.highlight .stat-detail[b-6q92kvr5zy] {
    color: #155724;
}

/* Reports Row */
.reports-row[b-6q92kvr5zy] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.report-panel[b-6q92kvr5zy] {
    background: #f8f9fa;
    border-radius: 10px;
    padding: 1rem;
    border: 1px solid #e9ecef;
}

.report-panel.full-width[b-6q92kvr5zy] {
    grid-column: 1 / -1;
}

.report-panel h4[b-6q92kvr5zy] {
    margin: 0 0 1rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #333;
}

/* Weekly Chart */
.weekly-chart[b-6q92kvr5zy] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.chart-row[b-6q92kvr5zy] {
    display: grid;
    grid-template-columns: 100px 1fr 60px;
    align-items: center;
    gap: 0.75rem;
}

.chart-label[b-6q92kvr5zy] {
    font-size: 0.75rem;
    color: #6c757d;
    white-space: nowrap;
}

.chart-bar-container[b-6q92kvr5zy] {
    height: 20px;
    background: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
}

.chart-bar-container.stacked[b-6q92kvr5zy] {
    display: flex;
}

.chart-bar[b-6q92kvr5zy] {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.time-clock-bar[b-6q92kvr5zy] {
    background: linear-gradient(90deg, #1b4a98 0%, #2d6fd6 100%);
}

.billable-bar[b-6q92kvr5zy] {
    background: linear-gradient(90deg, #28a745 0%, #34ce57 100%);
    position: absolute;
    left: 0;
}

.total-bar[b-6q92kvr5zy] {
    background: #adb5bd;
    position: absolute;
}

.chart-value[b-6q92kvr5zy] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #333;
    text-align: right;
}

.chart-legend[b-6q92kvr5zy] {
    display: flex;
    gap: 1rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e9ecef;
}

.legend-item[b-6q92kvr5zy] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.7rem;
    color: #6c757d;
}

.legend-color[b-6q92kvr5zy] {
    width: 12px;
    height: 12px;
    border-radius: 3px;
}

.legend-color.billable[b-6q92kvr5zy] {
    background: #28a745;
}

.legend-color.non-billable[b-6q92kvr5zy] {
    background: #adb5bd;
}

/* Type Breakdown */
.type-breakdown[b-6q92kvr5zy] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.type-row[b-6q92kvr5zy] {
    display: grid;
    grid-template-columns: 100px 1fr 70px 60px;
    align-items: center;
    gap: 0.75rem;
}

.type-name[b-6q92kvr5zy] {
    font-size: 0.8rem;
    color: #333;
    font-weight: 500;
}

.type-bar-container[b-6q92kvr5zy] {
    height: 16px;
    background: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
}

.type-bar[b-6q92kvr5zy] {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.type-billable[b-6q92kvr5zy] {
    background: linear-gradient(90deg, #28a745 0%, #34ce57 100%);
}

.type-non-billable[b-6q92kvr5zy] {
    background: linear-gradient(90deg, #6c757d 0%, #868e96 100%);
}

.type-internal[b-6q92kvr5zy] {
    background: linear-gradient(90deg, #1b4a98 0%, #2d6fd6 100%);
}

.type-warranty[b-6q92kvr5zy] {
    background: linear-gradient(90deg, #fd7e14 0%, #ff922b 100%);
}

.type-retainer[b-6q92kvr5zy] {
    background: linear-gradient(90deg, #6f42c1 0%, #9775fa 100%);
}

.type-unknown[b-6q92kvr5zy] {
    background: #adb5bd;
}

.type-value[b-6q92kvr5zy] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #333;
    text-align: right;
}

.type-count[b-6q92kvr5zy] {
    font-size: 0.7rem;
    color: #6c757d;
    text-align: right;
}

.no-data[b-6q92kvr5zy], .no-reports[b-6q92kvr5zy] {
    text-align: center;
    color: #6c757d;
    font-size: 0.875rem;
    padding: 1rem;
}

/* Responsive adjustments for reports */
@media (max-width: 992px) {
    .reports-row[b-6q92kvr5zy] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .stats-cards[b-6q92kvr5zy] {
        grid-template-columns: 1fr;
    }

    .chart-row[b-6q92kvr5zy] {
        grid-template-columns: 80px 1fr 50px;
    }

    .type-row[b-6q92kvr5zy] {
        grid-template-columns: 80px 1fr 50px;
    }

    .type-count[b-6q92kvr5zy] {
        display: none;
    }
}

/* Password Reset Modal */
.password-reset-backdrop[b-6q92kvr5zy] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.password-reset-modal[b-6q92kvr5zy] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 450px;
}
/* /Components/Pages/Admin/SystemModules.razor.rz.scp.css */
/* Module card grid */
.module-grid[b-x5l4uw1fcu] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 20px;
    margin-top: 8px;
}

/* Individual card */
.module-card[b-x5l4uw1fcu] {
    display: flex;
    align-items: center;
    gap: 20px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 24px;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s;
    cursor: pointer;
}

.module-card:hover[b-x5l4uw1fcu] {
    border-color: #2563eb;
    box-shadow: 0 4px 16px rgba(37, 99, 235, 0.10);
    transform: translateY(-2px);
}

.module-card:active[b-x5l4uw1fcu] {
    transform: translateY(0);
}

/* Icon container */
.module-icon[b-x5l4uw1fcu] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    min-width: 56px;
    border-radius: 12px;
}

.module-icon-blue[b-x5l4uw1fcu] {
    background: linear-gradient(135deg, #eff6ff, #dbeafe);
    color: #2563eb;
}

.module-icon-green[b-x5l4uw1fcu] {
    background: linear-gradient(135deg, #f0fdf4, #dcfce7);
    color: #16a34a;
}

.module-icon-amber[b-x5l4uw1fcu] {
    background: linear-gradient(135deg, #fffbeb, #fef3c7);
    color: #d97706;
}

.module-icon-purple[b-x5l4uw1fcu] {
    background: linear-gradient(135deg, #faf5ff, #f3e8ff);
    color: #7c3aed;
}

.module-icon-rose[b-x5l4uw1fcu] {
    background: linear-gradient(135deg, #fff1f2, #ffe4e6);
    color: #e11d48;
}

.module-icon-teal[b-x5l4uw1fcu] {
    background: linear-gradient(135deg, #f0fdfa, #ccfbf1);
    color: #0d9488;
}

/* Card text */
.module-info[b-x5l4uw1fcu] {
    flex: 1;
    min-width: 0;
}

.module-info h3[b-x5l4uw1fcu] {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 600;
    color: #111827;
}

.module-info p[b-x5l4uw1fcu] {
    margin: 0;
    font-size: 13px;
    color: #6b7280;
    line-height: 1.5;
}

/* Arrow */
.module-arrow[b-x5l4uw1fcu] {
    color: #d1d5db;
    transition: color 0.2s, transform 0.2s;
    flex-shrink: 0;
}

.module-card:hover .module-arrow[b-x5l4uw1fcu] {
    color: #2563eb;
    transform: translateX(3px);
}

/* Responsive: stack on smaller screens */
@media (max-width: 500px) {
    .module-grid[b-x5l4uw1fcu] {
        grid-template-columns: 1fr;
    }

    .module-card[b-x5l4uw1fcu] {
        padding: 18px;
        gap: 14px;
    }

    .module-icon[b-x5l4uw1fcu] {
        width: 44px;
        height: 44px;
        min-width: 44px;
    }
}
/* /Components/Pages/Admin/SystemSettings.razor.rz.scp.css */
/* Settings List */
.settings-list[b-gudgkzdaln] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Setting Card */
.setting-card[b-gudgkzdaln] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    padding: 1.25rem 1.5rem;
}

.setting-header[b-gudgkzdaln] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.setting-title h3[b-gudgkzdaln] {
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a2e;
    margin: 0 0 0.25rem 0;
}

.setting-description[b-gudgkzdaln] {
    font-size: 0.8125rem;
    color: #6c757d;
    margin: 0;
    line-height: 1.4;
}

.setting-meta[b-gudgkzdaln] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.25rem;
    flex-shrink: 0;
}

.setting-modified[b-gudgkzdaln] {
    font-size: 0.75rem;
    color: #6c757d;
}

.setting-key[b-gudgkzdaln] {
    font-size: 0.6875rem;
    color: #adb5bd;
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    background: #f8f9fa;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
}

/* Setting Body */
.setting-body[b-gudgkzdaln] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.setting-input[b-gudgkzdaln] {
    flex: 1;
    max-width: 500px;
}

.setting-input .form-select[b-gudgkzdaln],
.setting-input .form-control[b-gudgkzdaln] {
    font-size: 0.875rem;
}

.btn-save[b-gudgkzdaln] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    padding: 0.375rem 1rem;
    white-space: nowrap;
}

/* Staff Multi-Select */
.staff-multi-select[b-gudgkzdaln] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.staff-chip[b-gudgkzdaln] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.3rem 0.65rem;
    border: 1px solid #dee2e6;
    border-radius: 20px;
    font-size: 0.8125rem;
    color: #495057;
    background: #f8f9fa;
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
}

.staff-chip:hover[b-gudgkzdaln] {
    border-color: #adb5bd;
    background: #e9ecef;
}

.staff-chip.selected[b-gudgkzdaln] {
    background: #e8f0fe;
    border-color: #1b4a98;
    color: #1b4a98;
    font-weight: 500;
}

.staff-chip input[type="checkbox"][b-gudgkzdaln] {
    display: none;
}

.staff-chip .chip-name[b-gudgkzdaln] {
    line-height: 1;
}
/* /Components/Pages/Admin/Tickets.razor.rz.scp.css */
/* Ticket list badges */
.badge[b-zy5epygmv0] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
}

/* Type badges */
.badge-type-bug[b-zy5epygmv0] {
    background-color: #fef2f2;
    color: #dc2626;
}

.badge-type-featurerequest[b-zy5epygmv0] {
    background-color: #eff6ff;
    color: #2563eb;
}

.badge-type-accessrequest[b-zy5epygmv0] {
    background-color: #fefce8;
    color: #ca8a04;
}

.badge-type-other[b-zy5epygmv0] {
    background-color: #f3f4f6;
    color: #6b7280;
}

/* Priority badges */
.badge-priority-low[b-zy5epygmv0] {
    background-color: #f0fdf4;
    color: #16a34a;
}

.badge-priority-medium[b-zy5epygmv0] {
    background-color: #fefce8;
    color: #ca8a04;
}

.badge-priority-high[b-zy5epygmv0] {
    background-color: #fff7ed;
    color: #ea580c;
}

.badge-priority-critical[b-zy5epygmv0] {
    background-color: #fef2f2;
    color: #dc2626;
}

/* Status badges */
.badge-status-open[b-zy5epygmv0] {
    background-color: #eff6ff;
    color: #2563eb;
}

.badge-status-inprogress[b-zy5epygmv0] {
    background-color: #fefce8;
    color: #ca8a04;
}

.badge-status-resolved[b-zy5epygmv0] {
    background-color: #f0fdf4;
    color: #16a34a;
}

.badge-status-resolvedpendingrelease[b-zy5epygmv0] {
    background-color: #f0fdfa;
    color: #0d9488;
}

.badge-status-closed[b-zy5epygmv0] {
    background-color: #f3f4f6;
    color: #6b7280;
}

/* Table styling */
.ticket-id[b-zy5epygmv0] {
    color: #6b7280;
    font-size: 13px;
}

.ticket-title[b-zy5epygmv0] {
    font-weight: 500;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ticket-date[b-zy5epygmv0] {
    color: #6b7280;
    font-size: 13px;
    white-space: nowrap;
}

/* Toggle filter — prevent uppercase from shared .filter-group label */
.toggle-filter .toggle .toggle-label[b-zy5epygmv0] {
    text-transform: none;
}

/* Actions column — matches TimeLogs pattern */
.actions-col[b-zy5epygmv0] {
    width: 80px;
    text-align: right;
}

.actions-cell[b-zy5epygmv0] {
    text-align: right;
    white-space: nowrap;
}

    .actions-cell .btn-icon[b-zy5epygmv0] {
        display: inline-flex;
        margin-left: 0.25rem;
    }

/* Clickable row */
.clickable-row[b-zy5epygmv0] {
    cursor: pointer;
    transition: background-color 0.1s ease;
}

.clickable-row:hover[b-zy5epygmv0] {
    background-color: #f9fafb;
}

/* Title cell with expand icon */
.title-cell[b-zy5epygmv0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.expand-icon[b-zy5epygmv0] {
    flex-shrink: 0;
    color: #9ca3af;
    transition: transform 0.2s ease;
}

.expand-icon.expanded[b-zy5epygmv0] {
    transform: rotate(180deg);
}

/* Detail panel (expanded row) */
.detail-row td[b-zy5epygmv0] {
    padding: 0 !important;
    border-top: none !important;
    background-color: #f9fafb;
}

.detail-panel[b-zy5epygmv0] {
    padding: 1rem 1.25rem 1rem 3rem;
    border-top: 1px dashed #e5e7eb;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.detail-panel-info[b-zy5epygmv0] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.detail-section[b-zy5epygmv0] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-section-label[b-zy5epygmv0] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #9ca3af;
}

.detail-section-text[b-zy5epygmv0] {
    margin: 0;
    font-size: 0.85rem;
    line-height: 1.6;
    color: #4b5563;
    white-space: pre-wrap;
}

.detail-url[b-zy5epygmv0] {
    font-size: 0.85rem;
    color: #2563eb;
    text-decoration: none;
    word-break: break-all;
}

    .detail-url:hover[b-zy5epygmv0] {
        text-decoration: underline;
    }

.detail-meta[b-zy5epygmv0] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.detail-meta-item[b-zy5epygmv0] {
    font-size: 0.8rem;
    color: #6b7280;
}

.detail-meta-key[b-zy5epygmv0] {
    font-weight: 600;
    margin-right: 0.25rem;
}

/* Inline edit form */
.detail-panel-actions[b-zy5epygmv0] {
    border-top: 1px solid #e5e7eb;
    padding-top: 1rem;
}

.inline-form[b-zy5epygmv0] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.inline-form-row[b-zy5epygmv0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

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

    .detail-panel[b-zy5epygmv0] {
        padding-left: 1.25rem;
    }
}

.inline-form-group[b-zy5epygmv0] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .inline-form-group label[b-zy5epygmv0] {
        font-size: 0.75rem;
        font-weight: 600;
        color: #374151;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

    .inline-form-group .form-control[b-zy5epygmv0] {
        padding: 6px 10px;
        border: 1px solid #d1d5db;
        border-radius: 6px;
        font-size: 13px;
        background: #fff;
    }

        .inline-form-group .form-control:focus[b-zy5epygmv0] {
            outline: none;
            border-color: #3b82f6;
            box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
        }

.inline-form-buttons[b-zy5epygmv0] {
    display: flex;
    gap: 0.5rem;
    padding-top: 0.25rem;
}

.btn-inline-save[b-zy5epygmv0] {
    padding: 6px 16px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    border: none;
    background-color: #3b82f6;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: background-color 0.15s ease;
}

    .btn-inline-save:hover:not(:disabled)[b-zy5epygmv0] {
        background-color: #2563eb;
    }

    .btn-inline-save:disabled[b-zy5epygmv0] {
        opacity: 0.6;
        cursor: not-allowed;
    }

.btn-inline-cancel[b-zy5epygmv0] {
    padding: 6px 16px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    border: 1px solid #d1d5db;
    background-color: #fff;
    color: #374151;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

    .btn-inline-cancel:hover[b-zy5epygmv0] {
        background-color: #f3f4f6;
    }

/* Release bar — bulk resolve pending release tickets */
.release-bar[b-zy5epygmv0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1rem;
    margin-bottom: 1rem;
    background-color: #f0fdfa;
    border: 1px solid #99f6e4;
    border-radius: 8px;
}

.release-bar-info[b-zy5epygmv0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #0d9488;
}

.btn-resolve-release[b-zy5epygmv0] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 6px 14px;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    background-color: #0d9488;
    color: #fff;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color 0.15s ease;
}

    .btn-resolve-release:hover:not(:disabled)[b-zy5epygmv0] {
        background-color: #0f766e;
    }

    .btn-resolve-release:disabled[b-zy5epygmv0] {
        opacity: 0.6;
        cursor: not-allowed;
    }

@media (max-width: 600px) {
    .release-bar[b-zy5epygmv0] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/Admin/TicketView.razor.rz.scp.css */
/* Layout */
.ticket-layout[b-w69ogmyok4] {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 24px;
    align-items: start;
}

@media (max-width: 900px) {
    .ticket-layout[b-w69ogmyok4] {
        grid-template-columns: 1fr;
    }
}

/* Card */
.ticket-card[b-w69ogmyok4] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 20px;
}

.ticket-card-header[b-w69ogmyok4] {
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
}

    .ticket-card-header h1[b-w69ogmyok4] {
        margin: 0 0 12px;
        font-size: 20px;
        font-weight: 600;
        color: #111827;
    }

    .ticket-card-header h2[b-w69ogmyok4] {
        margin: 0;
        font-size: 16px;
        font-weight: 600;
        color: #111827;
    }

.ticket-card-body[b-w69ogmyok4] {
    padding: 24px;
}

/* Badges */
.ticket-badges[b-w69ogmyok4] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.badge[b-w69ogmyok4] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
}

.badge-type-bug[b-w69ogmyok4] { background-color: #fef2f2; color: #dc2626; }
.badge-type-featurerequest[b-w69ogmyok4] { background-color: #eff6ff; color: #2563eb; }
.badge-type-accessrequest[b-w69ogmyok4] { background-color: #fefce8; color: #ca8a04; }
.badge-type-other[b-w69ogmyok4] { background-color: #f3f4f6; color: #6b7280; }

.badge-priority-low[b-w69ogmyok4] { background-color: #f0fdf4; color: #16a34a; }
.badge-priority-medium[b-w69ogmyok4] { background-color: #fefce8; color: #ca8a04; }
.badge-priority-high[b-w69ogmyok4] { background-color: #fff7ed; color: #ea580c; }
.badge-priority-critical[b-w69ogmyok4] { background-color: #fef2f2; color: #dc2626; }

.badge-status-open[b-w69ogmyok4] { background-color: #eff6ff; color: #2563eb; }
.badge-status-inprogress[b-w69ogmyok4] { background-color: #fefce8; color: #ca8a04; }
.badge-status-resolved[b-w69ogmyok4] { background-color: #f0fdf4; color: #16a34a; }
.badge-status-resolvedpendingrelease[b-w69ogmyok4] { background-color: #f0fdfa; color: #0d9488; }
.badge-status-closed[b-w69ogmyok4] { background-color: #f3f4f6; color: #6b7280; }

/* Description */
.section-label[b-w69ogmyok4] {
    font-size: 13px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 8px;
}

.ticket-description[b-w69ogmyok4] {
    padding: 16px;
    background-color: #f9fafb;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    color: #374151;
    font-size: 14px;
    line-height: 1.6;
    white-space: pre-wrap;
}

/* Sidebar details */
.sidebar-details[b-w69ogmyok4] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.detail-row[b-w69ogmyok4] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.detail-key[b-w69ogmyok4] {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.detail-value[b-w69ogmyok4] {
    font-size: 14px;
    color: #111827;
}

.url-link[b-w69ogmyok4] {
    color: #2563eb;
    text-decoration: none;
    word-break: break-all;
}

    .url-link:hover[b-w69ogmyok4] {
        text-decoration: underline;
    }

/* Update form */
.update-form[b-w69ogmyok4] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.form-row[b-w69ogmyok4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

@media (max-width: 600px) {
    .form-row[b-w69ogmyok4] {
        grid-template-columns: 1fr;
    }
}

.update-form .form-group[b-w69ogmyok4] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

    .update-form .form-group label[b-w69ogmyok4] {
        font-size: 13px;
        font-weight: 600;
        color: #374151;
    }

    .update-form .form-group .form-control[b-w69ogmyok4] {
        padding: 8px 12px;
        border: 1px solid #d1d5db;
        border-radius: 8px;
        font-size: 14px;
    }

        .update-form .form-group .form-control:focus[b-w69ogmyok4] {
            outline: none;
            border-color: #3b82f6;
            box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
        }

.form-actions[b-w69ogmyok4] {
    display: flex;
    gap: 8px;
}

    .form-actions .btn-primary[b-w69ogmyok4] {
        padding: 8px 20px;
        border-radius: 8px;
        font-size: 14px;
        font-weight: 500;
        border: none;
        background-color: #3b82f6;
        color: #ffffff;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 6px;
    }

        .form-actions .btn-primary:hover:not(:disabled)[b-w69ogmyok4] {
            background-color: #2563eb;
        }

        .form-actions .btn-primary:disabled[b-w69ogmyok4] {
            opacity: 0.6;
            cursor: not-allowed;
        }

/* States */
.loading-container[b-w69ogmyok4] {
    display: flex;
    justify-content: center;
    padding: 48px 0;
}

.error-state[b-w69ogmyok4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 48px 0;
    text-align: center;
}

    .error-state h2[b-w69ogmyok4] {
        margin: 0 0 8px;
        font-size: 20px;
        color: #111827;
    }

    .error-state p[b-w69ogmyok4] {
        margin: 0 0 16px;
        color: #6b7280;
    }
/* /Components/Pages/Crm/Admin/CrmAdminBulkDeals.razor.rz.scp.css */
/* ── Step Cards ──────────────────────────────────────────── */

.step-card[b-gdm7kc0n4a] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    margin-bottom: 1.25rem;
    opacity: 0.6;
    transition: opacity 0.2s;
}

.step-card.active[b-gdm7kc0n4a] {
    opacity: 1;
}

.step-header[b-gdm7kc0n4a] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f0f0f0;
}

.step-header h2[b-gdm7kc0n4a] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    flex: 1;
}

.step-badge[b-gdm7kc0n4a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #fff;
    background: #1b4a98;
    border-radius: 50%;
    flex-shrink: 0;
}

.step-badge-done[b-gdm7kc0n4a] {
    background: #059669;
}

.step-body[b-gdm7kc0n4a] {
    padding: 1.5rem;
}

.step-actions[b-gdm7kc0n4a] {
    display: flex;
    gap: 0.75rem;
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid #f0f0f0;
}

/* ── Criteria Grid ──────────────────────────────────────── */

.criteria-grid[b-gdm7kc0n4a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-group[b-gdm7kc0n4a] {
    display: flex;
    flex-direction: column;
}

.form-label[b-gdm7kc0n4a] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.375rem;
}

.form-hint[b-gdm7kc0n4a] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

.form-control[b-gdm7kc0n4a],
.form-select[b-gdm7kc0n4a] {
    font-size: 0.875rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    transition: border-color 0.15s;
}

.form-control:focus[b-gdm7kc0n4a],
.form-select:focus[b-gdm7kc0n4a] {
    border-color: #1b4a98;
    outline: none;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

/* ── Preview Table ──────────────────────────────────────── */

.preview-toolbar[b-gdm7kc0n4a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.preview-count[b-gdm7kc0n4a] {
    margin-left: auto;
    font-size: 0.8125rem;
    color: #6c757d;
    font-weight: 500;
}

.preview-table-wrap[b-gdm7kc0n4a] {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}

.preview-table[b-gdm7kc0n4a] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.preview-table thead[b-gdm7kc0n4a] {
    position: sticky;
    top: 0;
    z-index: 1;
}

.preview-table th[b-gdm7kc0n4a] {
    background: #f8f9fa;
    padding: 0.625rem 0.75rem;
    text-align: left;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #6c757d;
    border-bottom: 1px solid #e5e7eb;
}

.preview-table td[b-gdm7kc0n4a] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #f0f0f0;
    color: #333;
}

.preview-table tr:last-child td[b-gdm7kc0n4a] {
    border-bottom: none;
}

.preview-table tr.selected[b-gdm7kc0n4a] {
    background: #f0f7ff;
}

.preview-table tr:hover[b-gdm7kc0n4a] {
    background: #f8f9fa;
}

.preview-table tr.selected:hover[b-gdm7kc0n4a] {
    background: #e8f0fe;
}

.col-check[b-gdm7kc0n4a] {
    width: 40px;
    text-align: center;
}

.org-link[b-gdm7kc0n4a] {
    color: #1b4a98;
    text-decoration: none;
    font-weight: 500;
}

.org-link:hover[b-gdm7kc0n4a] {
    text-decoration: underline;
}

/* ── Template Grid ──────────────────────────────────────── */

.template-grid[b-gdm7kc0n4a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.span-2[b-gdm7kc0n4a] {
    grid-column: span 2;
}

/* ── Title Tag Chips ───────────────────────────────────────── */

.title-tags-hint[b-gdm7kc0n4a] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.375rem;
}

.title-tags-label[b-gdm7kc0n4a] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-right: 0.15rem;
}

.title-tag-chip[b-gdm7kc0n4a] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.72rem;
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
    border-radius: 4px;
    padding: 0.1rem 0.4rem;
    cursor: pointer;
    transition: background-color 0.15s;
}

    .title-tag-chip:hover[b-gdm7kc0n4a] {
        background: #fde68a;
    }

.create-summary[b-gdm7kc0n4a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    margin-top: 1rem;
    background: #eef6ff;
    border: 1px solid #b6d4fe;
    border-radius: 8px;
    font-size: 0.875rem;
    color: #0c4a6e;
}

/* ── Results ────────────────────────────────────────────── */

.result-summary[b-gdm7kc0n4a] {
    display: flex;
    gap: 1.5rem;
    justify-content: center;
}

.result-stat[b-gdm7kc0n4a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.5rem 2rem;
    border-radius: 12px;
    min-width: 140px;
}

.result-stat-success[b-gdm7kc0n4a] {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
}

.result-stat-danger[b-gdm7kc0n4a] {
    background: #fef2f2;
    border: 1px solid #fecaca;
}

.result-stat-value[b-gdm7kc0n4a] {
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1;
}

.result-stat-success .result-stat-value[b-gdm7kc0n4a] {
    color: #059669;
}

.result-stat-danger .result-stat-value[b-gdm7kc0n4a] {
    color: #dc2626;
}

.result-stat-label[b-gdm7kc0n4a] {
    font-size: 0.8125rem;
    color: #6c757d;
    margin-top: 0.5rem;
    font-weight: 500;
}

/* ── Empty state ────────────────────────────────────────── */

.empty-state[b-gdm7kc0n4a] {
    text-align: center;
    padding: 2rem 1rem;
    color: #6c757d;
}

.empty-state p[b-gdm7kc0n4a] {
    margin-bottom: 1rem;
}

/* ── Spinner ────────────────────────────────────────────── */

.spinner-sm[b-gdm7kc0n4a] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-gdm7kc0n4a 0.6s linear infinite;
    margin-right: 0.375rem;
}

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

/* ── Responsive ─────────────────────────────────────────── */

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

    .span-2[b-gdm7kc0n4a] {
        grid-column: span 1;
    }

    .result-summary[b-gdm7kc0n4a] {
        flex-direction: column;
        align-items: center;
    }
}
/* /Components/Pages/Crm/Admin/CrmAdminDataPurge.razor.rz.scp.css */
.admin-section[b-gissknaxrs] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.admin-section-danger[b-gissknaxrs] {
    border-color: #fecaca;
    background: #fffbfb;
}

.admin-section-warning[b-gissknaxrs] {
    border-color: #fde68a;
    background: #fffdf5;
}

.section-title[b-gissknaxrs] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 0.25rem;
}

.section-desc[b-gissknaxrs] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0 0 1rem;
}

/* Purge Summary Stats */
.purge-summary[b-gissknaxrs] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
}

.purge-summary-sm[b-gissknaxrs] {
    margin-bottom: 1rem;
}

.purge-stat[b-gissknaxrs] {
    text-align: center;
    padding: 0.625rem 0.875rem;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #e5e7eb;
    min-width: 80px;
}

.purge-stat-number[b-gissknaxrs] {
    display: block;
    font-size: 1.375rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.2;
}

.purge-stat-total[b-gissknaxrs] {
    color: #dc3545;
}

.purge-stat-warning[b-gissknaxrs] {
    color: #d97706;
}

.purge-stat-label[b-gissknaxrs] {
    display: block;
    font-size: 0.75rem;
    color: #64748b;
    margin-top: 0.15rem;
}

/* Purge Result */
.purge-result[b-gissknaxrs] {
    background: #f0faf4;
    border: 1px solid #c6f0d8;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
}

.purge-result-header[b-gissknaxrs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1rem;
    font-weight: 600;
    color: #155724;
    margin-bottom: 0.75rem;
}

.purge-result-details[b-gissknaxrs] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.purge-result-row[b-gissknaxrs] {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
    color: #374151;
    padding: 0.25rem 0;
}

.purge-result-total[b-gissknaxrs] {
    border-top: 1px solid #c6f0d8;
    padding-top: 0.5rem;
    margin-top: 0.25rem;
    font-weight: 600;
}

/* Confirmation Modal */
.confirm-backdrop[b-gissknaxrs] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.confirm-modal[b-gissknaxrs] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 520px;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-header[b-gissknaxrs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.modal-header h3[b-gissknaxrs] {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.modal-close[b-gissknaxrs] {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #6b7280;
    padding: 0.25rem;
    line-height: 1;
}

.modal-close:hover[b-gissknaxrs] {
    color: #1e293b;
}

.modal-body[b-gissknaxrs] {
    padding: 1.25rem 1.5rem;
}

.modal-footer[b-gissknaxrs] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e5e7eb;
}

.purge-list[b-gissknaxrs] {
    margin: 0.75rem 0;
    padding-left: 1.25rem;
}

.purge-list li[b-gissknaxrs] {
    font-size: 0.875rem;
    color: #374151;
    padding: 0.2rem 0;
}

.purge-warning[b-gissknaxrs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    font-size: 0.875rem;
    color: #991b1b;
    margin: 1rem 0;
}

.confirm-input-group[b-gissknaxrs] {
    margin-top: 1rem;
}

.confirm-input-group label[b-gissknaxrs] {
    display: block;
    font-size: 0.875rem;
    color: #374151;
    margin-bottom: 0.5rem;
}

.purge-safe-note[b-gissknaxrs] {
    font-size: 0.875rem;
    color: #059669;
    margin-top: 0.5rem;
}
/* /Components/Pages/Crm/Admin/CrmAdminEmailSpool.razor.rz.scp.css */
.page-header[b-o7seqh8k84] {
    margin-bottom: 32px;
}

.page-header-left[b-o7seqh8k84] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.back-link[b-o7seqh8k84] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #64748b;
    text-decoration: none;
    font-size: 13px;
    margin-bottom: 8px;
    transition: color 0.15s;
}

    .back-link:hover[b-o7seqh8k84] {
        color: #334155;
    }

.page-header h1[b-o7seqh8k84] {
    margin: 0;
    font-size: 24px;
    font-weight: 700;
    color: #1e293b;
}

.page-subtitle[b-o7seqh8k84] {
    margin: 4px 0 0 0;
    color: #64748b;
    font-size: 14px;
}

.loading-container[b-o7seqh8k84] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 60px 20px;
    color: #64748b;
}

/* ─── Stats Cards ──────────────────────────────────────────────────── */

.stats-grid[b-o7seqh8k84] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

.stat-card[b-o7seqh8k84] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    border-top: 3px solid transparent;
}

.stat-queued[b-o7seqh8k84] {
    border-top-color: #3b82f6;
}

.stat-scheduled[b-o7seqh8k84] {
    border-top-color: #8b5cf6;
}

.stat-sending[b-o7seqh8k84] {
    border-top-color: #f59e0b;
}

.stat-sent[b-o7seqh8k84] {
    border-top-color: #10b981;
}

.stat-failed[b-o7seqh8k84] {
    border-top-color: #ef4444;
}

.stat-value[b-o7seqh8k84] {
    font-size: 28px;
    font-weight: 700;
    color: #1e293b;
    line-height: 1;
}

.stat-label[b-o7seqh8k84] {
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 6px;
}

/* ─── Controls Bar ─────────────────────────────────────────────────── */

.spool-controls[b-o7seqh8k84] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 20px;
    margin-bottom: 24px;
}

.spool-tabs[b-o7seqh8k84] {
    display: flex;
    gap: 4px;
}

.spool-tab[b-o7seqh8k84] {
    padding: 6px 16px;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    background: #ffffff;
    font-size: 13px;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    transition: all 0.15s;
}

    .spool-tab:hover[b-o7seqh8k84] {
        color: #1e293b;
        border-color: #cbd5e1;
    }

    .spool-tab.active[b-o7seqh8k84] {
        background: #1b4a98;
        color: #ffffff;
        border-color: #1b4a98;
    }

.spool-actions[b-o7seqh8k84] {
    display: flex;
    gap: 8px;
    align-items: center;
}

/* ─── Empty State ──────────────────────────────────────────────────── */

.empty-state[b-o7seqh8k84] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 60px 20px;
    color: #94a3b8;
    text-align: center;
}

    .empty-state p[b-o7seqh8k84] {
        margin: 0;
        font-size: 14px;
    }

/* ─── Spool Table ──────────────────────────────────────────────────── */

.spool-table-container[b-o7seqh8k84] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
}

.spool-table[b-o7seqh8k84] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

    .spool-table thead th[b-o7seqh8k84] {
        background: #f8fafc;
        padding: 12px 16px;
        text-align: left;
        font-size: 11px;
        font-weight: 600;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 1px solid #e2e8f0;
    }

    .spool-table tbody td[b-o7seqh8k84] {
        padding: 12px 16px;
        border-bottom: 1px solid #f1f5f9;
        vertical-align: middle;
    }

    .spool-table tbody tr:last-child td[b-o7seqh8k84] {
        border-bottom: none;
    }

.cell-primary[b-o7seqh8k84] {
    font-weight: 500;
    color: #1e293b;
}

.cell-secondary[b-o7seqh8k84] {
    font-size: 12px;
    color: #94a3b8;
}

.cell-subject[b-o7seqh8k84] {
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cell-date[b-o7seqh8k84] {
    white-space: nowrap;
    color: #64748b;
    font-size: 12px;
}

.cell-retries[b-o7seqh8k84] {
    text-align: center;
    color: #64748b;
}

.cell-actions[b-o7seqh8k84] {
    white-space: nowrap;
}

.row-failed td[b-o7seqh8k84] {
    background: #fef2f2;
}

.row-error-detail td[b-o7seqh8k84] {
    padding: 0 16px 12px 16px;
    background: #fef2f2;
    border-bottom: 1px solid #fecaca;
}

.error-detail[b-o7seqh8k84] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 12px;
    color: #dc2626;
    padding: 8px 12px;
    background: #fff1f2;
    border-radius: 6px;
}

/* ─── Status Badges ────────────────────────────────────────────────── */

.status-badge[b-o7seqh8k84] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.badge-queued[b-o7seqh8k84] {
    background: #dbeafe;
    color: #1e40af;
}

.badge-sending[b-o7seqh8k84] {
    background: #fef3c7;
    color: #92400e;
}

.badge-sent[b-o7seqh8k84] {
    background: #d1fae5;
    color: #065f46;
}

.badge-failed[b-o7seqh8k84] {
    background: #fecaca;
    color: #991b1b;
}

.badge-cancelled[b-o7seqh8k84] {
    background: #e2e8f0;
    color: #475569;
}

/* ─── Icon Buttons ─────────────────────────────────────────────────── */

.btn-icon[b-o7seqh8k84] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    background: #ffffff;
    cursor: pointer;
    transition: all 0.15s;
}

.btn-icon-retry[b-o7seqh8k84] {
    color: #f59e0b;
}

    .btn-icon-retry:hover[b-o7seqh8k84] {
        background: #fffbeb;
        border-color: #f59e0b;
    }

.btn-icon-cancel[b-o7seqh8k84] {
    color: #ef4444;
}

    .btn-icon-cancel:hover[b-o7seqh8k84] {
        background: #fef2f2;
        border-color: #ef4444;
    }

/* ─── Pagination ───────────────────────────────────────────────────── */

.spool-pagination[b-o7seqh8k84] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    padding: 16px;
}

.pagination-info[b-o7seqh8k84] {
    font-size: 13px;
    color: #64748b;
}

/* ─── Danger Zone ──────────────────────────────────────────────────── */

.danger-zone[b-o7seqh8k84] {
    margin-top: 40px;
    border: 1px solid #fecaca;
    border-radius: 10px;
    overflow: hidden;
}

.danger-zone-header[b-o7seqh8k84] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: #fef2f2;
    color: #dc2626;
    font-weight: 600;
    font-size: 14px;
    border-bottom: 1px solid #fecaca;
}

.danger-zone-body[b-o7seqh8k84] {
    padding: 16px;
    background: #fff;
}

.danger-zone-item[b-o7seqh8k84] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

    .danger-zone-item strong[b-o7seqh8k84] {
        font-size: 14px;
        color: #1e293b;
    }

    .danger-zone-item p[b-o7seqh8k84] {
        margin: 4px 0 0 0;
        font-size: 13px;
        color: #64748b;
    }

.danger-zone-confirm[b-o7seqh8k84] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #dc2626;
    font-weight: 500;
    white-space: nowrap;
}

/* ─── Responsive ───────────────────────────────────────────────────── */

@@media (max-width: 768px) {
    .stats-grid[b-o7seqh8k84] {
        grid-template-columns: repeat(3, 1fr);
    }

    .spool-controls[b-o7seqh8k84] {
        flex-direction: column;
        align-items: stretch;
    }

    .spool-tabs[b-o7seqh8k84] {
        flex-wrap: wrap;
    }

    .spool-table-container[b-o7seqh8k84] {
        overflow-x: auto;
    }
}
/* /Components/Pages/Crm/Admin/CrmAdminEmailTemplates.razor.rz.scp.css */
.admin-section[b-6tmxskmjan] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
}

.section-header[b-6tmxskmjan] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.section-title[b-6tmxskmjan] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
}

.section-desc[b-6tmxskmjan] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0.25rem 0 0;
    flex-basis: 100%;
}

    .section-desc code[b-6tmxskmjan] {
        background: #f1f5f9;
        padding: 0.1rem 0.35rem;
        border-radius: 4px;
        font-size: 0.82rem;
        color: #1b4a98;
    }

/* ── Merge Tags ──────────────────────────────────────────── */

.system-tags-section[b-6tmxskmjan] {
    margin-bottom: 1.25rem;
    padding: 0.75rem 1rem;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 8px;
}

.system-tags-label[b-6tmxskmjan] {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: #92400e;
    margin-bottom: 0.5rem;
}

.system-tag-list[b-6tmxskmjan] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.system-tag-group[b-6tmxskmjan] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.system-tag-group-label[b-6tmxskmjan] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #78716c;
    min-width: 80px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.custom-tags-title[b-6tmxskmjan] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 0.75rem;
}

.tag-create-form[b-6tmxskmjan] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

    .tag-create-form input[b-6tmxskmjan] {
        max-width: 220px;
    }

.merge-tag-list[b-6tmxskmjan] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.merge-tag-item[b-6tmxskmjan] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.merge-tag-info[b-6tmxskmjan] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    flex: 1;
    min-width: 0;
}

.merge-tag-token[b-6tmxskmjan] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.82rem;
    background: #e0e7ff;
    color: #1b4a98;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    white-space: nowrap;
    font-weight: 600;
}

.merge-tag-desc[b-6tmxskmjan] {
    font-size: 0.82rem;
    color: #64748b;
}

.merge-tag-default[b-6tmxskmjan] {
    font-size: 0.78rem;
    color: #94a3b8;
    font-style: italic;
}

.merge-tag-actions[b-6tmxskmjan] {
    display: flex;
    gap: 0.25rem;
    flex-shrink: 0;
}

/* ── Templates ───────────────────────────────────────────── */

.template-list[b-6tmxskmjan] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.template-item[b-6tmxskmjan] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    transition: border-color 0.15s;
}

    .template-item:hover[b-6tmxskmjan] {
        border-color: #cbd5e1;
    }

.template-info[b-6tmxskmjan] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    flex: 1;
    min-width: 0;
}

.template-name[b-6tmxskmjan] {
    font-weight: 600;
    font-size: 0.9rem;
    color: #1e293b;
}

.template-subject[b-6tmxskmjan] {
    font-size: 0.82rem;
    color: #64748b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.template-meta[b-6tmxskmjan] {
    font-size: 0.75rem;
    color: #94a3b8;
}

.template-actions[b-6tmxskmjan] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

/* ── Edit Tag Modal ──────────────────────────────────────── */

.edit-tag-backdrop[b-6tmxskmjan] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.edit-tag-modal[b-6tmxskmjan] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 480px;
    max-height: 90vh;
    overflow-y: auto;
}

/* ── Template Editor Modal ───────────────────────────────── */

.editor-backdrop[b-6tmxskmjan] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.editor-modal[b-6tmxskmjan] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 95%;
    max-width: 900px;
    max-height: 90vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

/* ── Shared Modal Parts ──────────────────────────────────── */

.modal-header[b-6tmxskmjan] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e5e7eb;
}

    .modal-header h3[b-6tmxskmjan] {
        margin: 0;
        font-size: 1.05rem;
        font-weight: 600;
        color: #1e293b;
    }

.modal-close[b-6tmxskmjan] {
    background: none;
    border: none;
    font-size: 1.4rem;
    color: #94a3b8;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

    .modal-close:hover[b-6tmxskmjan] {
        color: #475569;
    }

.modal-body[b-6tmxskmjan] {
    padding: 1.25rem;
    flex: 1;
    overflow-y: auto;
}

.modal-footer[b-6tmxskmjan] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid #e5e7eb;
}

/* ── Radzen HTML Editor ───────────────────────────────────── */

[b-6tmxskmjan] .rz-html-editor {
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #dee2e6;
}

[b-6tmxskmjan] .rz-html-editor:focus-within {
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

[b-6tmxskmjan] .rz-html-editor .rz-html-editor-toolbar {
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

[b-6tmxskmjan] .rz-html-editor .rz-html-editor-content {
    min-height: 300px;
}

/* ── Merge Tag Chips ─────────────────────────────────────── */

.merge-tag-chips[b-6tmxskmjan] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.5rem;
    align-items: center;
}

.merge-tag-chips-label[b-6tmxskmjan] {
    font-size: 0.78rem;
    color: #64748b;
    margin-right: 0.25rem;
}

.merge-tag-chip[b-6tmxskmjan] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.72rem;
    background: #e0e7ff;
    color: #1b4a98;
    border: 1px solid #c7d2fe;
    border-radius: 4px;
    padding: 0.1rem 0.4rem;
    cursor: pointer;
    transition: background-color 0.15s;
}

    .merge-tag-chip:hover[b-6tmxskmjan] {
        background: #c7d2fe;
    }

.merge-tag-chip-system[b-6tmxskmjan] {
    background: #fef3c7;
    color: #92400e;
    border-color: #fde68a;
}

    .merge-tag-chip-system:hover[b-6tmxskmjan] {
        background: #fde68a;
    }

.badge-sm[b-6tmxskmjan] {
    font-size: 0.7rem;
    padding: 0.15rem 0.4rem;
}
/* /Components/Pages/Crm/Admin/CrmAdminPipelines.razor.rz.scp.css */
.admin-section[b-2wm59da9z2] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
}

.pipeline-management[b-2wm59da9z2] {
    max-width: 700px;
}

.pipeline-create-form[b-2wm59da9z2] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

    .pipeline-create-form input[b-2wm59da9z2] {
        max-width: 260px;
    }

.pipeline-list[b-2wm59da9z2] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.pipeline-list-item[b-2wm59da9z2] {
    padding: 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.pipeline-info[b-2wm59da9z2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.pipeline-name[b-2wm59da9z2] {
    font-weight: 500;
    color: #1e293b;
    font-size: 0.9rem;
}

.pipeline-stats[b-2wm59da9z2] {
    font-size: 0.8rem;
    color: #64748b;
    margin-left: auto;
}

.pipeline-actions[b-2wm59da9z2] {
    display: flex;
    gap: 0.375rem;
    margin-top: 0.5rem;
}

.pipeline-edit-row[b-2wm59da9z2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.pipeline-stages-editor[b-2wm59da9z2] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pipeline-stages-header[b-2wm59da9z2] {
    font-size: 0.875rem;
    color: #374151;
}

.pipeline-stages-checkboxes[b-2wm59da9z2] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
}

.stage-checkbox[b-2wm59da9z2] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    color: #374151;
    cursor: pointer;
    padding: 0.3rem 0.5rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
}

.pipeline-stages-actions[b-2wm59da9z2] {
    display: flex;
    gap: 0.5rem;
}

.color-swatch[b-2wm59da9z2] {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    flex-shrink: 0;
}

.form-check-inline[b-2wm59da9z2] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    cursor: pointer;
    font-size: 0.8rem;
    white-space: nowrap;
}

.form-check-label-text[b-2wm59da9z2] {
    font-size: 0.8rem;
    color: #64748b;
}

.badge-sm[b-2wm59da9z2] {
    font-size: 0.7rem;
    padding: 0.15rem 0.4rem;
}
/* /Components/Pages/Crm/Admin/CrmAdminSources.razor.rz.scp.css */
.admin-section[b-tviq13nucq] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
}

.source-management[b-tviq13nucq] {
    max-width: 600px;
}

.source-create-form[b-tviq13nucq] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

    .source-create-form input[b-tviq13nucq] {
        max-width: 260px;
    }

.source-list[b-tviq13nucq] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.source-list-item[b-tviq13nucq] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.source-inactive[b-tviq13nucq] {
    opacity: 0.6;
}

.source-list-name[b-tviq13nucq] {
    flex: 1;
    font-size: 0.9rem;
    font-weight: 500;
    color: #1e293b;
}

.source-edit-input[b-tviq13nucq] {
    flex: 1;
    max-width: 200px;
}

.badge-inactive[b-tviq13nucq] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #94a3b8;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    padding: 0.125rem 0.5rem;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.active-toggle[b-tviq13nucq] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    color: #475569;
    cursor: pointer;
    white-space: nowrap;
}

    .active-toggle input[b-tviq13nucq] {
        cursor: pointer;
    }
/* /Components/Pages/Crm/Admin/CrmAdminStages.razor.rz.scp.css */
.admin-section[b-cthqamf6v6] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
}

.stage-management[b-cthqamf6v6] {
    max-width: 700px;
}

.stage-create-form[b-cthqamf6v6] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
    align-items: center;
    flex-wrap: wrap;
}

    .stage-create-form input[type="text"][b-cthqamf6v6] {
        max-width: 200px;
    }

.stage-color-input[b-cthqamf6v6] {
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    cursor: pointer;
    background: none;
    flex-shrink: 0;
}

.form-check-inline[b-cthqamf6v6] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    cursor: pointer;
    font-size: 0.8rem;
    white-space: nowrap;
}

.form-check-label-text[b-cthqamf6v6] {
    font-size: 0.8rem;
    color: #64748b;
}

.stage-list[b-cthqamf6v6] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.stage-list-item[b-cthqamf6v6] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    flex-wrap: wrap;
}

.color-swatch[b-cthqamf6v6] {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    flex-shrink: 0;
}

.stage-list-name[b-cthqamf6v6] {
    flex: 1;
    font-size: 0.9rem;
    font-weight: 500;
    color: #1e293b;
}

.stage-edit-input[b-cthqamf6v6] {
    flex: 1;
    max-width: 200px;
}

.badge-sm[b-cthqamf6v6] {
    font-size: 0.7rem;
    padding: 0.15rem 0.4rem;
}
/* /Components/Pages/Crm/Admin/CrmAdminTags.razor.rz.scp.css */
.admin-section[b-1bwn7xdcfo] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
}

.tag-management[b-1bwn7xdcfo] {
    max-width: 600px;
}

.tag-create-form[b-1bwn7xdcfo] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

    .tag-create-form input[b-1bwn7xdcfo] {
        max-width: 260px;
    }

.tag-list[b-1bwn7xdcfo] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.tag-list-item[b-1bwn7xdcfo] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.tag-color-swatch[b-1bwn7xdcfo] {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    flex-shrink: 0;
}

.tag-list-name[b-1bwn7xdcfo] {
    flex: 1;
    font-size: 0.9rem;
    font-weight: 500;
    color: #1e293b;
}

.tag-edit-input[b-1bwn7xdcfo] {
    flex: 1;
    max-width: 200px;
}

.tag-color-input[b-1bwn7xdcfo] {
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    cursor: pointer;
    background: none;
}
/* /Components/Pages/Crm/Contacts/ContactDeduplication.razor.rz.scp.css */
/* Page Header */
.page-header[b-g980shjebh] {
    margin-bottom: 1.5rem;
}

.page-header-left[b-g980shjebh] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.back-link[b-g980shjebh] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    color: #6c757d;
    text-decoration: none;
    margin-bottom: 0.25rem;
}

.back-link:hover[b-g980shjebh] {
    color: #1b4a98;
}

.page-header h1[b-g980shjebh] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.page-subtitle[b-g980shjebh] {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0;
}

/* Loading */
.loading-container[b-g980shjebh] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem;
    font-size: 0.9375rem;
    color: #6c757d;
}

.spinner[b-g980shjebh] {
    width: 24px;
    height: 24px;
    border: 3px solid #e5e7eb;
    border-top: 3px solid #1b4a98;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

.spinner-small[b-g980shjebh] {
    width: 16px;
    height: 16px;
    border: 2px solid #e5e7eb;
    border-top: 2px solid #1b4a98;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

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

/* Cards */
.dedup-card[b-g980shjebh] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.75rem;
    margin-bottom: 1.25rem;
}

.card-title[b-g980shjebh] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1b4a98;
    margin-bottom: 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Preview Stats */
.preview-grid[b-g980shjebh] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.preview-stat[b-g980shjebh] {
    flex: 1;
    text-align: center;
    padding: 1.25rem;
    border-radius: 10px;
    background: #f8f9fa;
    border: 1px solid #e5e7eb;
}

.preview-stat.stat-success[b-g980shjebh] {
    background: #f0faf4;
    border-color: #c6f0d8;
}

.preview-stat.stat-warning[b-g980shjebh] {
    background: #fff8e1;
    border-color: #ffecb3;
}

.preview-stat.stat-danger[b-g980shjebh] {
    background: #fef2f2;
    border-color: #fecaca;
}

.stat-number[b-g980shjebh] {
    display: block;
    font-size: 2rem;
    font-weight: 700;
    color: #1b4a98;
    line-height: 1.2;
}

.stat-success .stat-number[b-g980shjebh] {
    color: #155724;
}

.stat-warning .stat-number[b-g980shjebh] {
    color: #856404;
}

.stat-danger .stat-number[b-g980shjebh] {
    color: #dc3545;
}

.stat-label[b-g980shjebh] {
    display: block;
    font-size: 0.8125rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

/* Notices */
.dedup-notice[b-g980shjebh] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.875rem 1rem;
    border-radius: 8px;
    font-size: 0.9375rem;
    margin-bottom: 1.25rem;
}

.notice-warning[b-g980shjebh] {
    background: #fff8e1;
    border: 1px solid #ffecb3;
    color: #856404;
}

.notice-info[b-g980shjebh] {
    background: #e8f4fd;
    border: 1px solid #b3d7f2;
    color: #0c5460;
}

/* Actions */
.dedup-actions[b-g980shjebh] {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    padding-top: 0.5rem;
}

.btn[b-g980shjebh] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 600;
    border-radius: 8px;
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.15s ease;
}

.btn-primary[b-g980shjebh] {
    background: #1b4a98;
    color: #fff;
    border-color: #1b4a98;
}

.btn-primary:hover[b-g980shjebh] {
    background: #153d7f;
}

.btn-outline-primary[b-g980shjebh] {
    background: transparent;
    color: #1b4a98;
    border-color: #1b4a98;
}

.btn-outline-primary:hover[b-g980shjebh] {
    background: #e8eef7;
}

.btn-outline-secondary[b-g980shjebh] {
    background: transparent;
    color: #6c757d;
    border-color: #dee2e6;
}

.btn-outline-secondary:hover[b-g980shjebh] {
    background: #f8f9fa;
    color: #495057;
}

.btn-sm[b-g980shjebh] {
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
}

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

/* Progress */
.progress-section[b-g980shjebh] {
    padding: 1rem 0;
}

.progress-bar-container[b-g980shjebh] {
    width: 100%;
    height: 12px;
    background: #e5e7eb;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 0.75rem;
}

.progress-bar-fill[b-g980shjebh] {
    height: 100%;
    background: linear-gradient(90deg, #1b4a98, #2d6fd6);
    border-radius: 6px;
    transition: width 0.3s ease;
}

.progress-info[b-g980shjebh] {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
    color: #495057;
    font-weight: 500;
}

.progress-detail[b-g980shjebh] {
    margin-top: 0.5rem;
    font-size: 0.8125rem;
    color: #6c757d;
}

/* Group Card */
.group-card[b-g980shjebh] {
    border-left: 4px solid #ffc107;
}

.group-header[b-g980shjebh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.group-title[b-g980shjebh] {
    font-size: 1rem;
    font-weight: 600;
    color: #333;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.count-badge[b-g980shjebh] {
    background: #e8eef7;
    color: #1b4a98;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
}

.match-reasons[b-g980shjebh] {
    display: flex;
    gap: 0.375rem;
}

.reason-badge[b-g980shjebh] {
    background: #fff3cd;
    color: #856404;
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

/* Contact Cards */
.contact-cards[b-g980shjebh] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.contact-card[b-g980shjebh] {
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    padding: 1rem;
    cursor: pointer;
    transition: all 0.15s ease;
    background: #fafafa;
}

.contact-card:hover[b-g980shjebh] {
    border-color: #b0c4de;
    background: #f8f9fa;
}

.contact-card-selected[b-g980shjebh] {
    border-color: #1b4a98;
    background: #f0f5ff;
    box-shadow: 0 0 0 1px #1b4a98;
}

.contact-card-header[b-g980shjebh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.survivor-radio[b-g980shjebh] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    cursor: pointer;
}

.survivor-radio input[type="radio"][b-g980shjebh] {
    accent-color: #1b4a98;
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.badge-keep[b-g980shjebh] {
    background: #d4edda;
    color: #155724;
    font-size: 0.6875rem;
    font-weight: 700;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    text-transform: uppercase;
}

.badge-remove[b-g980shjebh] {
    background: #f8d7da;
    color: #721c24;
    font-size: 0.6875rem;
    font-weight: 700;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    text-transform: uppercase;
}

.contact-id[b-g980shjebh] {
    font-size: 0.75rem;
    color: #999;
    font-family: monospace;
}

.contact-card-body[b-g980shjebh] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.contact-name[b-g980shjebh] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #333;
}

.contact-field[b-g980shjebh] {
    display: flex;
    gap: 0.5rem;
    font-size: 0.8125rem;
    align-items: baseline;
}

.field-label[b-g980shjebh] {
    color: #999;
    font-weight: 500;
    min-width: 3.5rem;
    flex-shrink: 0;
}

.field-value[b-g980shjebh] {
    color: #333;
    word-break: break-all;
}

.contact-meta[b-g980shjebh] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    margin-top: 0.375rem;
    align-items: center;
}

.meta-badge[b-g980shjebh] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
}

.meta-org[b-g980shjebh] {
    background: #e8eef7;
    color: #1b4a98;
}

.meta-deal[b-g980shjebh] {
    background: #f0faf4;
    color: #155724;
}

.meta-date[b-g980shjebh] {
    font-size: 0.6875rem;
    color: #999;
}

.contact-orgs[b-g980shjebh] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: 0.25rem;
}

.org-tag[b-g980shjebh] {
    background: #f3f4f6;
    color: #6c757d;
    font-size: 0.6875rem;
    padding: 0.0625rem 0.375rem;
    border-radius: 3px;
    border: 1px solid #e5e7eb;
}

/* Group Actions */
.group-actions[b-g980shjebh] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.5rem;
    border-top: 1px solid #f0f0f0;
}

/* Results */
.results-section[b-g980shjebh] {
    margin-top: 1.25rem;
}

.details-title[b-g980shjebh] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.75rem;
}

.results-table-container[b-g980shjebh] {
    max-height: 300px;
    overflow-y: auto;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}

.results-table[b-g980shjebh] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.results-table thead[b-g980shjebh] {
    position: sticky;
    top: 0;
    z-index: 1;
}

.results-table th[b-g980shjebh] {
    background: #f8f9fa;
    padding: 0.625rem 0.75rem;
    text-align: left;
    font-weight: 600;
    color: #495057;
    border-bottom: 1px solid #e5e7eb;
}

.results-table td[b-g980shjebh] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #f0f0f0;
    color: #333;
}

.text-danger[b-g980shjebh] {
    color: #dc3545;
}

/* NA Contacts Section */
.na-card[b-g980shjebh] {
    border-left: 4px solid #dc3545;
}

.badge-danger[b-g980shjebh] {
    background: #dc3545;
    color: #fff;
    font-size: 0.75rem;
    padding: 0.125rem 0.5rem;
    border-radius: 999px;
    font-weight: 600;
    margin-left: 0.5rem;
}

.na-contact-list[b-g980shjebh] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 1rem 0;
}

.na-contact-row[b-g980shjebh] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    font-size: 0.8125rem;
    flex-wrap: wrap;
}
/* /Components/Pages/Crm/Contacts/ContactEdit.razor.rz.scp.css */
.form-card[b-oe8oihqa4v] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
}

.form-section-title[b-oe8oihqa4v] {
    font-size: 1rem;
    font-weight: 600;
    color: #1b4a98;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f0f0f0;
}

.form-row[b-oe8oihqa4v] {
    display: flex;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.form-group[b-oe8oihqa4v] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.form-label[b-oe8oihqa4v] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.25rem;
}

.required[b-oe8oihqa4v] {
    color: #dc3545;
}

.form-hint[b-oe8oihqa4v] {
    font-size: 0.8125rem;
    color: #6c757d;
    margin-bottom: 0.75rem;
}

.org-links-list[b-oe8oihqa4v] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.org-link-row[b-oe8oihqa4v] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
}

.org-link-row .form-select[b-oe8oihqa4v] {
    flex: 1;
}

.primary-toggle[b-oe8oihqa4v] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    color: #495057;
    cursor: pointer;
    white-space: nowrap;
}

.form-actions[b-oe8oihqa4v] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 0;
}

.mt-2[b-oe8oihqa4v] {
    margin-top: 0.5rem;
}

.small[b-oe8oihqa4v] {
    font-size: 0.8125rem;
}
/* /Components/Pages/Crm/Contacts/ContactList.razor.rz.scp.css */
.contact-cell[b-t9boakkhvl] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.contact-avatar[b-t9boakkhvl] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1b4a98, #2d6fd6);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 600;
    flex-shrink: 0;
}

.contact-name[b-t9boakkhvl] {
    font-weight: 600;
    color: #333;
}

.org-extra[b-t9boakkhvl] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-left: 0.25rem;
}
/* /Components/Pages/Crm/Contacts/ContactView.razor.rz.scp.css */
.view-grid[b-2sut6o1kh4] {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 1.25rem;
    align-items: start;
}

.view-main[b-2sut6o1kh4] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.view-sidebar[b-2sut6o1kh4] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.detail-card[b-2sut6o1kh4] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
}

.detail-card-meta[b-2sut6o1kh4] {
    background: #f8f9fa;
}

.card-title[b-2sut6o1kh4] {
    font-size: 1rem;
    font-weight: 600;
    color: #1b4a98;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-count[b-2sut6o1kh4] {
    background: #e8eef7;
    color: #1b4a98;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
}

.detail-grid[b-2sut6o1kh4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.detail-item[b-2sut6o1kh4] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-label[b-2sut6o1kh4] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.detail-value[b-2sut6o1kh4] {
    font-size: 0.9375rem;
    color: #333;
}

.detail-link[b-2sut6o1kh4] {
    font-size: 0.9375rem;
    color: #1b4a98;
    text-decoration: none;
}

.detail-link:hover[b-2sut6o1kh4] {
    text-decoration: underline;
}

.notes-text[b-2sut6o1kh4] {
    font-size: 0.9375rem;
    color: #333;
    white-space: pre-wrap;
    line-height: 1.6;
    margin: 0;
}

.linked-list[b-2sut6o1kh4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.linked-item[b-2sut6o1kh4] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.625rem 0.75rem;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    text-decoration: none;
    color: inherit;
    transition: background-color 0.15s, border-color 0.15s;
}

.linked-item:hover[b-2sut6o1kh4] {
    background-color: #f0f4fa;
    border-color: #c0d0e8;
}

.linked-name[b-2sut6o1kh4] {
    font-weight: 600;
    font-size: 0.875rem;
    color: #333;
}

.linked-deal-row[b-2sut6o1kh4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.linked-amount[b-2sut6o1kh4] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #495057;
}

.badge-primary-small[b-2sut6o1kh4] {
    background-color: #cce5ff;
    color: #004085;
    font-size: 0.6875rem;
    padding: 0.125rem 0.375rem;
    border-radius: 4px;
    width: fit-content;
}

.badge-info[b-2sut6o1kh4] {
    background-color: #d1ecf1;
    color: #0c5460;
}

.badge-warning[b-2sut6o1kh4] {
    background-color: #fff3cd;
    color: #856404;
}

.badge-primary[b-2sut6o1kh4] {
    background-color: #cce5ff;
    color: #004085;
}

.badge-success[b-2sut6o1kh4] {
    background-color: #d4edda;
    color: #155724;
}

.badge-secondary[b-2sut6o1kh4] {
    background-color: #e2e3e5;
    color: #383d41;
}

.meta-row[b-2sut6o1kh4] {
    display: flex;
    justify-content: space-between;
    padding: 0.375rem 0;
    font-size: 0.8125rem;
    color: #495057;
}

.meta-row + .meta-row[b-2sut6o1kh4] {
    border-top: 1px solid #e5e7eb;
}

.meta-label[b-2sut6o1kh4] {
    font-weight: 500;
    color: #6c757d;
}

.small[b-2sut6o1kh4] {
    font-size: 0.8125rem;
}

@media (max-width: 992px) {
    .view-grid[b-2sut6o1kh4] {
        grid-template-columns: 1fr;
    }
}

/* ─── Inline Tasks Section ─────────────────────────────────────────── */

.section-header-row[b-2sut6o1kh4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f0f0f0;
}

.section-header-row .card-title[b-2sut6o1kh4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-header-actions[b-2sut6o1kh4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.count-badge[b-2sut6o1kh4] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.5rem;
    height: 1.5rem;
    padding: 0 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #fff;
    background: #6c757d;
    border-radius: 999px;
}

.inline-task-list[b-2sut6o1kh4] {
    display: flex;
    flex-direction: column;
}

.inline-task-item[b-2sut6o1kh4] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.8125rem;
}

.inline-task-item:last-child[b-2sut6o1kh4] {
    border-bottom: none;
}

.inline-task-item.overdue[b-2sut6o1kh4] {
    border-left: 3px solid #dc2626;
    padding-left: 0.5rem;
}

.inline-task-item.completed[b-2sut6o1kh4] {
    opacity: 0.55;
}

.inline-check-btn[b-2sut6o1kh4] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #d1d5db;
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    flex-shrink: 0;
    transition: all 0.15s;
}

.inline-check-btn:hover[b-2sut6o1kh4] {
    border-color: #1b4a98;
}

.inline-check-btn.checked[b-2sut6o1kh4] {
    background: #22c55e;
    border-color: #22c55e;
    color: #fff;
}

.inline-task-type[b-2sut6o1kh4] {
    font-size: 0.625rem;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    white-space: nowrap;
    flex-shrink: 0;
}

.type-phone[b-2sut6o1kh4] { background: #dbeafe; color: #1d4ed8; }
.type-email[b-2sut6o1kh4] { background: #fce7f3; color: #be185d; }
.type-sms[b-2sut6o1kh4]   { background: #d1fae5; color: #065f46; }
.type-meeting[b-2sut6o1kh4] { background: #ede9fe; color: #6d28d9; }
.type-todo[b-2sut6o1kh4]  { background: #f3f4f6; color: #4b5563; }

.inline-task-title[b-2sut6o1kh4] {
    flex: 1;
    font-weight: 600;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.inline-task-title.completed-text[b-2sut6o1kh4] {
    text-decoration: line-through;
    color: #9ca3af;
}

.inline-task-assignee[b-2sut6o1kh4] {
    color: #6b7280;
    font-size: 0.75rem;
    white-space: nowrap;
    flex-shrink: 0;
}

.inline-task-due[b-2sut6o1kh4] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6b7280;
    white-space: nowrap;
    flex-shrink: 0;
}

.inline-task-due.overdue-text[b-2sut6o1kh4] {
    color: #dc2626;
    font-weight: 600;
}

.inline-task-actions[b-2sut6o1kh4] {
    display: flex;
    gap: 0.125rem;
    opacity: 0;
    transition: opacity 0.1s;
    flex-shrink: 0;
}

.inline-task-item:hover .inline-task-actions[b-2sut6o1kh4] {
    opacity: 1;
}

.inline-task-action-btn[b-2sut6o1kh4] {
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 3px;
    border-radius: 4px;
    display: flex;
    align-items: center;
}

.inline-task-action-btn:hover[b-2sut6o1kh4] {
    color: #1b4a98;
    background: #f3f4f6;
}

.inline-task-action-btn.danger:hover[b-2sut6o1kh4] {
    color: #dc2626;
    background: #fef2f2;
}
/* /Components/Pages/Crm/CrmAdmin.razor.rz.scp.css */
/* Admin Grid Layout */
.admin-grid[b-i33vuzcfjz] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 1.25rem;
}

/* Admin Cards */
.admin-card[b-i33vuzcfjz] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    transition: border-color 0.2s, box-shadow 0.2s;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.admin-card:hover[b-i33vuzcfjz] {
    border-color: #1b4a98;
    box-shadow: 0 4px 12px rgba(27, 74, 152, 0.1);
}

.admin-card:hover .admin-card-arrow[b-i33vuzcfjz] {
    color: #1b4a98;
    transform: translateX(2px);
}

.admin-card-danger[b-i33vuzcfjz] {
    border-color: #fecaca;
    background: #fffbfb;
}

.admin-card-danger:hover[b-i33vuzcfjz] {
    border-color: #dc3545;
    box-shadow: 0 4px 12px rgba(220, 53, 69, 0.1);
}

.admin-card-danger:hover .admin-card-arrow[b-i33vuzcfjz] {
    color: #dc3545;
}

/* Card Icon */
.admin-card-icon[b-i33vuzcfjz] {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: #eef2ff;
    color: #1b4a98;
    display: flex;
    align-items: center;
    justify-content: center;
}

.icon-danger[b-i33vuzcfjz] {
    background: #fef2f2;
    color: #dc3545;
}

/* Card Content */
.admin-card-content[b-i33vuzcfjz] {
    flex: 1;
    min-width: 0;
}

.admin-card-content h3[b-i33vuzcfjz] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 0.35rem 0;
}

.admin-card-content p[b-i33vuzcfjz] {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0;
    line-height: 1.5;
}

/* Card Arrow */
.admin-card-arrow[b-i33vuzcfjz] {
    flex-shrink: 0;
    color: #94a3b8;
    transition: color 0.2s, transform 0.2s;
    align-self: center;
}
/* /Components/Pages/Crm/DataMigration.razor.rz.scp.css */
.migration-card[b-perb6l0r0f] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.75rem;
    margin-bottom: 1.25rem;
}

.card-title[b-perb6l0r0f] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1b4a98;
    margin-bottom: 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Preview Stats */
.preview-grid[b-perb6l0r0f] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.preview-stat[b-perb6l0r0f] {
    flex: 1;
    text-align: center;
    padding: 1.25rem;
    border-radius: 10px;
    background: #f8f9fa;
    border: 1px solid #e5e7eb;
}

.preview-stat.stat-success[b-perb6l0r0f] {
    background: #f0faf4;
    border-color: #c6f0d8;
}

.preview-stat.stat-muted[b-perb6l0r0f] {
    background: #f8f9fa;
    border-color: #e2e3e5;
}

.preview-stat.stat-danger[b-perb6l0r0f] {
    background: #fef2f2;
    border-color: #fecaca;
}

.stat-number[b-perb6l0r0f] {
    display: block;
    font-size: 2rem;
    font-weight: 700;
    color: #1b4a98;
    line-height: 1.2;
}

.stat-success .stat-number[b-perb6l0r0f] {
    color: #155724;
}

.stat-muted .stat-number[b-perb6l0r0f] {
    color: #6c757d;
}

.stat-danger .stat-number[b-perb6l0r0f] {
    color: #dc3545;
}

.stat-label[b-perb6l0r0f] {
    display: block;
    font-size: 0.8125rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

/* Preview Details */
.preview-details[b-perb6l0r0f] {
    margin-bottom: 1.5rem;
}

.details-title[b-perb6l0r0f] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.details-grid[b-perb6l0r0f] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.detail-row[b-perb6l0r0f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9375rem;
    color: #333;
    padding: 0.5rem 0.75rem;
    background: #f8f9fa;
    border-radius: 6px;
    flex-wrap: wrap;
}

.detail-row svg[b-perb6l0r0f] {
    color: #1b4a98;
    flex-shrink: 0;
}

.detail-sub[b-perb6l0r0f] {
    font-size: 0.8125rem;
    color: #6c757d;
}

/* Notices */
.migration-notice[b-perb6l0r0f] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.875rem 1rem;
    border-radius: 8px;
    font-size: 0.9375rem;
    margin-bottom: 1.25rem;
}

.notice-warning[b-perb6l0r0f] {
    background: #fff8e1;
    border: 1px solid #ffecb3;
    color: #856404;
}

.notice-info[b-perb6l0r0f] {
    background: #e8f4fd;
    border: 1px solid #b3d7f2;
    color: #0c5460;
}

/* Actions */
.migration-actions[b-perb6l0r0f] {
    display: flex;
    justify-content: center;
    padding-top: 0.5rem;
}

.btn-lg[b-perb6l0r0f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
}

/* Progress */
.progress-section[b-perb6l0r0f] {
    padding: 1rem 0;
}

.progress-bar-container[b-perb6l0r0f] {
    width: 100%;
    height: 12px;
    background: #e5e7eb;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 0.75rem;
}

.progress-bar-fill[b-perb6l0r0f] {
    height: 100%;
    background: linear-gradient(90deg, #1b4a98, #2d6fd6);
    border-radius: 6px;
    transition: width 0.3s ease;
}

.progress-info[b-perb6l0r0f] {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
    color: #495057;
    font-weight: 500;
}

.progress-detail[b-perb6l0r0f] {
    margin-top: 0.5rem;
    font-size: 0.8125rem;
    color: #6c757d;
}

/* Results */
.results-section[b-perb6l0r0f] {
    margin-top: 1.25rem;
}

.results-table-container[b-perb6l0r0f] {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}

.results-table[b-perb6l0r0f] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.results-table thead[b-perb6l0r0f] {
    position: sticky;
    top: 0;
    z-index: 1;
}

.results-table th[b-perb6l0r0f] {
    background: #f8f9fa;
    padding: 0.625rem 0.75rem;
    text-align: left;
    font-weight: 600;
    color: #495057;
    border-bottom: 1px solid #e5e7eb;
}

.results-table td[b-perb6l0r0f] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #f0f0f0;
    color: #333;
}

.results-table a[b-perb6l0r0f] {
    color: #1b4a98;
    text-decoration: none;
}

.results-table a:hover[b-perb6l0r0f] {
    text-decoration: underline;
}

.count-badge[b-perb6l0r0f] {
    background: #e8eef7;
    color: #1b4a98;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
}

.badge-success[b-perb6l0r0f] {
    background-color: #d4edda;
    color: #155724;
    font-size: 0.75rem;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
}

.text-danger[b-perb6l0r0f] {
    color: #dc3545;
}

.text-muted[b-perb6l0r0f] {
    color: #6c757d;
}

.spinner-small[b-perb6l0r0f] {
    width: 18px;
    height: 18px;
    border: 2px solid #e5e7eb;
    border-top: 2px solid #1b4a98;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

@@keyframes spin {
    to[b-perb6l0r0f] { transform: rotate(360deg); }
}
/* /Components/Pages/Crm/Deals/DealEdit.razor.rz.scp.css */
.form-card[b-8qtq9nxcej] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
}

.form-section-title[b-8qtq9nxcej] {
    font-size: 1rem;
    font-weight: 600;
    color: #1b4a98;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f0f0f0;
}

.form-row[b-8qtq9nxcej] {
    display: flex;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.form-group[b-8qtq9nxcej] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.form-group.flex-2[b-8qtq9nxcej] {
    flex: 2;
}

.form-label[b-8qtq9nxcej] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.25rem;
}

.required[b-8qtq9nxcej] {
    color: #dc3545;
}

.form-actions[b-8qtq9nxcej] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 0;
}

/* Pipeline Assignments */
.pipeline-assignments-section[b-8qtq9nxcej] {
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid #f0f0f0;
}

.pipeline-assignment-row[b-8qtq9nxcej] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
}

.pipeline-check[b-8qtq9nxcej] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    cursor: pointer;
    min-width: 160px;
}

.pipeline-stage-select[b-8qtq9nxcej] {
    max-width: 200px;
}

/* ── Title Tag Chips ───────────────────────────────────────── */

.title-tags-hint[b-8qtq9nxcej] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.375rem;
}

.title-tags-label[b-8qtq9nxcej] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-right: 0.15rem;
}

.title-tag-chip[b-8qtq9nxcej] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.72rem;
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
    border-radius: 4px;
    padding: 0.1rem 0.4rem;
    cursor: pointer;
    transition: background-color 0.15s;
}

    .title-tag-chip:hover[b-8qtq9nxcej] {
        background: #fde68a;
    }
/* /Components/Pages/Crm/Deals/DealList.razor.rz.scp.css */
.deal-title[b-guum0gtmjx] {
    font-weight: 600;
    color: #333;
}

.deal-amount[b-guum0gtmjx] {
    font-weight: 600;
    color: #1b4a98;
}

.expected-date[b-guum0gtmjx] {
    color: #6c757d;
    font-style: italic;
}

.badge-info[b-guum0gtmjx] {
    background-color: #d1ecf1;
    color: #0c5460;
}

.badge-warning[b-guum0gtmjx] {
    background-color: #fff3cd;
    color: #856404;
}

.badge-primary[b-guum0gtmjx] {
    background-color: #cce5ff;
    color: #004085;
}

.badge-success[b-guum0gtmjx] {
    background-color: #d4edda;
    color: #155724;
}

.badge-secondary[b-guum0gtmjx] {
    background-color: #e2e3e5;
    color: #383d41;
}

.badge-danger[b-guum0gtmjx] {
    background-color: #f8d7da;
    color: #721c24;
}
/* /Components/Pages/Crm/Deals/DealView.razor.rz.scp.css */
.back-links[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.back-link-separator[b-nh3vucn7pi] {
    color: #d1d5db;
    font-size: 0.875rem;
    user-select: none;
}

.view-grid[b-nh3vucn7pi] {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 1.25rem;
    align-items: start;
}

.view-main[b-nh3vucn7pi] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.view-sidebar[b-nh3vucn7pi] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.detail-card[b-nh3vucn7pi] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
}

.detail-card-meta[b-nh3vucn7pi] {
    background: #f8f9fa;
}

.card-title[b-nh3vucn7pi] {
    font-size: 1rem;
    font-weight: 600;
    color: #1b4a98;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f0f0f0;
}

.deal-hero[b-nh3vucn7pi] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 1rem 0;
}

.deal-amount-large[b-nh3vucn7pi] {
    font-size: 2rem;
    font-weight: 700;
    color: #1b4a98;
}

.deal-badges[b-nh3vucn7pi] {
    display: flex;
    gap: 0.5rem;
}

.badge-lg[b-nh3vucn7pi] {
    font-size: 0.875rem;
    padding: 0.375rem 0.75rem;
    border-radius: 6px;
}

.detail-grid[b-nh3vucn7pi] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.detail-item[b-nh3vucn7pi] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-label[b-nh3vucn7pi] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.detail-value[b-nh3vucn7pi] {
    font-size: 0.9375rem;
    color: #333;
}

.detail-link[b-nh3vucn7pi] {
    font-size: 0.9375rem;
    color: #1b4a98;
    text-decoration: none;
}

.detail-link:hover[b-nh3vucn7pi] {
    text-decoration: underline;
}

.notes-text[b-nh3vucn7pi] {
    font-size: 0.9375rem;
    color: #333;
    white-space: pre-wrap;
    line-height: 1.6;
    margin: 0;
}

.badge-info[b-nh3vucn7pi] {
    background-color: #d1ecf1;
    color: #0c5460;
}

.badge-warning[b-nh3vucn7pi] {
    background-color: #fff3cd;
    color: #856404;
}

.badge-primary[b-nh3vucn7pi] {
    background-color: #cce5ff;
    color: #004085;
}

.badge-success[b-nh3vucn7pi] {
    background-color: #d4edda;
    color: #155724;
}

.badge-secondary[b-nh3vucn7pi] {
    background-color: #e2e3e5;
    color: #383d41;
}

.badge-danger[b-nh3vucn7pi] {
    background-color: #f8d7da;
    color: #721c24;
}

.meta-row[b-nh3vucn7pi] {
    display: flex;
    justify-content: space-between;
    padding: 0.375rem 0;
    font-size: 0.8125rem;
    color: #495057;
}

.meta-row + .meta-row[b-nh3vucn7pi] {
    border-top: 1px solid #e5e7eb;
}

.meta-label[b-nh3vucn7pi] {
    font-weight: 500;
    color: #6c757d;
}

@media (max-width: 992px) {
    .view-grid[b-nh3vucn7pi] {
        grid-template-columns: 1fr;
    }
}

/* ─── Email History Section ─────────────────────────────────────────── */

.email-section-header[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f0f0f0;
}

.email-section-header .card-title[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.email-count[b-nh3vucn7pi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.5rem;
    height: 1.5rem;
    padding: 0 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #fff;
    background: #6c757d;
    border-radius: 999px;
}

.email-empty[b-nh3vucn7pi] {
    font-size: 0.875rem;
    color: #6c757d;
    text-align: center;
    padding: 1rem 0;
}

.email-list[b-nh3vucn7pi] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.email-list-item[b-nh3vucn7pi] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
    transition: background 0.15s;
    margin: 0 -0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    border-radius: 6px;
}

.email-list-item:hover[b-nh3vucn7pi] {
    background: #f8f9fa;
}

.email-list-item:last-child[b-nh3vucn7pi] {
    border-bottom: none;
}

.email-list-item-main[b-nh3vucn7pi] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
    flex: 1;
}

.email-list-subject[b-nh3vucn7pi] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1b4a98;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.email-list-recipient[b-nh3vucn7pi] {
    font-size: 0.75rem;
    color: #6c757d;
}

.email-list-item-meta[b-nh3vucn7pi] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.125rem;
    white-space: nowrap;
    flex-shrink: 0;
}

.email-list-date[b-nh3vucn7pi] {
    font-size: 0.75rem;
    color: #495057;
}

.email-list-sender[b-nh3vucn7pi] {
    font-size: 0.6875rem;
    color: #6c757d;
}

.email-list-template[b-nh3vucn7pi] {
    display: inline-block;
    font-size: 0.6875rem;
    padding: 0.125rem 0.375rem;
    background: #eef2ff;
    color: #1b4a98;
    border-radius: 4px;
}

/* ─── Unified Email Timeline ───────────────────────────────────────── */

.email-header-right[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.email-sync-indicator[b-nh3vucn7pi] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    color: #6c757d;
    padding: 0.125rem 0.5rem;
    background: #f0f0f0;
    border-radius: 999px;
}

.email-sync-indicator.synced[b-nh3vucn7pi] {
    color: #2e7d32;
    background: #e8f5e9;
}

.spinner-sm[b-nh3vucn7pi] {
    width: 12px;
    height: 12px;
    border: 2px solid #e5e7eb;
    border-top-color: #1b4a98;
    border-radius: 50%;
    animation: spin-b-nh3vucn7pi 0.6s linear infinite;
}

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

.email-direction-badge[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    flex-shrink: 0;
}

.email-direction-badge.badge-sent[b-nh3vucn7pi] {
    background: #eef2ff;
    color: #1b4a98;
}

.email-direction-badge.badge-received[b-nh3vucn7pi] {
    background: #e8f5e9;
    color: #2e7d32;
}

.email-received[b-nh3vucn7pi] {
    background: #fafffe;
}

.email-received:hover[b-nh3vucn7pi] {
    background: #f0faf5 !important;
}

.email-list-preview[b-nh3vucn7pi] {
    font-size: 0.75rem;
    color: #9ca3af;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 400px;
}

.email-unread-badge[b-nh3vucn7pi] {
    display: inline-block;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    padding: 0.0625rem 0.375rem;
    background: #2e7d32;
    color: #fff;
    border-radius: 4px;
    letter-spacing: 0.05em;
}

/* ─── Email Detail Viewer ───────────────────────────────────────────── */

.email-detail-backdrop[b-nh3vucn7pi] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.email-detail-modal[b-nh3vucn7pi] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 800px;
    max-height: 90vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.email-detail-header[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.email-detail-header h3[b-nh3vucn7pi] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1b4a98;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.modal-close[b-nh3vucn7pi] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.modal-close:hover[b-nh3vucn7pi] {
    color: #333;
}

.email-detail-meta-bar[b-nh3vucn7pi] {
    padding: 0.75rem 1.5rem;
    background: #f8f9fa;
    border-bottom: 1px solid #e5e7eb;
    font-size: 0.8125rem;
    color: #495057;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.email-detail-body[b-nh3vucn7pi] {
    padding: 1.5rem;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: #333;
    overflow-y: auto;
    flex: 1;
}

/* ─── Stage Progress Bar ───────────────────────────────────────────── */

.stage-bars[b-nh3vucn7pi] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1rem 1.5rem;
    margin-bottom: 1.25rem;
}

.stage-bar-container[b-nh3vucn7pi] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.stage-bar-label[b-nh3vucn7pi] {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-align: center;
}

.stage-bar[b-nh3vucn7pi] {
    display: flex;
    gap: 2px;
    width: 100%;
}

.stage-segment[b-nh3vucn7pi] {
    flex: 1;
    padding: 0.5rem 0.25rem;
    text-align: center;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    border: none;
    background: #e9ecef;
    color: #6c757d;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.stage-segment:first-child[b-nh3vucn7pi] {
    border-radius: 8px 0 0 8px;
}

.stage-segment:last-child[b-nh3vucn7pi] {
    border-radius: 0 8px 8px 0;
}

.stage-segment:only-child[b-nh3vucn7pi] {
    border-radius: 8px;
}

.stage-segment:hover:not(.active):not(:disabled)[b-nh3vucn7pi] {
    background: #dee2e6;
    color: #333;
}

.stage-segment.active[b-nh3vucn7pi] {
    color: #fff;
    font-weight: 600;
    cursor: default;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.stage-segment.is-won:not(.active)[b-nh3vucn7pi] {
    background: #e8f5e9;
    color: #2e7d32;
}

.stage-segment.is-won:not(.active):hover:not(:disabled)[b-nh3vucn7pi] {
    background: #c8e6c9;
}

.stage-segment.is-lost:not(.active)[b-nh3vucn7pi] {
    background: #ffebee;
    color: #c62828;
}

.stage-segment.is-lost:not(.active):hover:not(:disabled)[b-nh3vucn7pi] {
    background: #ffcdd2;
}

.stage-segment:disabled:not(.active)[b-nh3vucn7pi] {
    opacity: 0.6;
    cursor: wait;
}

/* ─── Stage Move Prompt Modal ──────────────────────────────────────── */

.stage-prompt-backdrop[b-nh3vucn7pi] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.stage-prompt-modal[b-nh3vucn7pi] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 600px;
    padding: 1.5rem;
}

.stage-prompt-header[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.stage-prompt-title[b-nh3vucn7pi] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1b4a98;
}

.stage-prompt-message[b-nh3vucn7pi] {
    font-size: 0.875rem;
    color: #6c757d;
    margin-bottom: 1rem;
}

.stage-prompt-actions[b-nh3vucn7pi] {
    display: flex;
    justify-content: flex-end;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.stage-prompt-confirmed[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    font-weight: 500;
    color: #059669;
    padding: 0.5rem 0.75rem;
    background: #ecfdf5;
    border-radius: 6px;
    border: 1px solid #a7f3d0;
    margin-bottom: 0.5rem;
}

/* ─── Follow-Up Task Section (inside post-email prompt) ──────────── */

.followup-section[b-nh3vucn7pi] {
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.followup-label[b-nh3vucn7pi] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.625rem;
}

.followup-options[b-nh3vucn7pi] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.followup-btn[b-nh3vucn7pi] {
    padding: 0.375rem 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background: #fff;
    font-size: 0.8rem;
    font-weight: 500;
    color: #374151;
    cursor: pointer;
    transition: all 0.15s;
}

.followup-btn:hover:not(:disabled)[b-nh3vucn7pi] {
    border-color: #1b4a98;
    color: #1b4a98;
    background: rgba(27, 74, 152, 0.04);
}

.followup-btn.selected[b-nh3vucn7pi] {
    border-color: #1b4a98;
    background: #1b4a98;
    color: #fff;
}

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

.followup-confirmed[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    font-weight: 500;
    color: #059669;
    padding: 0.5rem 0.75rem;
    background: #ecfdf5;
    border-radius: 6px;
    border: 1px solid #a7f3d0;
}

/* ─── Tasks Section (inline on deal view) ──────────────────────────── */

.section-header-row[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f0f0f0;
}

.section-header-row .card-title[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-header-actions[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.deal-task-list[b-nh3vucn7pi] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.deal-task-item[b-nh3vucn7pi] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.8125rem;
}

.deal-task-item:last-child[b-nh3vucn7pi] {
    border-bottom: none;
}

.deal-task-item.overdue[b-nh3vucn7pi] {
    border-left: 3px solid #dc2626;
    padding-left: 0.5rem;
}

.deal-task-item.completed[b-nh3vucn7pi] {
    opacity: 0.55;
}

.deal-check-btn[b-nh3vucn7pi] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #d1d5db;
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    flex-shrink: 0;
    transition: all 0.15s;
}

.deal-check-btn:hover[b-nh3vucn7pi] {
    border-color: #1b4a98;
}

.deal-check-btn.checked[b-nh3vucn7pi] {
    background: #22c55e;
    border-color: #22c55e;
    color: #fff;
}

.deal-task-type[b-nh3vucn7pi] {
    font-size: 0.625rem;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    white-space: nowrap;
    flex-shrink: 0;
}

.type-phone[b-nh3vucn7pi] { background: #dbeafe; color: #1d4ed8; }
.type-email[b-nh3vucn7pi] { background: #fce7f3; color: #be185d; }
.type-sms[b-nh3vucn7pi]   { background: #d1fae5; color: #065f46; }
.type-meeting[b-nh3vucn7pi] { background: #ede9fe; color: #6d28d9; }
.type-todo[b-nh3vucn7pi]  { background: #f3f4f6; color: #4b5563; }

.deal-task-title[b-nh3vucn7pi] {
    flex: 1;
    font-weight: 600;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.deal-task-title.completed-text[b-nh3vucn7pi] {
    text-decoration: line-through;
    color: #9ca3af;
}

.deal-task-assignee[b-nh3vucn7pi] {
    color: #6b7280;
    font-size: 0.75rem;
    white-space: nowrap;
    flex-shrink: 0;
}

.deal-task-due[b-nh3vucn7pi] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6b7280;
    white-space: nowrap;
    flex-shrink: 0;
}

.deal-task-due.overdue-text[b-nh3vucn7pi] {
    color: #dc2626;
    font-weight: 600;
}

.deal-task-actions[b-nh3vucn7pi] {
    display: flex;
    gap: 0.125rem;
    opacity: 0;
    transition: opacity 0.1s;
    flex-shrink: 0;
}

.deal-task-item:hover .deal-task-actions[b-nh3vucn7pi] {
    opacity: 1;
}

.deal-task-action-btn[b-nh3vucn7pi] {
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 3px;
    border-radius: 4px;
    display: flex;
    align-items: center;
}

.deal-task-action-btn:hover[b-nh3vucn7pi] {
    color: #1b4a98;
    background: #f3f4f6;
}

.deal-task-action-btn.danger:hover[b-nh3vucn7pi] {
    color: #dc2626;
    background: #fef2f2;
}
/* /Components/Pages/Crm/Organizations/OrganizationEdit.razor.rz.scp.css */
.form-card[b-539md6mavx] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
}

.form-section-title[b-539md6mavx] {
    font-size: 1rem;
    font-weight: 600;
    color: #1b4a98;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f0f0f0;
}

.form-row[b-539md6mavx] {
    display: flex;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.form-group[b-539md6mavx] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.form-group.flex-2[b-539md6mavx] {
    flex: 2;
}

.form-label[b-539md6mavx] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.25rem;
}

.required[b-539md6mavx] {
    color: #dc3545;
}

.form-hint[b-539md6mavx] {
    font-size: 0.8125rem;
    color: #6c757d;
    margin-bottom: 0.75rem;
}

.form-actions[b-539md6mavx] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 0;
}

/* Contact linking section */
.contact-links-list[b-539md6mavx] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.contact-link-card[b-539md6mavx] {
    background: #f8f9fa;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 0.75rem;
}

.contact-link-header[b-539md6mavx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.primary-toggle[b-539md6mavx] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    color: #495057;
    cursor: pointer;
    white-space: nowrap;
}

.btn-link-remove[b-539md6mavx] {
    background: none;
    border: none;
    color: #dc3545;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 4px;
    line-height: 1;
    transition: background-color 0.15s;
}

.btn-link-remove:hover[b-539md6mavx] {
    background-color: #f8d7da;
}

.contact-link-body[b-539md6mavx] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.inline-row[b-539md6mavx] {
    display: flex;
    gap: 0.75rem;
}

.inline-group[b-539md6mavx] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.inline-label[b-539md6mavx] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6c757d;
    margin-bottom: 0.125rem;
}

.contact-link-actions[b-539md6mavx] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.small[b-539md6mavx] {
    font-size: 0.8125rem;
}
/* /Components/Pages/Crm/Organizations/OrganizationList.razor.rz.scp.css */
.org-cell[b-pgytyrm3tg] {
    display: flex;
    flex-direction: column;
}

.org-name[b-pgytyrm3tg] {
    font-weight: 600;
    color: #333;
}

.org-email[b-pgytyrm3tg] {
    font-size: 0.8125rem;
    color: #6c757d;
}

.badge-info[b-pgytyrm3tg] {
    background-color: #d1ecf1;
    color: #0c5460;
}

.badge-warning[b-pgytyrm3tg] {
    background-color: #fff3cd;
    color: #856404;
}

.badge-primary[b-pgytyrm3tg] {
    background-color: #cce5ff;
    color: #004085;
}

.badge-success[b-pgytyrm3tg] {
    background-color: #d4edda;
    color: #155724;
}

.badge-secondary[b-pgytyrm3tg] {
    background-color: #e2e3e5;
    color: #383d41;
}
/* /Components/Pages/Crm/Organizations/OrganizationView.razor.rz.scp.css */
.view-grid[b-7nlq90lcvx] {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 1.25rem;
    align-items: start;
}

.view-main[b-7nlq90lcvx] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.view-sidebar[b-7nlq90lcvx] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.detail-card[b-7nlq90lcvx] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
}

.detail-card-meta[b-7nlq90lcvx] {
    background: #f8f9fa;
}

.card-title[b-7nlq90lcvx] {
    font-size: 1rem;
    font-weight: 600;
    color: #1b4a98;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-count[b-7nlq90lcvx] {
    background: #e8eef7;
    color: #1b4a98;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
}

.detail-grid[b-7nlq90lcvx] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.detail-item[b-7nlq90lcvx] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-label[b-7nlq90lcvx] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.detail-value[b-7nlq90lcvx] {
    font-size: 0.9375rem;
    color: #333;
}

.detail-link[b-7nlq90lcvx] {
    font-size: 0.9375rem;
    color: #1b4a98;
    text-decoration: none;
}

.detail-link:hover[b-7nlq90lcvx] {
    text-decoration: underline;
}

.address-block[b-7nlq90lcvx] {
    font-size: 0.9375rem;
    color: #333;
    line-height: 1.6;
}

.notes-text[b-7nlq90lcvx] {
    font-size: 0.9375rem;
    color: #333;
    white-space: pre-wrap;
    line-height: 1.6;
    margin: 0;
}

.linked-list[b-7nlq90lcvx] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.linked-item[b-7nlq90lcvx] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.625rem 0.75rem;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    text-decoration: none;
    color: inherit;
    transition: background-color 0.15s, border-color 0.15s;
}

.linked-item:hover[b-7nlq90lcvx] {
    background-color: #f0f4fa;
    border-color: #c0d0e8;
}

.linked-name[b-7nlq90lcvx] {
    font-weight: 600;
    font-size: 0.875rem;
    color: #333;
}

.linked-sub[b-7nlq90lcvx] {
    font-size: 0.8125rem;
    color: #6c757d;
}

.linked-deal-row[b-7nlq90lcvx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.linked-amount[b-7nlq90lcvx] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #495057;
}

.badge-primary-small[b-7nlq90lcvx] {
    background-color: #cce5ff;
    color: #004085;
    font-size: 0.6875rem;
    padding: 0.125rem 0.375rem;
    border-radius: 4px;
    width: fit-content;
}

.badge-info[b-7nlq90lcvx] {
    background-color: #d1ecf1;
    color: #0c5460;
}

.badge-warning[b-7nlq90lcvx] {
    background-color: #fff3cd;
    color: #856404;
}

.badge-primary[b-7nlq90lcvx] {
    background-color: #cce5ff;
    color: #004085;
}

.badge-success[b-7nlq90lcvx] {
    background-color: #d4edda;
    color: #155724;
}

.badge-secondary[b-7nlq90lcvx] {
    background-color: #e2e3e5;
    color: #383d41;
}

.meta-row[b-7nlq90lcvx] {
    display: flex;
    justify-content: space-between;
    padding: 0.375rem 0;
    font-size: 0.8125rem;
    color: #495057;
}

.meta-row + .meta-row[b-7nlq90lcvx] {
    border-top: 1px solid #e5e7eb;
}

.meta-label[b-7nlq90lcvx] {
    font-weight: 500;
    color: #6c757d;
}

.small[b-7nlq90lcvx] {
    font-size: 0.8125rem;
}

@media (max-width: 992px) {
    .view-grid[b-7nlq90lcvx] {
        grid-template-columns: 1fr;
    }
}

/* Work Log Section */
.worklog-section[b-7nlq90lcvx] {
    margin-top: 0;
}

.worklog-summary[b-7nlq90lcvx] {
    display: flex;
    gap: 1.5rem;
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1rem;
}

.worklog-stat[b-7nlq90lcvx] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.worklog-stat-label[b-7nlq90lcvx] {
    font-size: 0.7rem;
    text-transform: uppercase;
    font-weight: 600;
    color: #6c757d;
    letter-spacing: 0.03em;
}

.worklog-stat-value[b-7nlq90lcvx] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1a1a2e;
}

.worklog-list[b-7nlq90lcvx] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.worklog-item[b-7nlq90lcvx] {
    padding: 0.65rem 0.85rem;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    background: #fff;
    transition: border-color 0.15s ease;
}

.worklog-item:hover[b-7nlq90lcvx] {
    border-color: #c5cad0;
}

.worklog-item-top[b-7nlq90lcvx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.25rem;
}

.worklog-item-date[b-7nlq90lcvx] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #495057;
}

.worklog-item-time[b-7nlq90lcvx] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #0d6efd;
    background: #e7f1ff;
    padding: 0.15rem 0.5rem;
    border-radius: 10px;
}

.worklog-item-middle[b-7nlq90lcvx] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    margin-bottom: 0.2rem;
}

.worklog-item-project[b-7nlq90lcvx] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #495057;
}

.worklog-item-staff[b-7nlq90lcvx] {
    font-size: 0.75rem;
    color: #6c757d;
}

.worklog-item-staff[b-7nlq90lcvx]::before {
    content: "·";
    margin-right: 0.75rem;
    color: #ced4da;
}

.worklog-item-desc[b-7nlq90lcvx] {
    font-size: 0.78rem;
    color: #6c757d;
    line-height: 1.4;
}

.worklog-pager[b-7nlq90lcvx] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e9ecef;
}

.worklog-pager-info[b-7nlq90lcvx] {
    font-size: 0.8rem;
    color: #6c757d;
}

.worklog-footer[b-7nlq90lcvx] {
    margin-top: 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e9ecef;
    text-align: center;
}

.worklog-footer .detail-link[b-7nlq90lcvx] {
    font-size: 0.8rem;
}

@media (max-width: 576px) {
    .worklog-summary[b-7nlq90lcvx] {
        flex-direction: column;
        gap: 0.5rem;
    }
}

/* ─── Inline Tasks Section ─────────────────────────────────────────── */

.section-header-row[b-7nlq90lcvx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f0f0f0;
}

.section-header-row .card-title[b-7nlq90lcvx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-header-actions[b-7nlq90lcvx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.count-badge[b-7nlq90lcvx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.5rem;
    height: 1.5rem;
    padding: 0 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #fff;
    background: #6c757d;
    border-radius: 999px;
}

.inline-task-list[b-7nlq90lcvx] {
    display: flex;
    flex-direction: column;
}

.inline-task-item[b-7nlq90lcvx] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.8125rem;
}

.inline-task-item:last-child[b-7nlq90lcvx] {
    border-bottom: none;
}

.inline-task-item.overdue[b-7nlq90lcvx] {
    border-left: 3px solid #dc2626;
    padding-left: 0.5rem;
}

.inline-task-item.completed[b-7nlq90lcvx] {
    opacity: 0.55;
}

.inline-check-btn[b-7nlq90lcvx] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #d1d5db;
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    flex-shrink: 0;
    transition: all 0.15s;
}

.inline-check-btn:hover[b-7nlq90lcvx] {
    border-color: #1b4a98;
}

.inline-check-btn.checked[b-7nlq90lcvx] {
    background: #22c55e;
    border-color: #22c55e;
    color: #fff;
}

.inline-task-type[b-7nlq90lcvx] {
    font-size: 0.625rem;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    white-space: nowrap;
    flex-shrink: 0;
}

.type-phone[b-7nlq90lcvx] { background: #dbeafe; color: #1d4ed8; }
.type-email[b-7nlq90lcvx] { background: #fce7f3; color: #be185d; }
.type-sms[b-7nlq90lcvx]   { background: #d1fae5; color: #065f46; }
.type-meeting[b-7nlq90lcvx] { background: #ede9fe; color: #6d28d9; }
.type-todo[b-7nlq90lcvx]  { background: #f3f4f6; color: #4b5563; }

.inline-task-title[b-7nlq90lcvx] {
    flex: 1;
    font-weight: 600;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.inline-task-title.completed-text[b-7nlq90lcvx] {
    text-decoration: line-through;
    color: #9ca3af;
}

.inline-task-assignee[b-7nlq90lcvx] {
    color: #6b7280;
    font-size: 0.75rem;
    white-space: nowrap;
    flex-shrink: 0;
}

.inline-task-due[b-7nlq90lcvx] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #6b7280;
    white-space: nowrap;
    flex-shrink: 0;
}

.inline-task-due.overdue-text[b-7nlq90lcvx] {
    color: #dc2626;
    font-weight: 600;
}

.inline-task-actions[b-7nlq90lcvx] {
    display: flex;
    gap: 0.125rem;
    opacity: 0;
    transition: opacity 0.1s;
    flex-shrink: 0;
}

.inline-task-item:hover .inline-task-actions[b-7nlq90lcvx] {
    opacity: 1;
}

.inline-task-action-btn[b-7nlq90lcvx] {
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 3px;
    border-radius: 4px;
    display: flex;
    align-items: center;
}

.inline-task-action-btn:hover[b-7nlq90lcvx] {
    color: #1b4a98;
    background: #f3f4f6;
}

.inline-task-action-btn.danger:hover[b-7nlq90lcvx] {
    color: #dc2626;
    background: #fef2f2;
}
/* /Components/Pages/Crm/Pipelines/PipelineBulkEmail.razor.rz.scp.css */
/* Bulk Email Modal — Backdrop & Container */
.bulk-email-backdrop[b-mtu4scz4ho] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.bulk-email-modal[b-mtu4scz4ho] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 800px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Header */
.modal-header[b-mtu4scz4ho] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e5e7eb;
    background: linear-gradient(135deg, #1b4a98, #2563eb);
    color: #fff;
}

.modal-header h3[b-mtu4scz4ho] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.modal-close[b-mtu4scz4ho] {
    background: rgba(255, 255, 255, 0.15);
    border: none;
    color: #fff;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 6px;
    display: flex;
    align-items: center;
    transition: background 0.15s;
}

.modal-close:hover[b-mtu4scz4ho] {
    background: rgba(255, 255, 255, 0.3);
}

/* Step Indicator */
.step-indicator[b-mtu4scz4ho] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 1.25rem;
    gap: 0.5rem;
    border-bottom: 1px solid #f1f5f9;
    background: #f8fafc;
}

.step[b-mtu4scz4ho] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    color: #94a3b8;
    font-size: 0.82rem;
}

.step.active[b-mtu4scz4ho] {
    color: #1b4a98;
    font-weight: 600;
}

.step.completed[b-mtu4scz4ho] {
    color: #16a34a;
}

.step-number[b-mtu4scz4ho] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 2px solid currentColor;
    font-size: 0.72rem;
    font-weight: 700;
}

.step.active .step-number[b-mtu4scz4ho] {
    background: #1b4a98;
    border-color: #1b4a98;
    color: #fff;
}

.step.completed .step-number[b-mtu4scz4ho] {
    background: #16a34a;
    border-color: #16a34a;
    color: #fff;
}

.step-label[b-mtu4scz4ho] {
    font-size: 0.82rem;
}

.step-line[b-mtu4scz4ho] {
    width: 40px;
    height: 2px;
    background: #e2e8f0;
    border-radius: 1px;
}

.step-line.active[b-mtu4scz4ho] {
    background: #1b4a98;
}

/* Body */
.modal-body[b-mtu4scz4ho] {
    flex: 1;
    overflow-y: auto;
    padding: 1.25rem;
}

/* Footer */
.modal-footer[b-mtu4scz4ho] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 1rem 1.25rem;
    border-top: 1px solid #e5e7eb;
    background: #f8fafc;
}

/* Alert */
.alert-error[b-mtu4scz4ho] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    color: #dc2626;
    font-size: 0.875rem;
    margin-bottom: 1rem;
}

/* ─── Step 1: Config Form ─────────────────────────────────────────── */
.config-section[b-mtu4scz4ho] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

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

.form-label[b-mtu4scz4ho] {
    font-weight: 600;
    font-size: 0.875rem;
    color: #1e293b;
}

.form-help[b-mtu4scz4ho] {
    font-size: 0.78rem;
    color: #64748b;
    margin: 0;
}

.form-select[b-mtu4scz4ho] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.875rem;
    color: #1e293b;
    background: #fff;
    transition: border-color 0.15s;
    max-width: 400px;
}

.form-select:focus[b-mtu4scz4ho] {
    outline: none;
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

.toggle-label[b-mtu4scz4ho] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}

.toggle-label input[type="checkbox"][b-mtu4scz4ho] {
    width: 16px;
    height: 16px;
    accent-color: #1b4a98;
}

.follow-up-config[b-mtu4scz4ho] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.35rem;
    padding-left: 1.5rem;
}

.form-label-sm[b-mtu4scz4ho] {
    font-size: 0.82rem;
    color: #475569;
    white-space: nowrap;
}

.form-input-sm[b-mtu4scz4ho] {
    width: 80px;
    padding: 0.35rem 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.875rem;
    text-align: center;
}

.form-input-sm:focus[b-mtu4scz4ho] {
    outline: none;
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

/* ─── Step 2: Preview ─────────────────────────────────────────────── */
.preview-summary[b-mtu4scz4ho] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.summary-stat[b-mtu4scz4ho] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.75rem;
    border-radius: 20px;
    font-size: 0.82rem;
    font-weight: 500;
}

.summary-stat.ready[b-mtu4scz4ho] {
    background: #dcfce7;
    color: #15803d;
}

.summary-stat.skipped[b-mtu4scz4ho] {
    background: #fef3c7;
    color: #92400e;
}

.summary-stat.info[b-mtu4scz4ho] {
    background: #dbeafe;
    color: #1d4ed8;
}

.summary-count[b-mtu4scz4ho] {
    font-weight: 700;
}

.preview-actions-bar[b-mtu4scz4ho] {
    display: flex;
    gap: 0.35rem;
    margin-bottom: 0.75rem;
}

.preview-list[b-mtu4scz4ho] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 400px;
    overflow-y: auto;
}

.preview-item[b-mtu4scz4ho] {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    transition: border-color 0.15s;
}

.preview-item.selected[b-mtu4scz4ho] {
    border-color: #93c5fd;
}

.preview-item.no-email[b-mtu4scz4ho] {
    opacity: 0.6;
    background: #f9fafb;
}

.preview-item-header[b-mtu4scz4ho] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0.75rem;
}

.preview-item-header input[type="checkbox"][b-mtu4scz4ho] {
    width: 16px;
    height: 16px;
    accent-color: #1b4a98;
    flex-shrink: 0;
}

.no-email-badge[b-mtu4scz4ho] {
    color: #dc2626;
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.preview-item-info[b-mtu4scz4ho] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1;
}

.preview-deal-title[b-mtu4scz4ho] {
    font-weight: 600;
    font-size: 0.85rem;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.preview-recipient[b-mtu4scz4ho] {
    font-size: 0.78rem;
    color: #64748b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.preview-item-subject[b-mtu4scz4ho] {
    font-size: 0.8rem;
    color: #475569;
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 0;
}

.btn-icon[b-mtu4scz4ho] {
    background: none;
    border: none;
    color: #64748b;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 4px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    transition: color 0.15s, background 0.15s;
}

.btn-icon:hover[b-mtu4scz4ho] {
    color: #1b4a98;
    background: #f1f5f9;
}

.preview-body-container[b-mtu4scz4ho] {
    border-top: 1px solid #e5e7eb;
    padding: 0.75rem;
    background: #f8fafc;
}

.preview-body-frame[b-mtu4scz4ho] {
    width: 100%;
    height: 250px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #fff;
}

/* ─── Step 3: Results ─────────────────────────────────────────────── */
.results-section[b-mtu4scz4ho] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 1rem 0;
}

.results-icon[b-mtu4scz4ho] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.results-title[b-mtu4scz4ho] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #1e293b;
    text-align: center;
}

.results-stats[b-mtu4scz4ho] {
    display: flex;
    gap: 1.5rem;
    margin-top: 0.5rem;
}

.result-stat[b-mtu4scz4ho] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
}

.result-stat-count[b-mtu4scz4ho] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1b4a98;
}

.result-stat-label[b-mtu4scz4ho] {
    font-size: 0.78rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.results-errors[b-mtu4scz4ho] {
    width: 100%;
    max-width: 500px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    margin-top: 0.5rem;
}

.results-errors h5[b-mtu4scz4ho] {
    margin: 0 0 0.5rem 0;
    color: #dc2626;
    font-size: 0.875rem;
}

.results-errors ul[b-mtu4scz4ho] {
    margin: 0;
    padding-left: 1.25rem;
    font-size: 0.82rem;
    color: #991b1b;
}

.results-errors li[b-mtu4scz4ho] {
    margin-bottom: 0.25rem;
}

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

@keyframes spin-b-mtu4scz4ho {
    to { transform: rotate(360deg); }
}
/* /Components/Pages/Crm/Pipelines/PipelineList.razor.rz.scp.css */
/* Pipeline Cards Grid */
.pipeline-cards[b-tuudux13da] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1.25rem;
}

.pipeline-card[b-tuudux13da] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.2s, box-shadow 0.2s;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pipeline-card:hover[b-tuudux13da] {
    border-color: #1b4a98;
    box-shadow: 0 4px 12px rgba(27, 74, 152, 0.1);
}

.pipeline-card-inactive[b-tuudux13da] {
    opacity: 0.6;
}

.pipeline-card-header[b-tuudux13da] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.pipeline-card-header h3[b-tuudux13da] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
}

.pipeline-card-desc[b-tuudux13da] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0;
    line-height: 1.4;
}

.pipeline-card-stats[b-tuudux13da] {
    display: flex;
    gap: 1rem;
    margin-top: auto;
    padding-top: 0.75rem;
    border-top: 1px solid #f0f0f0;
}

.pipeline-stat[b-tuudux13da] {
    text-align: center;
    flex: 1;
}

.pipeline-stat-number[b-tuudux13da] {
    display: block;
    font-size: 1.1rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.2;
}

.pipeline-stat-label[b-tuudux13da] {
    display: block;
    font-size: 0.7rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 0.15rem;
}

.badge-sm[b-tuudux13da] {
    font-size: 0.7rem;
    padding: 0.15rem 0.4rem;
}
/* /Components/Pages/Crm/Pipelines/PipelineView.razor.rz.scp.css */
/* View Toggle */
.view-toggle[b-j927q95kdm] {
    display: flex;
    gap: 0.25rem;
}

/* Search Bar */
.pipeline-search[b-j927q95kdm] {
    margin-bottom: 1rem;
}

.search-input-wrapper[b-j927q95kdm] {
    position: relative;
    max-width: 400px;
}

.search-icon[b-j927q95kdm] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
    pointer-events: none;
}

.search-input[b-j927q95kdm] {
    width: 100%;
    padding: 0.5rem 0.75rem 0.5rem 2.25rem;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 0.875rem;
    color: #1e293b;
    background: #fff;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.search-input[b-j927q95kdm]::placeholder {
    color: #94a3b8;
}

.search-input:focus[b-j927q95kdm] {
    outline: none;
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

/* Kanban Board */
.kanban-board[b-j927q95kdm] {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    padding-bottom: 1rem;
    min-height: 400px;
    max-width: 100%;
}

.kanban-column[b-j927q95kdm] {
    flex: 0 0 280px;
    background: #f8fafc;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 200px);
}

.kanban-column-header[b-j927q95kdm] {
    padding: 0.75rem 1rem;
    border-top: 3px solid #6b7280;
    border-radius: 10px 10px 0 0;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
}

.kanban-column-title[b-j927q95kdm] {
    display: block;
    font-weight: 600;
    font-size: 0.9rem;
    color: #1e293b;
}

.kanban-column-count[b-j927q95kdm] {
    display: block;
    font-size: 0.75rem;
    color: #64748b;
    margin-top: 0.15rem;
}

.kanban-column-body[b-j927q95kdm] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Kanban Cards */
.kanban-card[b-j927q95kdm] {
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    padding: 0.75rem;
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.15s, border-color 0.15s;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    cursor: grab;
}

.kanban-card:hover[b-j927q95kdm] {
    border-color: #1b4a98;
    box-shadow: 0 2px 8px rgba(27, 74, 152, 0.12);
}

.kanban-card.dragging[b-j927q95kdm] {
    opacity: 0.4;
    cursor: grabbing;
}

/* Drop Target */
.kanban-column-body.drop-target[b-j927q95kdm] {
    background: rgba(27, 74, 152, 0.05);
    outline: 2px dashed rgba(27, 74, 152, 0.35);
    outline-offset: -2px;
    border-radius: 0 0 8px 8px;
}

.kanban-card-title[b-j927q95kdm] {
    font-weight: 600;
    font-size: 0.85rem;
    color: #1e293b;
    line-height: 1.3;
}

.kanban-card-amount[b-j927q95kdm] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #1b4a98;
}

.kanban-card-org[b-j927q95kdm],
.kanban-card-contact[b-j927q95kdm] {
    font-size: 0.78rem;
    color: #64748b;
}

.kanban-card-tags[b-j927q95kdm] {
    margin-top: 0.25rem;
}

.kanban-empty[b-j927q95kdm] {
    text-align: center;
    font-size: 0.8rem;
    color: #94a3b8;
    padding: 1.5rem 0;
}

.badge-sm[b-j927q95kdm] {
    font-size: 0.7rem;
    padding: 0.15rem 0.4rem;
}
/* /Components/Pages/Crm/Shared/CrmActivityTimeline.razor.rz.scp.css */
/* CRM Activity Timeline Component Styles */

.activity-section[b-2xrls26ab0] {
    margin-top: 1.5rem;
}

.activity-header[b-2xrls26ab0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

    .activity-header .card-title[b-2xrls26ab0] {
        margin: 0;
    }

.activity-controls[b-2xrls26ab0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.scope-toggle[b-2xrls26ab0] {
    display: inline-flex;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    overflow: hidden;
}

.scope-btn[b-2xrls26ab0] {
    background: #fff;
    border: none;
    padding: 0.3rem 0.75rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    transition: all 0.15s ease;
}

    .scope-btn:not(:last-child)[b-2xrls26ab0] {
        border-right: 1px solid #e2e8f0;
    }

    .scope-btn:hover[b-2xrls26ab0] {
        background: #f8fafc;
        color: #334155;
    }

.scope-btn-active[b-2xrls26ab0] {
    background: #2563eb;
    color: #fff;
}

    .scope-btn-active:hover[b-2xrls26ab0] {
        background: #1d4ed8;
        color: #fff;
    }

.activity-filter[b-2xrls26ab0] {
    width: auto;
    min-width: 140px;
}

/* Timeline */
.timeline[b-2xrls26ab0] {
    position: relative;
    padding-left: 2.5rem;
}

    .timeline[b-2xrls26ab0]::before {
        content: '';
        position: absolute;
        left: 15px;
        top: 0;
        bottom: 0;
        width: 2px;
        background: #e2e8f0;
    }

.timeline-item[b-2xrls26ab0] {
    position: relative;
    padding-bottom: 1.25rem;
    display: flex;
    gap: 0.75rem;
}

    .timeline-item:last-child[b-2xrls26ab0] {
        padding-bottom: 0;
    }

.timeline-icon[b-2xrls26ab0] {
    position: absolute;
    left: -2.5rem;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e2e8f0;
    color: #64748b;
    flex-shrink: 0;
    z-index: 1;
}

.timeline-icon-phonecall[b-2xrls26ab0] {
    background: #dbeafe;
    color: #2563eb;
}

.timeline-icon-email[b-2xrls26ab0] {
    background: #fce7f3;
    color: #db2777;
}

.timeline-icon-meeting[b-2xrls26ab0] {
    background: #d1fae5;
    color: #059669;
}

.timeline-icon-text[b-2xrls26ab0] {
    background: #e0e7ff;
    color: #4f46e5;
}

.timeline-icon-note[b-2xrls26ab0] {
    background: #fef3c7;
    color: #d97706;
}

.timeline-content[b-2xrls26ab0] {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    flex: 1;
    min-width: 0;
}

.timeline-top[b-2xrls26ab0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.25rem;
}

.timeline-type[b-2xrls26ab0] {
    font-weight: 600;
    font-size: 0.8rem;
    color: #334155;
}

.timeline-direction[b-2xrls26ab0] {
    font-size: 0.7rem;
    font-weight: 500;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.timeline-direction-inbound[b-2xrls26ab0] {
    background: #dbeafe;
    color: #1e40af;
}

.timeline-direction-outbound[b-2xrls26ab0] {
    background: #d1fae5;
    color: #065f46;
}

.timeline-duration[b-2xrls26ab0] {
    font-size: 0.75rem;
    color: #64748b;
}

.timeline-date[b-2xrls26ab0] {
    font-size: 0.75rem;
    color: #94a3b8;
    margin-left: auto;
}

.timeline-subject[b-2xrls26ab0] {
    font-weight: 500;
    color: #1e293b;
    margin-bottom: 0.25rem;
}

.timeline-description[b-2xrls26ab0] {
    font-size: 0.875rem;
    color: #475569;
    white-space: pre-line;
    margin-bottom: 0.25rem;
}

.timeline-meta[b-2xrls26ab0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.75rem;
    color: #94a3b8;
}

.timeline-owner[b-2xrls26ab0] {
    font-style: italic;
}

.timeline-link[b-2xrls26ab0] {
    color: #2563eb;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
}

    .timeline-link:hover[b-2xrls26ab0] {
        text-decoration: underline;
    }

.timeline-actions[b-2xrls26ab0] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.timeline-content:hover .timeline-actions[b-2xrls26ab0] {
    opacity: 1;
}

.btn-timeline-action[b-2xrls26ab0] {
    background: none;
    border: none;
    font-size: 0.75rem;
    color: #64748b;
    cursor: pointer;
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
}

    .btn-timeline-action:hover[b-2xrls26ab0] {
        background: #f1f5f9;
        color: #334155;
    }

.btn-timeline-delete:hover[b-2xrls26ab0] {
    background: #fee2e2;
    color: #dc2626;
}

/* Modal styles (using custom class names per project conventions) */
.activity-backdrop[b-2xrls26ab0] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.activity-modal[b-2xrls26ab0] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 600px;
    max-height: 90vh;
    overflow-y: auto;
}

.activity-modal-sm[b-2xrls26ab0] {
    max-width: 420px;
}

.activity-modal .modal-header[b-2xrls26ab0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e2e8f0;
}

    .activity-modal .modal-header h4[b-2xrls26ab0] {
        margin: 0;
        font-size: 1.1rem;
        font-weight: 600;
    }

.activity-modal .modal-close[b-2xrls26ab0] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #94a3b8;
    cursor: pointer;
    line-height: 1;
}

    .activity-modal .modal-close:hover[b-2xrls26ab0] {
        color: #334155;
    }

.activity-modal .modal-body[b-2xrls26ab0] {
    padding: 1.25rem 1.5rem;
}

.activity-modal .modal-footer[b-2xrls26ab0] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e2e8f0;
}

.form-row[b-2xrls26ab0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-group[b-2xrls26ab0] {
    margin-bottom: 1rem;
}

    .form-group label[b-2xrls26ab0] {
        display: block;
        font-weight: 500;
        font-size: 0.875rem;
        color: #334155;
        margin-bottom: 0.35rem;
    }
/* /Components/Pages/Crm/Shared/CrmComposeEmail.razor.rz.scp.css */
.compose-backdrop[b-6g9r058ujs] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.compose-modal[b-6g9r058ujs] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 800px;
    max-height: 90vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.modal-header[b-6g9r058ujs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.modal-header h3[b-6g9r058ujs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 600;
    color: #1b4a98;
    margin: 0;
}

.modal-close[b-6g9r058ujs] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.modal-close:hover[b-6g9r058ujs] {
    color: #333;
}

.modal-body[b-6g9r058ujs] {
    padding: 1.5rem;
    flex: 1;
    overflow-y: auto;
}

.modal-footer[b-6g9r058ujs] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e5e7eb;
}

.compose-row[b-6g9r058ujs] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
}

.form-group[b-6g9r058ujs] {
    display: flex;
    flex-direction: column;
}

.form-label[b-6g9r058ujs] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.375rem;
}

.form-control[b-6g9r058ujs],
.form-select[b-6g9r058ujs] {
    font-size: 0.875rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    transition: border-color 0.15s;
}

.form-control:focus[b-6g9r058ujs],
.form-select:focus[b-6g9r058ujs] {
    border-color: #1b4a98;
    outline: none;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

.merge-tag-chips[b-6g9r058ujs] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.375rem;
    margin-bottom: 0.5rem;
}

.merge-tag-chips-sm[b-6g9r058ujs] {
    margin-top: 0.375rem;
    margin-bottom: 0;
}

.merge-tag-chips-label[b-6g9r058ujs] {
    font-size: 0.75rem;
    color: #6c757d;
    font-weight: 500;
}

.merge-tag-chip[b-6g9r058ujs] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.5rem;
    font-size: 0.75rem;
    font-family: 'SFMono-Regular', Consolas, monospace;
    background: #eef2ff;
    color: #1b4a98;
    border: 1px solid #c7d2fe;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.15s;
}

.merge-tag-chip:hover[b-6g9r058ujs] {
    background: #dbeafe;
}

.merge-tag-chip-system[b-6g9r058ujs] {
    background: #fef3cd;
    color: #856404;
    border-color: #f5c76b;
}

.merge-tag-chip-system:hover[b-6g9r058ujs] {
    background: #fde68a;
}

.compose-sender-info[b-6g9r058ujs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
    font-size: 0.8125rem;
    color: #6c757d;
}

.spinner-sm[b-6g9r058ujs] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-6g9r058ujs 0.6s linear infinite;
    margin-right: 0.375rem;
}

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

[b-6g9r058ujs] .rz-html-editor {
    border-radius: 8px !important;
    border: 1px solid #d1d5db !important;
}

[b-6g9r058ujs] .rz-html-editor:focus-within {
    border-color: #1b4a98 !important;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1) !important;
}

@media (max-width: 640px) {
    .compose-modal[b-6g9r058ujs] {
        width: 95%;
        max-height: 95vh;
    }

    .compose-row[b-6g9r058ujs] {
        flex-direction: column;
        gap: 0;
    }
}
/* /Components/Pages/Crm/Shared/CrmTagBadge.razor.rz.scp.css */
.crm-tag-badge[b-coydcxe55p] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 9999px;
    font-size: 0.7rem;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
    margin-right: 4px;
    margin-bottom: 2px;
}
/* /Components/Pages/Crm/Shared/CrmTagPicker.razor.rz.scp.css */
.tag-picker[b-xb0rgjjyzi] {
    position: relative;
    display: inline-block;
}

.tag-picker-current[b-xb0rgjjyzi] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}

.tag-picker-empty[b-xb0rgjjyzi] {
    color: #94a3b8;
    font-size: 0.85rem;
    font-style: italic;
}

.crm-tag-badge[b-xb0rgjjyzi] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 9999px;
    font-size: 0.7rem;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
}

.tag-remove-btn[b-xb0rgjjyzi] {
    background: none;
    border: none;
    padding: 0;
    margin: 0 0 0 2px;
    cursor: pointer;
    font-size: 0.85rem;
    line-height: 1;
    opacity: 0.7;
    color: inherit;
}

    .tag-remove-btn:hover[b-xb0rgjjyzi] {
        opacity: 1;
    }

.tag-add-btn[b-xb0rgjjyzi] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 10px;
    border: 1px dashed #cbd5e1;
    border-radius: 9999px;
    background: transparent;
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

    .tag-add-btn:hover[b-xb0rgjjyzi] {
        border-color: #3b82f6;
        color: #3b82f6;
        background: #eff6ff;
    }

.tag-picker-backdrop[b-xb0rgjjyzi] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1040;
}

.tag-picker-dropdown[b-xb0rgjjyzi] {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 4px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    min-width: 180px;
    max-height: 200px;
    overflow-y: auto;
    z-index: 1050;
    padding: 4px;
}

.tag-picker-option[b-xb0rgjjyzi] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 6px 10px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 0.85rem;
    border-radius: 4px;
    color: #334155;
    text-align: left;
}

    .tag-picker-option:hover[b-xb0rgjjyzi] {
        background: #f1f5f9;
    }

.tag-color-dot[b-xb0rgjjyzi] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.tag-picker-empty-dropdown[b-xb0rgjjyzi] {
    padding: 12px;
    text-align: center;
    color: #94a3b8;
    font-size: 0.85rem;
}
/* /Components/Pages/Crm/Shared/CrmTaskModal.razor.rz.scp.css */
.task-modal-backdrop[b-ieyqidwvh0] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
}

.task-modal[b-ieyqidwvh0] {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 640px;
    max-height: 90vh;
    overflow-y: auto;
}

.task-modal .modal-header[b-ieyqidwvh0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.task-modal .modal-header h3[b-ieyqidwvh0] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 700;
    color: #1f2937;
}

.task-modal .modal-close[b-ieyqidwvh0] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.task-modal .modal-close:hover[b-ieyqidwvh0] {
    color: #1f2937;
}

.task-modal .modal-body[b-ieyqidwvh0] {
    padding: 1.5rem;
}

.task-modal .form-row[b-ieyqidwvh0] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
}

.task-modal .form-group[b-ieyqidwvh0] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-bottom: 1rem;
}

.task-modal .form-group label[b-ieyqidwvh0] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #374151;
}

.task-modal .form-control[b-ieyqidwvh0] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.875rem;
    transition: border-color 0.15s;
}

.task-modal .form-control:focus[b-ieyqidwvh0] {
    outline: none;
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

.task-modal .flex-1[b-ieyqidwvh0] {
    flex: 1;
}

.task-modal .flex-2[b-ieyqidwvh0] {
    flex: 2;
}

.task-modal .modal-footer[b-ieyqidwvh0] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
    margin-top: 0.5rem;
}

.task-modal .spinner-sm[b-ieyqidwvh0] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid #e5e7eb;
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-ieyqidwvh0 0.6s linear infinite;
    margin-right: 0.25rem;
}

.due-shortcuts[b-ieyqidwvh0] {
    display: flex;
    gap: 0.375rem;
    margin-top: 0.375rem;
}

.due-shortcut[b-ieyqidwvh0] {
    padding: 0.125rem 0.5rem;
    font-size: 0.6875rem;
    font-weight: 500;
    color: #1b4a98;
    background: #eef2ff;
    border: 1px solid #c7d2fe;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}

.due-shortcut:hover[b-ieyqidwvh0] {
    background: #1b4a98;
    color: #fff;
    border-color: #1b4a98;
}

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

.task-modal .validation-message[b-ieyqidwvh0] {
    font-size: 0.75rem;
    color: #dc2626;
}
/* /Components/Pages/Crm/Tasks/TaskList.razor.rz.scp.css */
.page-header[b-x64upbrztp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.5rem;
}

.page-header h1[b-x64upbrztp] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0;
}

.loading-container[b-x64upbrztp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 2rem;
    color: #6b7280;
    font-size: 0.875rem;
}

/* ── Stats Cards ──────────────────────────────────────────── */
.task-stats-grid[b-x64upbrztp] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 1.25rem;
}

.task-stat-card[b-x64upbrztp] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 16px;
    text-align: center;
}

.task-stat-value[b-x64upbrztp] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1f2937;
    line-height: 1;
    margin-bottom: 4px;
}

.task-stat-label[b-x64upbrztp] {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.stat-overdue .task-stat-value[b-x64upbrztp] {
    color: #dc2626;
}

.stat-overdue[b-x64upbrztp] {
    border-color: #fecaca;
    background: #fef2f2;
}

.stat-this-week .task-stat-value[b-x64upbrztp] {
    color: #2563eb;
}

.stat-this-week[b-x64upbrztp] {
    border-color: #bfdbfe;
    background: #eff6ff;
}

.stat-next-week .task-stat-value[b-x64upbrztp] {
    color: #7c3aed;
}

.stat-next-week[b-x64upbrztp] {
    border-color: #ddd6fe;
    background: #f5f3ff;
}

.stat-completed .task-stat-value[b-x64upbrztp] {
    color: #16a34a;
}

.stat-completed[b-x64upbrztp] {
    border-color: #bbf7d0;
    background: #f0fdf4;
}

/* ── Bulk Actions ────────────────────────────────────────── */
.bulk-actions[b-x64upbrztp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 10px 14px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    margin-bottom: 1rem;
}

.bulk-confirm-text[b-x64upbrztp] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #374151;
    margin-right: 0.25rem;
}

/* ── Filters ──────────────────────────────────────────────── */
.task-filters[b-x64upbrztp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.filter-group[b-x64upbrztp] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.filter-label[b-x64upbrztp] {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.filter-select[b-x64upbrztp] {
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    color: #374151;
    background: #fff;
}

.filter-select:focus[b-x64upbrztp] {
    outline: none;
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

@media (max-width: 768px) {
    .task-filters[b-x64upbrztp] {
        flex-wrap: wrap;
    }
}

/* ── Empty State ──────────────────────────────────────────── */
.empty-state[b-x64upbrztp] {
    text-align: center;
    padding: 3rem 1rem;
    color: #9ca3af;
}

.empty-state .empty-icon[b-x64upbrztp] {
    margin-bottom: 1rem;
    opacity: 0.5;
}

.empty-state h3[b-x64upbrztp] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #6b7280;
    margin: 0 0 0.5rem;
}

.empty-state p[b-x64upbrztp] {
    font-size: 0.875rem;
    margin: 0;
}

/* ── Task List ────────────────────────────────────────────── */
.task-list[b-x64upbrztp] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: #f9fafb;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
}

.task-item[b-x64upbrztp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    background: #fff;
    transition: background 0.1s ease-in-out;
}

.task-item:hover[b-x64upbrztp] {
    background: #f9fafb;
}

.task-item.overdue[b-x64upbrztp] {
    border-left: 3px solid #dc2626;
}

.task-item.completed[b-x64upbrztp] {
    opacity: 0.6;
}

/* ── Checkbox ─────────────────────────────────────────────── */
.task-check[b-x64upbrztp] {
    flex-shrink: 0;
}

.check-btn[b-x64upbrztp] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 2px solid #d1d5db;
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease-in-out;
    padding: 0;
}

.check-btn:hover[b-x64upbrztp] {
    border-color: #1b4a98;
    background: #eff6ff;
}

.check-btn.checked[b-x64upbrztp] {
    background: #22c55e;
    border-color: #22c55e;
    color: #fff;
}

.check-btn.checked:hover[b-x64upbrztp] {
    background: #16a34a;
    border-color: #16a34a;
}

/* ── Main Content ─────────────────────────────────────────── */
.task-main[b-x64upbrztp] {
    flex: 1;
    min-width: 0;
}

.task-title-row[b-x64upbrztp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.task-title[b-x64upbrztp] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.task-title.completed-text[b-x64upbrztp] {
    text-decoration: line-through;
    color: #9ca3af;
}

/* ── Type Badges ──────────────────────────────────────────── */
.task-type-badge[b-x64upbrztp] {
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    white-space: nowrap;
    flex-shrink: 0;
}

.type-phone[b-x64upbrztp] {
    background: #dbeafe;
    color: #1d4ed8;
}

.type-email[b-x64upbrztp] {
    background: #fce7f3;
    color: #be185d;
}

.type-sms[b-x64upbrztp] {
    background: #d1fae5;
    color: #065f46;
}

.type-meeting[b-x64upbrztp] {
    background: #ede9fe;
    color: #6d28d9;
}

.type-todo[b-x64upbrztp] {
    background: #f3f4f6;
    color: #4b5563;
}

/* ── Priority Badge ───────────────────────────────────────── */
.priority-badge[b-x64upbrztp] {
    font-size: 0.625rem;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 4px;
    text-transform: uppercase;
    flex-shrink: 0;
}

.priority-badge.high[b-x64upbrztp] {
    background: #fef2f2;
    color: #dc2626;
}

/* ── Task Meta ────────────────────────────────────────────── */
.task-meta[b-x64upbrztp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.75rem;
    color: #9ca3af;
}

.task-assignee[b-x64upbrztp] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.task-link[b-x64upbrztp] {
    color: #1b4a98;
    text-decoration: none;
    font-weight: 500;
}

.task-link:hover[b-x64upbrztp] {
    text-decoration: underline;
}

.link-label[b-x64upbrztp] {
    color: #9ca3af;
    font-weight: 400;
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ── Right Side (Date + Actions) ──────────────────────────── */
.task-right[b-x64upbrztp] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-shrink: 0;
}

.task-due[b-x64upbrztp] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #6b7280;
    white-space: nowrap;
}

.task-due.overdue-text[b-x64upbrztp] {
    color: #dc2626;
    font-weight: 600;
}

.task-actions[b-x64upbrztp] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    opacity: 0;
    transition: opacity 0.1s ease-in-out;
}

.task-item:hover .task-actions[b-x64upbrztp] {
    opacity: 1;
}

.action-btn[b-x64upbrztp] {
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease-in-out;
}

.action-btn:hover[b-x64upbrztp] {
    background: #f3f4f6;
    color: #1b4a98;
}

.action-btn.danger:hover[b-x64upbrztp] {
    background: #fef2f2;
    color: #dc2626;
}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 640px) {
    .task-stats-grid[b-x64upbrztp] {
        grid-template-columns: repeat(3, 1fr);
    }

    .task-item[b-x64upbrztp] {
        flex-wrap: wrap;
    }

    .task-right[b-x64upbrztp] {
        width: 100%;
        justify-content: space-between;
        padding-left: 2.5rem;
    }

    .task-actions[b-x64upbrztp] {
        opacity: 1;
    }

    .task-meta[b-x64upbrztp] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Customers/CustomerEdit.razor.rz.scp.css */
/* Form wrapper — no outer card; sections provide their own cards */
.edit-form-wrapper[b-8d3o3pokbd] {
    max-width: none;
}

.form-grid[b-8d3o3pokbd] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

/* Form Sections */
.form-section[b-8d3o3pokbd] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.form-section.full-width[b-8d3o3pokbd] {
    grid-column: 1 / -1;
}

/* Section Headers — colored bars with icons */
.section-header[b-8d3o3pokbd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    border-radius: 6px;
    border-bottom: none;
    color: white;
}

.section-header svg[b-8d3o3pokbd] {
    flex-shrink: 0;
    color: white;
    stroke: white;
}

.section-basic[b-8d3o3pokbd] {
    background: linear-gradient(135deg, #1b4a98, #2d6fd6);
}

.section-contact[b-8d3o3pokbd] {
    background: linear-gradient(135deg, #0d7c5f, #17a87a);
}

.section-address[b-8d3o3pokbd] {
    background: linear-gradient(135deg, #2c3e50, #4a6785);
}

.section-billing[b-8d3o3pokbd] {
    background: linear-gradient(135deg, #7c5c1e, #b8860b);
}

.section-account[b-8d3o3pokbd] {
    background: linear-gradient(135deg, #6f42c1, #8e5cd9);
}

.section-worklog[b-8d3o3pokbd] {
    background: linear-gradient(135deg, #0077b6, #00a8e8);
}

.section-notes[b-8d3o3pokbd] {
    background: linear-gradient(135deg, #c0392b, #e05a4e);
}

/* Required indicator */
.required[b-8d3o3pokbd] {
    color: #dc3545;
    font-weight: 700;
}

/* Validation */
.validation-summary[b-8d3o3pokbd] {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
    color: #721c24;
    grid-column: 1 / -1;
}

.validation-summary ul[b-8d3o3pokbd] {
    margin: 0.5rem 0 0;
    padding-left: 1.25rem;
}

/* Form row */
.form-row[b-8d3o3pokbd] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

/* Form actions */
.form-actions[b-8d3o3pokbd] {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
}

/* Page-specific: small spinner for button loading */
.spinner-sm[b-8d3o3pokbd] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

/* Responsive */
@media (max-width: 1200px) {
    .form-grid[b-8d3o3pokbd] {
        grid-template-columns: repeat(2, 1fr);
    }
}

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

    .form-row[b-8d3o3pokbd] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Customers/CustomerList.razor.rz.scp.css */
/* Customer Cell */
.customer-cell[b-zll1u2zqrp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.customer-avatar[b-zll1u2zqrp] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    font-weight: 600;
    flex-shrink: 0;
}

.customer-info[b-zll1u2zqrp] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.customer-name[b-zll1u2zqrp] {
    font-weight: 500;
    color: #333;
}

.customer-company[b-zll1u2zqrp] {
    font-size: 0.8rem;
    color: #6c757d;
}

/* Contact Cell */
.contact-cell[b-zll1u2zqrp] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.contact-name[b-zll1u2zqrp] {
    font-weight: 500;
    color: #333;
}

.contact-email[b-zll1u2zqrp] {
    font-size: 0.8rem;
    color: #6c757d;
}

/* Status Badges */
.status-badges[b-zll1u2zqrp] {
    display: flex;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.badge[b-zll1u2zqrp] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    font-size: 0.7rem;
    font-weight: 600;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-success[b-zll1u2zqrp] {
    background-color: #d4edda;
    color: #155724;
}

.badge-secondary[b-zll1u2zqrp] {
    background-color: #e9ecef;
    color: #6c757d;
}

.badge-info[b-zll1u2zqrp] {
    background-color: #d1ecf1;
    color: #0c5460;
}

.text-muted[b-zll1u2zqrp] {
    color: #6c757d;
}

/* Pagination */
.pagination[b-zll1u2zqrp] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    margin-top: 1.5rem;
    padding: 1rem;
}

.btn-page[b-zll1u2zqrp] {
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background-color: white;
    color: #333;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-page:hover:not(:disabled)[b-zll1u2zqrp] {
    background-color: #f8f9fa;
    border-color: #1b4a98;
    color: #1b4a98;
}

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

.page-info[b-zll1u2zqrp] {
    font-size: 0.875rem;
    color: #6c757d;
}

/* Loading & Empty States */
.loading-container[b-zll1u2zqrp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6c757d;
}

.spinner[b-zll1u2zqrp] {
    width: 32px;
    height: 32px;
    border: 3px solid #e9ecef;
    border-top-color: #1b4a98;
    border-radius: 50%;
    animation: spin-b-zll1u2zqrp 0.8s linear infinite;
}

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

.empty-state[b-zll1u2zqrp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    text-align: center;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.empty-state svg[b-zll1u2zqrp] {
    color: #6c757d;
    margin-bottom: 1rem;
}

.empty-state h3[b-zll1u2zqrp] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #333;
}

.empty-state p[b-zll1u2zqrp] {
    margin: 0.5rem 0 0 0;
    color: #6c757d;
}

/* Responsive */
@media (max-width: 992px) {
    .data-table[b-zll1u2zqrp] {
        display: block;
        overflow-x: auto;
    }
}

@media (max-width: 768px) {
    .filter-bar[b-zll1u2zqrp] {
        flex-direction: column;
    }
    
    .filter-group[b-zll1u2zqrp] {
        width: 100%;
    }
    
    .form-control[b-zll1u2zqrp],
    .form-select[b-zll1u2zqrp] {
        width: 100%;
    }
}
/* /Components/Pages/Customers/CustomerLists.razor.rz.scp.css */
/* Page-header-left override */
.page-header-left[b-4xqubo9srw] {
    flex: 1;
}

/* Breadcrumb last child color */
.breadcrumb span:last-child[b-4xqubo9srw] {
    color: #6c757d;
}

/* Summary heading */
.summary-heading[b-4xqubo9srw] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #374151;
    margin: 1.5rem 0 0.75rem;
}

/* Summary table styles */
.clickable-row[b-4xqubo9srw] {
    cursor: pointer;
    transition: background-color 0.1s ease;
}

.clickable-row:hover[b-4xqubo9srw] {
    background-color: #f0f4ff !important;
}

.customer-name-cell[b-4xqubo9srw] {
    font-weight: 600;
    color: #1f2937;
}

.list-type-badges[b-4xqubo9srw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.badge-type[b-4xqubo9srw] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 0.7rem;
    font-weight: 600;
    background-color: #eff6ff;
    color: #2563eb;
}

.badge-incomplete[b-4xqubo9srw] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 600;
    background-color: #fef2f2;
    color: #dc2626;
}

.progress-cell[b-4xqubo9srw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.progress-bar-container[b-4xqubo9srw] {
    flex: 1;
    height: 8px;
    background-color: #e5e7eb;
    border-radius: 4px;
    overflow: hidden;
}

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

.progress-bar-fill.low[b-4xqubo9srw] {
    background-color: #ef4444;
}

.progress-bar-fill.mid[b-4xqubo9srw] {
    background-color: #f59e0b;
}

.progress-bar-fill.high[b-4xqubo9srw] {
    background-color: #22c55e;
}

.progress-text[b-4xqubo9srw] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6b7280;
    min-width: 36px;
    text-align: right;
}

.text-center[b-4xqubo9srw] {
    text-align: center;
}

.text-muted[b-4xqubo9srw] {
    color: #9ca3af;
}

/* Checklist Container */
.checklist-container[b-4xqubo9srw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.checklist-item[b-4xqubo9srw] {
    background: white;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.checklist-item.completed .item-name[b-4xqubo9srw] {
    text-decoration: line-through;
    color: #6c757d;
}

.checklist-item.completed .check-button[b-4xqubo9srw] {
    color: #28a745;
}

.checklist-item.sub-level[b-4xqubo9srw] {
    background: #f8f9fa;
    box-shadow: none;
    border: 1px solid #e9ecef;
}

.item-content[b-4xqubo9srw] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1rem;
}

.check-button[b-4xqubo9srw] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: none;
    background: transparent;
    color: #dee2e6;
    cursor: pointer;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.check-button:hover[b-4xqubo9srw] {
    color: #28a745;
}

.item-details[b-4xqubo9srw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.item-name[b-4xqubo9srw] {
    font-weight: 500;
    color: #333;
    font-size: 0.95rem;
}

.item-description[b-4xqubo9srw] {
    font-size: 0.85rem;
    color: #6c757d;
}

.item-meta[b-4xqubo9srw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.25rem;
}

.item-updated[b-4xqubo9srw] {
    font-size: 0.75rem;
    color: #6c757d;
}

.item-actions[b-4xqubo9srw] {
    display: flex;
    gap: 0.25rem;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.item-content:hover .item-actions[b-4xqubo9srw] {
    opacity: 1;
}

.sub-items[b-4xqubo9srw] {
    padding-left: 1rem;
    padding-bottom: 0.5rem;
}

/* Checklist Badges */
.badge-type[b-4xqubo9srw] {
    background-color: #e3f2fd;
    color: #1565c0;
}

.badge-project[b-4xqubo9srw] {
    background-color: #f3e5f5;
    color: #7b1fa2;
}

.badge-pm[b-4xqubo9srw] {
    background-color: #fff3e0;
    color: #ef6c00;
}

/* Modal: display as flex column for overflow */
.cl-backdrop[b-4xqubo9srw] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.cl-modal[b-4xqubo9srw] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 600px;
    max-height: 90vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.modal-footer[b-4xqubo9srw] {
    background: #f8f9fa;
}

/* Form group margin-based spacing in modal */
.form-group[b-4xqubo9srw] {
    margin-bottom: 1rem;
}

.form-group label[b-4xqubo9srw] {
    display: block;
    margin-bottom: 0.375rem;
}

.form-row .form-group[b-4xqubo9srw] {
    flex: 1;
}

.form-check input[type="checkbox"][b-4xqubo9srw] {
    width: 18px;
    height: 18px;
}

.form-check label[b-4xqubo9srw] {
    cursor: pointer;
}

/* Responsive */
@media (max-width: 768px) {
    .item-actions[b-4xqubo9srw] {
        opacity: 1;
    }
}
/* /Components/Pages/Customers/CustomerView.razor.rz.scp.css */
/* Customer Hub Header */
.customer-hub-header[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    margin-bottom: 0;
}

.hub-avatar[b-h49x40quy9] {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    font-weight: 700;
    flex-shrink: 0;
    letter-spacing: 0.5px;
}

.hub-info[b-h49x40quy9] {
    flex: 1;
    min-width: 0;
}

.hub-name-row[b-h49x40quy9] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.hub-name-row h2[b-h49x40quy9] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: #1a1a2e;
    line-height: 1.3;
}

.hub-company[b-h49x40quy9] {
    font-size: 0.875rem;
    color: #6c757d;
    font-weight: 400;
}

.hub-badges[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.375rem;
    flex-wrap: wrap;
}

.hub-actions[b-h49x40quy9] {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
}

/* Tab Navigation */
.hub-tabs[b-h49x40quy9] {
    display: flex;
    gap: 0;
    border-bottom: 2px solid #e9ecef;
    margin-bottom: 1rem;
    padding: 0;
}

.hub-tab[b-h49x40quy9] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.75rem 1.25rem;
    border: none;
    background: none;
    color: #6c757d;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all 0.15s ease;
}

.hub-tab:hover[b-h49x40quy9] {
    color: #1b4a98;
    background-color: #f8f9fa;
}

.hub-tab.active[b-h49x40quy9] {
    color: #1b4a98;
    border-bottom-color: #1b4a98;
    font-weight: 600;
}

.hub-tab svg[b-h49x40quy9] {
    opacity: 0.7;
}

.hub-tab.active svg[b-h49x40quy9] {
    opacity: 1;
}

/* Hub Content */
.hub-content[b-h49x40quy9] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Details tab: 2-column grid */
.hub-details-grid[b-h49x40quy9] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    align-items: start;
}

.detail-span-full[b-h49x40quy9] {
    grid-column: 1 / -1;
}

/* Compact detail grids within hub sections */
.hub-details-grid .detail-grid[b-h49x40quy9] {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    padding: 1rem;
}

.hub-details-grid .section-header[b-h49x40quy9] {
    padding: 0.75rem 1rem;
}

/* Item Count Badge (reuse for projects/worklogs) */
.item-count[b-h49x40quy9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 0.5rem;
    border-radius: 12px;
    background-color: #e9ecef;
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
}

/* Project Hub List */
.project-hub-list[b-h49x40quy9] {
    display: flex;
    flex-direction: column;
}

.project-hub-item[b-h49x40quy9] {
    display: block;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid #f0f0f0;
    text-decoration: none;
    color: inherit;
    transition: background-color 0.15s ease;
}

.project-hub-item:last-child[b-h49x40quy9] {
    border-bottom: none;
}

.project-hub-item:hover[b-h49x40quy9] {
    background-color: #f8f9fa;
    text-decoration: none;
    color: inherit;
}

.project-hub-main[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.project-hub-name[b-h49x40quy9] {
    font-weight: 500;
    font-size: 0.875rem;
    color: #1b4a98;
}

.project-hub-item:hover .project-hub-name[b-h49x40quy9] {
    text-decoration: underline;
}

.badge-status[b-h49x40quy9] {
    font-size: 0.65rem;
    padding: 0.125rem 0.5rem;
    border-radius: 999px;
    background-color: #e9ecef;
    color: #495057;
    font-weight: 500;
}

.project-hub-meta[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    color: #6c757d;
    margin-top: 0.125rem;
    flex-wrap: wrap;
}

/* Work Log List */
.worklog-list[b-h49x40quy9] {
    display: flex;
    flex-direction: column;
}

.worklog-item[b-h49x40quy9] {
    display: flex;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid #f0f0f0;
    align-items: flex-start;
}

.worklog-item:last-child[b-h49x40quy9] {
    border-bottom: none;
}

.worklog-date[b-h49x40quy9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 48px;
    flex-shrink: 0;
    padding-top: 0.125rem;
}

.worklog-day[b-h49x40quy9] {
    font-weight: 600;
    font-size: 0.75rem;
    color: #333;
    line-height: 1.2;
}

.worklog-year[b-h49x40quy9] {
    font-size: 0.625rem;
    color: #adb5bd;
    line-height: 1.2;
}

.worklog-info[b-h49x40quy9] {
    flex: 1;
    min-width: 0;
}

.worklog-description[b-h49x40quy9] {
    font-size: 0.8125rem;
    color: #333;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.worklog-meta[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    color: #6c757d;
    margin-top: 0.125rem;
    flex-wrap: wrap;
}

/* Line Item List */
.lineitem-list[b-h49x40quy9] {
    display: flex;
    flex-direction: column;
}

.lineitem-item[b-h49x40quy9] {
    display: block;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid #f0f0f0;
    text-decoration: none;
    color: inherit;
    transition: background-color 0.15s ease;
}

.lineitem-item:last-child[b-h49x40quy9] {
    border-bottom: none;
}

.lineitem-item:hover[b-h49x40quy9] {
    background-color: #f8f9fa;
    text-decoration: none;
    color: inherit;
}

.lineitem-main[b-h49x40quy9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.lineitem-description[b-h49x40quy9] {
    font-weight: 500;
    font-size: 0.875rem;
    color: #333;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lineitem-item:hover .lineitem-description[b-h49x40quy9] {
    color: #1b4a98;
}

.lineitem-amount[b-h49x40quy9] {
    font-weight: 600;
    font-size: 0.875rem;
    color: #155724;
    flex-shrink: 0;
}

.lineitem-meta[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    color: #6c757d;
    margin-top: 0.125rem;
    flex-wrap: wrap;
}

/* Line Item Badge Variants */
.badge-category[b-h49x40quy9] {
    background-color: #e7f1ff;
    color: #1b4a98;
    text-transform: none;
    font-weight: 500;
}

.badge-recurring[b-h49x40quy9] {
    background-color: #fff3cd;
    color: #856404;
    text-transform: none;
    font-weight: 500;
}

.badge-onetime[b-h49x40quy9] {
    background-color: #f0f0f0;
    color: #666;
    text-transform: none;
    font-weight: 500;
}

/* Hub Pager */
.hub-pager[b-h49x40quy9] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 0.5rem 1rem;
    border-top: 1px solid #f0f0f0;
}

.pager-btn[b-h49x40quy9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: #fff;
    color: #495057;
    cursor: pointer;
    transition: all 0.15s ease;
}

.pager-btn:hover:not(:disabled)[b-h49x40quy9] {
    background-color: #f0f4ff;
    border-color: #1b4a98;
    color: #1b4a98;
}

.pager-btn:disabled[b-h49x40quy9] {
    opacity: 0.4;
    cursor: not-allowed;
}

.pager-info[b-h49x40quy9] {
    font-size: 0.75rem;
    color: #6c757d;
    font-weight: 500;
    white-space: nowrap;
}

/* Section Header Actions */
.section-header-actions[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-add-link[b-h49x40quy9] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: none;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.2rem 0.625rem;
    font-size: 0.6875rem;
    font-weight: 500;
    color: #1b4a98;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.section-add-link:hover[b-h49x40quy9] {
    background-color: #f0f4ff;
    border-color: #1b4a98;
    color: #1b4a98;
    text-decoration: none;
}

.section-toggle-btn[b-h49x40quy9] {
    background: none;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.2rem 0.625rem;
    font-size: 0.6875rem;
    font-weight: 500;
    color: #495057;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.section-toggle-btn:hover[b-h49x40quy9] {
    background-color: #f0f4ff;
    border-color: #1b4a98;
    color: #1b4a98;
}

/* Profile company subtitle (kept for hub) */
.profile-company[b-h49x40quy9] {
    margin: 0.25rem 0 0 0;
    color: #6c757d;
    font-size: 0.9rem;
}

/* View-specific: text block background */
.text-block[b-h49x40quy9] {
    background-color: #f8f9fa;
    padding: 1rem;
    border-radius: 8px;
}

/* Responsive */
@media (max-width: 992px) {
    .hub-details-grid[b-h49x40quy9] {
        grid-template-columns: 1fr;
    }

    .customer-hub-header[b-h49x40quy9] {
        flex-wrap: wrap;
    }

    .hub-actions[b-h49x40quy9] {
        width: 100%;
        justify-content: flex-end;
    }
}

@media (max-width: 576px) {
    .customer-hub-header[b-h49x40quy9] {
        padding: 1rem;
    }

    .hub-avatar[b-h49x40quy9] {
        width: 42px;
        height: 42px;
        font-size: 0.875rem;
    }

    .hub-name-row h2[b-h49x40quy9] {
        font-size: 1.1rem;
    }

    .hub-tabs[b-h49x40quy9] {
        overflow-x: auto;
    }
}

/* Comments Section */
.comment-section[b-h49x40quy9] {
    overflow: visible;
}

.comment-body-section[b-h49x40quy9] {
    padding: 1rem;
}

.comment-count[b-h49x40quy9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 0.5rem;
    border-radius: 12px;
    background-color: #e9ecef;
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
}

.comment-input-area[b-h49x40quy9] {
    display: flex;
    gap: 0.75rem;
    padding-bottom: 0.5rem;
    margin-bottom: 0;
}

.comment-hint[b-h49x40quy9] {
    display: block;
    font-size: 0.7rem;
    color: #adb5bd;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
    margin-bottom: 1rem;
    text-align: right;
}

.comment-hint kbd[b-h49x40quy9] {
    display: inline-block;
    padding: 0 4px;
    font-size: 0.65rem;
    font-family: inherit;
    background-color: #f0f0f0;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    box-shadow: 0 1px 0 #d1d5db;
    color: #6b7280;
}

.comment-input-wrapper[b-h49x40quy9] {
    flex: 1;
    position: relative;
}

.comment-textarea[b-h49x40quy9] {
    resize: none;
    font-size: 0.875rem;
    padding-right: 3rem;
}

.comment-submit[b-h49x40quy9] {
    position: absolute;
    right: 0.5rem;
    bottom: 0.5rem;
    padding: 0.25rem 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.comment-list[b-h49x40quy9] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.comment-item[b-h49x40quy9] {
    display: flex;
    gap: 0.75rem;
}

.comment-avatar[b-h49x40quy9] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 600;
    flex-shrink: 0;
}

.comment-content[b-h49x40quy9] {
    flex: 1;
    min-width: 0;
}

.comment-header[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.comment-author[b-h49x40quy9] {
    font-weight: 600;
    font-size: 0.8125rem;
    color: #333;
}

.comment-time[b-h49x40quy9] {
    font-size: 0.75rem;
    color: #adb5bd;
}

.comment-delete[b-h49x40quy9] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border: none;
    background: none;
    color: #adb5bd;
    cursor: pointer;
    border-radius: 4px;
    padding: 0;
    margin-left: auto;
    opacity: 0;
    transition: all 0.15s ease;
}

.comment-item:hover .comment-delete[b-h49x40quy9] {
    opacity: 1;
}

.comment-delete:hover[b-h49x40quy9] {
    background-color: #f8d7da;
    color: #dc3545;
}

.comment-body[b-h49x40quy9] {
    font-size: 0.875rem;
    line-height: 1.5;
    color: #495057;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.comment-body[b-h49x40quy9]  .mention-tag {
    background-color: #e9ecef;
    color: #1b4a98;
    padding: 1px 4px;
    border-radius: 4px;
    font-weight: 500;
}

/* Mention Dropdown */
.mention-dropdown[b-h49x40quy9] {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    max-height: 220px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 1050;
    margin-top: 4px;
    padding: 0.25rem;
}

.mention-item[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.625rem;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.1s ease;
}

.mention-item:hover[b-h49x40quy9],
.mention-item.selected[b-h49x40quy9] {
    background-color: #f0f4ff;
}

.mention-avatar[b-h49x40quy9] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, #6f42c1 0%, #8e5cd9 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6rem;
    font-weight: 600;
    flex-shrink: 0;
}

.mention-name[b-h49x40quy9] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #333;
}

/* File Upload Zone */
.file-upload-zone[b-h49x40quy9] {
    position: relative;
    border: 2px dashed #d1d5db;
    border-radius: 8px;
    padding: 0.75rem;
    text-align: center;
    transition: all 0.2s ease;
    margin-bottom: 0.5rem;
    background-color: #fafbfc;
}

.file-upload-zone:hover[b-h49x40quy9],
.file-upload-zone.drag-over[b-h49x40quy9] {
    border-color: #1b4a98;
    background-color: #f0f4ff;
}

[b-h49x40quy9] .file-input-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

.file-upload-label[b-h49x40quy9] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #6c757d;
    pointer-events: none;
    position: relative;
    z-index: 1;
}

.file-upload-label svg[b-h49x40quy9] {
    color: #adb5bd;
}

.file-upload-zone:hover .file-upload-label svg[b-h49x40quy9],
.file-upload-zone.drag-over .file-upload-label svg[b-h49x40quy9] {
    color: #1b4a98;
}

.upload-text[b-h49x40quy9] {
    font-size: 0.8125rem;
    color: #6c757d;
}

.upload-text strong[b-h49x40quy9] {
    color: #1b4a98;
}

.upload-hint[b-h49x40quy9] {
    font-size: 0.7rem;
    color: #adb5bd;
}

/* File Count Badge */
.file-count[b-h49x40quy9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 0.5rem;
    border-radius: 12px;
    background-color: #e9ecef;
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
}

/* File List */
.file-list[b-h49x40quy9] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.file-item[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.5rem;
    border-bottom: 1px solid #f0f0f0;
    transition: background-color 0.15s ease;
}

.file-item:last-child[b-h49x40quy9] {
    border-bottom: none;
}

.file-item:hover[b-h49x40quy9] {
    background-color: #f8f9fa;
}

.file-icon[b-h49x40quy9] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 6px;
    background-color: #f0f4ff;
    color: #1b4a98;
    flex-shrink: 0;
}

.file-info[b-h49x40quy9] {
    flex: 1;
    min-width: 0;
}

.file-name-row[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.file-name-link[b-h49x40quy9] {
    font-weight: 500;
    font-size: 0.8125rem;
    color: #1b4a98;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.file-name-link:hover[b-h49x40quy9] {
    text-decoration: underline;
}

.file-name-text[b-h49x40quy9] {
    font-weight: 500;
    font-size: 0.8125rem;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.file-meta[b-h49x40quy9] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    color: #6c757d;
    margin-top: 0;
    flex-wrap: wrap;
}

.meta-sep[b-h49x40quy9] {
    color: #d1d5db;
}

.file-path-display[b-h49x40quy9] {
    max-width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 0.7rem;
    color: #6c757d;
}

.file-delete-btn[b-h49x40quy9] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: none;
    background: none;
    color: #adb5bd;
    cursor: pointer;
    border-radius: 6px;
    padding: 0;
    flex-shrink: 0;
    opacity: 0;
    transition: all 0.15s ease;
}

.file-item:hover .file-delete-btn[b-h49x40quy9] {
    opacity: 1;
}

.file-delete-btn:hover[b-h49x40quy9] {
    background-color: #f8d7da;
    color: #dc3545;
}

/* Customer File Modal */
.cust-file-modal-backdrop[b-h49x40quy9] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cust-file-modal[b-h49x40quy9] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.cust-file-modal .modal-header[b-h49x40quy9] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.cust-file-modal .modal-header h3[b-h49x40quy9] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
}

.cust-file-modal .modal-close[b-h49x40quy9] {
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: none;
    color: #6c757d;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 4px;
}

.cust-file-modal .modal-close:hover[b-h49x40quy9] {
    background-color: #f0f0f0;
    color: #333;
}

.cust-file-modal .modal-body[b-h49x40quy9] {
    padding: 1.25rem 1.5rem;
}

.cust-file-modal .modal-footer[b-h49x40quy9] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

/* Jump to Customer Modal */
.jump-customer-backdrop[b-h49x40quy9] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.jump-customer-modal[b-h49x40quy9] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 520px;
    max-height: 80vh;
    overflow-y: auto;
}

.jump-customer-list[b-h49x40quy9] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    max-height: 340px;
    overflow-y: auto;
}

.jump-customer-item[b-h49x40quy9] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    padding: 0.6rem 0.75rem;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    text-align: left;
    transition: background 0.15s;
}

.jump-customer-item:hover[b-h49x40quy9] {
    background: #f0f4ff;
    border-color: #b3c6ff;
}

.jump-customer-name[b-h49x40quy9] {
    font-weight: 600;
    color: #1a1a2e;
    font-size: 0.92rem;
}

.jump-customer-company[b-h49x40quy9] {
    font-size: 0.8rem;
    color: #6c757d;
}
/* /Components/Pages/Customers/LineItems/LineItemEdit.razor.rz.scp.css */
/* Breadcrumb last child */
.breadcrumb span:last-child[b-0rsq2z3mga] {
    color: #6c757d;
}

/* Form Container width */
.form-container[b-0rsq2z3mga] {
    max-width: 800px;
}

/* Form Cards */
.form-card[b-0rsq2z3mga] {
    margin-bottom: 1.5rem;
}

/* Form group margin-based spacing */
.form-group[b-0rsq2z3mga] {
    margin-bottom: 1.25rem;
}

.form-group:last-child[b-0rsq2z3mga] {
    margin-bottom: 0;
}

.form-group label[b-0rsq2z3mga] {
    display: block;
    margin-bottom: 0.5rem;
}

/* Input Group override for attached prefix */
.input-prefix[b-0rsq2z3mga] {
    display: flex;
    align-items: center;
    padding: 0 0.75rem;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-right: none;
    border-radius: 6px 0 0 6px;
    font-size: 0.9rem;
    color: #6c757d;
    position: static;
}

.input-group .form-control[b-0rsq2z3mga] {
    border-radius: 0 6px 6px 0;
}

/* Checkbox Group */
.checkbox-group[b-0rsq2z3mga] {
    margin-top: 0.5rem;
}

.checkbox-label[b-0rsq2z3mga] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: normal !important;
}

.checkbox-label input[type="checkbox"][b-0rsq2z3mga] {
    width: 18px;
    height: 18px;
    accent-color: #1b4a98;
}

.checkbox-text[b-0rsq2z3mga] {
    font-size: 0.9rem;
    color: #333;
}

/* Recurring Options */
.recurring-options[b-0rsq2z3mga] {
    background-color: #f8f9fa;
    padding: 1rem;
    border-radius: 8px;
    margin-top: 0.5rem;
    margin-bottom: 1rem;
}

/* Button overrides */
.btn-primary:hover:not(:disabled)[b-0rsq2z3mga] {
    background-color: #153a7a;
}

.btn-primary:disabled[b-0rsq2z3mga] {
    opacity: 0.7;
    cursor: not-allowed;
}
/* /Components/Pages/Customers/LineItems/LineItemList.razor.rz.scp.css */
/* Line Item Specific Styles */
.customer-link[b-ibhztyz7mb] {
    font-weight: 500;
    color: #1b4a98;
}

.description-text[b-ibhztyz7mb] {
    display: block;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.amount[b-ibhztyz7mb] {
    font-weight: 600;
    color: #155724;
}

/* Line Item Badge Variants */
.badge-category[b-ibhztyz7mb] {
    background-color: #e7f1ff;
    color: #1b4a98;
    text-transform: none;
    font-weight: 500;
}

.badge-recurring[b-ibhztyz7mb] {
    background-color: #fff3cd;
    color: #856404;
    text-transform: none;
    font-weight: 500;
}

.badge-onetime[b-ibhztyz7mb] {
    background-color: #f0f0f0;
    color: #666;
    text-transform: none;
    font-weight: 500;
}
/* /Components/Pages/Customers/LineItems/LineItemView.razor.rz.scp.css */
/* Loading & Error States */
.loading-container[b-5ly3dnq1gr],
.error-container[b-5ly3dnq1gr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6c757d;
    text-align: center;
}

.spinner[b-5ly3dnq1gr] {
    width: 32px;
    height: 32px;
    border: 3px solid #e9ecef;
    border-top-color: #1b4a98;
    border-radius: 50%;
    animation: spin-b-5ly3dnq1gr 0.8s linear infinite;
}

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

.error-container svg[b-5ly3dnq1gr] {
    color: #dc3545;
    margin-bottom: 0.5rem;
}

.error-container h3[b-5ly3dnq1gr] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #333;
}

.error-container p[b-5ly3dnq1gr] {
    margin: 0.5rem 0;
    color: #6c757d;
}

/* Page Header */
.page-header[b-5ly3dnq1gr] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header h1[b-5ly3dnq1gr] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 600;
    color: #333;
}

.breadcrumb[b-5ly3dnq1gr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}

.breadcrumb a[b-5ly3dnq1gr] {
    color: #1b4a98;
    text-decoration: none;
}

.breadcrumb a:hover[b-5ly3dnq1gr] {
    text-decoration: underline;
}

.breadcrumb .separator[b-5ly3dnq1gr] {
    color: #6c757d;
}

/* Breadcrumb last child */
.breadcrumb span:last-child[b-5ly3dnq1gr] {
    color: #6c757d;
}

/* Page-specific Styles */
.detail-grid[b-5ly3dnq1gr] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 1.5rem;
}

@media (max-width: 992px) {
    .detail-grid[b-5ly3dnq1gr] {
        grid-template-columns: 1fr;
    }
}

.detail-card[b-5ly3dnq1gr] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.card-header[b-5ly3dnq1gr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    background-color: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
}

.card-header h2[b-5ly3dnq1gr] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #333;
}

.card-body[b-5ly3dnq1gr] {
    padding: 1.25rem;
}

/* Info Rows */
.info-row[b-5ly3dnq1gr] {
    display: flex;
    justify-content: space-between;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.info-row:last-child[b-5ly3dnq1gr] {
    border-bottom: none;
}

.info-row .label[b-5ly3dnq1gr] {
    font-size: 0.875rem;
    color: #6c757d;
    font-weight: 500;
}

.info-row .value[b-5ly3dnq1gr] {
    font-size: 0.875rem;
    color: #333;
    text-align: right;
}

.info-row .description[b-5ly3dnq1gr] {
    text-align: left;
    flex: 1;
    margin-left: 2rem;
    white-space: pre-wrap;
}

.customer-link[b-5ly3dnq1gr] {
    color: #1b4a98;
    text-decoration: none;
    font-weight: 500;
}

.customer-link:hover[b-5ly3dnq1gr] {
    text-decoration: underline;
}

/* Amount Display */
.amount-display[b-5ly3dnq1gr] {
    text-align: center;
    padding: 1.5rem 0;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 0.5rem;
}

.amount-value[b-5ly3dnq1gr] {
    display: block;
    font-size: 2rem;
    font-weight: 700;
    color: #155724;
}

.amount-label[b-5ly3dnq1gr] {
    display: block;
    font-size: 0.875rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

/* Buttons */
.btn[b-5ly3dnq1gr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: all 0.15s ease;
    text-decoration: none;
}

.btn-primary[b-5ly3dnq1gr] {
    background-color: #1b4a98;
    color: white;
}

.btn-primary:hover[b-5ly3dnq1gr] {
    background-color: #153a7a;
}

.btn-secondary[b-5ly3dnq1gr] {
    background-color: #6c757d;
    color: white;
}

.btn-secondary:hover[b-5ly3dnq1gr] {
    background-color: #5a6268;
}

/* Button variants */
.btn-success[b-5ly3dnq1gr] {
    background-color: #28a745;
    color: white;
}

.btn-success:hover[b-5ly3dnq1gr] {
    background-color: #218838;
}

.btn-warning[b-5ly3dnq1gr] {
    background-color: #ffc107;
    color: #212529;
}

.btn-warning:hover[b-5ly3dnq1gr] {
    background-color: #e0a800;
}

.btn-danger[b-5ly3dnq1gr] {
    background-color: #dc3545;
    color: white;
}

.btn-danger:hover[b-5ly3dnq1gr] {
    background-color: #c82333;
}

/* Badges */
.status-badges[b-5ly3dnq1gr] {
    display: flex;
    gap: 0.5rem;
}

.badge[b-5ly3dnq1gr] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-success[b-5ly3dnq1gr] {
    background-color: #d4edda;
    color: #155724;
}

.badge-secondary[b-5ly3dnq1gr] {
    background-color: #e9ecef;
    color: #6c757d;
}

/* Line Item Badge Variants */
.badge-category[b-5ly3dnq1gr] {
    background-color: #e7f1ff;
    color: #1b4a98;
    text-transform: none;
    font-weight: 500;
}

.badge-recurring[b-5ly3dnq1gr] {
    background-color: #fff3cd;
    color: #856404;
    text-transform: none;
}

.badge-onetime[b-5ly3dnq1gr] {
    background-color: #f0f0f0;
    color: #666;
    text-transform: none;
}

.text-muted[b-5ly3dnq1gr] {
    color: #6c757d;
}

/* Modal - custom naming */
.modal-overlay[b-5ly3dnq1gr] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.modal-dialog[b-5ly3dnq1gr] {
    background: white;
    border-radius: 12px;
    width: 100%;
    max-width: 400px;
    margin: 1rem;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

/* Modal Header */
.modal-header[b-5ly3dnq1gr] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e9ecef;
}

.modal-header h3[b-5ly3dnq1gr] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #333;
}

/* Modal Body */
.modal-body[b-5ly3dnq1gr] {
    padding: 1.25rem;
}

.modal-body p[b-5ly3dnq1gr] {
    margin: 0 0 0.5rem 0;
}

/* Modal Footer */
.modal-footer[b-5ly3dnq1gr] {
    padding: 1rem 1.25rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}
/* /Components/Pages/Customers/Projects/ProjectEdit.razor.rz.scp.css */
/* Breadcrumb */
.breadcrumb span[b-uk7tkv7m88] { color: #6c757d; }
.page-subtitle[b-uk7tkv7m88] { margin: 0.25rem 0 0; font-size: 0.875rem; color: #6c757d; }

/* Form wrapper — no outer card; sections provide their own cards */
.edit-form-wrapper[b-uk7tkv7m88] {
    max-width: none;
}

.form-grid[b-uk7tkv7m88] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-areas:
        "basic schedule"
        "billing approval";
    gap: 1.5rem;
}

/* Form Sections */
.form-section[b-uk7tkv7m88] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.area-basic[b-uk7tkv7m88] { grid-area: basic; }
.area-schedule[b-uk7tkv7m88] { grid-area: schedule; }
.area-billing[b-uk7tkv7m88] { grid-area: billing; }
.area-approval[b-uk7tkv7m88] { grid-area: approval; }

.form-section.full-width[b-uk7tkv7m88] {
    grid-column: 1 / -1;
}

/* Section Headers — colored bars with icons */
.section-header[b-uk7tkv7m88] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    border-radius: 6px;
    border-bottom: none;
    color: white;
}

.section-header svg[b-uk7tkv7m88] {
    flex-shrink: 0;
    color: white;
    stroke: white;
}

.section-divider[b-uk7tkv7m88] {
    margin-top: 0.5rem;
}

.section-basic[b-uk7tkv7m88] {
    background: linear-gradient(135deg, #1b4a98, #2d6fd6);
}

.section-schedule[b-uk7tkv7m88] {
    background: linear-gradient(135deg, #0d7c5f, #17a87a);
}

.section-team[b-uk7tkv7m88] {
    background: linear-gradient(135deg, #6f42c1, #8e5cd9);
}

.section-billing[b-uk7tkv7m88] {
    background: linear-gradient(135deg, #7c5c1e, #b8860b);
}

.section-approval[b-uk7tkv7m88] {
    background: linear-gradient(135deg, #0077b6, #00a8e8);
}

/* Required indicator */
.required[b-uk7tkv7m88] {
    color: #dc3545;
    font-weight: 700;
}

/* Validation */
.validation-summary[b-uk7tkv7m88] {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
    color: #721c24;
    grid-column: 1 / -1;
}

.validation-summary ul[b-uk7tkv7m88] {
    margin: 0.5rem 0 0;
    padding-left: 1.25rem;
}

/* Form row */
.form-row[b-uk7tkv7m88] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

/* Checkbox inline style */
.checkbox-inline label[b-uk7tkv7m88] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: 500;
    font-size: 0.875rem;
    color: #333;
}

.checkbox-inline input[type="checkbox"][b-uk7tkv7m88] {
    width: 16px;
    height: 16px;
    accent-color: #1b4a98;
}

/* Checkbox row (multiple checkboxes in a row) */
.checkbox-row[b-uk7tkv7m88] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.checkbox-item[b-uk7tkv7m88] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: 500;
    font-size: 0.8125rem;
    color: #333;
    white-space: nowrap;
}

.checkbox-item input[type="checkbox"][b-uk7tkv7m88] {
    width: 16px;
    height: 16px;
    accent-color: #1b4a98;
}

/* Time Input */
.time-input-row[b-uk7tkv7m88] {
    display: flex;
    gap: 0.75rem;
}

.time-input-group[b-uk7tkv7m88] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.time-input[b-uk7tkv7m88] {
    width: 72px;
    text-align: center;
}

.time-label[b-uk7tkv7m88] {
    font-size: 0.8125rem;
    color: #6c757d;
}

/* Currency input */
.currency-input[b-uk7tkv7m88] {
    display: flex;
    align-items: stretch;
}

.currency-prefix[b-uk7tkv7m88] {
    display: flex;
    align-items: center;
    padding: 0 0.625rem;
    background: #f8f9fa;
    border: 1px solid #ced4da;
    border-right: none;
    border-radius: 6px 0 0 6px;
    font-size: 0.875rem;
    color: #6c757d;
}

.currency-input .form-control[b-uk7tkv7m88] {
    border-radius: 0 6px 6px 0;
}

/* Form Actions */
.form-actions[b-uk7tkv7m88] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
}

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

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

/* Responsive */
@media (max-width: 1200px) {
    .form-grid[b-uk7tkv7m88] {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "basic basic"
            "schedule schedule"
            "billing approval";
    }
}

@media (max-width: 768px) {
    .form-grid[b-uk7tkv7m88] {
        grid-template-columns: 1fr;
        grid-template-areas:
            "basic"
            "schedule"
            "billing"
            "approval";
    }

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

    .checkbox-row[b-uk7tkv7m88] {
        flex-direction: column;
        gap: 0.75rem;
    }
}
/* /Components/Pages/Customers/Projects/ProjectList.razor.rz.scp.css */
/* Sort indicator */
.sort-indicator[b-t35xok4wlx] {
    margin-left: 0.375rem;
    font-size: 0.625rem;
}

/* Multi-select status dropdown */
.multi-select-dropdown[b-t35xok4wlx] {
    position: relative;
}

.multi-select-toggle[b-t35xok4wlx] {
    cursor: pointer;
    text-align: left;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 12px;
    padding-right: 2.25rem;
}

.multi-select-toggle.has-selection[b-t35xok4wlx] {
    border-color: #1b4a98;
    background-color: #f0f4ff;
    color: #1b4a98;
    font-weight: 500;
}

.multi-select-backdrop[b-t35xok4wlx] {
    position: fixed;
    inset: 0;
    z-index: 199;
}

.multi-select-panel[b-t35xok4wlx] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    min-width: 100%;
    max-height: 260px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    z-index: 200;
    padding: 4px 0;
}

.multi-select-option[b-t35xok4wlx] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    cursor: pointer;
    font-size: 0.875rem;
    white-space: nowrap;
    user-select: none;
}

.multi-select-option:hover[b-t35xok4wlx] {
    background-color: #f0f4ff;
}

.multi-select-option input[type="checkbox"][b-t35xok4wlx] {
    flex-shrink: 0;
    accent-color: #1b4a98;
}

/* Project Cell */
.project-cell[b-t35xok4wlx] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.project-name[b-t35xok4wlx] {
    font-weight: 600;
    color: #1b4a98;
    overflow-wrap: break-word;
    word-break: break-word;
}

.project-subtitle[b-t35xok4wlx] {
    font-size: 0.75rem;
    color: #6c757d;
}

.badge-parent[b-t35xok4wlx] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 0.7rem;
    font-weight: 500;
    padding: 1px 8px;
    border-radius: 10px;
    background-color: #fff3e0;
    color: #e65100;
    white-space: nowrap;
    align-self: flex-start;
}

/* Status Badge */
.status-badge[b-t35xok4wlx] {
    color: #fff;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 12px;
    white-space: nowrap;
}

/* Priority Toolbar */
.priority-toolbar[b-t35xok4wlx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px;
    background: #f0f4ff;
    border: 1px solid #dbeafe;
    border-radius: 8px;
    margin-bottom: 12px;
}

.priority-hint[b-t35xok4wlx] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #4b5563;
    font-size: 13px;
}

/* Progress Cell */
.progress-cell[b-t35xok4wlx] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.progress-bar-container[b-t35xok4wlx] {
    width: 100%;
    height: 6px;
    background-color: #e9ecef;
    border-radius: 3px;
    overflow: hidden;
}

.progress-bar-fill[b-t35xok4wlx] {
    height: 100%;
    background: linear-gradient(90deg, #1b4a98, #2d6fd6);
    border-radius: 3px;
    transition: width 0.3s ease;
}

.progress-text[b-t35xok4wlx] {
    font-size: 0.75rem;
    color: #6c757d;
}

/* Badge variants */
.badge-primary[b-t35xok4wlx] {
    background-color: #d4e5ff;
    color: #1b4a98;
}

.badge-danger[b-t35xok4wlx] {
    background-color: #f8d7da;
    color: #721c24;
}

.text-danger[b-t35xok4wlx] {
    color: #dc3545;
    font-weight: 500;
}

.text-warning[b-t35xok4wlx] {
    color: #e67e00;
    font-weight: 500;
}

/* Actions Column */
.actions-col[b-t35xok4wlx] {
    width: 110px;
    text-align: center;
}

.actions-col.priority-actions[b-t35xok4wlx] {
    width: 180px;
}

.actions-cell[b-t35xok4wlx] {
    text-align: center;
    white-space: nowrap;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.btn-action[b-t35xok4wlx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    transition: all 0.15s ease;
    text-decoration: none;
}

.btn-track[b-t35xok4wlx] {
    background-color: #d4edda;
    color: #28a745;
}

.btn-track:hover[b-t35xok4wlx] {
    background-color: #28a745;
    color: white;
}

.btn-edit[b-t35xok4wlx] {
    background-color: #e0e7ff;
    color: #4f46e5;
}

.btn-edit:hover[b-t35xok4wlx] {
    background-color: #4f46e5;
    color: white;
}

/* Refresh button */
.filter-action[b-t35xok4wlx] {
    display: flex;
    align-items: flex-end;
}

.btn-preset[b-t35xok4wlx] {
    display: inline-flex;
    align-items: center;
    height: 36px;
    padding: 0 12px;
    font-size: 0.8125rem;
    border-radius: 8px;
    white-space: nowrap;
}

.btn-refresh[b-t35xok4wlx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 8px;
}

/* Quick filter bar */
.quick-filter-bar[b-t35xok4wlx] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    flex-wrap: wrap;
}

.quick-filter-label[b-t35xok4wlx] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #6c757d;
    white-space: nowrap;
}

.btn-quick-filter[b-t35xok4wlx] {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 12px;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #4b5563;
    background-color: #fff;
    border: 1px solid #9ca3af;
    border-radius: 8px;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.btn-quick-filter:hover[b-t35xok4wlx] {
    background-color: #f3f4f6;
    border-color: #6b7280;
    color: #111827;
}

/* Target Date Cell */
.target-date-cell[b-t35xok4wlx] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
    border: 2px solid transparent;
}

.target-date-cell.hard-deadline[b-t35xok4wlx] {
    border-color: #dc2626;
    background-color: #fef2f2;
    cursor: help;
}

.target-distance[b-t35xok4wlx] {
    font-size: 0.75rem;
}

/* Toggle filter — prevent uppercase from shared .filter-group label */
.toggle-filter .toggle .toggle-label[b-t35xok4wlx] {
    text-transform: none;
}

/* Alternating row backgrounds */
.data-table tbody tr:nth-child(even)[b-t35xok4wlx] {
    background-color: #f8f9fb;
}

.data-table tbody tr:nth-child(odd)[b-t35xok4wlx] {
    background-color: #ffffff;
}

/* Priority sort column */
.priority-col[b-t35xok4wlx] {
    width: 40px;
    text-align: center;
}

.priority-cell[b-t35xok4wlx] {
    text-align: center;
    font-weight: 600;
    color: #6b7280;
    font-size: 13px;
}

/* Drag handle icon */
.drag-handle[b-t35xok4wlx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #fff;
    color: #9ca3af;
    cursor: grab;
    transition: all 0.15s ease;
}

.drag-handle:hover[b-t35xok4wlx] {
    background: #f3f4f6;
    color: #1e40af;
    border-color: #93c5fd;
}

/* Draggable row styles */
.draggable-row[b-t35xok4wlx] {
    cursor: grab;
}

.draggable-row.dragging[b-t35xok4wlx] {
    opacity: 0.4;
    cursor: grabbing;
}

.draggable-row.drag-over[b-t35xok4wlx] {
    box-shadow: 0 -2px 0 0 #3b82f6 inset;
}

.draggable-row.drag-over td[b-t35xok4wlx] {
    border-top: 2px solid #3b82f6;
}

.inline-date-input[b-t35xok4wlx] {
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid transparent;
    border-radius: 6px;
    padding: 0.25rem 0.4rem;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    background: transparent;
    color: inherit;
    width: 100%;
    max-width: 130px;
}

.inline-date-input:hover[b-t35xok4wlx] {
    border-color: #d1d5db;
    background: #fff;
}

.inline-date-input:focus[b-t35xok4wlx] {
    outline: none;
    border-color: #93c5fd;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15);
    background: #fff;
}

.inline-date-input.text-danger[b-t35xok4wlx] {
    color: #dc2626;
}

.inline-date-input.text-warning[b-t35xok4wlx] {
    color: #d97706;
}

/* Inline select dropdowns for quick editing */
.inline-select[b-t35xok4wlx] {
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid transparent;
    border-radius: 6px;
    padding: 0.25rem 1.5rem 0.25rem 0.5rem;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    max-width: 100%;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.35rem center;
    background-size: 0.65rem;
}

.inline-select:hover[b-t35xok4wlx] {
    border-color: #d1d5db;
}

.inline-select:focus[b-t35xok4wlx] {
    outline: none;
    border-color: #93c5fd;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15);
}

.status-select[b-t35xok4wlx] {
    color: #fff;
    font-weight: 600;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

.status-select option[b-t35xok4wlx] {
    background: #fff;
    color: #1f2937;
    font-weight: 500;
}

.employee-select[b-t35xok4wlx] {
    background-color: #f9fafb;
    color: #374151;
}

/* Prevent table from overflowing the page */
.data-table[b-t35xok4wlx] {
    table-layout: fixed;
}
/* /Components/Pages/Customers/Projects/ProjectTree.razor.rz.scp.css */
/* Tree Summary */
.tree-summary[b-8yruocxq0a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1rem;
    font-size: 0.875rem;
    color: #495057;
}

.summary-separator[b-8yruocxq0a] {
    color: #adb5bd;
}

/* Tree Controls */
.tree-controls[b-8yruocxq0a] {
    display: flex;
    gap: 0.5rem;
}

.tree-controls .btn[b-8yruocxq0a] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
}

/* Tree Container */
.tree-container[b-8yruocxq0a] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    overflow: hidden;
}

.tree-header[b-8yruocxq0a] {
    display: flex;
    align-items: center;
    padding: 0.625rem 0;
    background: #f8f9fa;
    border-bottom: 2px solid #e9ecef;
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Tree Columns */
.tree-col[b-8yruocxq0a] {
    padding: 0.5rem 0.75rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tree-col-name[b-8yruocxq0a] {
    flex: 1;
    min-width: 250px;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.tree-col-status[b-8yruocxq0a] {
    width: 300px;
    white-space: normal;
    overflow: visible;
}

.tree-col-assigned[b-8yruocxq0a] {
    width: 140px;
}

.tree-col-hours[b-8yruocxq0a] {
    width: 100px;
    text-align: right;
}

.tree-col-estimate[b-8yruocxq0a] {
    width: 90px;
    text-align: right;
}

.tree-col-target[b-8yruocxq0a] {
    width: 110px;
    text-align: right;
}

/* Tree Rows */
.tree-row[b-8yruocxq0a] {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #f0f0f0;
    transition: background-color 0.15s ease;
    font-size: 0.875rem;
}

.tree-row:last-child[b-8yruocxq0a] {
    border-bottom: none;
}

.tree-row:hover[b-8yruocxq0a] {
    background-color: #f8f9ff;
}

.tree-row.overdue[b-8yruocxq0a] {
    background-color: #fff8f8;
}

.tree-row.overdue:hover[b-8yruocxq0a] {
    background-color: #fff0f0;
}

/* Toggle Button */
.tree-toggle[b-8yruocxq0a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border: none;
    background: none;
    cursor: pointer;
    padding: 0;
    border-radius: 4px;
    color: #6c757d;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.tree-toggle:hover[b-8yruocxq0a] {
    background-color: #e9ecef;
    color: #333;
}

.toggle-icon[b-8yruocxq0a] {
    transition: transform 0.2s ease;
}

.toggle-icon.expanded[b-8yruocxq0a] {
    transform: rotate(90deg);
}

.tree-toggle-spacer[b-8yruocxq0a] {
    display: inline-block;
    width: 22px;
    flex-shrink: 0;
}

/* Node Info */
.node-info[b-8yruocxq0a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
    overflow: hidden;
}

.node-name[b-8yruocxq0a] {
    font-weight: 500;
    color: #333;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.node-name:hover[b-8yruocxq0a] {
    color: #1b4a98;
    text-decoration: underline;
}

.node-customer[b-8yruocxq0a] {
    font-size: 0.75rem;
    color: #6c757d;
    background: #f0f0f0;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
    white-space: nowrap;
    flex-shrink: 0;
}

.node-child-count[b-8yruocxq0a] {
    font-size: 0.6875rem;
    color: #1b4a98;
    background: #d4e5ff;
    padding: 0.0625rem 0.375rem;
    border-radius: 8px;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Hours */
.hours-own[b-8yruocxq0a] {
    color: #495057;
}

.hours-total[b-8yruocxq0a] {
    font-weight: 600;
    color: #1b4a98;
}

/* Status Badges */
.status-badge[b-8yruocxq0a] {
    display: inline-block;
    padding: 0.1875rem 0.625rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
    white-space: normal;
    word-wrap: break-word;
    line-height: 1.3;
}

.badge-primary[b-8yruocxq0a] {
    background-color: #d4e5ff;
    color: #1b4a98;
}

.badge-success[b-8yruocxq0a] {
    background-color: #d4edda;
    color: #155724;
}

.badge-warning[b-8yruocxq0a] {
    background-color: #fff3cd;
    color: #856404;
}

.badge-danger[b-8yruocxq0a] {
    background-color: #f8d7da;
    color: #721c24;
}

.badge-info[b-8yruocxq0a] {
    background-color: #d1ecf1;
    color: #0c5460;
}

.badge-secondary[b-8yruocxq0a] {
    background-color: #e9ecef;
    color: #495057;
}

.text-danger[b-8yruocxq0a] {
    color: #dc3545;
    font-weight: 500;
}

/* Loading & Empty States */
.loading-container[b-8yruocxq0a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
}

.empty-state[b-8yruocxq0a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
}

/* Filter actions alignment */
.filter-actions[b-8yruocxq0a] {
    display: flex;
    flex-direction: column;
}

/* Actions Column */
.tree-col-actions[b-8yruocxq0a] {
    width: 44px;
    text-align: center;
    flex-shrink: 0;
}

.btn-delete-node[b-8yruocxq0a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: none;
    cursor: pointer;
    padding: 0;
    border-radius: 6px;
    color: #adb5bd;
    transition: all 0.15s ease;
    opacity: 0;
}

.tree-row:hover .btn-delete-node[b-8yruocxq0a] {
    opacity: 1;
}

.btn-delete-node:hover[b-8yruocxq0a] {
    background-color: #f8d7da;
    color: #dc3545;
}

/* Delete Confirmation Modal */
.delete-backdrop[b-8yruocxq0a] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.delete-modal[b-8yruocxq0a] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.delete-modal .modal-header[b-8yruocxq0a] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.delete-modal .modal-header h3[b-8yruocxq0a] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
}

.delete-modal .modal-body[b-8yruocxq0a] {
    padding: 1.25rem 1.5rem;
}

.delete-modal .modal-body p[b-8yruocxq0a] {
    margin-bottom: 0.75rem;
}

.delete-modal .modal-body p:last-child[b-8yruocxq0a] {
    margin-bottom: 0;
}

.delete-modal .modal-footer[b-8yruocxq0a] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

.text-warning[b-8yruocxq0a] {
    color: #e67e00;
    font-weight: 500;
}

/* Drag & Drop */
.tree-row.dragging[b-8yruocxq0a] {
    opacity: 0.4;
}

.tree-row.drag-over[b-8yruocxq0a] {
    background-color: #d4e5ff;
    box-shadow: inset 0 0 0 2px #1b4a98;
    border-radius: 4px;
}

.tree-root-drop[b-8yruocxq0a] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem;
    color: #adb5bd;
    font-size: 0.8125rem;
    border-top: 1px dashed #dee2e6;
    transition: all 0.15s ease;
}

.tree-root-drop.drag-over[b-8yruocxq0a] {
    background-color: #d4e5ff;
    color: #1b4a98;
    border-top-color: #1b4a98;
}

/* Move Confirmation Modal */
.move-backdrop[b-8yruocxq0a] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.move-modal[b-8yruocxq0a] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.move-modal .modal-header[b-8yruocxq0a] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.move-modal .modal-header h3[b-8yruocxq0a] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
}

.move-modal .modal-body[b-8yruocxq0a] {
    padding: 1.25rem 1.5rem;
}

.move-modal .modal-body p[b-8yruocxq0a] {
    margin-bottom: 0.75rem;
}

.move-modal .modal-body p:last-child[b-8yruocxq0a] {
    margin-bottom: 0;
}

.move-modal .modal-footer[b-8yruocxq0a] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

/* Responsive adjustments */
@media (max-width: 1200px) {
    .tree-col-assigned[b-8yruocxq0a] {
        display: none;
    }

    .tree-col-estimate[b-8yruocxq0a] {
        display: none;
    }
}

@media (max-width: 992px) {
    .tree-col-target[b-8yruocxq0a] {
        display: none;
    }

    .tree-col-status[b-8yruocxq0a] {
        display: none;
    }
}
/* /Components/Pages/Customers/Projects/ProjectView.razor.rz.scp.css */
/* Error container */
.error-container[b-48ryg6f0c8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    text-align: center;
}

/* Breadcrumb last child */
.breadcrumb span[b-48ryg6f0c8] { color: #6c757d; }

/* Page meta badges */
.page-meta[b-48ryg6f0c8] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
    flex-wrap: wrap;
}

/* Button variants */
.btn-success[b-48ryg6f0c8] { background-color: #28a745; color: white; }
.btn-success:hover[b-48ryg6f0c8] { background-color: #218838; }
.btn-danger[b-48ryg6f0c8] { background-color: #dc3545; color: white; }
.btn-danger:hover[b-48ryg6f0c8] { background-color: #c82333; }

/* Badge variants */
.badge-primary[b-48ryg6f0c8] { background-color: #d4e5ff; color: #1b4a98; }
.badge-danger[b-48ryg6f0c8] { background-color: #f8d7da; color: #721c24; }

/* Content Grid */
.content-grid[b-48ryg6f0c8] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 1.5rem;
}

.content-grid .full-width[b-48ryg6f0c8] { grid-column: 1 / -1; }

/* Two-column layout: left = description + comments, right = progress/details/team */
.left-column[b-48ryg6f0c8],
.right-column[b-48ryg6f0c8] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Progress Card */
.progress-card .card-body[b-48ryg6f0c8] { padding: 1.5rem; }

.progress-overview[b-48ryg6f0c8] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.progress-bar-large[b-48ryg6f0c8] {
    width: 100%;
    height: 12px;
    background-color: #e9ecef;
    border-radius: 6px;
    overflow: hidden;
}

.progress-fill[b-48ryg6f0c8] {
    height: 100%;
    background: linear-gradient(90deg, #1b4a98, #2d6fd6);
    border-radius: 6px;
    transition: width 0.3s ease;
}

.progress-stats[b-48ryg6f0c8] {
    display: flex;
    justify-content: space-around;
    text-align: center;
}

.stat[b-48ryg6f0c8] { display: flex; flex-direction: column; gap: 0.25rem; }
.stat-value[b-48ryg6f0c8] { font-size: 1.5rem; font-weight: 600; color: #333; }
.stat-label[b-48ryg6f0c8] { font-size: 0.75rem; color: #6c757d; text-transform: uppercase; letter-spacing: 0.5px; }

/* Detail grid two-column */
.detail-grid[b-48ryg6f0c8] { grid-template-columns: repeat(2, 1fr); }

.detail-label[b-48ryg6f0c8] { font-size: 0.75rem; font-weight: 600; color: #6c757d; text-transform: uppercase; letter-spacing: 0.5px; }
.detail-value[b-48ryg6f0c8] { font-size: 0.9rem; color: #333; }
.detail-value a[b-48ryg6f0c8] { color: #1b4a98; text-decoration: none; }
.detail-value a:hover[b-48ryg6f0c8] { text-decoration: underline; }

/* Team List */
.team-list[b-48ryg6f0c8] { display: flex; flex-direction: column; gap: 1rem; }

.team-member[b-48ryg6f0c8] {
    display: flex;
    gap: 0.75rem;
    padding: 0.75rem;
    background-color: #f8f9fa;
    border-radius: 8px;
}

.member-avatar[b-48ryg6f0c8] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: 600;
    flex-shrink: 0;
}

.member-info[b-48ryg6f0c8] { display: flex; flex-direction: column; gap: 0.125rem; }
.member-name[b-48ryg6f0c8] { font-weight: 500; color: #333; }
.member-role[b-48ryg6f0c8] { font-size: 0.8rem; color: #6c757d; }
.member-email[b-48ryg6f0c8] { font-size: 0.8rem; color: #1b4a98; text-decoration: none; }
.member-email:hover[b-48ryg6f0c8] { text-decoration: underline; }

/* Description */
.short-description[b-48ryg6f0c8] { font-style: italic; color: #6c757d; margin-bottom: 1rem; }
.full-description[b-48ryg6f0c8] { line-height: 1.6; }

.text-danger[b-48ryg6f0c8] { color: #dc3545; }

/* Comments */
.comment-card[b-48ryg6f0c8] {
    overflow: visible;
}

.comment-count[b-48ryg6f0c8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 0.5rem;
    border-radius: 12px;
    background-color: #e9ecef;
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
}

.comment-input-area[b-48ryg6f0c8] {
    display: flex;
    gap: 0.75rem;
    padding-bottom: 0.5rem;
    margin-bottom: 0;
}

.comment-hint[b-48ryg6f0c8] {
    display: block;
    font-size: 0.7rem;
    color: #adb5bd;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
    margin-bottom: 1rem;
    text-align: right;
}

.comment-hint kbd[b-48ryg6f0c8] {
    display: inline-block;
    padding: 0 4px;
    font-size: 0.65rem;
    font-family: inherit;
    background-color: #f0f0f0;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    box-shadow: 0 1px 0 #d1d5db;
    color: #6b7280;
}

.comment-input-wrapper[b-48ryg6f0c8] {
    flex: 1;
    position: relative;
}

.comment-textarea[b-48ryg6f0c8] {
    resize: none;
    font-size: 0.875rem;
    padding-right: 3rem;
}

.comment-submit[b-48ryg6f0c8] {
    position: absolute;
    right: 0.5rem;
    bottom: 0.5rem;
    padding: 0.25rem 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.comment-list[b-48ryg6f0c8] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.comment-item[b-48ryg6f0c8] {
    display: flex;
    gap: 0.75rem;
}

.comment-avatar[b-48ryg6f0c8] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 600;
    flex-shrink: 0;
}

.comment-content[b-48ryg6f0c8] {
    flex: 1;
    min-width: 0;
}

.comment-header[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.comment-author[b-48ryg6f0c8] {
    font-weight: 600;
    font-size: 0.8125rem;
    color: #333;
}

.comment-time[b-48ryg6f0c8] {
    font-size: 0.75rem;
    color: #adb5bd;
}

.comment-delete[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border: none;
    background: none;
    color: #adb5bd;
    cursor: pointer;
    border-radius: 4px;
    padding: 0;
    margin-left: auto;
    opacity: 0;
    transition: all 0.15s ease;
}

.comment-item:hover .comment-delete[b-48ryg6f0c8] {
    opacity: 1;
}

.comment-delete:hover[b-48ryg6f0c8] {
    background-color: #f8d7da;
    color: #dc3545;
}

.comment-body[b-48ryg6f0c8] {
    font-size: 0.875rem;
    line-height: 1.5;
    color: #495057;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.comment-body[b-48ryg6f0c8]  .mention-tag {
    background-color: #e9ecef;
    color: #1b4a98;
    padding: 1px 4px;
    border-radius: 4px;
    font-weight: 500;
}

/* Mention Dropdown */
.mention-dropdown[b-48ryg6f0c8] {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    max-height: 220px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 1050;
    margin-top: 4px;
    padding: 0.25rem;
}

.mention-item[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.625rem;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.1s ease;
}

.mention-item:hover[b-48ryg6f0c8],
.mention-item.selected[b-48ryg6f0c8] {
    background-color: #f0f4ff;
}

.mention-avatar[b-48ryg6f0c8] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, #6f42c1 0%, #8e5cd9 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6rem;
    font-weight: 600;
    flex-shrink: 0;
}

.mention-name[b-48ryg6f0c8] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #333;
}

/* Work Logs Section */
.work-logs-summary[b-48ryg6f0c8] {
    display: flex;
    gap: 2rem;
    padding: 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1rem;
}

.summary-stat[b-48ryg6f0c8] { display: flex; flex-direction: column; gap: 0.125rem; }
.summary-value[b-48ryg6f0c8] { font-size: 1.25rem; font-weight: 600; color: #333; }
.summary-label[b-48ryg6f0c8] { font-size: 0.7rem; color: #6c757d; text-transform: uppercase; letter-spacing: 0.5px; }

.work-logs-table[b-48ryg6f0c8] { width: 100%; border-collapse: collapse; }

.work-logs-table th[b-48ryg6f0c8] {
    padding: 0.75rem;
    text-align: left;
    font-size: 0.7rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1px solid #e9ecef;
}

.work-logs-table td[b-48ryg6f0c8] {
    padding: 0.75rem;
    border-bottom: 1px solid #e9ecef;
    font-size: 0.875rem;
    color: #333;
    vertical-align: middle;
}

.work-logs-table tbody tr:last-child td[b-48ryg6f0c8] { border-bottom: none; }
.work-logs-table .clickable-row[b-48ryg6f0c8] { cursor: pointer; transition: background-color 0.15s ease; }
.work-logs-table .clickable-row:hover[b-48ryg6f0c8] { background-color: #f8f9fa; }

.date-display[b-48ryg6f0c8] { display: block; font-weight: 500; }
.time-display[b-48ryg6f0c8] { display: block; font-size: 0.75rem; color: #6c757d; }

.staff-avatar-small[b-48ryg6f0c8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    font-size: 0.6rem;
    font-weight: 600;
    margin-right: 0.5rem;
    vertical-align: middle;
}

.task-description[b-48ryg6f0c8] { color: #555; }

.work-logs-pagination[b-48ryg6f0c8] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 0;
    border-top: 1px solid #e9ecef;
    margin-top: 0.5rem;
}

.btn-page-sm[b-48ryg6f0c8] {
    padding: 0.375rem 0.75rem;
    font-size: 0.8rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background-color: white;
    color: #333;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-page-sm:hover:not(:disabled)[b-48ryg6f0c8] { background-color: #f8f9fa; border-color: #1b4a98; color: #1b4a98; }
.btn-page-sm:disabled[b-48ryg6f0c8] { opacity: 0.5; cursor: not-allowed; }
.page-info-sm[b-48ryg6f0c8] { font-size: 0.8rem; color: #6c757d; }

.view-all-link[b-48ryg6f0c8] { text-align: center; padding-top: 1rem; }
.view-all-link a[b-48ryg6f0c8] { color: #1b4a98; text-decoration: none; font-size: 0.875rem; }
.view-all-link a:hover[b-48ryg6f0c8] { text-decoration: underline; }

.view-all-container[b-48ryg6f0c8] {
    display: flex;
    justify-content: center;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
    margin-top: 0.5rem;
}

/* Delete Confirmation Modal */
.delete-backdrop[b-48ryg6f0c8] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.delete-modal[b-48ryg6f0c8] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.delete-modal .modal-header[b-48ryg6f0c8] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.delete-modal .modal-header h3[b-48ryg6f0c8] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
}

.delete-modal .modal-body[b-48ryg6f0c8] {
    padding: 1.25rem 1.5rem;
}

.delete-modal .modal-body p[b-48ryg6f0c8] {
    margin-bottom: 0.75rem;
}

.delete-modal .modal-body p:last-child[b-48ryg6f0c8] {
    margin-bottom: 0;
}

.delete-modal .modal-footer[b-48ryg6f0c8] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

.text-warning[b-48ryg6f0c8] {
    color: #e67e00;
    font-weight: 500;
}

.loading-inline[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2rem;
    color: #6c757d;
}

.spinner-small[b-48ryg6f0c8] {
    width: 20px;
    height: 20px;
    border: 2px solid #e9ecef;
    border-top-color: #1b4a98;
    border-radius: 50%;
    animation: spin-b-48ryg6f0c8 0.8s linear infinite;
}

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

.empty-state-inline[b-48ryg6f0c8] { text-align: center; padding: 2rem; }

/* Card Header with Action Button */
.card-header-with-action[b-48ryg6f0c8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Responsive */
@media (max-width: 992px) {
    .content-grid[b-48ryg6f0c8] { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .page-header-right[b-48ryg6f0c8] { width: 100%; justify-content: flex-start; }
    .work-logs-table[b-48ryg6f0c8] { display: block; overflow-x: auto; }
    .work-logs-summary[b-48ryg6f0c8] { flex-direction: column; gap: 0.75rem; }
    .sub-tree-col-assigned[b-48ryg6f0c8] { display: none; }
}

/* Sub-Project Tree */
.sub-tree-controls[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.sub-tree-controls .btn[b-48ryg6f0c8] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
}

.sub-tree-count[b-48ryg6f0c8] {
    font-size: 0.8125rem;
    color: #6c757d;
    margin-left: auto;
}

.sub-tree-container[b-48ryg6f0c8] {
    border: 1px solid #e9ecef;
    border-radius: 6px;
    overflow: hidden;
}

.sub-tree-header[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    padding: 0.5rem 0;
    background: #f8f9fa;
    border-bottom: 2px solid #e9ecef;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.sub-tree-col[b-48ryg6f0c8] {
    padding: 0.375rem 0.625rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sub-tree-col-name[b-48ryg6f0c8] {
    flex: 1;
    min-width: 180px;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.sub-tree-col-status[b-48ryg6f0c8] {
    width: 130px;
    white-space: normal;
    overflow: visible;
}

.sub-tree-col-assigned[b-48ryg6f0c8] {
    width: 110px;
}

.sub-tree-col-hours[b-48ryg6f0c8] {
    width: 85px;
    text-align: right;
}

.sub-tree-row[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #f0f0f0;
    font-size: 0.8125rem;
    transition: background-color 0.15s ease;
}

.sub-tree-row:last-child[b-48ryg6f0c8] {
    border-bottom: none;
}

.sub-tree-row:hover[b-48ryg6f0c8] {
    background-color: #f8f9ff;
}

.sub-tree-row.overdue[b-48ryg6f0c8] {
    background-color: #fff8f8;
}

.sub-tree-row.overdue:hover[b-48ryg6f0c8] {
    background-color: #fff0f0;
}

.sub-tree-toggle[b-48ryg6f0c8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border: none;
    background: none;
    cursor: pointer;
    padding: 0;
    border-radius: 3px;
    color: #6c757d;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.sub-tree-toggle:hover[b-48ryg6f0c8] {
    background-color: #e9ecef;
    color: #333;
}

.sub-toggle-icon[b-48ryg6f0c8] {
    transition: transform 0.2s ease;
}

.sub-toggle-icon.expanded[b-48ryg6f0c8] {
    transform: rotate(90deg);
}

.sub-tree-toggle-spacer[b-48ryg6f0c8] {
    display: inline-block;
    width: 20px;
    flex-shrink: 0;
}

.sub-node-name[b-48ryg6f0c8] {
    font-weight: 500;
    color: #333;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sub-node-name:hover[b-48ryg6f0c8] {
    color: #1b4a98;
    text-decoration: underline;
}

.sub-node-child-count[b-48ryg6f0c8] {
    font-size: 0.625rem;
    color: #1b4a98;
    background: #d4e5ff;
    padding: 0.0625rem 0.3125rem;
    border-radius: 6px;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Sub-project totals row */
.sub-tree-totals[b-48ryg6f0c8] {
    background-color: #f0f4ff;
    border-top: 2px solid #d4e5ff;
    font-size: 0.8125rem;
}

/* Card header with multiple actions */
.card-header-actions[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Toggle for include sub-projects checkbox */
.toggle-include-sub[b-48ryg6f0c8] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    color: #4b5563;
    cursor: pointer;
    white-space: nowrap;
}

.toggle-include-sub input[type="checkbox"][b-48ryg6f0c8] {
    accent-color: #1b4a98;
    cursor: pointer;
}

/* Work logs table footer totals */
.totals-row[b-48ryg6f0c8] {
    background-color: #f0f4ff;
}

.totals-row td[b-48ryg6f0c8] {
    border-top: 2px solid #d4e5ff;
    border-bottom: none;
    font-size: 0.8125rem;
}

.totals-label[b-48ryg6f0c8] {
    font-weight: 600;
    color: #4b5563;
    text-align: right;
}

/* Text alignment for numeric columns */
.text-right[b-48ryg6f0c8] {
    text-align: right;
}

/* File Upload Zone */
.file-upload-zone[b-48ryg6f0c8] {
    position: relative;
    border: 2px dashed #d1d5db;
    border-radius: 8px;
    padding: 0.75rem;
    text-align: center;
    transition: all 0.2s ease;
    margin-bottom: 0.5rem;
    background-color: #fafbfc;
}

.file-upload-zone:hover[b-48ryg6f0c8],
.file-upload-zone.drag-over[b-48ryg6f0c8] {
    border-color: #1b4a98;
    background-color: #f0f4ff;
}

[b-48ryg6f0c8] .file-input-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

.file-upload-label[b-48ryg6f0c8] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #6c757d;
    pointer-events: none;
    position: relative;
    z-index: 1;
}

.file-upload-label svg[b-48ryg6f0c8] {
    color: #adb5bd;
}

.file-upload-zone:hover .file-upload-label svg[b-48ryg6f0c8],
.file-upload-zone.drag-over .file-upload-label svg[b-48ryg6f0c8] {
    color: #1b4a98;
}

.upload-text[b-48ryg6f0c8] {
    font-size: 0.8125rem;
    color: #6c757d;
}

.upload-text strong[b-48ryg6f0c8] {
    color: #1b4a98;
}

.upload-hint[b-48ryg6f0c8] {
    font-size: 0.7rem;
    color: #adb5bd;
}

/* File Count Badge */
.file-count[b-48ryg6f0c8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 0.5rem;
    border-radius: 12px;
    background-color: #e9ecef;
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
}

/* File List */
.file-list[b-48ryg6f0c8] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.file-item[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.5rem;
    border-bottom: 1px solid #f0f0f0;
    transition: background-color 0.15s ease;
}

.file-item:last-child[b-48ryg6f0c8] {
    border-bottom: none;
}

.file-item:hover[b-48ryg6f0c8] {
    background-color: #f8f9fa;
}

.file-icon[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 6px;
    background-color: #f0f4ff;
    color: #1b4a98;
    flex-shrink: 0;
}

.file-info[b-48ryg6f0c8] {
    flex: 1;
    min-width: 0;
}

.file-name-row[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.file-name-link[b-48ryg6f0c8] {
    font-weight: 500;
    font-size: 0.8125rem;
    color: #1b4a98;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.file-name-link:hover[b-48ryg6f0c8] {
    text-decoration: underline;
}

.file-name-text[b-48ryg6f0c8] {
    font-weight: 500;
    font-size: 0.8125rem;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.file-meta[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    color: #6c757d;
    margin-top: 0;
    flex-wrap: wrap;
}

.meta-sep[b-48ryg6f0c8] {
    color: #d1d5db;
}

.file-path-display[b-48ryg6f0c8] {
    max-width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 0.7rem;
    color: #6c757d;
}

.file-signoff-checkbox[b-48ryg6f0c8] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    color: #495057;
    cursor: pointer;
    user-select: none;
}

.file-signoff-checkbox input[type="checkbox"][b-48ryg6f0c8] {
    cursor: pointer;
    margin: 0;
}

.file-signoff-checkbox input[type="checkbox"]:disabled[b-48ryg6f0c8] {
    cursor: not-allowed;
}

.file-delete-btn[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: none;
    background: none;
    color: #adb5bd;
    cursor: pointer;
    border-radius: 6px;
    padding: 0;
    flex-shrink: 0;
    opacity: 0;
    transition: all 0.15s ease;
}

.file-item:hover .file-delete-btn[b-48ryg6f0c8] {
    opacity: 1;
}

.file-delete-btn:hover[b-48ryg6f0c8] {
    background-color: #f8d7da;
    color: #dc3545;
}

/* File Modal */
.file-modal-backdrop[b-48ryg6f0c8] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
}

.file-modal[b-48ryg6f0c8] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.file-modal .modal-header[b-48ryg6f0c8] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.file-modal .modal-header h3[b-48ryg6f0c8] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
}

.file-modal .modal-close[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: none;
    color: #6c757d;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 4px;
}

.file-modal .modal-close:hover[b-48ryg6f0c8] {
    background-color: #f0f0f0;
    color: #333;
}

.file-modal .modal-body[b-48ryg6f0c8] {
    padding: 1.25rem 1.5rem;
}

.file-modal .modal-body .form-group[b-48ryg6f0c8] {
    margin-bottom: 1rem;
}

.file-modal .modal-body .form-group:last-child[b-48ryg6f0c8] {
    margin-bottom: 0;
}

.file-modal .modal-body label[b-48ryg6f0c8] {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.375rem;
}

.file-modal .modal-body .form-control[b-48ryg6f0c8] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    outline: none;
    transition: border-color 0.15s ease;
    box-sizing: border-box;
}

.file-modal .modal-body .form-control:focus[b-48ryg6f0c8] {
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

.file-modal .modal-body p[b-48ryg6f0c8] {
    margin-bottom: 0.75rem;
}

.file-modal .modal-body p:last-child[b-48ryg6f0c8] {
    margin-bottom: 0;
}

.file-modal .modal-footer[b-48ryg6f0c8] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

/* Badge variant for links */
.badge-info[b-48ryg6f0c8] {
    background-color: #d1ecf1;
    color: #0c5460;
}

/* Full-width detail item spanning all grid columns */
.full-width-item[b-48ryg6f0c8] {
    grid-column: 1 / -1;
}

/* Signoff Cards Grid */
.signoff-cards-grid[b-48ryg6f0c8] {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.signoff-card .card-header h2[b-48ryg6f0c8] {
    font-size: 1.125rem;
}

.signoff-card-body[b-48ryg6f0c8] {
    padding: 1rem !important;
}

.signoff-row[b-48ryg6f0c8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.signoff-row:last-child[b-48ryg6f0c8] {
    border-bottom: none;
}

.signoff-detail-item[b-48ryg6f0c8] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.signoff-detail-item:last-child[b-48ryg6f0c8] {
    border-bottom: none;
}

.signoff-detail-item .detail-label[b-48ryg6f0c8] {
    font-size: 0.6875rem;
}

.signoff-detail-item .detail-value[b-48ryg6f0c8] {
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.signoff-details[b-48ryg6f0c8] {
    font-size: 0.75rem;
    color: #6b7280;
    margin-top: 0.25rem;
    line-height: 1.4;
}

.signoff-reminder-note[b-48ryg6f0c8] {
    font-size: 0.6875rem;
    color: #92400e;
    margin-top: 0.25rem;
    font-style: italic;
}

.signoff-testimonial[b-48ryg6f0c8],
.signoff-url-item[b-48ryg6f0c8] {
    padding: 0.625rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.signoff-testimonial:last-child[b-48ryg6f0c8],
.signoff-url-item:last-child[b-48ryg6f0c8] {
    border-bottom: none;
}

.signoff-testimonial[b-48ryg6f0c8] {
    padding-top: 0.75rem;
}

.signoff-url-item .signoff-url-link[b-48ryg6f0c8] {
    flex: 1;
    min-width: 0;
}

/* Responsive: Stack cards on smaller screens */
@media (max-width: 1024px) {
    .signoff-cards-grid[b-48ryg6f0c8] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .signoff-row[b-48ryg6f0c8] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
}

/* Testimonial text styling */
.testimonial-text[b-48ryg6f0c8] {
    font-style: italic;
    font-weight: 400 !important;
    line-height: 1.6;
}

/* Signoff URL row */
.signoff-url-row[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.signoff-url-link[b-48ryg6f0c8] {
    font-size: 0.8rem;
    color: #3b82f6;
    word-break: break-all;
    line-height: 1.4;
    min-width: 0;
}

.signoff-url-link:hover[b-48ryg6f0c8] {
    color: #1d4ed8;
    text-decoration: underline;
}

.btn-copy[b-48ryg6f0c8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid #d1d5db;
    background: #ffffff;
    border-radius: 6px;
    color: #64748b;
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.btn-copy:hover[b-48ryg6f0c8] {
    background: #f1f5f9;
    border-color: #94a3b8;
    color: #334155;
}

/* Send button icons - make SVG white on primary buttons */
.btn-primary svg[b-48ryg6f0c8] {
    stroke: white;
}

/* Danger Zone */
.danger-zone-card[b-48ryg6f0c8] {
    margin-top: 3rem;
    background: linear-gradient(to bottom, #fff5f5 0%, #ffffff 100%);
    border: 2px solid #ef4444;
    border-radius: 12px;
    overflow: hidden;
}

.danger-zone-header[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    background: #fee2e2;
    border-bottom: 1px solid #fca5a5;
}

.danger-zone-header svg[b-48ryg6f0c8] {
    color: #dc2626;
    flex-shrink: 0;
}

.danger-zone-header h2[b-48ryg6f0c8] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #991b1b;
}

.danger-zone-body[b-48ryg6f0c8] {
    padding: 1.5rem;
}

.danger-zone-description[b-48ryg6f0c8] {
    margin: 0 0 1.5rem 0;
    padding: 0.75rem 1rem;
    background: #fef2f2;
    border-left: 3px solid #f87171;
    color: #7f1d1d;
    font-size: 0.9rem;
}

.danger-zone-actions[b-48ryg6f0c8] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.danger-action-item[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    gap: 1rem;
}

.danger-action-item.disabled[b-48ryg6f0c8] {
    opacity: 0.5;
    background: #f9fafb;
}

.danger-action-info[b-48ryg6f0c8] {
    flex: 1;
}

.danger-action-info h3[b-48ryg6f0c8] {
    margin: 0 0 0.25rem 0;
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
}

.danger-action-info p[b-48ryg6f0c8] {
    margin: 0;
    font-size: 0.875rem;
    color: #6b7280;
}

.btn-danger-action[b-48ryg6f0c8] {
    padding: 0.5rem 1rem;
    background: #dc2626;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s ease;
}

.btn-danger-action:hover[b-48ryg6f0c8] {
    background: #b91c1c;
    transform: translateY(-1px);
}

.btn-danger-action:active[b-48ryg6f0c8] {
    transform: translateY(0);
}

/* Danger Modal */
.danger-modal-backdrop[b-48ryg6f0c8] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
}

.danger-modal[b-48ryg6f0c8] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.danger-modal .modal-header[b-48ryg6f0c8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.danger-modal .modal-header h3[b-48ryg6f0c8] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #991b1b;
}

.danger-modal .modal-body[b-48ryg6f0c8] {
    padding: 1.5rem;
}

.danger-modal .modal-body p[b-48ryg6f0c8] {
    margin: 0 0 1rem 0;
    color: #4b5563;
    line-height: 1.6;
}

.danger-modal .modal-body p:last-child[b-48ryg6f0c8] {
    margin-bottom: 0;
}

.danger-modal .modal-body ul[b-48ryg6f0c8] {
    margin: 0.5rem 0 1rem 0;
    padding-left: 1.5rem;
    color: #6b7280;
}

.danger-modal .modal-body ul li[b-48ryg6f0c8] {
    margin-bottom: 0.25rem;
}

.danger-modal .modal-footer[b-48ryg6f0c8] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
}

@media (max-width: 768px) {
    .danger-action-item[b-48ryg6f0c8] {
        flex-direction: column;
        align-items: flex-start;
    }

    .btn-danger-action[b-48ryg6f0c8] {
        width: 100%;
    }
}
/* /Components/Pages/Customers/Projects/SmChecklist.razor.rz.scp.css */
/* Current Site Card */
.current-site-card[b-4ugeqmbp5r] {
    overflow: visible;
    margin-bottom: 1.5rem;
}

.site-header[b-4ugeqmbp5r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
}

.site-name-link[b-4ugeqmbp5r] {
    font-size: 1.125rem;
    font-weight: 600;
    color: white;
    text-decoration: none;
}

.site-name-link:hover[b-4ugeqmbp5r] {
    text-decoration: underline;
    color: #e0e8ff;
}

.site-counter[b-4ugeqmbp5r] {
    font-size: 0.8rem;
    opacity: 0.8;
}

.site-errors[b-4ugeqmbp5r] {
    padding: 0.75rem 1.5rem;
    background-color: #fef2f2;
    border-bottom: 1px solid #fecaca;
}

.site-errors p[b-4ugeqmbp5r] {
    margin: 0 0 0.25rem;
    color: #dc2626;
    font-weight: 600;
    font-size: 0.875rem;
}

.site-errors p:last-child[b-4ugeqmbp5r] {
    margin-bottom: 0;
}

/* Workspace Layout */
.site-workspace[b-4ugeqmbp5r] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1.5rem;
    padding: 1.5rem;
}

.workspace-label[b-4ugeqmbp5r] {
    display: block;
    font-weight: 600;
    font-size: 0.8125rem;
    color: #374151;
    margin-bottom: 0.5rem;
}

.workspace-log[b-4ugeqmbp5r] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.log-textarea[b-4ugeqmbp5r] {
    resize: vertical;
    font-size: 0.875rem;
    min-height: 100px;
}

.log-actions[b-4ugeqmbp5r] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.timer-hint[b-4ugeqmbp5r] {
    font-size: 0.75rem;
    color: #6b7280;
}

.submit-message[b-4ugeqmbp5r] {
    font-size: 0.8125rem;
    padding: 0.375rem 0.75rem;
    border-radius: 6px;
}

.submit-message.success[b-4ugeqmbp5r] {
    background-color: #f0fdf4;
    color: #166534;
    border: 1px solid #bbf7d0;
}

/* Common Logs */
.workspace-common[b-4ugeqmbp5r] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.common-log-buttons[b-4ugeqmbp5r] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    max-height: 320px;
    overflow-y: auto;
}

.btn-common-log[b-4ugeqmbp5r] {
    display: block;
    width: 100%;
    text-align: left;
    padding: 0.375rem 0.625rem;
    font-size: 0.8rem;
    background-color: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    color: #374151;
    cursor: pointer;
    transition: all 0.1s ease;
}

.btn-common-log:hover[b-4ugeqmbp5r] {
    background-color: #e0e7ff;
    border-color: #c7d2fe;
    color: #1b4a98;
}

/* Site Details / Scratch Pads */
.workspace-details[b-4ugeqmbp5r] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.site-notes[b-4ugeqmbp5r] {
    font-size: 0.8125rem;
    color: #6b7280;
    line-height: 1.5;
    margin-bottom: 0.75rem;
    white-space: pre-wrap;
}

.scratch-row[b-4ugeqmbp5r] {
    display: flex;
    gap: 0.375rem;
    margin-bottom: 0.25rem;
}

.scratch-input[b-4ugeqmbp5r] {
    flex: 1;
    font-size: 0.8125rem;
    padding: 0.25rem 0.5rem;
}

/* Sites Table */
.sites-table-card[b-4ugeqmbp5r] {
    overflow: hidden;
}

.sites-table[b-4ugeqmbp5r] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.sites-table thead th[b-4ugeqmbp5r] {
    padding: 0.75rem 1rem;
    text-align: left;
    background-color: #1b4a98;
    color: white;
    font-weight: 600;
    font-size: 0.8125rem;
}

.sites-table tbody tr[b-4ugeqmbp5r] {
    border-bottom: 1px solid #e5e7eb;
    transition: background-color 0.1s ease;
}

.sites-table tbody tr:hover[b-4ugeqmbp5r] {
    background-color: #f0f4ff;
}

.sites-table tbody tr.active-row[b-4ugeqmbp5r] {
    background-color: #e0e7ff;
    font-weight: 500;
}

.sites-table tbody tr.overdue-red[b-4ugeqmbp5r] {
    background-color: #fef2f2;
}

.sites-table tbody tr.overdue-red:hover[b-4ugeqmbp5r] {
    background-color: #fee2e2;
}

.sites-table tbody tr.overdue-orange[b-4ugeqmbp5r] {
    background-color: #fffbeb;
}

.sites-table tbody tr.overdue-orange:hover[b-4ugeqmbp5r] {
    background-color: #fef3c7;
}

.sites-table td[b-4ugeqmbp5r] {
    padding: 0.625rem 1rem;
}

.action-cell[b-4ugeqmbp5r] {
    display: flex;
    gap: 0.375rem;
    align-items: center;
}

.btn-icon[b-4ugeqmbp5r] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background: white;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.1s ease;
    text-decoration: none;
    padding: 0;
}

.btn-icon:hover[b-4ugeqmbp5r] {
    background-color: #f0f4ff;
    border-color: #93b4f3;
    color: #1b4a98;
}

.site-link[b-4ugeqmbp5r] {
    color: #1b4a98;
    text-decoration: none;
}

.site-link:hover[b-4ugeqmbp5r] {
    text-decoration: underline;
}

.review-date-cell[b-4ugeqmbp5r] {
    color: #6b7280;
    font-size: 0.8125rem;
}
/* /Components/Pages/Customers/Social/Shared/SocialInstanceReviewPanel.razor.rz.scp.css */
/* Wide review panel layout (spans full main column width) */
.review-panel-wide .card-body[b-i3dli1wq7u] {
    padding: 1.25rem;
}

/* Card header icon styling */
.card-header h2[b-i3dli1wq7u] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-header h2 svg[b-i3dli1wq7u] {
    flex-shrink: 0;
    opacity: 0.7;
}

/* Review columns layout */
.review-columns[b-i3dli1wq7u] {
    display: grid;
    gap: 1.5rem;
}

.review-columns-one[b-i3dli1wq7u] {
    grid-template-columns: 1fr;
}

.review-columns-two[b-i3dli1wq7u] {
    grid-template-columns: 1fr 1fr;
}

@media (max-width: 768px) {
    .review-columns-two[b-i3dli1wq7u] {
        grid-template-columns: 1fr;
    }
}

/* Scope group */
.review-scope-group[b-i3dli1wq7u] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.review-scope-group-client[b-i3dli1wq7u] {
    padding-left: 1.5rem;
    border-left: 2px solid #1b4a98;
}

/* Status Info */
.status-info[b-i3dli1wq7u] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.status-row[b-i3dli1wq7u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
}

.status-label[b-i3dli1wq7u] {
    font-size: 0.8125rem;
    color: #6c757d;
    flex-shrink: 0;
}

/* Review Links Section */
.review-links-section[b-i3dli1wq7u] {
    margin-top: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e9ecef;
}

.review-links-label[b-i3dli1wq7u] {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

/* Review link container */
.review-link-container[b-i3dli1wq7u] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.review-link-value[b-i3dli1wq7u] {
    color: #1b4a98;
    text-decoration: none;
    font-size: 0.8125rem;
    font-weight: 500;
    font-family: monospace;
    word-break: break-all;
}

.review-link-value:hover[b-i3dli1wq7u] {
    text-decoration: underline;
}

.copy-btn[b-i3dli1wq7u] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
}

.copy-btn:hover:not(:disabled)[b-i3dli1wq7u] {
    background: #e3f2fd;
    border-color: #1b4a98;
    color: #1b4a98;
}

.btn-outline[b-i3dli1wq7u] {
    background: transparent;
    border: 1px solid #1b4a98;
    color: #1b4a98;
}

.btn-outline:hover[b-i3dli1wq7u] {
    background: #1b4a98;
    color: white;
}

.review-hint[b-i3dli1wq7u] {
    margin-top: 1rem;
    padding: 0.75rem;
    background: #e3f2fd;
    border-radius: 6px;
    font-size: 0.8125rem;
    color: #1565c0;
    line-height: 1.4;
}

/* Status value group � badge + inline clear button */
.status-value-group[b-i3dli1wq7u] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

/* Inline Clear Review Button */
.btn-clear-review[b-i3dli1wq7u] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 500;
    padding: 0.125rem 0.375rem;
    background: transparent;
    color: #6c757d;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s ease;
    line-height: 1;
}

.btn-clear-review:hover:not(:disabled)[b-i3dli1wq7u] {
    background: #fee2e2;
    border-color: #ef4444;
    color: #dc2626;
}

.btn-clear-review:disabled[b-i3dli1wq7u] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-clear-review svg[b-i3dli1wq7u] {
    flex-shrink: 0;
}

/* Review Scope Labels */
.review-scope-label[b-i3dli1wq7u] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.25rem;
}

.review-scope-label svg[b-i3dli1wq7u] {
    opacity: 0.7;
}

.review-scope-internal[b-i3dli1wq7u] {
    color: #856404;
}

/* Send Internal Review Section */
.send-review-section[b-i3dli1wq7u] {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.send-review-btn[b-i3dli1wq7u] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    padding: 0.5rem 0.875rem;
    width: 100%;
    justify-content: center;
}

.send-review-btn svg[b-i3dli1wq7u] {
    flex-shrink: 0;
}

.send-review-hint[b-i3dli1wq7u] {
    font-size: 0.6875rem;
    color: #6c757d;
    text-align: center;
}

.reminder-hint[b-i3dli1wq7u] {
    color: #856404;
    font-style: italic;
}

/* Gated send review message (internal approval required) */
.send-review-gated[b-i3dli1wq7u] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 6px;
    font-size: 0.8125rem;
    color: #664d03;
    line-height: 1.4;
}

.send-review-gated svg[b-i3dli1wq7u] {
    flex-shrink: 0;
    margin-top: 0.125rem;
    opacity: 0.8;
}

/* Recipient indicator below send buttons */
.send-review-recipient[b-i3dli1wq7u] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.6875rem;
    color: #495057;
    padding: 0.375rem 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    line-height: 1.3;
    word-break: break-word;
}

.send-review-recipient svg[b-i3dli1wq7u] {
    flex-shrink: 0;
    opacity: 0.6;
}

.recipient-warning[b-i3dli1wq7u] {
    color: #856404;
    background: #fff3cd;
}
/* /Components/Pages/Customers/Social/Shared/SocialPostEditCard.razor.rz.scp.css */
/* Wide Instance Edit Card */
.instance-edit-card-wide[b-qzselmg9t8] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    overflow: hidden;
    transition: all 0.15s ease;
}

.instance-edit-card-wide:hover[b-qzselmg9t8] {
    border-color: #dee2e6;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.instance-card-header-wide[b-qzselmg9t8] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: white;
    border-bottom: 1px solid #e9ecef;
}

.instance-date[b-qzselmg9t8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    padding: 0.375rem 0.5rem;
    background: #1b4a98;
    color: white;
    border-radius: 6px;
    line-height: 1;
}

.instance-date .day[b-qzselmg9t8] {
    font-size: 1.25rem;
    font-weight: 700;
}

.instance-date .month[b-qzselmg9t8] {
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.9;
}

.instance-date .no-date[b-qzselmg9t8] {
    font-size: 0.6875rem;
    text-transform: uppercase;
}

.instance-header-content[b-qzselmg9t8] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.instance-meta[b-qzselmg9t8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.instance-id[b-qzselmg9t8] {
    font-size: 0.8125rem;
    color: #6c757d;
    font-family: monospace;
}

.type-badge[b-qzselmg9t8] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    background: #e9ecef;
    color: #495057;
    font-size: 0.6875rem;
    font-weight: 600;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.edit-link[b-qzselmg9t8] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #1b4a98;
    text-decoration: none;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
    transition: all 0.15s ease;
}

.edit-link:hover[b-qzselmg9t8] {
    background: #e3f2fd;
    color: #0d3a7a;
    text-decoration: none;
}

/* Instance header fields (Name, Post Date, Scheduled) */
.instance-header-fields[b-qzselmg9t8] {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
    flex-wrap: wrap;
}

.instance-header-fields .form-group[b-qzselmg9t8] {
    margin-bottom: 0;
    flex: 1;
    min-width: 150px;
}

.instance-header-fields .form-group label[b-qzselmg9t8] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.375rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.instance-header-fields .checkbox-cell[b-qzselmg9t8] {
    flex: 0 0 auto;
    padding-bottom: 0.5rem;
}

.checkbox-label-inline[b-qzselmg9t8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    padding: 0.5rem 0;
}

.checkbox-label-inline input[type="checkbox"][b-qzselmg9t8] {
    width: 16px;
    height: 16px;
    accent-color: #1b4a98;
}

/* Smaller form controls for bulk edit */
.form-control-sm[b-qzselmg9t8] {
    padding: 0.5rem 0.75rem;
    font-size: 0.8125rem;
}

/* Card body with editors */
.instance-card-body-wide[b-qzselmg9t8] {
    padding: 1rem 1.25rem;
}

.instance-card-body-wide .form-group[b-qzselmg9t8] {
    margin-bottom: 0;
}

.instance-card-body-wide .form-group label[b-qzselmg9t8] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* Side by side editors */
.editors-row[b-qzselmg9t8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.editor-half[b-qzselmg9t8] {
    margin-bottom: 0 !important;
}

.editor-half label[b-qzselmg9t8] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

@media (max-width: 992px) {
    .editors-row[b-qzselmg9t8] {
        grid-template-columns: 1fr;
    }
}

/* Radzen HTML Editor overrides � visual only; layout is handled by Radzen's built-in flex */
[b-qzselmg9t8] .rz-html-editor {
    border-radius: 6px;
    border: 1px solid #dee2e6;
}

[b-qzselmg9t8] .rz-html-editor:focus-within {
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

[b-qzselmg9t8] .rz-html-editor .rz-html-editor-toolbar {
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

[b-qzselmg9t8] .rz-html-editor .rz-html-editor-content img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin: 0.5rem 0;
}

/* Post Review Status */
.post-review-status[b-qzselmg9t8] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.625rem 0.75rem;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    margin-top: 0.25rem;
}

.review-status-item[b-qzselmg9t8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.review-type-label[b-qzselmg9t8] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    min-width: 62px;
}

.review-changes-note[b-qzselmg9t8] {
    display: flex;
    align-items: flex-start;
    gap: 0.375rem;
    padding: 0.375rem 0.625rem;
    background: #fff3cd;
    border-radius: 4px;
    font-size: 0.8125rem;
    color: #664d03;
    line-height: 1.4;
    margin-left: 62px;
}

.review-changes-note svg[b-qzselmg9t8] {
    flex-shrink: 0;
    margin-top: 0.125rem;
    opacity: 0.7;
}

.review-changes-note span[b-qzselmg9t8] {
    word-break: break-word;
}

/* Review Meta (reviewer name + date) */
.review-meta[b-qzselmg9t8] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    color: #6c757d;
}

.reviewer-name[b-qzselmg9t8] {
    font-weight: 600;
    color: #495057;
}

.review-date[b-qzselmg9t8] {
    color: #6c757d;
}

.reviewer-name + .review-date[b-qzselmg9t8]::before {
    content: "�";
    margin-right: 0.375rem;
    color: #adb5bd;
}

/* Processed Checkbox */
.processed-checkbox[b-qzselmg9t8] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    margin-left: auto;
    cursor: pointer;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
}

.processed-checkbox input[type="checkbox"][b-qzselmg9t8] {
    width: 14px;
    height: 14px;
    accent-color: #1b4a98;
    cursor: pointer;
}

.processed-checkbox:hover[b-qzselmg9t8] {
    color: #1b4a98;
}

/* Review Actions Row (revision badge + history button) */
.review-actions-row[b-qzselmg9t8] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding-top: 0.375rem;
    border-top: 1px solid #e9ecef;
    margin-top: 0.375rem;
}

/* Revision Badge (per-post) */
.revision-badge[b-qzselmg9t8] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #856404;
    background: #fff3cd;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
}

.revision-badge svg[b-qzselmg9t8] {
    opacity: 0.7;
}

/* History Button */
.history-btn[b-qzselmg9t8] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    padding: 0.2rem 0.5rem;
    margin-left: auto;
}

.btn-outline[b-qzselmg9t8] {
    background: transparent;
    border: 1px solid #1b4a98;
    color: #1b4a98;
}

.btn-outline:hover[b-qzselmg9t8] {
    background: #1b4a98;
    color: white;
}

/* Inline Review History */
.review-history-inline[b-qzselmg9t8] {
    margin-top: 0.5rem;
    padding: 0.75rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
}

.review-history-header[b-qzselmg9t8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.625rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e9ecef;
}

.review-history-title[b-qzselmg9t8] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.review-history-loading[b-qzselmg9t8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0;
    font-size: 0.8125rem;
    color: #6c757d;
}

.review-history-empty[b-qzselmg9t8] {
    text-align: center;
    padding: 0.75rem 0;
    font-size: 0.8125rem;
}

/* Review History Timeline */
.history-timeline[b-qzselmg9t8] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.history-entry[b-qzselmg9t8] {
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    border-left: 3px solid #1b4a98;
}

.history-entry.history-processed[b-qzselmg9t8] {
    opacity: 0.6;
    border-left-color: #adb5bd;
}

.history-entry-header[b-qzselmg9t8] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.history-meta[b-qzselmg9t8] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
}

.history-reviewer[b-qzselmg9t8] {
    font-weight: 600;
    color: #333;
}

.history-date[b-qzselmg9t8] {
    color: #6c757d;
}

.history-reviewer + .history-date[b-qzselmg9t8]::before {
    content: "�";
    margin-right: 0.375rem;
    color: #adb5bd;
}

.history-entry-details[b-qzselmg9t8] {
    display: flex;
    gap: 0.375rem;
    margin-top: 0.375rem;
    flex-wrap: wrap;
}

.history-tag[b-qzselmg9t8] {
    display: inline-flex;
    align-items: center;
    padding: 0.0625rem 0.5rem;
    background: #e9ecef;
    color: #495057;
    font-size: 0.6875rem;
    font-weight: 600;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.history-tag-processed[b-qzselmg9t8] {
    background: #d1ecf1;
    color: #0c5460;
}

.history-changes[b-qzselmg9t8] {
    display: flex;
    align-items: flex-start;
    gap: 0.375rem;
    padding: 0.5rem 0.625rem;
    background: #fff3cd;
    border-radius: 4px;
    font-size: 0.8125rem;
    color: #664d03;
    line-height: 1.4;
    margin-top: 0.5rem;
}

.history-changes svg[b-qzselmg9t8] {
    flex-shrink: 0;
    margin-top: 0.125rem;
    opacity: 0.7;
}

.history-changes span[b-qzselmg9t8] {
    word-break: break-word;
}

/* Edited Description Compare */
.history-edited-description[b-qzselmg9t8] {
    margin-top: 0.5rem;
}

.history-edited-toggle[b-qzselmg9t8] {
    font-size: 0.75rem;
    gap: 0.25rem;
    color: #1b4a98;
}

.edited-description-compare[b-qzselmg9t8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-top: 0.5rem;
}

.compare-panel[b-qzselmg9t8] {
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    overflow: hidden;
}

.compare-label[b-qzselmg9t8] {
    display: block;
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.375rem 0.625rem;
    background: #f3f4f6;
    color: #6b7280;
    border-bottom: 1px solid #e5e7eb;
}

.compare-label-edited[b-qzselmg9t8] {
    background: #dbeafe;
    color: #1e40af;
}

.compare-content[b-qzselmg9t8] {
    padding: 0.625rem;
    font-size: 0.8125rem;
    line-height: 1.5;
    max-height: 300px;
    overflow-y: auto;
    word-break: break-word;
}

/* Diff Panel */
.diff-panel[b-qzselmg9t8] {
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    overflow: hidden;
    margin-top: 0.75rem;
}

.compare-label-diff[b-qzselmg9t8] {
    background: #fef3c7;
    color: #92400e;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

/* Accept Reviewer Changes */
.accept-changes-row[b-qzselmg9t8] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.75rem;
    padding: 0.625rem 0.75rem;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 6px;
}

.btn-accept-changes[b-qzselmg9t8] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    background-color: #16a34a;
    color: #fff;
    border: none;
    padding: 0.375rem 0.75rem;
    border-radius: 4px;
    font-weight: 600;
    font-size: 0.75rem;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.btn-accept-changes:hover[b-qzselmg9t8] {
    background-color: #15803d;
}

.accept-changes-hint[b-qzselmg9t8] {
    font-size: 0.6875rem;
    color: #6b7280;
    line-height: 1.3;
}

/* Name + Topic button inline layout */
.name-with-topic[b-qzselmg9t8] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.name-with-topic .form-control[b-qzselmg9t8] {
    flex: 1;
}

.topic-insert-btn[b-qzselmg9t8] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    padding: 0.4rem 0.625rem;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Image Drop Zone */
.image-drop-zone[b-qzselmg9t8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    margin-top: 0.375rem;
    border: 2px dashed #dee2e6;
    border-radius: 6px;
    background: #f8f9fa;
    color: #6c757d;
    font-size: 0.75rem;
    cursor: default;
    transition: all 0.15s ease;
}

.image-drop-zone svg[b-qzselmg9t8] {
    opacity: 0.5;
    flex-shrink: 0;
}

.image-drop-zone.drop-zone-active[b-qzselmg9t8] {
    border-color: #1b4a98;
    background: rgba(27, 74, 152, 0.05);
    color: #1b4a98;
}

.image-drop-zone.drop-zone-active svg[b-qzselmg9t8] {
    opacity: 1;
}

.image-drop-zone.drop-zone-uploading[b-qzselmg9t8] {
    border-color: #ffc107;
    background: rgba(255, 193, 7, 0.05);
    color: #856404;
}
/* /Components/Pages/Customers/Social/Shared/SocialQuickNav.razor.rz.scp.css */
/* =============================================================================
   SocialQuickNav — Inline breadcrumb-level pill for navigating to the Work Queue.
   Drop <SocialQuickNav /> after the breadcrumb div on any social module page.
   ============================================================================= */

.social-quick-nav[b-q6jqg8zvvj] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;

    padding: 0.2rem 0.6rem;
    background: var(--color-primary-light, rgba(27, 74, 152, 0.1));
    color: var(--color-primary, #1b4a98);
    border-radius: var(--radius-pill, 20px);
    border: 1px solid transparent;

    text-decoration: none;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
    line-height: 1.4;

    transition: background 0.15s ease, border-color 0.15s ease;
}

.social-quick-nav:hover[b-q6jqg8zvvj] {
    background: var(--color-primary, #1b4a98);
    color: #fff;
    text-decoration: none;
}

.social-quick-nav svg[b-q6jqg8zvvj] {
    flex-shrink: 0;
}

/* /Components/Pages/Customers/Social/SocialClientEdit.razor.rz.scp.css */
/* Breadcrumb last child */
.breadcrumb span:last-child[b-y0u31zfs0m] {
    color: #6c757d;
}

/* Form Container width */
.form-container[b-y0u31zfs0m] {
    max-width: 800px;
}

/* Form Cards */
.form-card[b-y0u31zfs0m] {
    margin-bottom: 1.5rem;
}

/* Allow customer search dropdown to overflow the card boundary */
.form-card:has(.customer-search-container)[b-y0u31zfs0m] {
    overflow: visible;
}

/* Form group margin-based spacing */
.form-group[b-y0u31zfs0m] {
    margin-bottom: 1.25rem;
}

.form-group:last-child[b-y0u31zfs0m] {
    margin-bottom: 0;
}

.form-group label[b-y0u31zfs0m] {
    display: block;
    margin-bottom: 0.5rem;
}

/* Customer Search */
.customer-search-container[b-y0u31zfs0m] {
    position: relative;
}

.selected-customer[b-y0u31zfs0m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: #e7f1ff;
    border-radius: 6px;
    border: 1px solid #1b4a98;
}

.selected-customer-name[b-y0u31zfs0m] {
    font-weight: 500;
    color: #1b4a98;
}

.clear-selection[b-y0u31zfs0m] {
    background: none;
    border: none;
    font-size: 1.25rem;
    cursor: pointer;
    color: #1b4a98;
    line-height: 1;
    padding: 0 0.25rem;
}

.clear-selection:hover[b-y0u31zfs0m] {
    color: #153a7a;
}

.customer-dropdown[b-y0u31zfs0m] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    max-height: 250px;
    overflow-y: auto;
    z-index: 100;
    margin-top: 0.25rem;
}

.customer-option[b-y0u31zfs0m] {
    padding: 0.625rem 0.875rem;
    cursor: pointer;
    transition: background-color 0.15s;
    font-size: 0.9rem;
}

.customer-option:hover[b-y0u31zfs0m] {
    background: #f8f9fa;
}

.customer-option:first-child[b-y0u31zfs0m] {
    border-radius: 6px 6px 0 0;
}

.customer-option:last-child[b-y0u31zfs0m] {
    border-radius: 0 0 6px 6px;
}

/* Button overrides */
.btn-primary:hover:not(:disabled)[b-y0u31zfs0m] {
    background-color: #153a7a;
}

.btn-primary:disabled[b-y0u31zfs0m] {
    opacity: 0.7;
    cursor: not-allowed;
}
/* /Components/Pages/Customers/Social/SocialClientNotes.razor.rz.scp.css */
/* ─── Popup Header ─── */
.popup-header[b-4fsjsvr3z7] {
    padding: 1rem 1.25rem 0.5rem;
    text-align: center;
}

.popup-client-name[b-4fsjsvr3z7] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #333;
}

.popup-subtitle[b-4fsjsvr3z7] {
    margin: 0.25rem 0 0;
    font-size: 0.8125rem;
    color: #6c757d;
}

/* ─── Content ─── */
.notes-page-content[b-4fsjsvr3z7] {
    padding: 1rem;
}

/* ─── Loading / Error ─── */
.loading-container[b-4fsjsvr3z7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6c757d;
}

.error-container[b-4fsjsvr3z7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6c757d;
    text-align: center;
}

.error-container h3[b-4fsjsvr3z7] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #333;
}

.error-container p[b-4fsjsvr3z7] {
    margin: 0.5rem 0;
    color: #6c757d;
}

/* Breadcrumb */
.breadcrumb[b-4fsjsvr3z7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    color: #6c757d;
}

.breadcrumb a[b-4fsjsvr3z7] {
    color: #1b4a98;
    text-decoration: none;
}

.breadcrumb a:hover[b-4fsjsvr3z7] {
    text-decoration: underline;
}
/* /Components/Pages/Customers/Social/SocialClients.razor.rz.scp.css */
/* Social Client Specific Styles */
.customer-cell[b-h42rnnbe5l] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.customer-avatar[b-h42rnnbe5l] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.875rem;
    flex-shrink: 0;
}

.social-avatar[b-h42rnnbe5l] {
    background: linear-gradient(135deg, #1b4a98 0%, #2563eb 100%);
}

.social-avatar svg[b-h42rnnbe5l] {
    color: white;
}

.customer-info[b-h42rnnbe5l] {
    display: flex;
    flex-direction: column;
}

.customer-name[b-h42rnnbe5l] {
    font-weight: 500;
    color: #1b4a98;
}

.customer-company[b-h42rnnbe5l] {
    font-size: 0.8125rem;
    color: #6c757d;
}

.description-text[b-h42rnnbe5l] {
    display: block;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #6c757d;
    font-size: 0.875rem;
}

/* Badge info variant */
.badge-info[b-h42rnnbe5l] {
    background-color: #e7f1ff;
    color: #1b4a98;
}

/* Summary Bar */
.summary-bar[b-h42rnnbe5l] {
    display: flex;
    gap: 2rem;
    margin-bottom: 1.5rem;
    background: linear-gradient(135deg, #1b4a98 0%, #2563eb 100%);
    padding: 1.25rem 1.5rem;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(27, 74, 152, 0.2);
}

.summary-item[b-h42rnnbe5l] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.summary-label[b-h42rnnbe5l] {
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.8);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.summary-value[b-h42rnnbe5l] {
    font-size: 1.5rem;
    font-weight: 700;
    color: white;
}

/* Responsive */
@media (max-width: 992px) {
    .summary-bar[b-h42rnnbe5l] {
        flex-wrap: wrap;
    }
}

@media (max-width: 768px) {
    .summary-bar[b-h42rnnbe5l] {
        flex-direction: column;
        gap: 1rem;
    }
}

/* Admin tools */
.admin-tools-section[b-h42rnnbe5l] {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid #e2e8f0;
}

.admin-tools-title[b-h42rnnbe5l] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 1rem 0;
}

.admin-tools-links[b-h42rnnbe5l] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.admin-tool-link[b-h42rnnbe5l] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    transition: all 0.15s ease;
}

.admin-tool-link:hover[b-h42rnnbe5l] {
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    transform: translateY(-1px);
}

.admin-tool-icon[b-h42rnnbe5l] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: #f1f5f9;
    border-radius: 8px;
    color: #64748b;
    flex-shrink: 0;
}

.admin-tool-info[b-h42rnnbe5l] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.admin-tool-name[b-h42rnnbe5l] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #1e293b;
}

.admin-tool-desc[b-h42rnnbe5l] {
    font-size: 0.8125rem;
    color: #64748b;
    line-height: 1.4;
}

.admin-tool-arrow[b-h42rnnbe5l] {
    color: #94a3b8;
    flex-shrink: 0;
}
/* /Components/Pages/Customers/Social/SocialClientView.razor.rz.scp.css */
/* Error container */
.error-container[b-mm83k8a0cu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6c757d;
    text-align: center;
}

.error-container svg[b-mm83k8a0cu] { color: #dc3545; margin-bottom: 0.5rem; }
.error-container h3[b-mm83k8a0cu] { margin: 0; font-size: 1.25rem; font-weight: 600; color: #333; }
.error-container p[b-mm83k8a0cu] { margin: 0.5rem 0; color: #6c757d; }

.loading-inline[b-mm83k8a0cu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    padding: 0.5rem 0;
    font-size: 0.875rem;
}

/* Breadcrumb last child */
.breadcrumb span:last-child[b-mm83k8a0cu] { color: #6c757d; }

/* Button variants */
.btn-danger[b-mm83k8a0cu] { background-color: #dc3545; color: white; }
.btn-danger:hover:not(:disabled)[b-mm83k8a0cu] { background-color: #c82333; }
.btn-danger:disabled[b-mm83k8a0cu] { opacity: 0.7; cursor: not-allowed; }
.btn-primary:hover:not(:disabled)[b-mm83k8a0cu] { background-color: #153a7a; }
.btn-primary:disabled[b-mm83k8a0cu] { opacity: 0.7; cursor: not-allowed; }

.btn-icon-danger[b-mm83k8a0cu] { background: #fee; color: #dc3545; }
.btn-icon-danger:hover[b-mm83k8a0cu] { background: #fdd; color: #c82333; }

/* Detail Grid */
.detail-grid[b-mm83k8a0cu] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 1.5rem;
}

/* Projects Section */
.projects-section[b-mm83k8a0cu] { margin-top: 1.5rem; }

/* Detail Cards */
.detail-card[b-mm83k8a0cu] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

/* Info Rows */
.info-row[b-mm83k8a0cu] {
    display: flex;
    justify-content: space-between;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.info-row:last-child[b-mm83k8a0cu] { border-bottom: none; }
.info-row .label[b-mm83k8a0cu] { font-size: 0.875rem; color: #6c757d; font-weight: 500; }
.info-row .value[b-mm83k8a0cu] { font-size: 0.875rem; color: #333; text-align: right; }

.customer-link[b-mm83k8a0cu] { color: #1b4a98; text-decoration: none; font-weight: 500; }
.customer-link:hover[b-mm83k8a0cu] { text-decoration: underline; }

/* Description */
.description-content[b-mm83k8a0cu] { white-space: pre-wrap; line-height: 1.6; color: #333; font-size: 0.9rem; }
.no-description[b-mm83k8a0cu], .no-projects[b-mm83k8a0cu] { margin: 0; font-style: italic; }

/* Projects Table */
.projects-table-wrapper[b-mm83k8a0cu] { overflow-x: auto; }

.projects-table[b-mm83k8a0cu] { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.projects-table th[b-mm83k8a0cu], .projects-table td[b-mm83k8a0cu] { padding: 0.75rem 0.5rem; text-align: left; border-bottom: 1px solid #f0f0f0; }
.projects-table th[b-mm83k8a0cu] { font-weight: 600; color: #6c757d; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.5px; }
.projects-table tbody tr:last-child td[b-mm83k8a0cu] { border-bottom: none; }
.projects-table tbody tr:hover[b-mm83k8a0cu] { background-color: #f8f9fa; }

.project-type[b-mm83k8a0cu] { font-weight: 500; color: #333; }
.project-type-link[b-mm83k8a0cu] { font-weight: 500; color: #1b4a98; text-decoration: none; }
.project-type-link:hover[b-mm83k8a0cu] { text-decoration: underline; }

/* Actions Column */
.actions-col[b-mm83k8a0cu] { width: 110px; text-align: center; }
.actions-wrapper[b-mm83k8a0cu] { display: flex; gap: 0.25rem; justify-content: center; align-items: center; }

/* Modal extensions */
.modal[b-mm83k8a0cu] {
    max-width: 420px;
    max-height: fit-content !important;
    height: auto !important;
    overflow: visible !important;
    display: block !important;
}

.modal-close[b-mm83k8a0cu] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

.modal-close:hover[b-mm83k8a0cu] { background-color: #f0f0f0; color: #333; }
.modal-footer[b-mm83k8a0cu] { background-color: #f8f9fa; }

/* Delete Preview */
.delete-preview[b-mm83k8a0cu] {
    background-color: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 8px;
    padding: 1rem;
    margin: 1rem 0;
}

.delete-preview p[b-mm83k8a0cu] { margin: 0 0 0.5rem 0; }
.delete-preview ul[b-mm83k8a0cu] { margin: 0.5rem 0 0.5rem 1.25rem; padding: 0; }
.delete-preview ul li[b-mm83k8a0cu] { margin-bottom: 0.25rem; }
.text-warning[b-mm83k8a0cu] { color: #856404; }
.preserved-list[b-mm83k8a0cu] { max-height: 100px; overflow-y: auto; font-size: 0.875rem; }

/* Contact Styles */
.contact-name[b-mm83k8a0cu] { font-weight: 500; color: #333; }
.email-link[b-mm83k8a0cu] { color: #1b4a98; text-decoration: none; }
.email-link:hover[b-mm83k8a0cu] { text-decoration: underline; }

/* Form group margin-based spacing */
.form-group[b-mm83k8a0cu] { margin-bottom: 1rem; }
.form-group:last-child[b-mm83k8a0cu] { margin-bottom: 0; }
.form-group label[b-mm83k8a0cu] { display: block; margin-bottom: 0.375rem; }

/* Outline button for create project */
.btn-outline-primary[b-mm83k8a0cu] {
    background-color: transparent;
    color: #1b4a98;
    border: 1px solid #1b4a98;
    padding: 0.25rem 0.75rem;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    transition: background-color 0.15s, color 0.15s;
}

.btn-outline-primary:hover:not(:disabled)[b-mm83k8a0cu] {
    background-color: #1b4a98;
    color: white;
}

.btn-outline-primary:disabled[b-mm83k8a0cu] {
    opacity: 0.7;
    cursor: not-allowed;
}
/* /Components/Pages/Customers/Social/SocialInstances.razor.rz.scp.css */
/* View Toggle */
.view-toggle[b-5g6lx1qx36] {
    display: flex;
    background: #e9ecef;
    border-radius: 8px;
    padding: 3px;
}

.view-toggle-btn[b-5g6lx1qx36] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 32px;
    border-radius: 6px;
    color: #6c757d;
    text-decoration: none;
    transition: all 0.15s ease;
    background: none;
    border: none;
    cursor: pointer;
}

.view-toggle-btn:hover[b-5g6lx1qx36] {
    color: #1b4a98;
    background: rgba(27, 74, 152, 0.1);
}

.view-toggle-btn.active[b-5g6lx1qx36] {
    background: white;
    color: #1b4a98;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Breadcrumb last child */
.breadcrumb span:last-child[b-5g6lx1qx36] {
    color: #6c757d;
}

/* Filter actions override */
.filter-actions[b-5g6lx1qx36] {
    margin-left: auto;
}

/* Stats Bar */
.stats-bar[b-5g6lx1qx36] {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    padding: 1rem 1.25rem;
    background: white;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.stat-item[b-5g6lx1qx36] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.stat-value[b-5g6lx1qx36] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1b4a98;
}

.stat-label[b-5g6lx1qx36] {
    font-size: 0.8125rem;
    color: #6c757d;
}

/* Table overrides */
.actions-col[b-5g6lx1qx36] {
    width: 80px;
    text-align: center;
}

.actions-cell[b-5g6lx1qx36] {
    text-align: center;
}

.actions-wrapper[b-5g6lx1qx36] {
    display: inline-flex;
    gap: 0.25rem;
    justify-content: center;
}

/* Date Cell */
.date-cell[b-5g6lx1qx36] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.date-primary[b-5g6lx1qx36] {
    font-weight: 500;
    color: #333;
}

.date-secondary[b-5g6lx1qx36] {
    font-size: 0.75rem;
    color: #6c757d;
}

/* Links */
.client-link[b-5g6lx1qx36],
.contract-link[b-5g6lx1qx36] {
    color: #1b4a98;
    text-decoration: none;
    font-weight: 500;
}

.client-link:hover[b-5g6lx1qx36],
.contract-link:hover[b-5g6lx1qx36] {
    text-decoration: underline;
}

/* Instance Name */
.instance-name[b-5g6lx1qx36] {
    font-weight: 500;
}

/* Status Badges */
.status-badges[b-5g6lx1qx36] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

/* Badge variants */
.badge-type[b-5g6lx1qx36] {
    background-color: #e7e3ff;
    color: #5a4fcf;
}

/* Calendar Styles */
.calendar-container[b-5g6lx1qx36] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    margin-right: 160px;
}

.calendar-month[b-5g6lx1qx36] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.month-header[b-5g6lx1qx36] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    background-color: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
}

.month-header h2[b-5g6lx1qx36] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #333;
}

.month-count[b-5g6lx1qx36] {
    font-size: 0.8125rem;
    color: #6c757d;
    background: #e9ecef;
    padding: 0.25rem 0.625rem;
    border-radius: 12px;
}

.calendar-grid[b-5g6lx1qx36] { padding: 1rem; }

.calendar-weekdays[b-5g6lx1qx36] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    margin-bottom: 0.5rem;
}

.weekday[b-5g6lx1qx36] {
    text-align: center;
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.5rem 0;
}

.calendar-days[b-5g6lx1qx36] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}

.calendar-day[b-5g6lx1qx36] {
    min-height: 90px;
    padding: 0.5rem;
    background: #fafafa;
    border-radius: 6px;
    position: relative;
    transition: background-color 0.15s ease;
}

.calendar-day:hover:not(.empty)[b-5g6lx1qx36] { background: #f0f0f0; }
.calendar-day.empty[b-5g6lx1qx36] { background: transparent; }
.calendar-day.today[b-5g6lx1qx36] { background: #e8f0fe; border: 2px solid #1b4a98; }
.calendar-day.has-instances[b-5g6lx1qx36] { background: #fff; border: 1px solid #e9ecef; }

.day-number[b-5g6lx1qx36] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #333;
    margin-bottom: 0.25rem;
}

.calendar-day.today .day-number[b-5g6lx1qx36] { color: #1b4a98; font-weight: 600; }

.day-instances[b-5g6lx1qx36] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-height: 20px;
}

.instance-chip[b-5g6lx1qx36] {
    font-size: 0.625rem;
    padding: 0.2rem 0.375rem;
    background: #e9ecef;
    border-radius: 4px;
    color: #495057;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 1px;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.instance-chip:hover[b-5g6lx1qx36] { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); background-color: #dee2e6; }
.instance-chip.scheduled[b-5g6lx1qx36] { background: #d4edda; color: #155724; }
.instance-chip.scheduled:hover[b-5g6lx1qx36] { background: #c3e6cb; }
.instance-chip.reviewed[b-5g6lx1qx36] { background: #cce5ff; color: #004085; }
.instance-chip.reviewed:hover[b-5g6lx1qx36] { background: #b8daff; }

.instance-client[b-5g6lx1qx36] {
    font-weight: 600;
    font-size: 0.5625rem;
    opacity: 0.8;
}

.instance-more[b-5g6lx1qx36] {
    font-size: 0.625rem;
    color: #6c757d;
    text-align: center;
    padding: 0.125rem;
}

/* Floating Month Navigation */
.month-nav[b-5g6lx1qx36] {
    position: fixed;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    background: white;
    border-radius: 10px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    padding: 0.75rem;
    z-index: 100;
    max-height: 70vh;
    overflow-y: auto;
    min-width: 120px;
}

.month-nav-header[b-5g6lx1qx36] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.25rem 0.5rem 0.5rem;
    border-bottom: 1px solid #e9ecef;
    margin-bottom: 0.5rem;
}

.month-nav-list[b-5g6lx1qx36] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.month-nav-item[b-5g6lx1qx36] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.5rem;
    font-size: 0.8125rem;
    color: #495057;
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.15s ease;
    white-space: nowrap;
    background: none;
    border: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
    font-family: inherit;
}

.month-nav-item:hover[b-5g6lx1qx36] { background: #f0f0f0; color: #1b4a98; }

/* Responsive */
@media (max-width: 1200px) {
    .month-nav[b-5g6lx1qx36] { right: 12px; min-width: 100px; padding: 0.5rem; }
    .month-nav-item[b-5g6lx1qx36] { font-size: 0.75rem; padding: 0.3rem 0.4rem; }
    .calendar-container[b-5g6lx1qx36] { margin-right: 130px; }
}

@media (max-width: 992px) {
    .month-nav[b-5g6lx1qx36] { position: fixed; right: 12px; top: auto; bottom: 24px; transform: none; max-height: 50vh; }
    .calendar-container[b-5g6lx1qx36] { margin-right: 0; }
}

@media (max-width: 768px) {
    .filter-actions[b-5g6lx1qx36] { margin-left: 0; width: 100%; }
    .filter-actions .btn[b-5g6lx1qx36] { width: 100%; justify-content: center; }
    .stats-bar[b-5g6lx1qx36] { flex-wrap: wrap; gap: 1rem; }
    .calendar-day[b-5g6lx1qx36] { min-height: 70px; padding: 0.375rem; }
    .day-number[b-5g6lx1qx36] { font-size: 0.75rem; }
    .instance-chip[b-5g6lx1qx36] { font-size: 0.5625rem; padding: 0.125rem 0.25rem; }
    .weekday[b-5g6lx1qx36] { font-size: 0.625rem; }
}

@media (max-width: 576px) {
    .month-nav[b-5g6lx1qx36] { display: none; }
    .calendar-day[b-5g6lx1qx36] { min-height: 50px; padding: 0.25rem; }
    .instance-chip[b-5g6lx1qx36] { display: none; }
    .day-instances[b-5g6lx1qx36] { position: absolute; bottom: 2px; left: 50%; transform: translateX(-50%); }
    .calendar-day.has-instances .day-instances[b-5g6lx1qx36]::before { content: ''; display: block; width: 6px; height: 6px; background: #1b4a98; border-radius: 50%; }
    .instance-more[b-5g6lx1qx36] { display: none; }
}
/* /Components/Pages/Customers/Social/SocialProjectCalendar.razor.rz.scp.css */
/* View Toggle */
.view-toggle[b-b03sapbkcf] {
    display: flex;
    background: #e9ecef;
    border-radius: 8px;
    padding: 3px;
}

.view-toggle-btn[b-b03sapbkcf] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 32px;
    border-radius: 6px;
    color: #6c757d;
    text-decoration: none;
    transition: all 0.15s ease;
}

.view-toggle-btn:hover[b-b03sapbkcf] {
    color: #1b4a98;
    background: rgba(27, 74, 152, 0.1);
}

.view-toggle-btn.active[b-b03sapbkcf] {
    background: white;
    color: #1b4a98;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Error / Empty containers */
.error-container[b-b03sapbkcf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6c757d;
    text-align: center;
}

.error-container svg[b-b03sapbkcf] {
    color: #6c757d;
    margin-bottom: 0.5rem;
}

.error-container h3[b-b03sapbkcf] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #333;
}

.error-container p[b-b03sapbkcf] {
    margin: 0.5rem 0;
    color: #6c757d;
}

/* Page subtitle override */
.page-subtitle[b-b03sapbkcf] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Drag hint in subtitle */
.drag-hint[b-b03sapbkcf] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.625rem;
    background: #e8f0fe;
    color: #1b4a98;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
}

.drag-hint svg[b-b03sapbkcf] {
    opacity: 0.7;
}

/* Breadcrumb last child */
.breadcrumb span:last-child[b-b03sapbkcf] {
    color: #6c757d;
}

/* Stats */
.calendar-stats[b-b03sapbkcf] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.stat-card[b-b03sapbkcf] {
    background: white;
    border-radius: 10px;
    padding: 1rem 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    min-width: 120px;
}

.stat-value[b-b03sapbkcf] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #1b4a98;
}

.stat-label[b-b03sapbkcf] {
    font-size: 0.75rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 0.25rem;
}

/* Legend Card */
.legend-card[b-b03sapbkcf] {
    padding: 0.75rem 1rem;
}

.legend-title[b-b03sapbkcf] {
    font-size: 0.75rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.legend-items[b-b03sapbkcf] {
    display: flex;
    gap: 1rem;
}

.legend-item[b-b03sapbkcf] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.legend-color[b-b03sapbkcf] {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    border-left: 3px solid;
}

.legend-color.type-post[b-b03sapbkcf] { background: #e8eef4; border-color: #3d5a80; }
.legend-color.type-calendar[b-b03sapbkcf] { background: #e0f2f1; border-color: #00897b; }
.legend-color.type-creation[b-b03sapbkcf] { background: #fce4ec; border-color: #d81b60; }

.legend-icon[b-b03sapbkcf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.legend-icon.type-calendar[b-b03sapbkcf] {
    color: #00897b;
}

.legend-icon.type-creation[b-b03sapbkcf] {
    color: #d81b60;
}

.legend-label[b-b03sapbkcf] {
    font-size: 0.8125rem;
    color: #495057;
}

/* Calendar Container */
.calendar-container[b-b03sapbkcf] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    margin-right: 160px;
}

/* Calendar Month */
.calendar-month[b-b03sapbkcf] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.month-header[b-b03sapbkcf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    background-color: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
}

.month-header h2[b-b03sapbkcf] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #333;
}

.month-count[b-b03sapbkcf] {
    font-size: 0.8125rem;
    color: #6c757d;
    background: #e9ecef;
    padding: 0.25rem 0.625rem;
    border-radius: 12px;
}

/* Calendar Grid — single grid so weekday headers and day cells share column tracks */
.calendar-grid[b-b03sapbkcf] {
    padding: 1rem;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
}

.calendar-weekdays[b-b03sapbkcf] {
    display: contents;
}

.weekday[b-b03sapbkcf] {
    text-align: center;
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.5rem 0;
}

.calendar-days[b-b03sapbkcf] {
    display: contents;
}

.calendar-day[b-b03sapbkcf] {
    min-height: 100px;
    min-width: 0;
    padding: 0.5rem;
    background: #fafafa;
    border-radius: 6px;
    position: relative;
    transition: background-color 0.15s ease, transform 0.15s ease, border 0.15s ease;
    border: 2px solid transparent;
    overflow: hidden;
}

.calendar-day:hover:not(.empty)[b-b03sapbkcf] { background: #f0f0f0; }
.calendar-day.empty[b-b03sapbkcf] { background: transparent; }
.calendar-day.today[b-b03sapbkcf] { background: #e8f0fe; border: 2px solid #1b4a98; }
.calendar-day.outside-contract[b-b03sapbkcf] { background: #f5f5f5; opacity: 0.6; }
.calendar-day.has-instances[b-b03sapbkcf] { background: #fff; border: 1px solid #e9ecef; }

/* Drop target styling */
.calendar-day.drag-over[b-b03sapbkcf] {
    background: #e8f0fe !important;
    border: 2px dashed #1b4a98 !important;
    transform: scale(1.02);
}

.calendar-day.drag-over .day-number[b-b03sapbkcf] {
    color: #1b4a98;
    font-weight: 600;
}

.day-number[b-b03sapbkcf] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #333;
    margin-bottom: 0.25rem;
}

.calendar-day.today .day-number[b-b03sapbkcf] { color: #1b4a98; font-weight: 600; }
.calendar-day.outside-contract .day-number[b-b03sapbkcf] { color: #adb5bd; }

/* Instances */
.day-instances[b-b03sapbkcf] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-height: 20px;
}

.drag-handle[b-b03sapbkcf] {
    display: inline-flex;
    align-items: center;
    opacity: 0.4;
    margin-right: 0.25rem;
    cursor: grab;
    flex-shrink: 0;
}

.drag-handle svg[b-b03sapbkcf] { display: block; }
.instance-chip:hover .drag-handle[b-b03sapbkcf] { opacity: 0.8; }

.instance-chip[b-b03sapbkcf] {
    font-size: 0.6875rem;
    padding: 0.25rem 0.375rem;
    background: #e9ecef;
    border-radius: 4px;
    color: #495057;
    cursor: pointer;
    user-select: none;
    display: flex;
    align-items: flex-start;
    transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease, background-color 0.15s ease;
    position: relative;
    min-height: 1.75rem;
    min-width: 0;
    overflow: hidden;
}

.instance-chip:hover[b-b03sapbkcf] { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); }
.instance-chip:active[b-b03sapbkcf] { cursor: grabbing; }
.instance-chip.dragging[b-b03sapbkcf] { opacity: 0.5; transform: scale(0.95); }

.instance-type-indicator[b-b03sapbkcf] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-right: 0.25rem;
    margin-top: 0.25rem;
    background-color: currentColor;
    opacity: 0.8;
}

.instance-type-icon[b-b03sapbkcf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-right: 0.25rem;
    margin-top: 0.125rem;
    opacity: 0.85;
}

.instance-type-icon svg[b-b03sapbkcf] {
    display: block;
}

.instance-name[b-b03sapbkcf] {
    min-width: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* Instance type colors */
.instance-chip.type-post[b-b03sapbkcf] { background: #e8eef4; color: #3d5a80; border-left: 3px solid #3d5a80; }
.instance-chip.type-post:hover[b-b03sapbkcf] { background: #dce5ed; }
.instance-chip.type-post .instance-type-indicator[b-b03sapbkcf] { background-color: #3d5a80; }

.instance-chip.type-calendar[b-b03sapbkcf] { background: #e0f2f1; color: #00695c; border-left: 3px solid #00897b; }
.instance-chip.type-calendar:hover[b-b03sapbkcf] { background: #b2dfdb; }
.instance-chip.type-calendar .instance-type-indicator[b-b03sapbkcf] { background-color: #00897b; }

.instance-chip.type-creation[b-b03sapbkcf] { background: #fce4ec; color: #ad1457; border-left: 3px solid #d81b60; }
.instance-chip.type-creation:hover[b-b03sapbkcf] { background: #f8bbd9; }
.instance-chip.type-creation .instance-type-indicator[b-b03sapbkcf] { background-color: #d81b60; }

/* Scheduled/Reviewed status */
.instance-chip.scheduled[b-b03sapbkcf],
.instance-chip.type-post.scheduled[b-b03sapbkcf],
.instance-chip.type-calendar.scheduled[b-b03sapbkcf],
.instance-chip.type-creation.scheduled[b-b03sapbkcf] {
    box-shadow: inset 3px 0 0 0 #4caf50;
}

.instance-chip.reviewed[b-b03sapbkcf],
.instance-chip.type-post.reviewed[b-b03sapbkcf],
.instance-chip.type-calendar.reviewed[b-b03sapbkcf],
.instance-chip.type-creation.reviewed[b-b03sapbkcf] {
    box-shadow: inset 3px 0 0 0 #2196f3;
}

.instance-more[b-b03sapbkcf] {
    font-size: 0.625rem;
    color: #6c757d;
    padding: 0.125rem 0.25rem;
    font-style: italic;
}

/* Floating Month Navigation */
.month-nav[b-b03sapbkcf] {
    position: fixed;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    background: white;
    border-radius: 10px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    padding: 0.75rem;
    z-index: 100;
    max-height: 70vh;
    overflow-y: auto;
    min-width: 120px;
}

.month-nav-header[b-b03sapbkcf] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.25rem 0.5rem 0.5rem;
    border-bottom: 1px solid #e9ecef;
    margin-bottom: 0.5rem;
}

.month-nav-list[b-b03sapbkcf] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.month-nav-item[b-b03sapbkcf] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.5rem;
    font-size: 0.8125rem;
    color: #495057;
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.15s ease;
    white-space: nowrap;
    background: none;
    border: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
    font-family: inherit;
}

.month-nav-item:hover[b-b03sapbkcf] { background: #f0f0f0; color: #1b4a98; }

.month-nav-item.nav-top[b-b03sapbkcf] {
    color: #1b4a98;
    font-weight: 500;
    margin-bottom: 0.25rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e9ecef;
}

.month-nav-item.nav-top:hover[b-b03sapbkcf] { background: #e8f0fe; }

.calendar-page[b-b03sapbkcf] { scroll-behavior: smooth; }

/* Responsive */
@media (max-width: 1200px) {
    .month-nav[b-b03sapbkcf] { right: 12px; min-width: 100px; padding: 0.5rem; }
    .month-nav-item[b-b03sapbkcf] { font-size: 0.75rem; padding: 0.3rem 0.4rem; }
    .calendar-container[b-b03sapbkcf] { margin-right: 130px; }
}

@media (max-width: 992px) {
    .month-nav[b-b03sapbkcf] { position: fixed; right: 12px; top: auto; bottom: 24px; transform: none; max-height: 50vh; }
    .calendar-container[b-b03sapbkcf] { margin-right: 0; }
}

@media (max-width: 768px) {
    .calendar-day[b-b03sapbkcf] { min-height: 70px; padding: 0.375rem; }
    .day-number[b-b03sapbkcf] { font-size: 0.75rem; }
    .instance-chip[b-b03sapbkcf] { font-size: 0.625rem; padding: 0.125rem 0.25rem; }
    .drag-handle[b-b03sapbkcf] { display: none; }
    .weekday[b-b03sapbkcf] { font-size: 0.625rem; }
    .calendar-stats[b-b03sapbkcf] { gap: 0.5rem; }
    .stat-card[b-b03sapbkcf] { padding: 0.75rem 1rem; min-width: 80px; flex: 1; }
    .stat-value[b-b03sapbkcf] { font-size: 1.25rem; }
    .drag-hint[b-b03sapbkcf] { display: none; }
}

@media (max-width: 576px) {
    .month-nav[b-b03sapbkcf] { display: none; }
    .calendar-day[b-b03sapbkcf] { min-height: 50px; padding: 0.25rem; }
    .instance-chip[b-b03sapbkcf] { display: none; }
    .day-instances[b-b03sapbkcf] { position: absolute; bottom: 2px; left: 50%; transform: translateX(-50%); }
    .calendar-day.has-instances .day-instances[b-b03sapbkcf]::before { content: ''; display: block; width: 6px; height: 6px; background: #1b4a98; border-radius: 50%; }
    .instance-more[b-b03sapbkcf] { display: none; }
}

/* Add Instance Modal */
.add-instance-backdrop[b-b03sapbkcf] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.add-instance-modal[b-b03sapbkcf] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 450px;
}
/* /Components/Pages/Customers/Social/SocialProjectEdit.razor.rz.scp.css */
/* Breadcrumb last child */
.breadcrumb span:last-child[b-k5vc6mqk4j] { color: #6c757d; }

/* Form Container */
.form-container[b-k5vc6mqk4j] { max-width: 1200px; }

/* Form Layout - Two Column */
.form-layout[b-k5vc6mqk4j] {
    display: grid;
    grid-template-columns: 1fr 350px;
    gap: 1.5rem;
    align-items: start;
}

.form-main[b-k5vc6mqk4j],
.form-sidebar[b-k5vc6mqk4j] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Form Cards - overflow visible for tooltips */
.form-card[b-k5vc6mqk4j] {
    overflow: visible;
}

/* Status Card */
.status-card .card-body[b-k5vc6mqk4j] { padding: 1rem 1.25rem; }

.status-info[b-k5vc6mqk4j] { display: flex; flex-direction: column; gap: 0.5rem; }
.status-row[b-k5vc6mqk4j] { display: flex; justify-content: space-between; align-items: center; }
.status-label[b-k5vc6mqk4j] { font-size: 0.8125rem; color: #6c757d; }
.status-value[b-k5vc6mqk4j] { font-size: 0.875rem; color: #333; font-weight: 500; }

/* Form group margin-based spacing */
.form-group[b-k5vc6mqk4j] { margin-bottom: 1.25rem; }
.form-group:last-child[b-k5vc6mqk4j] { margin-bottom: 0; }

.form-group label[b-k5vc6mqk4j] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-bottom: 0.5rem;
}

.form-control:disabled[b-k5vc6mqk4j],
.form-select:disabled[b-k5vc6mqk4j] {
    background-color: #f8f9fa;
    cursor: not-allowed;
}

/* Checkbox Group */
.checkbox-group[b-k5vc6mqk4j] { margin-top: 0.5rem; }

.checkbox-label[b-k5vc6mqk4j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: normal !important;
}

.checkbox-label input[type="checkbox"][b-k5vc6mqk4j] { width: 18px; height: 18px; accent-color: #1b4a98; }
.checkbox-text[b-k5vc6mqk4j] { font-size: 0.9rem; color: #333; }

/* Form actions border */
.form-actions[b-k5vc6mqk4j] {
    padding-top: 1.5rem;
    margin-top: 0.5rem;
    border-top: 1px solid #e9ecef;
}

/* Button overrides */
.btn-primary:hover:not(:disabled)[b-k5vc6mqk4j] { background-color: #153a7a; }
.btn-primary:disabled[b-k5vc6mqk4j] { opacity: 0.7; cursor: not-allowed; }

/* Radzen HTML Editor override */
[b-k5vc6mqk4j] .rz-html-editor {
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #dee2e6;
}

[b-k5vc6mqk4j] .rz-html-editor:focus-within {
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

[b-k5vc6mqk4j] .rz-html-editor .rz-html-editor-toolbar {
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

[b-k5vc6mqk4j] .rz-html-editor .rz-html-editor-content {
    min-height: 250px;
}

/* Tooltips */
.tooltip-trigger[b-k5vc6mqk4j] {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: help;
    color: #6c757d;
    margin-left: 0.125rem;
}

.tooltip-trigger svg[b-k5vc6mqk4j] { transition: color 0.15s ease; }
.tooltip-trigger:hover svg[b-k5vc6mqk4j], .tooltip-trigger:focus svg[b-k5vc6mqk4j] { color: #1b4a98; }

.tooltip-content[b-k5vc6mqk4j] {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    padding: 0.625rem 0.875rem;
    background-color: #333;
    color: white;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.4;
    border-radius: 6px;
    white-space: normal;
    width: 280px;
    text-align: left;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s ease;
    z-index: 100;
}

.tooltip-content[b-k5vc6mqk4j]::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: #333;
}

.tooltip-trigger:hover .tooltip-content[b-k5vc6mqk4j],
.tooltip-trigger:focus .tooltip-content[b-k5vc6mqk4j] {
    opacity: 1;
    visibility: visible;
}

@media (min-width: 577px) {
    .form-row > .form-group:last-child .tooltip-content[b-k5vc6mqk4j] {
        left: auto;
        right: 0;
        transform: none;
    }

    .form-row > .form-group:last-child .tooltip-content[b-k5vc6mqk4j]::after {
        left: auto;
        right: 12px;
        transform: none;
    }
}

@media (max-width: 992px) {
    .form-layout[b-k5vc6mqk4j] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Customers/Social/SocialProjectInstanceEdit.razor.rz.scp.css */
/* Error container */
.error-container[b-1kfquyn3uz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6c757d;
    text-align: center;
}

.error-container svg[b-1kfquyn3uz] {
    color: #dc3545;
    margin-bottom: 0.5rem;
}

.error-container h3[b-1kfquyn3uz] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #333;
}

.error-container p[b-1kfquyn3uz] {
    margin: 0.5rem 0;
    color: #6c757d;
}

/* Breadcrumb last child */
.breadcrumb span:last-child[b-1kfquyn3uz] {
    color: #6c757d;
}

/* Form Container - Full Width */
.form-container[b-1kfquyn3uz] {
    width: 100%;
    max-width: 100%;
}

/* Form Layout - Two Column override */
.form-layout[b-1kfquyn3uz] {
    grid-template-columns: 1fr 320px;
}

@media (max-width: 1200px) {
    .form-layout[b-1kfquyn3uz] {
        grid-template-columns: 1fr 300px;
    }
}

/* Card header icon styling */
.card-header h2[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-header h2 svg[b-1kfquyn3uz] {
    flex-shrink: 0;
    opacity: 0.7;
}

/* Status Info */
.status-info[b-1kfquyn3uz] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.status-row[b-1kfquyn3uz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
}

.status-label[b-1kfquyn3uz] {
    font-size: 0.8125rem;
    color: #6c757d;
    flex-shrink: 0;
}

.status-value[b-1kfquyn3uz] {
    font-size: 0.875rem;
    color: #333;
    font-weight: 500;
    text-align: right;
}

/* Mark Complete Row */
.mark-complete-row[b-1kfquyn3uz] {
    padding-top: 0.25rem;
}

.mark-complete-row .btn-success[b-1kfquyn3uz] {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    background-color: #28a745;
    color: white;
    border: none;
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
    font-weight: 500;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.mark-complete-row .btn-success:hover:not(:disabled)[b-1kfquyn3uz] { background-color: #218838; }
.mark-complete-row .btn-success:disabled[b-1kfquyn3uz] { opacity: 0.7; cursor: not-allowed; }

/* Form group margin-based spacing */
.form-group[b-1kfquyn3uz] {
    margin-bottom: 1.25rem;
}

.form-group:last-child[b-1kfquyn3uz] {
    margin-bottom: 0;
}

.form-group label[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-bottom: 0.5rem;
}

.form-control:disabled[b-1kfquyn3uz],
.form-select:disabled[b-1kfquyn3uz] {
    background-color: #f8f9fa;
    cursor: not-allowed;
}

/* Checkbox Group */
.checkbox-group[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    height: 100%;
}

.checkbox-label[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: normal !important;
}

.checkbox-label input[type="checkbox"][b-1kfquyn3uz] {
    width: 18px;
    height: 18px;
    accent-color: #1b4a98;
}

/* Form actions � replaced by floating save bar */
.form-actions[b-1kfquyn3uz] {
    display: none;
}

/* Floating Save Bar */
.floating-save-bar[b-1kfquyn3uz] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background: #ffffff;
    border-top: 1px solid #e9ecef;
    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.08);
    padding: 0.75rem 1.5rem;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.floating-save-bar.has-changes[b-1kfquyn3uz] {
    border-top: 2px solid #f59e0b;
    box-shadow: 0 -4px 20px rgba(245, 158, 11, 0.15);
}

.floating-save-inner[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
    max-width: 100%;
    margin: 0 auto;
}

.unsaved-warning[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.875rem;
    background: #fef3c7;
    color: #92400e;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 600;
    white-space: nowrap;
    animation: fadeSlideIn-b-1kfquyn3uz 0.25s ease;
}

.unsaved-warning svg[b-1kfquyn3uz] {
    flex-shrink: 0;
    opacity: 0.8;
}

.floating-save-actions[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

@keyframes fadeSlideIn-b-1kfquyn3uz {
    from {
        opacity: 0;
        transform: translateX(-8px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Bottom padding so floating bar doesn't cover content */
.form-container[b-1kfquyn3uz] {
    padding-bottom: 5rem;
}

/* Confirmation modals � use unique class names to avoid Bootstrap .modal conflicts */
.confirm-backdrop[b-1kfquyn3uz] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.confirm-modal[b-1kfquyn3uz] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 600px;
    max-height: 90vh;
    overflow-y: auto;
}

.confirm-modal .modal-header[b-1kfquyn3uz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.confirm-modal .modal-header h3[b-1kfquyn3uz] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #333;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.confirm-modal .modal-body[b-1kfquyn3uz] {
    padding: 1.5rem;
}

.confirm-modal .modal-footer[b-1kfquyn3uz] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    background-color: #f8f9fa;
}

/* Image hint */
.image-hint[b-1kfquyn3uz] {
    margin-bottom: 0.5rem;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    color: #6c757d;
}

.image-hint svg[b-1kfquyn3uz] {
    flex-shrink: 0;
    opacity: 0.7;
}

/* Editor hint styling */
.editor-hint[b-1kfquyn3uz] {
    margin-bottom: 0.5rem;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    color: #6c757d;
}

.editor-hint svg[b-1kfquyn3uz] {
    flex-shrink: 0;
    opacity: 0.7;
}

/* Side by side editors for Post instance */
.post-editors-row[b-1kfquyn3uz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.post-editors-row .form-group[b-1kfquyn3uz] {
    margin-bottom: 0;
}

@media (max-width: 1200px) {
    .post-editors-row[b-1kfquyn3uz] {
        grid-template-columns: 1fr;
    }
}

/* Side by side editors for bulk edit */
.editors-row[b-1kfquyn3uz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.editor-half[b-1kfquyn3uz] {
    margin-bottom: 0 !important;
}

.editor-half label[b-1kfquyn3uz] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

@media (max-width: 992px) {
    .editors-row[b-1kfquyn3uz] {
        grid-template-columns: 1fr;
    }
}

/* Radzen HTML Editor override � visual only; layout is handled by Radzen's built-in flex */
[b-1kfquyn3uz] .rz-html-editor {
    border-radius: 6px;
    border: 1px solid #dee2e6;
}

[b-1kfquyn3uz] .rz-html-editor:focus-within {
    border-color: #1b4a98;
    box-shadow: 0 0 0 3px rgba(27, 74, 152, 0.1);
}

[b-1kfquyn3uz] .rz-html-editor .rz-html-editor-toolbar {
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

[b-1kfquyn3uz] .rz-html-editor .rz-html-editor-content img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin: 0.5rem 0;
}

/* Range Badge in subtitle */
.range-badge[b-1kfquyn3uz] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    background: #e3f2fd;
    color: #1565c0;
    padding: 0.25rem 0.625rem;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 500;
    margin-left: 0.75rem;
}

.range-badge svg[b-1kfquyn3uz] {
    opacity: 0.8;
}

/* Quick Actions */
.quick-actions[b-1kfquyn3uz] { display: flex; flex-direction: column; gap: 0.5rem; }

.quick-action-link[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
    color: #333;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    transition: all 0.15s ease;
    border: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
}

.quick-action-link:hover:not(:disabled)[b-1kfquyn3uz] { background: #e9ecef; color: #1b4a98; }
.quick-action-link:disabled[b-1kfquyn3uz] { opacity: 0.7; cursor: not-allowed; }
.quick-action-link svg[b-1kfquyn3uz] { color: #6c757d; flex-shrink: 0; }
.quick-action-link:hover:not(:disabled) svg[b-1kfquyn3uz] { color: #1b4a98; }

/* Related Instances Section */
.related-instances-section[b-1kfquyn3uz] {
    margin-top: 2rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.section-header[b-1kfquyn3uz] {
    padding: 1.25rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-bottom: 1px solid #e9ecef;
}

.section-header h2[b-1kfquyn3uz] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #333;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-header h2 svg[b-1kfquyn3uz] {
    color: #1b4a98;
}

.section-hint[b-1kfquyn3uz] {
    margin: 0.5rem 0 0 0;
    font-size: 0.875rem;
    color: #6c757d;
}

/* Instances Grid */
.instances-grid[b-1kfquyn3uz] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1rem;
    padding: 1.25rem;
}

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

/* Instance Edit Card */
.instance-edit-card[b-1kfquyn3uz] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    overflow: hidden;
    transition: all 0.15s ease;
}

.instance-edit-card:hover[b-1kfquyn3uz] {
    border-color: #dee2e6;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.instance-edit-card.current[b-1kfquyn3uz] {
    border-color: #1b4a98;
    box-shadow: 0 0 0 2px rgba(27, 74, 152, 0.15);
}

.instance-card-header[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    background: white;
    border-bottom: 1px solid #e9ecef;
}

.instance-date[b-1kfquyn3uz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    padding: 0.375rem 0.5rem;
    background: #1b4a98;
    color: white;
    border-radius: 6px;
    line-height: 1;
}

.instance-date .day[b-1kfquyn3uz] {
    font-size: 1.25rem;
    font-weight: 700;
}

.instance-date .month[b-1kfquyn3uz] {
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.9;
}

.instance-date .no-date[b-1kfquyn3uz] {
    font-size: 0.6875rem;
    text-transform: uppercase;
}

.instance-meta[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.instance-id[b-1kfquyn3uz] {
    font-size: 0.8125rem;
    color: #6c757d;
    font-family: monospace;
}

.current-badge[b-1kfquyn3uz] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    background: #1b4a98;
    color: white;
    font-size: 0.6875rem;
    font-weight: 600;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.instance-card-body[b-1kfquyn3uz] {
    padding: 1rem;
}

.instance-card-body .form-group[b-1kfquyn3uz] {
    margin-bottom: 0.875rem;
}

.instance-card-body .form-group:last-child[b-1kfquyn3uz] {
    margin-bottom: 0;
}

.instance-card-body .form-group label[b-1kfquyn3uz] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.375rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* Smaller form controls for bulk edit */
.form-control-sm[b-1kfquyn3uz] {
    padding: 0.5rem 0.75rem;
    font-size: 0.8125rem;
}

textarea.form-control-sm[b-1kfquyn3uz] {
    min-height: 60px;
}

/* Inline form group for date + checkbox */
.form-group-inline[b-1kfquyn3uz] {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
}

.form-group-inline .form-group[b-1kfquyn3uz] {
    flex: 1;
    margin-bottom: 0;
}

.form-group-inline .checkbox-cell[b-1kfquyn3uz] {
    flex: 0 0 auto;
    padding-bottom: 0.25rem;
}

.checkbox-label-inline[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    padding: 0.5rem 0;
}

.checkbox-label-inline input[type="checkbox"][b-1kfquyn3uz] {
    width: 16px;
    height: 16px;
    accent-color: #1b4a98;
}

/* Type Badge */
.type-badge[b-1kfquyn3uz] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    background: #e9ecef;
    color: #495057;
    font-size: 0.6875rem;
    font-weight: 600;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* Instances List (vertical stacked layout) */
.instances-list[b-1kfquyn3uz] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.25rem;
}

/* Wide Instance Edit Card */
.instance-edit-card-wide[b-1kfquyn3uz] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    overflow: hidden;
    transition: all 0.15s ease;
}

.instance-edit-card-wide:hover[b-1kfquyn3uz] {
    border-color: #dee2e6;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.instance-card-header-wide[b-1kfquyn3uz] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: white;
    border-bottom: 1px solid #e9ecef;
}

.instance-header-content[b-1kfquyn3uz] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.instance-header-fields[b-1kfquyn3uz] {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
    flex-wrap: wrap;
}

.instance-header-fields .form-group[b-1kfquyn3uz] {
    margin-bottom: 0;
    flex: 1;
    min-width: 150px;
}

.instance-header-fields .form-group label[b-1kfquyn3uz] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.375rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.instance-header-fields .checkbox-cell[b-1kfquyn3uz] {
    flex: 0 0 auto;
    padding-bottom: 0.5rem;
}

.instance-card-body-wide[b-1kfquyn3uz] {
    padding: 1rem 1.25rem;
}

.instance-card-body-wide .form-group[b-1kfquyn3uz] {
    margin-bottom: 0;
}

.instance-card-body-wide .form-group label[b-1kfquyn3uz] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* Bulk edit items: Radzen handles flex layout; height is set via Style="" on the component */

/* Linked Project Card */
.form-card.card-warning[b-1kfquyn3uz] {
    border: 1px solid #ffc107;
    background: #fffbf0;
}

.form-card.card-warning .card-header[b-1kfquyn3uz] {
    background: linear-gradient(135deg, #fff3cd 0%, #ffeeba 100%);
    border-bottom-color: #ffc107;
}

.project-link[b-1kfquyn3uz] {
    color: #1b4a98;
    text-decoration: none;
    font-weight: 500;
    font-size: 0.875rem;
    text-align: right;
    word-break: break-word;
}

.project-link:hover[b-1kfquyn3uz] {
    text-decoration: underline;
}

.project-actions[b-1kfquyn3uz] {
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.no-project-warning[b-1kfquyn3uz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0.75rem 0;
    color: #856404;
}

.no-project-warning svg[b-1kfquyn3uz] {
    margin-bottom: 0.5rem;
    opacity: 0.7;
}

.no-project-warning span[b-1kfquyn3uz] {
    font-weight: 600;
    font-size: 0.875rem;
}

.warning-hint[b-1kfquyn3uz] {
    margin: 0.5rem 0 0 0;
    font-size: 0.8125rem;
    color: #6c757d;
    line-height: 1.4;
}

.warning-hint-small[b-1kfquyn3uz] {
    margin: 0.5rem 0 0 0;
    font-size: 0.75rem;
    color: #856404;
    line-height: 1.4;
}

/* Reviews Card Styles */
.review-link-container[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.review-link-value[b-1kfquyn3uz] {
    color: #1b4a98;
    text-decoration: none;
    font-size: 0.8125rem;
    font-weight: 500;
    font-family: monospace;
    word-break: break-all;
}

.review-link-value:hover[b-1kfquyn3uz] {
    text-decoration: underline;
}

.copy-btn[b-1kfquyn3uz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
}

.copy-btn:hover:not(:disabled)[b-1kfquyn3uz] {
    background: #e3f2fd;
    border-color: #1b4a98;
    color: #1b4a98;
}

.review-hint[b-1kfquyn3uz] {
    margin-top: 1rem;
    padding: 0.75rem;
    background: #e3f2fd;
    border-radius: 6px;
    font-size: 0.8125rem;
    color: #1565c0;
    line-height: 1.4;
}

/* Post Review Status */
.post-review-status[b-1kfquyn3uz] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.625rem 0.75rem;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    margin-top: 0.25rem;
}

.review-status-item[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.review-type-label[b-1kfquyn3uz] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    min-width: 62px;
}

.review-changes-note[b-1kfquyn3uz] {
    display: flex;
    align-items: flex-start;
    gap: 0.375rem;
    padding: 0.375rem 0.625rem;
    background: #fff3cd;
    border-radius: 4px;
    font-size: 0.8125rem;
    color: #664d03;
    line-height: 1.4;
    margin-left: 62px;
}

.review-changes-note svg[b-1kfquyn3uz] {
    flex-shrink: 0;
    margin-top: 0.125rem;
    opacity: 0.7;
}

.review-changes-note span[b-1kfquyn3uz] {
    word-break: break-word;
}

/* Processed Checkbox */
.processed-checkbox[b-1kfquyn3uz] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    margin-left: auto;
    cursor: pointer;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
}

.processed-checkbox input[type="checkbox"][b-1kfquyn3uz] {
    width: 14px;
    height: 14px;
    accent-color: #1b4a98;
    cursor: pointer;
}

.processed-checkbox:hover[b-1kfquyn3uz] {
    color: #1b4a98;
}

/* Reset Review Button */
.reset-review-row[b-1kfquyn3uz] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.5rem 0;
}

.reset-review-btn[b-1kfquyn3uz] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    padding: 0.375rem 0.75rem;
    background-color: #ffc107;
    color: #664d03;
    border: 1px solid #ffc107;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.reset-review-btn:hover:not(:disabled)[b-1kfquyn3uz] {
    background-color: #e0a800;
    border-color: #d39e00;
}

.reset-review-btn:disabled[b-1kfquyn3uz] {
    opacity: 0.7;
    cursor: not-allowed;
}

.reset-review-btn svg[b-1kfquyn3uz] {
    flex-shrink: 0;
}

.reset-hint[b-1kfquyn3uz] {
    font-size: 0.75rem;
    color: #6c757d;
    line-height: 1.4;
}

/* Review Meta (reviewer name + date) */
.review-meta[b-1kfquyn3uz] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    color: #6c757d;
}

.reviewer-name[b-1kfquyn3uz] {
    font-weight: 600;
    color: #495057;
}

.review-date[b-1kfquyn3uz] {
    color: #6c757d;
}

.reviewer-name + .review-date[b-1kfquyn3uz]::before {
    content: "�";
    margin-right: 0.375rem;
    color: #adb5bd;
}

/* Review Actions Row (revision badge + history button) */
.review-actions-row[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding-top: 0.375rem;
    border-top: 1px solid #e9ecef;
    margin-top: 0.375rem;
}

/* Revision Badge (per-post) */
.revision-badge[b-1kfquyn3uz] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #856404;
    background: #fff3cd;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
}

.revision-badge svg[b-1kfquyn3uz] {
    opacity: 0.7;
}

/* Revision Summary Badge (section header) */
.revision-summary-badge[b-1kfquyn3uz] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #856404;
    background: #fff3cd;
    padding: 0.25rem 0.75rem;
    border-radius: 10px;
    margin-left: 0.5rem;
    white-space: nowrap;
}

.revision-summary-badge svg[b-1kfquyn3uz] {
    opacity: 0.8;
}

/* History Button */
.history-btn[b-1kfquyn3uz] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    padding: 0.2rem 0.5rem;
    margin-left: auto;
}

/* Inline Review History (collapsible within post card) */
.review-history-inline[b-1kfquyn3uz] {
    margin-top: 0.5rem;
    padding: 0.75rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
}

.review-history-header[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.625rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e9ecef;
}

.review-history-title[b-1kfquyn3uz] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.review-history-loading[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0;
    font-size: 0.8125rem;
    color: #6c757d;
}

.review-history-empty[b-1kfquyn3uz] {
    text-align: center;
    padding: 0.75rem 0;
    font-size: 0.8125rem;
}

/* Review History Timeline */
.history-timeline[b-1kfquyn3uz] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.history-entry[b-1kfquyn3uz] {
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    border-left: 3px solid #1b4a98;
}

.history-entry.history-processed[b-1kfquyn3uz] {
    opacity: 0.6;
    border-left-color: #adb5bd;
}

.history-entry-header[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.history-meta[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
}

.history-reviewer[b-1kfquyn3uz] {
    font-weight: 600;
    color: #333;
}

.history-date[b-1kfquyn3uz] {
    color: #6c757d;
}

.history-reviewer + .history-date[b-1kfquyn3uz]::before {
    content: "�";
    margin-right: 0.375rem;
    color: #adb5bd;
}

.history-entry-details[b-1kfquyn3uz] {
    display: flex;
    gap: 0.375rem;
    margin-top: 0.375rem;
    flex-wrap: wrap;
}

.history-tag[b-1kfquyn3uz] {
    display: inline-flex;
    align-items: center;
    padding: 0.0625rem 0.5rem;
    background: #e9ecef;
    color: #495057;
    font-size: 0.6875rem;
    font-weight: 600;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.history-tag-processed[b-1kfquyn3uz] {
    background: #d1ecf1;
    color: #0c5460;
}

.history-changes[b-1kfquyn3uz] {
    display: flex;
    align-items: flex-start;
    gap: 0.375rem;
    padding: 0.5rem 0.625rem;
    background: #fff3cd;
    border-radius: 4px;
    font-size: 0.8125rem;
    color: #664d03;
    line-height: 1.4;
    margin-top: 0.5rem;
}

.history-changes svg[b-1kfquyn3uz] {
    flex-shrink: 0;
    margin-top: 0.125rem;
    opacity: 0.7;
}

.history-changes span[b-1kfquyn3uz] {
    word-break: break-word;
}

.empty-history[b-1kfquyn3uz] {
    text-align: center;
    padding: 2rem 1rem;
}

/* Topic Picker Modal � self-contained styles to avoid global .modal conflicts */
.topic-picker-backdrop[b-1kfquyn3uz] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.topic-picker-modal[b-1kfquyn3uz] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 640px;
    max-width: 90vw;
    max-height: 90vh;
    overflow-y: auto;
}

.topic-picker-modal .modal-header[b-1kfquyn3uz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.topic-picker-modal .modal-header h3[b-1kfquyn3uz] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #333;
}

.topic-picker-modal .modal-body[b-1kfquyn3uz] {
    padding: 1.5rem;
}

.topic-picker-modal .modal-footer[b-1kfquyn3uz] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    background-color: #f8f9fa;
}

.loading-inline[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 0;
    justify-content: center;
    font-size: 0.875rem;
    color: #6c757d;
}

.empty-topics[b-1kfquyn3uz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 2rem 1rem;
    color: #6c757d;
}

.empty-topics svg[b-1kfquyn3uz] {
    opacity: 0.5;
    margin-bottom: 0.75rem;
}

.empty-topics p[b-1kfquyn3uz] {
    margin: 0.25rem 0;
}

.topic-picker-hint[b-1kfquyn3uz] {
    margin: 0 0 1rem 0;
    font-size: 0.8125rem;
    color: #6c757d;
}

.topic-picker-list[b-1kfquyn3uz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 480px;
    overflow-y: auto;
}

.topic-picker-item[b-1kfquyn3uz] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
    transition: all 0.15s ease;
    width: 100%;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
}

.topic-picker-item:hover[b-1kfquyn3uz] {
    border-color: #1b4a98;
    background: #f0f4ff;
    box-shadow: 0 2px 6px rgba(27, 74, 152, 0.1);
}

.topic-picker-item-header[b-1kfquyn3uz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
}

.topic-title[b-1kfquyn3uz] {
    font-weight: 600;
    font-size: 0.9375rem;
    color: #333;
}

.topic-days-badge[b-1kfquyn3uz] {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
    background: #e3f2fd;
    color: #1565c0;
    white-space: nowrap;
}

.topic-days-badge.topic-never-used[b-1kfquyn3uz] {
    background: #e9ecef;
    color: #6c757d;
}

.topic-picker-item-preview[b-1kfquyn3uz] {
    font-size: 0.8125rem;
    color: #6c757d;
    line-height: 1.4;
    max-height: 3.2em;
    overflow: hidden;
    text-overflow: ellipsis;
}

.topic-picker-item-preview img[b-1kfquyn3uz] {
    display: none;
}

/* Admin Tools Section */
.admin-tools-section[b-1kfquyn3uz] {
    margin-top: 2rem;
    border: 1px dashed #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}

.admin-tools-header[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    cursor: pointer;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    user-select: none;
    transition: background 0.15s ease;
}

.admin-tools-header:hover[b-1kfquyn3uz] {
    background: #e9ecef;
    color: #495057;
}

.admin-tools-header svg[b-1kfquyn3uz] {
    opacity: 0.6;
}

.admin-tools-header .chevron[b-1kfquyn3uz] {
    margin-left: auto;
    transition: transform 0.2s ease;
}

.admin-tools-header .chevron-open[b-1kfquyn3uz] {
    transform: rotate(180deg);
}

.admin-tools-body[b-1kfquyn3uz] {
    padding: 1rem;
    background: #fff;
    border-top: 1px dashed #dee2e6;
}

.admin-tool-item[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem;
    background: #fff8f8;
    border: 1px solid #f5c6cb;
    border-radius: 8px;
}

.admin-tool-info[b-1kfquyn3uz] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.admin-tool-name[b-1kfquyn3uz] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #333;
}

.admin-tool-desc[b-1kfquyn3uz] {
    font-size: 0.8125rem;
    color: #6c757d;
    line-height: 1.4;
}

.admin-tool-item .btn-danger[b-1kfquyn3uz] {
    flex-shrink: 0;
    white-space: nowrap;
}

/* Clear Reviews Modal */
.clear-reviews-list[b-1kfquyn3uz] {
    margin: 0.75rem 0;
    padding-left: 1.25rem;
    font-size: 0.875rem;
    line-height: 1.6;
    color: #333;
}

.clear-reviews-list li[b-1kfquyn3uz] {
    margin-bottom: 0.25rem;
}

.clear-reviews-warning[b-1kfquyn3uz] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.75rem;
    background: #fff3cd;
    border-radius: 6px;
    font-size: 0.8125rem;
    color: #664d03;
    line-height: 1.4;
    margin-top: 0.75rem;
}

.clear-reviews-warning svg[b-1kfquyn3uz] {
    flex-shrink: 0;
    margin-top: 0.125rem;
    opacity: 0.8;
}

/* Image Drop Zone */
.image-drop-zone[b-1kfquyn3uz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    margin-top: 0.375rem;
    border: 2px dashed #dee2e6;
    border-radius: 6px;
    background: #f8f9fa;
    color: #6c757d;
    font-size: 0.75rem;
    cursor: default;
    transition: all 0.15s ease;
}

.image-drop-zone svg[b-1kfquyn3uz] {
    opacity: 0.5;
    flex-shrink: 0;
}

[b-1kfquyn3uz] .image-drop-zone.drop-zone-active {
    border-color: #1b4a98;
    background: rgba(27, 74, 152, 0.05);
    color: #1b4a98;
}

[b-1kfquyn3uz] .image-drop-zone.drop-zone-active svg {
    opacity: 1;
}

[b-1kfquyn3uz] .image-drop-zone.drop-zone-uploading {
    border-color: #ffc107;
    background: rgba(255, 193, 7, 0.05);
    color: #856404;
}

/* Add Post Instance Modal */
.add-post-backdrop[b-1kfquyn3uz] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.add-post-modal[b-1kfquyn3uz] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 450px;
}

.add-post-modal .modal-header[b-1kfquyn3uz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.add-post-modal .modal-header h3[b-1kfquyn3uz] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #333;
}

.add-post-modal .modal-body[b-1kfquyn3uz] {
    padding: 1.5rem;
}

.add-post-modal .modal-footer[b-1kfquyn3uz] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    background-color: #f8f9fa;
    border-radius: 0 0 12px 12px;
}
/* /Components/Pages/Customers/Social/SocialProjectInstanceList.razor.rz.scp.css */
/* Error container */
.error-container[b-leqk7qkc62] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6c757d;
    text-align: center;
}

.error-container svg[b-leqk7qkc62] { color: #dc3545; margin-bottom: 0.5rem; }
.error-container h3[b-leqk7qkc62] { margin: 0; font-size: 1.25rem; font-weight: 600; color: #333; }
.error-container p[b-leqk7qkc62] { margin: 0.5rem 0; color: #6c757d; }

/* View Toggle */
.view-toggle[b-leqk7qkc62] {
    display: flex;
    background: #e9ecef;
    border-radius: 8px;
    padding: 3px;
}

.view-toggle-btn[b-leqk7qkc62] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 32px;
    border-radius: 6px;
    color: #6c757d;
    text-decoration: none;
    transition: all 0.15s ease;
}

.view-toggle-btn:hover[b-leqk7qkc62] { color: #1b4a98; background: rgba(27, 74, 152, 0.1); }
.view-toggle-btn.active[b-leqk7qkc62] { background: white; color: #1b4a98; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }

/* Breadcrumb last child */
.breadcrumb span:last-child[b-leqk7qkc62] { color: #6c757d; }

/* Button variants */
.btn-danger[b-leqk7qkc62] { background-color: #dc3545; color: white; }
.btn-danger:hover:not(:disabled)[b-leqk7qkc62] { background-color: #c82333; }
.btn-danger:disabled[b-leqk7qkc62] { opacity: 0.7; cursor: not-allowed; }

.btn-icon-danger[b-leqk7qkc62] { background: #fee; color: #dc3545; }
.btn-icon-danger:hover[b-leqk7qkc62] { background: #fdd; color: #c82333; }

.btn-icon-complete[b-leqk7qkc62] { background: #e8f5e9; color: #2e7d32; }
.btn-icon-complete:hover[b-leqk7qkc62] { background: #c8e6c9; color: #1b5e20; }

.btn-success[b-leqk7qkc62] { background-color: #28a745; color: white; border: none; padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: 500; border-radius: 8px; cursor: pointer; transition: all 0.15s ease; }
.btn-success:hover:not(:disabled)[b-leqk7qkc62] { background-color: #218838; }
.btn-success:disabled[b-leqk7qkc62] { opacity: 0.7; cursor: not-allowed; }

/* Mark Complete Modal */
.mark-complete-backdrop[b-leqk7qkc62] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.mark-complete-modal[b-leqk7qkc62] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 480px;
    max-height: 90vh;
    overflow-y: auto;
}

/* Filter actions override */
.filter-actions[b-leqk7qkc62] { margin-left: auto; }

/* Filter checkbox variant */
.filter-group.checkbox-filter[b-leqk7qkc62] {
    justify-content: flex-end;
}

.checkbox-label[b-leqk7qkc62] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #495057;
    cursor: pointer;
}

.checkbox-label input[type="checkbox"][b-leqk7qkc62] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

/* Stats Bar */
.stats-bar[b-leqk7qkc62] {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    padding: 0.75rem 0;
}

.stat-item[b-leqk7qkc62] { display: flex; align-items: baseline; gap: 0.5rem; }
.stat-value[b-leqk7qkc62] { font-size: 1.25rem; font-weight: 600; color: #1b4a98; }
.stat-label[b-leqk7qkc62] { font-size: 0.8125rem; color: #6c757d; }

/* Generate Missing Instances Bar */
.generate-missing-bar[b-leqk7qkc62] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: #fef9e7;
    border: 1px solid #f0dfa0;
    border-radius: 10px;
    padding: 12px 20px;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.generate-missing-info[b-leqk7qkc62] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    color: #6b5900;
}

.generate-missing-info svg[b-leqk7qkc62] {
    flex-shrink: 0;
    color: #b8860b;
}

.generate-missing-actions[b-leqk7qkc62] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

/* Table overrides */
.actions-col[b-leqk7qkc62] { width: 100px; text-align: center; }
.actions-cell[b-leqk7qkc62] { text-align: center; }
.actions-wrapper[b-leqk7qkc62] { display: inline-flex; gap: 0.25rem; justify-content: center; }

/* Date Cell */
.date-cell[b-leqk7qkc62] { display: flex; flex-direction: column; gap: 0.125rem; }
.date-primary[b-leqk7qkc62] { font-weight: 500; color: #333; }
.date-secondary[b-leqk7qkc62] { font-size: 0.75rem; color: #6c757d; }

/* Instance Name */
.instance-name[b-leqk7qkc62] { font-weight: 500; }

/* Status Badges */
.status-badges[b-leqk7qkc62] { display: flex; flex-wrap: wrap; gap: 0.25rem; }

/* Badge variants */
.badge-type[b-leqk7qkc62] { background-color: #e7e3ff; color: #5a4fcf; }

/* Project Link */
.project-link[b-leqk7qkc62] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    color: #1b4a98;
    text-decoration: none;
    font-size: 0.8125rem;
}

.project-link:hover[b-leqk7qkc62] { text-decoration: underline; }
.project-link svg[b-leqk7qkc62] { flex-shrink: 0; }

.text-danger[b-leqk7qkc62] { color: #dc3545; font-size: 0.85rem; }

/* Delete Modal */
.delete-date[b-leqk7qkc62] { color: #6c757d; font-size: 0.875rem; }

/* Modal extensions */
.modal[b-leqk7qkc62] {
    max-width: 500px;
    max-height: fit-content !important;
    height: auto !important;
    overflow: visible !important;
    display: block !important;
}

.modal-sm[b-leqk7qkc62] { max-width: 400px; }

.modal-close[b-leqk7qkc62] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

.modal-close:hover[b-leqk7qkc62] { background-color: #f0f0f0; color: #333; }
.modal-footer[b-leqk7qkc62] { background-color: #f8f9fa; }

/* Responsive */
@media (max-width: 768px) {
    .filter-actions[b-leqk7qkc62] { margin-left: 0; width: 100%; }
    .filter-actions .btn[b-leqk7qkc62] { width: 100%; justify-content: center; }
    .stats-bar[b-leqk7qkc62] { flex-wrap: wrap; }
}

/* Danger Zone */
.danger-zone[b-leqk7qkc62] {
    margin-top: 2rem;
    background: white;
    border: 2px solid #dc3545;
    border-radius: 12px;
    overflow: hidden;
}

.danger-zone-header[b-leqk7qkc62] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    background-color: #fff5f5;
    border-bottom: 1px solid #f5c6cb;
}

.danger-zone-header svg[b-leqk7qkc62] { color: #dc3545; flex-shrink: 0; }
.danger-zone-header h3[b-leqk7qkc62] { margin: 0; font-size: 1rem; font-weight: 600; color: #dc3545; }
.danger-zone-content[b-leqk7qkc62] { padding: 1.25rem; }

.danger-zone-item[b-leqk7qkc62] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1.5rem;
}

.danger-zone-item + .danger-zone-item[b-leqk7qkc62] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #f5c6cb;
}

.danger-zone-info h4[b-leqk7qkc62] { margin: 0 0 0.25rem 0; font-size: 0.9375rem; font-weight: 600; color: #333; }
.danger-zone-info p[b-leqk7qkc62] { margin: 0; font-size: 0.8125rem; color: #6c757d; }

.btn-danger-outline[b-leqk7qkc62] {
    background-color: transparent;
    color: #dc3545;
    border: 1px solid #dc3545;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.btn-danger-outline:hover[b-leqk7qkc62] { background-color: #dc3545; color: white; }

/* Delete Preview */
.delete-preview[b-leqk7qkc62] {
    background-color: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 8px;
    padding: 1rem;
    margin: 0.75rem 0;
}

.delete-preview p[b-leqk7qkc62] { margin: 0 0 0.5rem 0; }
.delete-preview ul[b-leqk7qkc62] { margin: 0.5rem 0 0 1.25rem; padding: 0; }
.delete-preview ul li[b-leqk7qkc62] { margin-bottom: 0.25rem; font-size: 0.875rem; }

.text-warning[b-leqk7qkc62] { color: #856404 !important; }

.preserved-list[b-leqk7qkc62] {
    background-color: #fff;
    border-radius: 6px;
    padding: 0.5rem 0.75rem 0.5rem 2rem !important;
    margin: 0.5rem 0 0 0 !important;
    max-height: 150px;
    overflow-y: auto;
}

.preserved-list li[b-leqk7qkc62] { font-size: 0.8125rem; color: #333; }

.loading-inline[b-leqk7qkc62] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    margin: 0.75rem 0;
}

.loading-inline .spinner-small[b-leqk7qkc62] { border: 2px solid #e9ecef; border-top-color: #1b4a98; }
.loading-inline span[b-leqk7qkc62] { font-size: 0.875rem; color: #6c757d; }

@media (max-width: 576px) {
    .danger-zone-item[b-leqk7qkc62] { flex-direction: column; align-items: flex-start; }
    .danger-zone-item .btn-danger-outline[b-leqk7qkc62] { width: 100%; text-align: center; }
}

/* Add Instance Modal */
.add-instance-backdrop[b-leqk7qkc62] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.add-instance-modal[b-leqk7qkc62] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 450px;
}
/* /Components/Pages/Customers/Social/SocialProjectView.razor.rz.scp.css */
/* Error container */
.error-container[b-abpswezzoz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6c757d;
    text-align: center;
}

.error-container svg[b-abpswezzoz] { color: #dc3545; margin-bottom: 0.5rem; }
.error-container h3[b-abpswezzoz] { margin: 0; font-size: 1.25rem; font-weight: 600; color: #333; }
.error-container p[b-abpswezzoz] { margin: 0.5rem 0; color: #6c757d; }

/* Breadcrumb last child */
.breadcrumb span:last-child[b-abpswezzoz] { color: #6c757d; }

/* Button variants */
.btn-danger[b-abpswezzoz] { background-color: #dc3545; color: white; }
.btn-danger:hover:not(:disabled)[b-abpswezzoz] { background-color: #c82333; }
.btn-danger:disabled[b-abpswezzoz] { opacity: 0.7; cursor: not-allowed; }
.btn-primary:hover:not(:disabled)[b-abpswezzoz] { background-color: #153a7a; }

/* Detail Layout - Two Column */
.detail-layout[b-abpswezzoz] {
    display: grid;
    grid-template-columns: 1fr 350px;
    gap: 1.5rem;
    align-items: start;
}

.detail-main[b-abpswezzoz],
.detail-sidebar[b-abpswezzoz] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Detail Cards */
.detail-card[b-abpswezzoz] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

/* Info Grid */
.info-grid[b-abpswezzoz] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
}

.info-item[b-abpswezzoz] { display: flex; flex-direction: column; gap: 0.25rem; }
.info-label[b-abpswezzoz] { font-size: 0.75rem; font-weight: 600; color: #6c757d; text-transform: uppercase; letter-spacing: 0.5px; }
.info-value[b-abpswezzoz] { font-size: 0.9375rem; color: #333; }

/* Description */
.description-content[b-abpswezzoz] { line-height: 1.7; color: #333; font-size: 0.9375rem; }
.description-content p[b-abpswezzoz] { margin: 0 0 1rem 0; }
.description-content p:last-child[b-abpswezzoz] { margin-bottom: 0; }
.description-content ul[b-abpswezzoz], .description-content ol[b-abpswezzoz] { margin: 0 0 1rem 1.5rem; padding: 0; }
.description-content a[b-abpswezzoz] { color: #1b4a98; }
.no-content[b-abpswezzoz] { margin: 0; font-style: italic; }

/* Assignment */
.assignment-list[b-abpswezzoz] { display: flex; flex-direction: column; gap: 1rem; }
.assignment-item[b-abpswezzoz] { display: flex; flex-direction: column; gap: 0.125rem; }
.assignment-role[b-abpswezzoz] { font-size: 0.75rem; font-weight: 600; color: #6c757d; text-transform: uppercase; letter-spacing: 0.5px; }

.assignment-name[b-abpswezzoz] {
    font-size: 0.9375rem;
    color: #333;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.reviewer-email[b-abpswezzoz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    background: #e9ecef;
    border-radius: 4px;
    color: #6c757d;
    transition: all 0.15s ease;
}

.reviewer-email:hover[b-abpswezzoz] { background: #1b4a98; color: white; }

/* Options */
.option-item[b-abpswezzoz] { display: flex; justify-content: space-between; align-items: center; }
.option-label[b-abpswezzoz] { font-size: 0.875rem; color: #333; }

.option-value[b-abpswezzoz] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    font-weight: 500;
}

.option-enabled[b-abpswezzoz] { color: #155724; }
.option-disabled[b-abpswezzoz] { color: #6c757d; }

/* Quick Actions */
.quick-actions[b-abpswezzoz] { display: flex; flex-direction: column; gap: 0.5rem; }

.quick-action-link[b-abpswezzoz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
    color: #333;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    transition: all 0.15s ease;
    border: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
}

.quick-action-link:hover:not(:disabled)[b-abpswezzoz] { background: #e9ecef; color: #1b4a98; }
.quick-action-link:disabled[b-abpswezzoz] { opacity: 0.7; cursor: not-allowed; }
.quick-action-link svg[b-abpswezzoz] { color: #6c757d; flex-shrink: 0; }
.quick-action-link:hover:not(:disabled) svg[b-abpswezzoz] { color: #1b4a98; }

/* Modal extensions */
.modal[b-abpswezzoz] {
    max-width: 420px;
    max-height: fit-content !important;
    height: auto !important;
    overflow: visible !important;
    display: block !important;
}

.modal-close[b-abpswezzoz] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

.modal-close:hover[b-abpswezzoz] { background-color: #f0f0f0; color: #333; }
.modal-footer[b-abpswezzoz] { background-color: #f8f9fa; }

/* Delete Preview */
.delete-preview[b-abpswezzoz] {
    background-color: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 8px;
    padding: 1rem;
    margin: 0.75rem 0;
}

.delete-preview p[b-abpswezzoz] { margin: 0 0 0.5rem 0; }
.delete-preview ul[b-abpswezzoz] { margin: 0.5rem 0 0 1.25rem; padding: 0; }
.delete-preview ul li[b-abpswezzoz] { margin-bottom: 0.25rem; font-size: 0.875rem; }
.text-warning[b-abpswezzoz] { color: #856404 !important; }

.preserved-list[b-abpswezzoz] {
    background-color: #fff;
    border-radius: 6px;
    padding: 0.5rem 0.75rem 0.5rem 2rem !important;
    margin: 0.5rem 0 0 0 !important;
    max-height: 150px;
    overflow-y: auto;
}

.preserved-list li[b-abpswezzoz] { font-size: 0.8125rem; color: #333; }

/* Warning Card */
.card-warning[b-abpswezzoz] { border: 1px solid #ffc107; background: #fffbf0; }
.card-warning .card-header[b-abpswezzoz] { background: linear-gradient(135deg, #fff3cd 0%, #ffeeba 100%); border-bottom-color: #ffc107; }
.card-warning .card-header h2[b-abpswezzoz] { display: flex; align-items: center; gap: 0.5rem; color: #856404; }
.card-warning .card-header h2 svg[b-abpswezzoz] { flex-shrink: 0; }
.warning-text[b-abpswezzoz] { margin: 0 0 1rem 0; font-size: 0.875rem; color: #856404; line-height: 1.5; }

/* Linked Project Card */
.detail-card:has(.linked-project-info) .card-header h2[b-abpswezzoz],
.detail-card:has(.no-linked-project) .card-header h2[b-abpswezzoz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.detail-card:has(.linked-project-info) .card-header h2 svg[b-abpswezzoz],
.detail-card:has(.no-linked-project) .card-header h2 svg[b-abpswezzoz] {
    flex-shrink: 0;
    opacity: 0.7;
}

.linked-project-info[b-abpswezzoz] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.linked-project-row[b-abpswezzoz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
}

.linked-project-label[b-abpswezzoz] {
    font-size: 0.8125rem;
    color: #6c757d;
    flex-shrink: 0;
}

.linked-project-link[b-abpswezzoz] {
    color: #1b4a98;
    text-decoration: none;
    font-weight: 500;
    font-size: 0.875rem;
    text-align: right;
    word-break: break-word;
}

.linked-project-link:hover[b-abpswezzoz] {
    text-decoration: underline;
}

.linked-project-actions[b-abpswezzoz] {
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.btn-outline[b-abpswezzoz] {
    background-color: transparent;
    color: #1b4a98;
    border: 1px solid #1b4a98;
}

.btn-outline:hover[b-abpswezzoz] {
    background-color: #1b4a98;
    color: white;
}

.no-linked-project[b-abpswezzoz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0.75rem 0;
    color: #856404;
}

.no-linked-project svg[b-abpswezzoz] {
    margin-bottom: 0.5rem;
    opacity: 0.7;
}

.no-linked-project span[b-abpswezzoz] {
    font-weight: 600;
    font-size: 0.875rem;
}

.no-linked-project-hint[b-abpswezzoz] {
    margin: 0.5rem 0 0 0;
    font-size: 0.8125rem;
    color: #6c757d;
    line-height: 1.4;
}

/* Responsive */
@media (max-width: 992px) {
    .detail-layout[b-abpswezzoz] { grid-template-columns: 1fr; }
}

@media (max-width: 576px) {
    .info-grid[b-abpswezzoz] { grid-template-columns: 1fr; }
}

/* Loading inline */
.loading-inline[b-abpswezzoz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    padding: 0.5rem 0;
    font-size: 0.875rem;
}

/* Topics */
.topics-list[b-abpswezzoz] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.topic-item[b-abpswezzoz] {
    padding: 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 3px solid #1b4a98;
}

.topic-header[b-abpswezzoz] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.75rem;
}

.topic-title[b-abpswezzoz] {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #333;
    line-height: 1.4;
}

.topic-actions[b-abpswezzoz] {
    display: flex;
    gap: 0.25rem;
    flex-shrink: 0;
    opacity: 0;
    transition: opacity 0.15s;
}

.topic-item:hover .topic-actions[b-abpswezzoz] {
    opacity: 1;
}

.topic-description[b-abpswezzoz] {
    margin-top: 0.625rem;
    font-size: 0.875rem;
    color: #495057;
    line-height: 1.6;
}

.topic-description p[b-abpswezzoz] { margin: 0 0 0.5rem 0; }
.topic-description p:last-child[b-abpswezzoz] { margin-bottom: 0; }
.topic-description img[b-abpswezzoz] { max-width: 100%; height: auto; border-radius: 6px; }
.topic-description ul[b-abpswezzoz], .topic-description ol[b-abpswezzoz] { margin: 0 0 0.5rem 1.25rem; padding: 0; }
.topic-description a[b-abpswezzoz] { color: #1b4a98; }

/* Button icon variants */
.btn-icon-danger[b-abpswezzoz] { background: #fee; color: #dc3545; }
.btn-icon-danger:hover[b-abpswezzoz] { background: #fdd; color: #c82333; }

/* Wide modal for topic editor */
.modal-wide[b-abpswezzoz] {
    max-width: 720px !important;
}

/* Form group spacing */
.form-group[b-abpswezzoz] { margin-bottom: 1rem; }
.form-group:last-child[b-abpswezzoz] { margin-bottom: 0; }
.form-group label[b-abpswezzoz] { display: block; margin-bottom: 0.375rem; font-weight: 500; font-size: 0.875rem; }

/* Social Accounts */
.accounts-list[b-abpswezzoz] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.account-item[b-abpswezzoz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 3px solid #1b4a98;
    gap: 0.75rem;
}

.account-info[b-abpswezzoz] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.account-platform[b-abpswezzoz] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #333;
}

.account-handle[b-abpswezzoz] {
    font-size: 0.8125rem;
    color: #495057;
}

.account-url[b-abpswezzoz] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    color: #1b4a98;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.account-url:hover[b-abpswezzoz] {
    text-decoration: underline;
}

.account-url svg[b-abpswezzoz] {
    flex-shrink: 0;
    opacity: 0.6;
}

.account-actions[b-abpswezzoz] {
    display: flex;
    gap: 0.25rem;
    flex-shrink: 0;
    opacity: 0;
    transition: opacity 0.15s;
}

.account-item:hover .account-actions[b-abpswezzoz] {
    opacity: 1;
}

/* Preserve list for form groups */
.preserved-list[b-abpswezzoz] {
    background-color: #fff;
    border-radius: 6px;
    padding: 0.5rem 0.75rem 0.5rem 2rem !important;
    margin: 0.5rem 0 0 0 !important;
    max-height: 150px;
    overflow-y: auto;
}

.preserved-list li[b-abpswezzoz] { font-size: 0.8125rem; color: #333; }
/* /Components/Pages/Customers/Social/SocialWorkQueue.razor.rz.scp.css */
/* Page header left h1 override */
.page-header-left h1[b-fhrm70lbof] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 600;
    color: #333;
}

/* Breadcrumb last child */
.breadcrumb .separator[b-fhrm70lbof] { color: #6c757d; }

/* Button icon size override */
.btn-icon[b-fhrm70lbof] {
    width: 28px;
    height: 28px;
    background: #f8f9fa;
}

.btn-icon:hover[b-fhrm70lbof] {
    background: #e9ecef;
}

/* Filter checkbox variant */
.filter-group.checkbox-filter[b-fhrm70lbof] {
    justify-content: flex-end;
}

.checkbox-label[b-fhrm70lbof] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #495057;
    cursor: pointer;
}

.checkbox-label input[type="checkbox"][b-fhrm70lbof] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.filter-actions[b-fhrm70lbof] {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
}

/* Date Range Bar */
.date-range-bar[b-fhrm70lbof] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
    background: var(--color-bg-white);
    padding: 0.75rem 1rem;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
    flex-wrap: wrap;
}

.date-presets[b-fhrm70lbof] {
    display: flex;
    gap: 0.375rem;
}

.preset-btn[b-fhrm70lbof] {
    padding: 0.4rem 0.875rem;
    font-size: 0.8125rem;
    font-weight: 500;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-bg-white);
    color: var(--color-text-muted);
    cursor: pointer;
    transition: all 0.15s ease;
}

.preset-btn:hover[b-fhrm70lbof] {
    background: var(--color-bg);
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.preset-btn.active[b-fhrm70lbof] {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: white;
}

.date-inputs[b-fhrm70lbof] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.date-field[b-fhrm70lbof] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.date-field label[b-fhrm70lbof] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--color-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.date-field .form-control[b-fhrm70lbof] {
    width: 155px;
    padding: 0.375rem 0.5rem;
    font-size: 0.8125rem;
}

.date-separator[b-fhrm70lbof] {
    color: var(--color-text-secondary);
    font-size: 0.875rem;
}

/* Stats Bar */
.stats-bar[b-fhrm70lbof] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.stat-item[b-fhrm70lbof] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.75rem 1.25rem;
    background: white;
    border-radius: 10px;
    box-shadow: var(--shadow-card);
    min-width: 90px;
}

.stat-value[b-fhrm70lbof] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #333;
}

.stat-label[b-fhrm70lbof] {
    font-size: 0.7rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stat-not-started .stat-value[b-fhrm70lbof] { color: #6c757d; }
.stat-in-progress .stat-value[b-fhrm70lbof] { color: #17a2b8; }
.stat-awaiting .stat-value[b-fhrm70lbof] { color: #e6a700; }
.stat-completed .stat-value[b-fhrm70lbof] { color: #28a745; }

/* Work Queue Container */
.work-queue-container[b-fhrm70lbof] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Client Group */
.client-group[b-fhrm70lbof] {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
    overflow: hidden;
}

.client-header[b-fhrm70lbof] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    background: linear-gradient(135deg, #f0f4fa 0%, #e8ecf4 100%);
    border-bottom: 2px solid var(--color-primary);
}

.client-header-left[b-fhrm70lbof] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.client-name-link[b-fhrm70lbof] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-primary);
    text-decoration: none;
}

.client-name-link:hover[b-fhrm70lbof] {
    text-decoration: underline;
}

.client-name[b-fhrm70lbof] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-text);
}

.client-count[b-fhrm70lbof] {
    font-size: 0.8125rem;
    color: var(--color-text-secondary);
    font-weight: 500;
}

.client-header-right[b-fhrm70lbof] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.client-staff[b-fhrm70lbof] {
    font-size: 0.8125rem;
    color: var(--color-text-secondary);
    font-weight: 500;
}

.btn-icon-refresh[b-fhrm70lbof] {
    width: 26px;
    height: 26px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: var(--color-text-secondary);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.btn-icon-refresh:hover:not(:disabled)[b-fhrm70lbof] {
    background: rgba(0, 0, 0, 0.08);
    color: var(--color-primary);
}

.btn-icon-refresh:disabled[b-fhrm70lbof] {
    opacity: 0.5;
    cursor: default;
}

.btn-icon-refresh svg.spin[b-fhrm70lbof] {
    animation: spin-b-fhrm70lbof 0.8s linear infinite;
}

/* Table overrides inside client groups */
.client-group .table-container[b-fhrm70lbof] {
    box-shadow: none;
    border-radius: 0;
}

.client-group .data-table[b-fhrm70lbof] {
    table-layout: fixed;
    width: 100%;
}

.client-group .data-table th[b-fhrm70lbof],
.client-group .data-table td[b-fhrm70lbof] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.client-group .data-table th[b-fhrm70lbof] {
    padding: 0.5rem 1rem;
    font-size: 0.6875rem;
}

.client-group .data-table td[b-fhrm70lbof] {
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
}

/* Fixed column widths for consistent layout across client groups */
.col-due-date[b-fhrm70lbof] { width: 8%; }
.col-name[b-fhrm70lbof] { width: 19%; }
.col-type[b-fhrm70lbof] { width: 7%; }
.col-period[b-fhrm70lbof] { width: 11%; }
.col-posts[b-fhrm70lbof] { width: 5%; }
.col-hours[b-fhrm70lbof] { width: 7%; text-align: right; }
.col-sent[b-fhrm70lbof] { width: 11%; }
.col-completed[b-fhrm70lbof] { width: 8%; }
.col-actions[b-fhrm70lbof] { width: 6%; }

/* Hours cells */
.hours-cell[b-fhrm70lbof] {
    text-align: right;
    font-size: 0.8125rem;
    white-space: nowrap;
}

.hours-over[b-fhrm70lbof] {
    color: #dc3545;
    font-weight: 600;
}

/* Cell styles */
.date-cell[b-fhrm70lbof] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.date-primary[b-fhrm70lbof] {
    font-weight: 600;
    color: #333;
    white-space: nowrap;
}

.date-secondary[b-fhrm70lbof] {
    font-size: 0.6875rem;
    color: #6c757d;
}

.instance-link[b-fhrm70lbof] {
    color: #333;
    text-decoration: none;
    font-weight: 500;
}

.instance-link:hover[b-fhrm70lbof] {
    color: var(--color-primary);
}

.post-dates-label[b-fhrm70lbof] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-top: 2px;
}

.period-text[b-fhrm70lbof] {
    font-size: 0.8125rem;
    color: #6c757d;
    white-space: nowrap;
}

.post-count[b-fhrm70lbof] {
    font-weight: 600;
    color: #333;
}

.badge-type[b-fhrm70lbof] {
    background-color: #e9ecef;
    color: #495057;
}

.badge-na[b-fhrm70lbof] {
    background-color: #f1f3f5;
    color: #adb5bd;
    font-style: italic;
}

.actions-col[b-fhrm70lbof] {
    text-align: right;
}

.actions-cell[b-fhrm70lbof] {
    text-align: right;
}

.actions-wrapper[b-fhrm70lbof] {
    display: flex;
    gap: 0.25rem;
    justify-content: flex-end;
}

/* Row status highlights */
.row-overdue[b-fhrm70lbof] {
    background-color: #fff5f5;
}

.row-overdue:hover[b-fhrm70lbof] {
    background-color: #ffecec !important;
}

.row-due-soon[b-fhrm70lbof] {
    background-color: #fffbeb;
}

.row-due-soon:hover[b-fhrm70lbof] {
    background-color: #fff8e1 !important;
}

/* Mark Complete button */
.btn-icon-complete[b-fhrm70lbof] {
    color: #28a745;
    border: none;
    cursor: pointer;
}

.btn-icon-complete:hover[b-fhrm70lbof] {
    background: #d4edda !important;
    color: #1e7e34;
}

/* Mark Complete confirmation modal */
.mark-complete-backdrop[b-fhrm70lbof] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.mark-complete-modal[b-fhrm70lbof] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 480px;
    max-height: 90vh;
    overflow-y: auto;
}

.mark-complete-modal .modal-header[b-fhrm70lbof] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e9ecef;
}

.mark-complete-modal .modal-header h5[b-fhrm70lbof] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
}

.mark-complete-modal .modal-close[b-fhrm70lbof] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6c757d;
    cursor: pointer;
    line-height: 1;
}

.mark-complete-modal .modal-body[b-fhrm70lbof] {
    padding: 1.25rem;
}

.mark-complete-modal .modal-body p[b-fhrm70lbof] {
    margin: 0 0 0.75rem;
}

.mark-complete-modal .modal-body p:last-child[b-fhrm70lbof] {
    margin-bottom: 0;
}

.mark-complete-modal .modal-footer[b-fhrm70lbof] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 1rem 1.25rem;
    border-top: 1px solid #e9ecef;
}

/* Responsive */
@media (max-width: 768px) {
    .filter-actions[b-fhrm70lbof] {
        width: 100%;
        margin-left: 0;
        justify-content: flex-end;
    }

    .date-range-bar[b-fhrm70lbof] {
        flex-direction: column;
        align-items: stretch;
    }

    .date-inputs[b-fhrm70lbof] {
        flex-wrap: wrap;
    }

    .date-field .form-control[b-fhrm70lbof] {
        width: 100%;
    }

    .stats-bar[b-fhrm70lbof] {
        justify-content: center;
    }

    .stat-item[b-fhrm70lbof] {
        flex: 1;
        min-width: 80px;
        padding: 0.625rem 0.75rem;
    }

    .stat-value[b-fhrm70lbof] {
        font-size: 1.125rem;
    }

    .client-header[b-fhrm70lbof] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.375rem;
    }
}

/* Results wrapper for refresh overlay */
.results-wrapper[b-fhrm70lbof] {
    position: relative;
    transition: opacity 0.2s ease;
}

.results-wrapper.is-refreshing[b-fhrm70lbof] {
    opacity: 0.5;
    pointer-events: none;
}

.refresh-overlay[b-fhrm70lbof] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 4rem;
    z-index: 10;
}

.spinner-small[b-fhrm70lbof] {
    width: 24px;
    height: 24px;
    border: 3px solid #e9ecef;
    border-top-color: #0d6efd;
    border-radius: 50%;
    animation: spin-b-fhrm70lbof 0.6s linear infinite;
}

/* Refresh button */
.btn-refresh svg.spin[b-fhrm70lbof] {
    animation: spin-b-fhrm70lbof 0.8s linear infinite;
}

@keyframes spin-b-fhrm70lbof {
    to { transform: rotate(360deg); }
}
/* /Components/Pages/Customers/TenantModules/BuildingUnits.razor.rz.scp.css */
/* Building Units list page scoped styles */

.page-header[b-aovcd39gcg] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header-left[b-aovcd39gcg] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.page-header-left h1[b-aovcd39gcg] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.page-subtitle[b-aovcd39gcg] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0;
}

.page-header-right[b-aovcd39gcg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.btn-back[b-aovcd39gcg] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.85rem;
    color: #6b7280;
    text-decoration: none;
    padding: 6px 12px;
    border-radius: 8px;
    transition: all 0.15s;
}

.btn-back:hover[b-aovcd39gcg] {
    color: #374151;
    background: #f3f4f6;
}

/* Action bar */
.action-bar[b-aovcd39gcg] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.show-inactive-toggle[b-aovcd39gcg] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: #6b7280;
    cursor: pointer;
}

/* Loading & empty state */
.loading-spinner[b-aovcd39gcg] {
    display: flex;
    justify-content: center;
    padding: 3rem;
}

.empty-state[b-aovcd39gcg] {
    text-align: center;
    padding: 3rem;
    color: #6b7280;
}

/* Summary bar */
.summary-bar[b-aovcd39gcg] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 1rem;
    font-size: 0.9rem;
    color: #374151;
}

.summary-divider[b-aovcd39gcg] {
    color: #d1d5db;
}

.summary-occupied[b-aovcd39gcg] {
    color: #065f46;
}

.summary-vacant[b-aovcd39gcg] {
    color: #92400e;
}

.summary-rent[b-aovcd39gcg] {
    color: #059669;
}

/* Table card */
.table-card[b-aovcd39gcg] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
}

.table-responsive[b-aovcd39gcg] {
    overflow-x: auto;
}

.units-table[b-aovcd39gcg] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.units-table thead th[b-aovcd39gcg] {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #6b7280;
    border-bottom: 2px solid #e5e7eb;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
    background: #f9fafb;
}

.units-table thead th.sortable[b-aovcd39gcg] {
    cursor: pointer;
    user-select: none;
    transition: color 0.15s;
}

.units-table thead th.sortable:hover[b-aovcd39gcg] {
    color: #2563eb;
}

.units-table tbody td[b-aovcd39gcg] {
    padding: 12px 16px;
    border-bottom: 1px solid #f3f4f6;
    color: #374151;
    vertical-align: middle;
}

.units-table tbody tr:hover[b-aovcd39gcg] {
    background: #f9fafb;
}

.row-inactive[b-aovcd39gcg] {
    opacity: 0.55;
}

.unit-link[b-aovcd39gcg] {
    font-weight: 600;
    color: #2563eb;
    text-decoration: none;
}

.unit-link:hover[b-aovcd39gcg] {
    text-decoration: underline;
}

.text-end[b-aovcd39gcg] {
    text-align: right;
}

.text-muted[b-aovcd39gcg] {
    color: #9ca3af;
}

/* Totals footer */
.units-table tfoot td[b-aovcd39gcg] {
    padding: 12px 16px;
    border-top: 2px solid #e5e7eb;
    background: #f9fafb;
    color: #111827;
    font-size: 0.9rem;
}

/* Badges */
.badge[b-aovcd39gcg] {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 500;
}

.badge-vacant[b-aovcd39gcg] {
    background: #fef3c7;
    color: #92400e;
}

.badge-occupied[b-aovcd39gcg] {
    background: #d1fae5;
    color: #065f46;
}

.badge-inactive[b-aovcd39gcg] {
    background: #fee2e2;
    color: #991b1b;
}

.badge-checklist[b-aovcd39gcg] {
    background: #fef3c7;
    color: #92400e;
    gap: 3px;
    margin-left: 4px;
}

.badge-linked[b-aovcd39gcg] {
    background: #ede9fe;
    color: #6d28d9;
    gap: 3px;
    margin-left: 4px;
}

.badge-linked-child[b-aovcd39gcg] {
    background: #ede9fe;
    color: #6d28d9;
    margin-left: 4px;
    font-size: 0.7rem;
}

/* Child unit rows */
.child-unit-row[b-aovcd39gcg] {
    background: #f9fafb;
}

.child-unit-row:hover[b-aovcd39gcg] {
    background: #f3f4f6 !important;
}

.child-unit-indicator[b-aovcd39gcg] {
    color: #9ca3af;
    font-weight: 600;
    margin-right: 6px;
}

/* Modal */
.unit-backdrop[b-aovcd39gcg] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.unit-modal[b-aovcd39gcg] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-header[b-aovcd39gcg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px 0;
}

.modal-header h5[b-aovcd39gcg] {
    margin: 0;
    font-weight: 600;
    font-size: 1.1rem;
}

.modal-close[b-aovcd39gcg] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    line-height: 1;
    padding: 0;
}

.modal-close:hover[b-aovcd39gcg] {
    color: #111827;
}

.modal-body[b-aovcd39gcg] {
    padding: 20px 24px;
}

.modal-footer[b-aovcd39gcg] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 0 24px 20px;
}

/* Responsive */
@media (max-width: 640px) {
    .units-grid[b-aovcd39gcg] {
        grid-template-columns: 1fr;
    }

    .action-bar[b-aovcd39gcg] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/Customers/TenantModules/BuildingUnitView.razor.rz.scp.css */
/* Building Unit Detail page scoped styles */

.page-header[b-atv2urqswq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header-left[b-atv2urqswq] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.page-header-left h1[b-atv2urqswq] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.page-subtitle[b-atv2urqswq] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0;
}

.page-header-right[b-atv2urqswq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Loading & empty state */
.loading-spinner[b-atv2urqswq] {
    display: flex;
    justify-content: center;
    padding: 3rem;
}

.empty-state[b-atv2urqswq] {
    text-align: center;
    padding: 3rem;
    color: #6b7280;
}

/* Detail cards */
.detail-card[b-atv2urqswq] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px 24px;
    margin-bottom: 16px;
}

.section-header[b-atv2urqswq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.section-title[b-atv2urqswq] {
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
    margin: 0 0 12px;
}

.section-header .section-title[b-atv2urqswq] {
    margin-bottom: 0;
}

.description-text[b-atv2urqswq] {
    color: #374151;
    margin: 0;
    white-space: pre-line;
}

/* Current tenant */
.current-tenant-info[b-atv2urqswq] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.tenant-name[b-atv2urqswq] {
    font-weight: 600;
    font-size: 1.05rem;
}

.tenant-name a[b-atv2urqswq] {
    color: #2563eb;
    text-decoration: none;
}

.tenant-name a:hover[b-atv2urqswq] {
    text-decoration: underline;
}

.tenant-lease-dates[b-atv2urqswq] {
    display: flex;
    gap: 6px;
    font-size: 0.9rem;
    color: #6b7280;
}

.tenant-notes[b-atv2urqswq] {
    font-size: 0.85rem;
    color: #6b7280;
    margin: 4px 0 0;
    font-style: italic;
}

.current-tenant-checklist[b-atv2urqswq] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    padding: 8px 12px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #92400e;
}

.current-tenant-checklist svg[b-atv2urqswq] {
    flex-shrink: 0;
}

.checklist-view-link[b-atv2urqswq] {
    margin-left: auto;
    font-weight: 500;
    color: #2563eb;
    text-decoration: none;
    font-size: 0.8rem;
}

.checklist-view-link:hover[b-atv2urqswq] {
    text-decoration: underline;
}

.vacant-message[b-atv2urqswq] {
    color: #92400e;
    margin: 0;
}

/* Linked unit banner (child unit info) */
.linked-banner[b-atv2urqswq] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: #f5f3ff;
    border: 1px solid #ddd6fe;
    border-radius: 8px;
    margin-bottom: 16px;
    font-size: 0.9rem;
    color: #6d28d9;
}

.linked-banner a[b-atv2urqswq] {
    font-weight: 600;
    color: #6d28d9;
    text-decoration: none;
}

.linked-banner a:hover[b-atv2urqswq] {
    text-decoration: underline;
}

/* Linked units card (parent detail view) */
.linked-units-card .section-title[b-atv2urqswq] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #6d28d9;
}

.linked-units-list[b-atv2urqswq] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.linked-unit-item[b-atv2urqswq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    background: #f9fafb;
    border-radius: 8px;
    border: 1px solid #f3f4f6;
}

.linked-unit-name[b-atv2urqswq] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.linked-unit-name a[b-atv2urqswq] {
    font-weight: 600;
    color: #2563eb;
    text-decoration: none;
}

.linked-unit-name a:hover[b-atv2urqswq] {
    text-decoration: underline;
}

.linked-unit-location[b-atv2urqswq] {
    font-size: 0.85rem;
    color: #6b7280;
}

/* Tenant history table */
.table[b-atv2urqswq] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.table th[b-atv2urqswq] {
    padding: 10px 12px;
    text-align: left;
    font-weight: 600;
    color: #6b7280;
    border-bottom: 2px solid #e5e7eb;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.table td[b-atv2urqswq] {
    padding: 10px 12px;
    border-bottom: 1px solid #f3f4f6;
    color: #374151;
    vertical-align: middle;
}

.table td a[b-atv2urqswq] {
    color: #2563eb;
    text-decoration: none;
}

.table td a:hover[b-atv2urqswq] {
    text-decoration: underline;
}

.table-row-active[b-atv2urqswq] {
    background: #f0fdf4;
}

.notes-cell[b-atv2urqswq] {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.badge[b-atv2urqswq] {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 500;
}

.badge-current[b-atv2urqswq] {
    background: #d1fae5;
    color: #065f46;
}

.badge-past[b-atv2urqswq] {
    background: #f3f4f6;
    color: #6b7280;
}

.badge-future[b-atv2urqswq] {
    background: #dbeafe;
    color: #1e40af;
}

.badge-checklist-done[b-atv2urqswq] {
    background: #d1fae5;
    color: #065f46;
    gap: 3px;
}

.badge-checklist-pending[b-atv2urqswq] {
    background: #fef3c7;
    color: #92400e;
    gap: 3px;
}

.table-row-future[b-atv2urqswq] {
    background: #eff6ff;
}

/* Icon buttons */
.btn-icon[b-atv2urqswq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.15s;
}

.btn-icon:hover[b-atv2urqswq] {
    background: #f3f4f6;
    color: #374151;
}

.btn-icon-danger:hover[b-atv2urqswq] {
    background: #fef2f2;
    color: #dc2626;
}

.btn-icon-sm[b-atv2urqswq] {
    width: 24px;
    height: 24px;
}

/* Comments */
.comment-form[b-atv2urqswq] {
    margin-bottom: 16px;
}

.comments-list[b-atv2urqswq] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 12px;
}

.comment-item[b-atv2urqswq] {
    padding: 12px 16px;
    background: #f9fafb;
    border-radius: 8px;
    border: 1px solid #f3f4f6;
}

.comment-header[b-atv2urqswq] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.comment-author[b-atv2urqswq] {
    font-weight: 600;
    font-size: 0.85rem;
    color: #111827;
}

.comment-date[b-atv2urqswq] {
    font-size: 0.8rem;
    color: #9ca3af;
}

.comment-text[b-atv2urqswq] {
    margin: 0;
    font-size: 0.9rem;
    color: #374151;
    white-space: pre-line;
}

/* Modal */
.unit-backdrop[b-atv2urqswq] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.unit-modal[b-atv2urqswq] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 550px;
    max-height: 90vh;
    overflow-y: auto;
}

/* Quick-add customer panel */
.quick-add-panel[b-atv2urqswq] {
    border: 1px solid #dbeafe;
    border-radius: 8px;
    padding: 12px 16px;
    background: #f0f9ff;
}

.quick-add-legend[b-atv2urqswq] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1d4ed8;
    padding: 0 6px;
    width: auto;
    float: none;
}

/* Tenant price badge in current-tenant section */
.tenant-price[b-atv2urqswq] {
    font-weight: 600;
    color: #059669;
}

/* Section header actions */
.section-header-actions[b-atv2urqswq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Lease renewal modal */
.renewal-current-summary[b-atv2urqswq] {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 12px 16px;
}

.renewal-label[b-atv2urqswq] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: #6b7280;
    font-weight: 600;
}

.renewal-value[b-atv2urqswq] {
    font-size: 0.95rem;
    font-weight: 500;
    color: #111827;
    margin-bottom: 6px;
}

.renewal-row[b-atv2urqswq] {
    display: flex;
    gap: 2rem;
    margin-top: 4px;
}

.renewal-term-buttons[b-atv2urqswq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.renewal-term-custom[b-atv2urqswq] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-left: 0.25rem;
}

.renewal-term-custom input[b-atv2urqswq] {
    width: 60px;
}

.renewal-hint[b-atv2urqswq] {
    font-size: 0.8rem;
    margin-bottom: 6px;
}
    overflow-y: auto;[b-atv2urqswq]
}

.modal-header[b-atv2urqswq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px 0;
}

.modal-header h5[b-atv2urqswq] {
    margin: 0;
    font-weight: 600;
    font-size: 1.1rem;
}

.modal-close[b-atv2urqswq] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    line-height: 1;
    padding: 0;
}

.modal-close:hover[b-atv2urqswq] {
    color: #111827;
}

.modal-body[b-atv2urqswq] {
    padding: 20px 24px;
}

.modal-footer[b-atv2urqswq] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 0 24px 20px;
}

/* Responsive */
@media (max-width: 640px) {
    .page-header[b-atv2urqswq] {
        flex-direction: column;
    }

    .page-header-right[b-atv2urqswq] {
        flex-wrap: wrap;
    }

    .table-responsive[b-atv2urqswq] {
        overflow-x: auto;
    }
}
/* /Components/Pages/Customers/TenantModules/LeaseChecklist.razor.rz.scp.css */
/* Lease Checklist management page scoped styles */

.page-header[b-ncu969tdld] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header-left[b-ncu969tdld] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.page-header-left h1[b-ncu969tdld] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.page-subtitle[b-ncu969tdld] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0;
}

.page-header-right[b-ncu969tdld] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.btn-back[b-ncu969tdld] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.85rem;
    color: #6b7280;
    text-decoration: none;
    padding: 6px 12px;
    border-radius: 8px;
    transition: all 0.15s;
}

.btn-back:hover[b-ncu969tdld] {
    color: #374151;
    background: #f3f4f6;
}

.btn-primary[b-ncu969tdld] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #2563eb;
    color: #fff;
    border: none;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s;
}

.btn-primary:hover[b-ncu969tdld] {
    background: #1d4ed8;
    color: #fff;
}

/* Action bar */
.action-bar[b-ncu969tdld] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.show-inactive-toggle[b-ncu969tdld] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: #6b7280;
    cursor: pointer;
}

/* Loading & empty state */
.loading-spinner[b-ncu969tdld] {
    display: flex;
    justify-content: center;
    padding: 3rem;
}

.empty-state[b-ncu969tdld] {
    text-align: center;
    padding: 3rem;
    color: #6b7280;
}

/* Table card */
.table-card[b-ncu969tdld] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
}

.table-responsive[b-ncu969tdld] {
    overflow-x: auto;
}

.checklist-table[b-ncu969tdld] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.checklist-table thead th[b-ncu969tdld] {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #6b7280;
    border-bottom: 2px solid #e5e7eb;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
    background: #f9fafb;
}

.checklist-table tbody td[b-ncu969tdld] {
    padding: 12px 16px;
    border-bottom: 1px solid #f3f4f6;
    color: #374151;
    vertical-align: middle;
}

.checklist-table tbody tr:hover[b-ncu969tdld] {
    background: #f9fafb;
}

.row-inactive[b-ncu969tdld] {
    opacity: 0.55;
}

.item-name[b-ncu969tdld] {
    font-weight: 600;
    color: #111827;
}

.item-description[b-ncu969tdld] {
    font-size: 0.85rem;
    color: #6b7280;
}

.text-end[b-ncu969tdld] {
    text-align: right;
}

.text-muted[b-ncu969tdld] {
    color: #9ca3af;
}

/* Sort buttons */
.sort-buttons[b-ncu969tdld] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    align-items: center;
}

/* Badges */
.badge[b-ncu969tdld] {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 500;
}

.badge-active[b-ncu969tdld] {
    background: #d1fae5;
    color: #065f46;
}

.badge-inactive[b-ncu969tdld] {
    background: #fee2e2;
    color: #991b1b;
}

/* Icon buttons */
.btn-icon[b-ncu969tdld] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    color: #6b7280;
}

.btn-icon:hover[b-ncu969tdld] {
    background: #f3f4f6;
    color: #374151;
}

.btn-icon-sm[b-ncu969tdld] {
    width: 24px;
    height: 24px;
}

.btn-icon-danger:hover[b-ncu969tdld] {
    background: #fee2e2;
    color: #dc2626;
}

/* Modal */
.confirm-backdrop[b-ncu969tdld] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.confirm-modal[b-ncu969tdld] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-header[b-ncu969tdld] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px 0;
}

.modal-header h5[b-ncu969tdld] {
    margin: 0;
    font-weight: 600;
    font-size: 1.1rem;
}

.modal-close[b-ncu969tdld] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #9ca3af;
    cursor: pointer;
    line-height: 1;
}

.modal-body[b-ncu969tdld] {
    padding: 16px 24px;
}

.modal-footer[b-ncu969tdld] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 0 24px 20px;
}

/* Form elements */
.form-group[b-ncu969tdld] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.form-group label[b-ncu969tdld] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #374151;
}

.form-control[b-ncu969tdld] {
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.9rem;
    transition: border-color 0.15s;
}

.form-control:focus[b-ncu969tdld] {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

textarea.form-control[b-ncu969tdld] {
    resize: vertical;
}

.alert-danger[b-ncu969tdld] {
    background: #fee2e2;
    color: #991b1b;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 0.85rem;
}

.btn-secondary[b-ncu969tdld] {
    padding: 8px 16px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background: #fff;
    color: #374151;
    font-size: 0.85rem;
    cursor: pointer;
    transition: background 0.15s;
}

.btn-secondary:hover[b-ncu969tdld] {
    background: #f3f4f6;
}

.btn-danger[b-ncu969tdld] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border: none;
    border-radius: 8px;
    background: #dc2626;
    color: #fff;
    font-size: 0.85rem;
    cursor: pointer;
    transition: background 0.15s;
}

.btn-danger:hover[b-ncu969tdld] {
    background: #b91c1c;
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-ncu969tdld] {
        flex-direction: column;
    }

    .checklist-table thead th[b-ncu969tdld],
    .checklist-table tbody td[b-ncu969tdld] {
        padding: 8px 10px;
    }
}
/* /Components/Pages/Customers/TenantModules/LeaseTemplateEdit.razor.rz.scp.css */
/* Lease Template Edit page scoped styles */

.page-header[b-wug4360hin] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header-left[b-wug4360hin] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.page-header-left h1[b-wug4360hin] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.page-subtitle[b-wug4360hin] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0;
}

.page-header-right[b-wug4360hin] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.btn-back[b-wug4360hin] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.85rem;
    color: #6b7280;
    text-decoration: none;
    padding: 6px 12px;
    border-radius: 8px;
    transition: all 0.15s;
}

.btn-back:hover[b-wug4360hin] {
    color: #374151;
    background: #f3f4f6;
}

/* Loading & empty state */
.loading-spinner[b-wug4360hin] {
    display: flex;
    justify-content: center;
    padding: 3rem;
}

.empty-state[b-wug4360hin] {
    text-align: center;
    padding: 3rem;
    color: #6b7280;
}

/* Form card */
.form-card[b-wug4360hin] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 24px;
}

.form-row[b-wug4360hin] {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
    margin-bottom: 1.5rem;
}

.form-group[b-wug4360hin] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 1rem;
}

.form-row > .form-group[b-wug4360hin] {
    flex: 1;
    margin-bottom: 0;
}

.form-group-toggle[b-wug4360hin] {
    flex: 0 0 auto !important;
    justify-content: flex-end;
    padding-top: 26px;
}

.form-group label[b-wug4360hin] {
    font-weight: 600;
    font-size: 0.85rem;
    color: #374151;
}

.form-hint[b-wug4360hin] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.8rem;
    color: #9ca3af;
    margin-bottom: 4px;
}

.toggle-label[b-wug4360hin] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 500;
    cursor: pointer;
}

.form-control[b-wug4360hin] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.9rem;
    color: #374151;
    transition: border-color 0.15s;
    background: #fff;
}

.form-control:focus[b-wug4360hin] {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

/* Form actions */
.form-actions[b-wug4360hin] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 1rem;
    border-top: 1px solid #f3f4f6;
    margin-top: 1.5rem;
}

.btn-primary[b-wug4360hin] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #2563eb;
    color: #fff;
    border: none;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s;
}

.btn-primary:hover[b-wug4360hin] {
    background: #1d4ed8;
    color: #fff;
}

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

.btn-secondary[b-wug4360hin] {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background: #fff;
    color: #374151;
    font-size: 0.85rem;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s;
}

.btn-secondary:hover[b-wug4360hin] {
    background: #f3f4f6;
}

.spinner-small[b-wug4360hin] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: #fff;
    animation: spin-b-wug4360hin 0.6s linear infinite;
}

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

/* Radzen HTML editor overrides */
[b-wug4360hin] .rz-html-editor {
    border: 1px solid #d1d5db;
    border-radius: 8px;
    overflow: hidden;
}

[b-wug4360hin] .rz-html-editor:focus-within {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}
/* /Components/Pages/Customers/TenantModules/LeaseTemplates.razor.rz.scp.css */
/* Lease Templates list page scoped styles */

.page-header[b-xxhu08kxaq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header-left[b-xxhu08kxaq] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.page-header-left h1[b-xxhu08kxaq] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.page-subtitle[b-xxhu08kxaq] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0;
}

.page-header-right[b-xxhu08kxaq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.btn-back[b-xxhu08kxaq] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.85rem;
    color: #6b7280;
    text-decoration: none;
    padding: 6px 12px;
    border-radius: 8px;
    transition: all 0.15s;
}

.btn-back:hover[b-xxhu08kxaq] {
    color: #374151;
    background: #f3f4f6;
}

.btn-primary[b-xxhu08kxaq] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #2563eb;
    color: #fff;
    border: none;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s;
}

.btn-primary:hover[b-xxhu08kxaq] {
    background: #1d4ed8;
    color: #fff;
}

/* Action bar */
.action-bar[b-xxhu08kxaq] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.show-inactive-toggle[b-xxhu08kxaq] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: #6b7280;
    cursor: pointer;
}

/* Loading & empty state */
.loading-spinner[b-xxhu08kxaq] {
    display: flex;
    justify-content: center;
    padding: 3rem;
}

.empty-state[b-xxhu08kxaq] {
    text-align: center;
    padding: 3rem;
    color: #6b7280;
}

/* Table card */
.table-card[b-xxhu08kxaq] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
}

.table-responsive[b-xxhu08kxaq] {
    overflow-x: auto;
}

.templates-table[b-xxhu08kxaq] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.templates-table thead th[b-xxhu08kxaq] {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #6b7280;
    border-bottom: 2px solid #e5e7eb;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
    background: #f9fafb;
}

.templates-table tbody td[b-xxhu08kxaq] {
    padding: 12px 16px;
    border-bottom: 1px solid #f3f4f6;
    color: #374151;
    vertical-align: middle;
}

.templates-table tbody tr:hover[b-xxhu08kxaq] {
    background: #f9fafb;
}

.row-inactive[b-xxhu08kxaq] {
    opacity: 0.55;
}

.template-link[b-xxhu08kxaq] {
    font-weight: 600;
    color: #2563eb;
    text-decoration: none;
}

.template-link:hover[b-xxhu08kxaq] {
    text-decoration: underline;
}

.text-end[b-xxhu08kxaq] {
    text-align: right;
}

.text-muted[b-xxhu08kxaq] {
    color: #9ca3af;
}

/* Badges */
.badge[b-xxhu08kxaq] {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 500;
}

.badge-active[b-xxhu08kxaq] {
    background: #d1fae5;
    color: #065f46;
}

.badge-inactive[b-xxhu08kxaq] {
    background: #fee2e2;
    color: #991b1b;
}

/* Icon buttons */
.btn-icon[b-xxhu08kxaq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    color: #6b7280;
}

.btn-icon-danger:hover[b-xxhu08kxaq] {
    background: #fee2e2;
    color: #dc2626;
}

/* Delete confirmation modal */
.confirm-backdrop[b-xxhu08kxaq] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.confirm-modal[b-xxhu08kxaq] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 450px;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-header[b-xxhu08kxaq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px 0;
}

.modal-header h5[b-xxhu08kxaq] {
    margin: 0;
    font-weight: 600;
    font-size: 1.1rem;
}

.modal-close[b-xxhu08kxaq] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #9ca3af;
    cursor: pointer;
    line-height: 1;
}

.modal-body[b-xxhu08kxaq] {
    padding: 16px 24px;
}

.modal-footer[b-xxhu08kxaq] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 0 24px 20px;
}

.btn-secondary[b-xxhu08kxaq] {
    padding: 8px 16px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background: #fff;
    color: #374151;
    font-size: 0.85rem;
    cursor: pointer;
    transition: background 0.15s;
}

.btn-secondary:hover[b-xxhu08kxaq] {
    background: #f3f4f6;
}

.btn-danger[b-xxhu08kxaq] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border: none;
    border-radius: 8px;
    background: #dc2626;
    color: #fff;
    font-size: 0.85rem;
    cursor: pointer;
    transition: background 0.15s;
}

.btn-danger:hover[b-xxhu08kxaq] {
    background: #b91c1c;
}

.spinner-small[b-xxhu08kxaq] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: #fff;
    animation: spin-b-xxhu08kxaq 0.6s linear infinite;
}

@keyframes spin-b-xxhu08kxaq {
    to { transform: rotate(360deg); }
}
/* /Components/Pages/Customers/TenantModules/LeaseView.razor.rz.scp.css */
/* Lease Detail page scoped styles */

.page-header[b-vyar3m8ka0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header-left[b-vyar3m8ka0] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.page-header-left h1[b-vyar3m8ka0] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.page-subtitle[b-vyar3m8ka0] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0;
}

.page-subtitle a[b-vyar3m8ka0] {
    color: #2563eb;
    text-decoration: none;
}

.page-subtitle a:hover[b-vyar3m8ka0] {
    text-decoration: underline;
}

.page-header-right[b-vyar3m8ka0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Loading & empty state */
.loading-spinner[b-vyar3m8ka0] {
    display: flex;
    justify-content: center;
    padding: 3rem;
}

.empty-state[b-vyar3m8ka0] {
    text-align: center;
    padding: 3rem;
    color: #6b7280;
}

/* Detail cards */
.detail-card[b-vyar3m8ka0] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px 24px;
    margin-bottom: 16px;
}

.section-title[b-vyar3m8ka0] {
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
    margin: 0 0 12px;
}

/* Badges */
.badge[b-vyar3m8ka0] {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 500;
}

.badge-current[b-vyar3m8ka0] {
    background: #d1fae5;
    color: #065f46;
}

.badge-past[b-vyar3m8ka0] {
    background: #f3f4f6;
    color: #6b7280;
}

.badge-future[b-vyar3m8ka0] {
    background: #dbeafe;
    color: #1e40af;
}

/* Detail grid (read mode) */
.detail-grid[b-vyar3m8ka0] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 16px;
}

.detail-item[b-vyar3m8ka0] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.detail-item-wide[b-vyar3m8ka0] {
    grid-column: 1 / -1;
}

.detail-label[b-vyar3m8ka0] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: #6b7280;
    font-weight: 600;
}

.detail-value[b-vyar3m8ka0] {
    font-size: 0.95rem;
    color: #111827;
}

.detail-value a[b-vyar3m8ka0] {
    color: #2563eb;
    text-decoration: none;
}

.detail-value a:hover[b-vyar3m8ka0] {
    text-decoration: underline;
}

.tenant-price[b-vyar3m8ka0] {
    font-weight: 600;
    color: #059669;
}

/* File attachment */
.file-attachment[b-vyar3m8ka0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    gap: 12px;
    flex-wrap: wrap;
}

.file-info[b-vyar3m8ka0] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #374151;
}

.file-name[b-vyar3m8ka0] {
    font-weight: 500;
    word-break: break-all;
}

.file-actions[b-vyar3m8ka0] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Drag-and-drop upload zone */
.file-upload-zone[b-vyar3m8ka0] {
    position: relative;
    border: 2px dashed #d1d5db;
    border-radius: 8px;
    padding: 0.75rem;
    text-align: center;
    transition: all 0.2s ease;
    margin-bottom: 0.75rem;
    background-color: #fafbfc;
}

.file-upload-zone:hover[b-vyar3m8ka0],
.file-upload-zone.drag-over[b-vyar3m8ka0] {
    border-color: #1b4a98;
    background-color: #f0f4ff;
}

[b-vyar3m8ka0] .file-input-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

.file-upload-label[b-vyar3m8ka0] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #6c757d;
    pointer-events: none;
    position: relative;
    z-index: 1;
}

.file-upload-label svg[b-vyar3m8ka0] {
    color: #adb5bd;
}

.file-upload-zone:hover .file-upload-label svg[b-vyar3m8ka0],
.file-upload-zone.drag-over .file-upload-label svg[b-vyar3m8ka0] {
    color: #1b4a98;
}

.upload-text[b-vyar3m8ka0] {
    font-size: 0.8125rem;
    color: #6c757d;
}

.upload-text strong[b-vyar3m8ka0] {
    color: #1b4a98;
}

.upload-hint[b-vyar3m8ka0] {
    font-size: 0.7rem;
    color: #adb5bd;
}

/* Loading inline */
.loading-inline[b-vyar3m8ka0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0;
    font-size: 0.85rem;
    color: #6c757d;
}

.spinner-small[b-vyar3m8ka0] {
    width: 16px;
    height: 16px;
    border: 2px solid #e9ecef;
    border-top-color: #1b4a98;
    border-radius: 50%;
    animation: spin-b-vyar3m8ka0 0.6s linear infinite;
}

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

/* Generate Lease modal */
.generate-backdrop[b-vyar3m8ka0] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.generate-modal[b-vyar3m8ka0] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.generate-modal .modal-header[b-vyar3m8ka0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid #e5e7eb;
}

.generate-modal .modal-header h5[b-vyar3m8ka0] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.generate-modal .modal-close[b-vyar3m8ka0] {
    background: none;
    border: none;
    font-size: 1.4rem;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.generate-modal .modal-close:hover[b-vyar3m8ka0] {
    color: #111827;
}

.generate-modal .modal-body[b-vyar3m8ka0] {
    padding: 20px;
}

.generate-modal .modal-footer[b-vyar3m8ka0] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 12px 20px;
    border-top: 1px solid #e5e7eb;
}

.template-info[b-vyar3m8ka0] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    background: #eff6ff;
    border-radius: 8px;
    font-size: 0.8125rem;
    color: #1e40af;
    line-height: 1.4;
}

.template-info svg[b-vyar3m8ka0] {
    flex-shrink: 0;
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 640px) {
    .page-header[b-vyar3m8ka0] {
        flex-direction: column;
    }

    .page-header-right[b-vyar3m8ka0] {
        flex-wrap: wrap;
    }

    .detail-grid[b-vyar3m8ka0] {
        grid-template-columns: 1fr;
    }
}

/* ── Lease Checklist ── */

.checklist-header[b-vyar3m8ka0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.checklist-header .section-title[b-vyar3m8ka0] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}

.checklist-manage-link[b-vyar3m8ka0] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.8rem;
    color: #6b7280;
    text-decoration: none;
    padding: 4px 8px;
    border-radius: 6px;
    transition: all 0.15s;
}

.checklist-manage-link:hover[b-vyar3m8ka0] {
    color: #2563eb;
    background: #eff6ff;
}

.checklist-items[b-vyar3m8ka0] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.checklist-row[b-vyar3m8ka0] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid #f3f4f6;
    transition: background 0.15s;
}

.checklist-row:last-child[b-vyar3m8ka0] {
    border-bottom: none;
}

.checklist-row:hover[b-vyar3m8ka0] {
    background: #f9fafb;
}

.checklist-row-checked[b-vyar3m8ka0] {
    background: #f0fdf4;
}

.checklist-row-checked:hover[b-vyar3m8ka0] {
    background: #dcfce7;
}

.checklist-label[b-vyar3m8ka0] {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    margin: 0;
    flex: 1;
    min-width: 0;
}

.checklist-label input[type="checkbox"][b-vyar3m8ka0] {
    width: 18px;
    height: 18px;
    accent-color: #059669;
    cursor: pointer;
    flex-shrink: 0;
}

.checklist-label input[type="checkbox"]:disabled[b-vyar3m8ka0] {
    cursor: default;
}

.checklist-name[b-vyar3m8ka0] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #111827;
}

.checklist-row-checked .checklist-name[b-vyar3m8ka0] {
    text-decoration: line-through;
    color: #6b7280;
}

.checklist-meta[b-vyar3m8ka0] {
    font-size: 0.75rem;
    color: #9ca3af;
    white-space: nowrap;
}

.checklist-description[b-vyar3m8ka0] {
    width: 100%;
    font-size: 0.8rem;
    color: #6b7280;
    padding-left: 28px;
    margin-top: -4px;
}

/* Progress bar */
.checklist-progress[b-vyar3m8ka0] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #e5e7eb;
}

.checklist-progress-bar[b-vyar3m8ka0] {
    flex: 1;
    height: 6px;
    background: #e5e7eb;
    border-radius: 3px;
    overflow: hidden;
}

.checklist-progress-fill[b-vyar3m8ka0] {
    height: 100%;
    background: #059669;
    border-radius: 3px;
    transition: width 0.3s ease;
}

.checklist-progress-text[b-vyar3m8ka0] {
    font-size: 0.8rem;
    color: #6b7280;
    white-space: nowrap;
}

/* ── COI File List ── */

.coi-file-list[b-vyar3m8ka0] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.coi-file-details[b-vyar3m8ka0] {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.coi-file-meta[b-vyar3m8ka0] {
    font-size: 0.75rem;
    color: #9ca3af;
}

/* ── COI Expiration Date Prompt Modal ── */

.coi-expiration-backdrop[b-vyar3m8ka0] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.coi-expiration-modal[b-vyar3m8ka0] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 440px;
    max-height: 90vh;
    overflow-y: auto;
}

.coi-expiration-modal .modal-header[b-vyar3m8ka0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid #e5e7eb;
}

.coi-expiration-modal .modal-header h5[b-vyar3m8ka0] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.coi-expiration-modal .modal-close[b-vyar3m8ka0] {
    background: none;
    border: none;
    font-size: 1.4rem;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.coi-expiration-modal .modal-close:hover[b-vyar3m8ka0] {
    color: #111827;
}

.coi-expiration-modal .modal-body[b-vyar3m8ka0] {
    padding: 20px;
}

.coi-expiration-modal .modal-body p[b-vyar3m8ka0] {
    margin: 0 0 16px 0;
    color: #374151;
    font-size: 0.9rem;
    line-height: 1.5;
}

.coi-expiration-modal .modal-footer[b-vyar3m8ka0] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 12px 20px;
    border-top: 1px solid #e5e7eb;
}
/* /Components/Pages/Customers/TenantModules/ParkingLotUsage.razor.rz.scp.css */
/* Parking Lot Usage page scoped styles */

.page-header[b-3mgsoifkuh] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header-left[b-3mgsoifkuh] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.page-header-left h1[b-3mgsoifkuh] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.page-subtitle[b-3mgsoifkuh] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0;
}

.page-header-right[b-3mgsoifkuh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-back[b-3mgsoifkuh] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    text-decoration: none;
    transition: border-color 0.2s, color 0.2s;
}

.btn-back:hover[b-3mgsoifkuh] {
    border-color: #2563eb;
    color: #2563eb;
}

.loading-container[b-3mgsoifkuh] {
    display: flex;
    justify-content: center;
    padding: 3rem;
}

/* Stats grid */
.stats-grid[b-3mgsoifkuh] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 1.5rem;
}

.stat-card[b-3mgsoifkuh] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px;
    text-align: center;
}

.stat-value[b-3mgsoifkuh] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
}

.stat-label[b-3mgsoifkuh] {
    font-size: 0.8rem;
    color: #6b7280;
    margin-top: 4px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.stat-sub[b-3mgsoifkuh] {
    font-size: 0.75rem;
    color: #9ca3af;
    margin-top: 4px;
}

.stat-card-blue[b-3mgsoifkuh] {
    border-left: 4px solid #2563eb;
}

.stat-card-blue .stat-value[b-3mgsoifkuh] {
    color: #2563eb;
}

.stat-card-green[b-3mgsoifkuh] {
    border-left: 4px solid #16a34a;
}

.stat-card-green .stat-value[b-3mgsoifkuh] {
    color: #16a34a;
}

.stat-card-amber[b-3mgsoifkuh] {
    border-left: 4px solid #d97706;
}

.stat-card-amber .stat-value[b-3mgsoifkuh] {
    color: #d97706;
}

.stat-card-teal[b-3mgsoifkuh] {
    border-left: 4px solid #0d9488;
}

.stat-card-teal .stat-value[b-3mgsoifkuh] {
    color: #0d9488;
}

.stat-card-rose[b-3mgsoifkuh] {
    border-left: 4px solid #e11d48;
}

.stat-card-rose .stat-value[b-3mgsoifkuh] {
    color: #e11d48;
}

/* Entry form */
.entry-card[b-3mgsoifkuh] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 1.5rem;
}

.entry-title[b-3mgsoifkuh] {
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
    margin: 0 0 16px;
}

.entry-form[b-3mgsoifkuh] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.entry-field[b-3mgsoifkuh] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.entry-field .form-control[b-3mgsoifkuh] {
    height: 38px;
}

.entry-field label[b-3mgsoifkuh] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.entry-field .form-control[b-3mgsoifkuh] {
    padding: 8px 12px;
    border-radius: 8px;
    border: 1px solid #d1d5db;
    font-size: 0.9rem;
    min-width: 200px;
}

.entry-field .form-control:focus[b-3mgsoifkuh] {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    outline: none;
}

.entry-hint[b-3mgsoifkuh] {
    font-size: 0.75rem;
    color: #9ca3af;
}

.entry-actions[b-3mgsoifkuh] {
    display: flex;
    align-items: flex-start;
    padding-top: 22px;
}

/* Table card */
.table-card[b-3mgsoifkuh] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 24px;
}

.table-title[b-3mgsoifkuh] {
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
    margin: 0 0 16px;
}

.table[b-3mgsoifkuh] {
    width: 100%;
    border-collapse: collapse;
}

.table thead th[b-3mgsoifkuh] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 10px 12px;
    border-bottom: 2px solid #e5e7eb;
    white-space: nowrap;
}

.table tbody td[b-3mgsoifkuh] {
    padding: 12px;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.875rem;
    color: #374151;
    vertical-align: middle;
}

.table tbody tr:last-child td[b-3mgsoifkuh] {
    border-bottom: none;
}

.table tbody tr:hover[b-3mgsoifkuh] {
    background-color: #f9fafb;
}

/* Occupancy badges */
.badge[b-3mgsoifkuh] {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
}

.badge-occupancy-low[b-3mgsoifkuh] {
    background: #dcfce7;
    color: #166534;
}

.badge-occupancy-moderate[b-3mgsoifkuh] {
    background: #fef3c7;
    color: #92400e;
}

.badge-occupancy-high[b-3mgsoifkuh] {
    background: #fed7aa;
    color: #9a3412;
}

.badge-occupancy-critical[b-3mgsoifkuh] {
    background: #fecaca;
    color: #991b1b;
}

/* Icon button */
.btn-icon[b-3mgsoifkuh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    transition: all 0.15s;
}

.btn-icon-danger[b-3mgsoifkuh] {
    color: #dc2626;
}

.btn-icon-danger:hover[b-3mgsoifkuh] {
    background: #fef2f2;
    border-color: #fecaca;
}

/* Delete modal */
.parking-backdrop[b-3mgsoifkuh] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.parking-modal[b-3mgsoifkuh] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-header[b-3mgsoifkuh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px 0;
}

.modal-header h5[b-3mgsoifkuh] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #111827;
}

.modal-close[b-3mgsoifkuh] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    line-height: 1;
}

.modal-close:hover[b-3mgsoifkuh] {
    color: #111827;
}

.modal-body[b-3mgsoifkuh] {
    padding: 16px 24px;
}

.modal-footer[b-3mgsoifkuh] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 0 24px 20px;
}

/* Empty state */
.empty-state[b-3mgsoifkuh] {
    text-align: center;
    padding: 2rem;
    color: #6b7280;
}

/* Photo upload zone */
.photo-upload-zone[b-3mgsoifkuh] {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 38px;
    min-width: 200px;
    border: 1px dashed #d1d5db;
    border-radius: 8px;
    padding: 6px 12px;
    cursor: pointer;
    transition: border-color 0.2s;
    background: #fff;
}

.photo-upload-zone:hover[b-3mgsoifkuh] {
    border-color: #2563eb;
}

.photo-input[b-3mgsoifkuh] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.photo-placeholder[b-3mgsoifkuh] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: #6b7280;
}

.photo-selected[b-3mgsoifkuh] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: #374151;
}

.photo-file-name[b-3mgsoifkuh] {
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.photo-remove[b-3mgsoifkuh] {
    background: none;
    border: none;
    font-size: 1.1rem;
    color: #dc2626;
    cursor: pointer;
    line-height: 1;
    padding: 0 2px;
    position: relative;
    z-index: 2;
}

.photo-remove:hover[b-3mgsoifkuh] {
    color: #991b1b;
}

/* Table photo thumbnail */
.photo-thumb[b-3mgsoifkuh] {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
}

.photo-thumb-link[b-3mgsoifkuh] {
    display: inline-block;
    line-height: 0;
    transition: opacity 0.15s;
}

.photo-thumb-link:hover[b-3mgsoifkuh] {
    opacity: 0.8;
}

/* Delete modal photo preview */
.delete-photo-preview[b-3mgsoifkuh] {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.delete-photo-img[b-3mgsoifkuh] {
    max-width: 100%;
    max-height: 200px;
    object-fit: contain;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
}

.delete-photo-note[b-3mgsoifkuh] {
    font-size: 0.8rem;
    color: #dc2626;
    font-style: italic;
}

/* Responsive */
@media (max-width: 640px) {
    .stats-grid[b-3mgsoifkuh] {
        grid-template-columns: repeat(2, 1fr);
    }

    .entry-card[b-3mgsoifkuh] {
        padding: 16px;
    }

    .entry-form[b-3mgsoifkuh] {
        flex-direction: column;
        align-items: stretch;
    }

    .entry-field[b-3mgsoifkuh] {
        max-width: 100%;
    }

    .entry-field .form-control[b-3mgsoifkuh] {
        min-width: auto;
        width: 100%;
        box-sizing: border-box;
    }

    .photo-upload-zone[b-3mgsoifkuh] {
        min-width: auto;
        width: 100%;
        box-sizing: border-box;
    }
}

@media (max-width: 400px) {
    .stats-grid[b-3mgsoifkuh] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Customers/Tenants.razor.rz.scp.css */
/* Tenants landing page scoped styles */

.page-header[b-lvrsnpt0v8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header-left[b-lvrsnpt0v8] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.page-header-left h1[b-lvrsnpt0v8] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.page-subtitle[b-lvrsnpt0v8] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0;
}

/* Module card grid — matches SystemModules pattern */
.module-grid[b-lvrsnpt0v8] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 20px;
    margin-top: 8px;
}

.module-card[b-lvrsnpt0v8] {
    display: flex;
    align-items: center;
    gap: 20px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 24px;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s;
    cursor: pointer;
}

.module-card:hover[b-lvrsnpt0v8] {
    border-color: #2563eb;
    box-shadow: 0 4px 16px rgba(37, 99, 235, 0.10);
    transform: translateY(-2px);
}

.module-card:active[b-lvrsnpt0v8] {
    transform: translateY(0);
}

.module-card-placeholder[b-lvrsnpt0v8] {
    cursor: default;
    opacity: 0.7;
}

.module-card-placeholder:hover[b-lvrsnpt0v8] {
    border-color: #e5e7eb;
    box-shadow: none;
    transform: none;
}

.module-icon[b-lvrsnpt0v8] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    min-width: 56px;
    border-radius: 12px;
}

.module-icon-blue[b-lvrsnpt0v8] {
    background: linear-gradient(135deg, #eff6ff, #dbeafe);
    color: #2563eb;
}

.module-icon-green[b-lvrsnpt0v8] {
    background: linear-gradient(135deg, #f0fdf4, #dcfce7);
    color: #16a34a;
}

.module-icon-amber[b-lvrsnpt0v8] {
    background: linear-gradient(135deg, #fffbeb, #fef3c7);
    color: #d97706;
}

.module-icon-purple[b-lvrsnpt0v8] {
    background: linear-gradient(135deg, #faf5ff, #f3e8ff);
    color: #7c3aed;
}

.module-icon-rose[b-lvrsnpt0v8] {
    background: linear-gradient(135deg, #fff1f2, #ffe4e6);
    color: #e11d48;
}

.module-icon-teal[b-lvrsnpt0v8] {
    background: linear-gradient(135deg, #f0fdfa, #ccfbf1);
    color: #0d9488;
}

.module-info[b-lvrsnpt0v8] {
    flex: 1;
    min-width: 0;
}

.module-info h3[b-lvrsnpt0v8] {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 600;
    color: #111827;
}

.module-info p[b-lvrsnpt0v8] {
    margin: 0;
    font-size: 13px;
    color: #6b7280;
    line-height: 1.5;
}

.module-arrow[b-lvrsnpt0v8] {
    color: #d1d5db;
    transition: color 0.2s, transform 0.2s;
    flex-shrink: 0;
}

.module-card:hover .module-arrow[b-lvrsnpt0v8] {
    color: #2563eb;
    transform: translateX(3px);
}

@media (max-width: 500px) {
    .module-grid[b-lvrsnpt0v8] {
        grid-template-columns: 1fr;
    }

    .module-card[b-lvrsnpt0v8] {
        padding: 18px;
        gap: 14px;
    }

    .module-icon[b-lvrsnpt0v8] {
        width: 44px;
        height: 44px;
        min-width: 44px;
    }
}
/* /Components/Pages/Customers/Websites/WebsiteEdit.razor.rz.scp.css */
/* Breadcrumb */
.breadcrumb span[b-qs5zltj1s4] {
    color: #6c757d;
}

/* Form wrapper — no outer card; sections provide their own cards */
.edit-form-wrapper[b-qs5zltj1s4] {
    max-width: none;
}

.form-grid[b-qs5zltj1s4] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

/* Form Sections */
.form-section[b-qs5zltj1s4] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.form-section.full-width[b-qs5zltj1s4] {
    grid-column: 1 / -1;
}

/* Section Headers — colored bars with icons */
.section-header[b-qs5zltj1s4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    border-radius: 6px;
    border-bottom: none;
    color: white;
}

.section-header svg[b-qs5zltj1s4] {
    flex-shrink: 0;
    color: white;
    stroke: white;
}

.section-general[b-qs5zltj1s4] {
    background: linear-gradient(135deg, #1b4a98, #2d6fd6);
}

.section-hosting[b-qs5zltj1s4] {
    background: linear-gradient(135deg, #0d7c5f, #17a87a);
}

.section-credentials[b-qs5zltj1s4] {
    background: linear-gradient(135deg, #7c5c1e, #b8860b);
}

.section-seo[b-qs5zltj1s4] {
    background: linear-gradient(135deg, #6f42c1, #8e5cd9);
}

.section-security[b-qs5zltj1s4] {
    background: linear-gradient(135deg, #c0392b, #e05a4e);
}

.section-servers[b-qs5zltj1s4] {
    background: linear-gradient(135deg, #2c3e50, #4a6785);
}

.section-info[b-qs5zltj1s4] {
    background: linear-gradient(135deg, #0077b6, #00a8e8);
}

.section-divider[b-qs5zltj1s4] {
    margin-top: 0.5rem;
}

/* Required indicator */
.required[b-qs5zltj1s4] {
    color: #dc3545;
    font-weight: 700;
}

/* Validation */
.validation-summary[b-qs5zltj1s4] {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
    color: #721c24;
}

.validation-summary ul[b-qs5zltj1s4] {
    margin: 0.5rem 0 0;
    padding-left: 1.25rem;
}

/* Form row */
.form-row[b-qs5zltj1s4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-row.checkboxes[b-qs5zltj1s4] {
    display: flex;
    flex-direction: row;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.form-row.checkboxes.vertical[b-qs5zltj1s4] {
    flex-direction: column;
    gap: 0.75rem;
}

/* Checkbox group */
.checkbox-group label[b-qs5zltj1s4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    cursor: pointer;
}

.checkbox-group input[type="checkbox"][b-qs5zltj1s4] {
    width: 18px;
    height: 18px;
    accent-color: #1b4a98;
}

/* Form hint */
.form-hint[b-qs5zltj1s4] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

/* Server edit grid */
.server-edit-grid[b-qs5zltj1s4] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.server-column h3[b-qs5zltj1s4] {
    margin: 0 0 1rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: #2c3e50;
    padding: 0.35rem 0.6rem;
    background-color: #e9ecef;
    border-radius: 4px;
    border-bottom: none;
}

/* Form actions */
.form-actions[b-qs5zltj1s4] {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.form-actions-left[b-qs5zltj1s4] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

/* Delete button */
.btn-danger[b-qs5zltj1s4] {
    background-color: #dc3545;
    color: white;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-danger:hover[b-qs5zltj1s4] {
    background-color: #c82333;
}

/* Delete Modal */
.delete-backdrop[b-qs5zltj1s4] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.delete-modal[b-qs5zltj1s4] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.delete-modal .modal-header[b-qs5zltj1s4] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.delete-modal .modal-header h3[b-qs5zltj1s4] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.delete-modal .modal-body[b-qs5zltj1s4] {
    padding: 1.5rem;
}

.delete-modal .modal-footer[b-qs5zltj1s4] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

.text-danger[b-qs5zltj1s4] {
    color: #dc3545;
    font-weight: 500;
}

@media (max-width: 1200px) {
    .form-grid[b-qs5zltj1s4] {
        grid-template-columns: repeat(2, 1fr);
    }

    .server-edit-grid[b-qs5zltj1s4] {
        grid-template-columns: repeat(2, 1fr);
    }
}

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

    .server-edit-grid[b-qs5zltj1s4] {
        grid-template-columns: 1fr;
    }

    .form-row[b-qs5zltj1s4] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Customers/Websites/WebsiteList.razor.rz.scp.css */
/* Sort indicator */
.sort-indicator[b-fc0t1cnsls] {
    margin-left: 0.375rem;
    font-size: 0.625rem;
}

/* Site Cell */
.site-cell[b-fc0t1cnsls] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.site-name[b-fc0t1cnsls] {
    font-weight: 600;
    color: #1b4a98;
}

.site-link[b-fc0t1cnsls] {
    color: #6c757d;
    transition: color 0.15s ease;
}

.site-link:hover[b-fc0t1cnsls] {
    color: #1b4a98;
}

.dev-link[b-fc0t1cnsls] {
    color: #2d6fd6;
    font-size: 0.85rem;
    text-decoration: none;
}

.dev-link:hover[b-fc0t1cnsls] {
    text-decoration: underline;
}

.customer-link[b-fc0t1cnsls] {
    color: #333;
    text-decoration: none;
    font-weight: 500;
}

.customer-link:hover[b-fc0t1cnsls] {
    color: #1b4a98;
    text-decoration: underline;
}

/* Alternating row backgrounds */
.data-table tbody tr:nth-child(even)[b-fc0t1cnsls] {
    background-color: #f8f9fb;
}

.data-table tbody tr:nth-child(odd)[b-fc0t1cnsls] {
    background-color: #ffffff;
}
/* /Components/Pages/Customers/Websites/WebsiteView.razor.rz.scp.css */
/* Page meta badges */
.page-meta[b-ayj6p1a6h5] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
    flex-wrap: wrap;
}

/* Badge variants */
.badge-primary[b-ayj6p1a6h5] {
    background-color: #d4e5ff;
    color: #1b4a98;
}

.badge-info[b-ayj6p1a6h5] {
    background-color: #d1ecf1;
    color: #0c5460;
}

/* Content Grid */
.content-grid[b-ayj6p1a6h5] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

.content-grid .full-width[b-ayj6p1a6h5] {
    grid-column: 1 / -1;
}

/* Detail grid */
.detail-grid[b-ayj6p1a6h5] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.detail-item[b-ayj6p1a6h5] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-label[b-ayj6p1a6h5] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.detail-value[b-ayj6p1a6h5] {
    font-size: 0.9rem;
    color: #333;
}

.path-value[b-ayj6p1a6h5] {
    font-family: monospace;
    font-size: 0.8rem;
    word-break: break-all;
}

/* Server sections */
.server-grid[b-ayj6p1a6h5] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.server-section h3[b-ayj6p1a6h5] {
    margin: 0 0 1rem 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: #1b4a98;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #e9ecef;
}

.server-section .detail-grid[b-ayj6p1a6h5] {
    grid-template-columns: 1fr;
}

/* S/M Notes */
.sm-notes[b-ayj6p1a6h5] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
}

.sm-notes p[b-ayj6p1a6h5] {
    margin: 0.25rem 0 0;
    white-space: pre-wrap;
    color: #333;
}

/* Description content */
.description-content[b-ayj6p1a6h5] {
    line-height: 1.6;
    color: #333;
}

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

    .server-grid[b-ayj6p1a6h5] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Customers/WorkLogs/WorkLogEdit.razor.rz.scp.css */
/* Breadcrumb last child color */
.breadcrumb span[b-df6k8qlw3a] {
    color: #6c757d;
}

/* Form wrapper — no outer card; sections provide their own cards */
.edit-form-wrapper[b-df6k8qlw3a] {
    max-width: none;
}

.form-grid[b-df6k8qlw3a] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

/* Form Sections */
.form-section[b-df6k8qlw3a] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.form-section.full-width[b-df6k8qlw3a] {
    grid-column: 1 / -1;
}

/* Section Headers — colored bars with icons */
.section-header[b-df6k8qlw3a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    border-radius: 6px;
    border-bottom: none;
    color: white;
}

.section-header svg[b-df6k8qlw3a] {
    flex-shrink: 0;
    color: white;
    stroke: white;
}

.section-customer[b-df6k8qlw3a] {
    background: linear-gradient(135deg, #1b4a98, #2d6fd6);
}

.section-time[b-df6k8qlw3a] {
    background: linear-gradient(135deg, #0d7c5f, #17a87a);
}

.section-description[b-df6k8qlw3a] {
    background: linear-gradient(135deg, #2c3e50, #4a6785);
}

.section-billing[b-df6k8qlw3a] {
    background: linear-gradient(135deg, #7c5c1e, #b8860b);
}

.section-review[b-df6k8qlw3a] {
    background: linear-gradient(135deg, #6f42c1, #8e5cd9);
}

/* Required Field Indicator */
.required[b-df6k8qlw3a] {
    color: #dc3545;
    font-weight: 700;
}

/* Validation Summary */
.validation-summary[b-df6k8qlw3a] {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 8px;
    padding: 1rem;
    margin-bottom: 1.5rem;
    color: #721c24;
}

.validation-summary strong[b-df6k8qlw3a] {
    display: block;
    margin-bottom: 0.5rem;
}

.validation-summary ul[b-df6k8qlw3a] {
    margin: 0;
    padding-left: 1.25rem;
}

.validation-summary li[b-df6k8qlw3a] {
    font-size: 0.875rem;
}

/* Field Validation Error */
.field-validation-error[b-df6k8qlw3a] {
    color: #dc3545;
    font-size: 0.75rem;
    margin-top: 0.25rem;
    display: block;
}

/* Invalid state for form controls */
.form-control.invalid[b-df6k8qlw3a],
.form-select.invalid[b-df6k8qlw3a] {
    border-color: #dc3545;
}

.form-control.invalid:focus[b-df6k8qlw3a],
.form-select.invalid:focus[b-df6k8qlw3a] {
    border-color: #dc3545;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.15);
}

/* Invalid state for HTML editor */
.editor-invalid[b-df6k8qlw3a] {
    border: 1px solid #dc3545;
    border-radius: 6px;
}

/* Time Input Row */
.time-input-row[b-df6k8qlw3a] {
    display: flex;
    gap: 1rem;
}

.time-input-group[b-df6k8qlw3a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.time-input[b-df6k8qlw3a] {
    width: 80px;
    text-align: center;
}

.time-label[b-df6k8qlw3a] {
    font-size: 0.875rem;
    color: #6c757d;
}

/* Checkbox Groups */
.checkbox-group[b-df6k8qlw3a] {
    flex-direction: row;
    align-items: center;
}

.checkbox-group label[b-df6k8qlw3a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    cursor: pointer;
}

.checkbox-group input[type="checkbox"][b-df6k8qlw3a] {
    width: 18px;
    height: 18px;
    accent-color: #1b4a98;
}

.form-check-input[b-df6k8qlw3a] {
    width: 16px;
    height: 16px;
    accent-color: #1b4a98;
    cursor: pointer;
}

.form-check-label[b-df6k8qlw3a] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: normal;
    cursor: pointer;
}

.mt-2[b-df6k8qlw3a] {
    margin-top: 0.5rem;
}

/* Form actions */
.form-actions[b-df6k8qlw3a] {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.form-actions-left[b-df6k8qlw3a] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

/* Delete button */
.btn-danger[b-df6k8qlw3a] {
    background-color: #dc3545;
    color: white;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-danger:hover[b-df6k8qlw3a] {
    background-color: #c82333;
}

/* Delete Confirmation Modal */
.delete-backdrop[b-df6k8qlw3a] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.delete-modal[b-df6k8qlw3a] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.delete-modal .modal-header[b-df6k8qlw3a] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.delete-modal .modal-header h3[b-df6k8qlw3a] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.delete-modal .modal-body[b-df6k8qlw3a] {
    padding: 1.5rem;
}

.delete-modal .modal-footer[b-df6k8qlw3a] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

.text-danger[b-df6k8qlw3a] {
    color: #dc3545;
    font-weight: 500;
}

/* Button hover override */
.btn-primary:hover:not(:disabled)[b-df6k8qlw3a] {
    background-color: #153a7a;
}

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

.invalid[b-df6k8qlw3a] {
    border-color: #dc3545 !important;
}

/* Responsive */
@media (max-width: 992px) {
    .form-grid[b-df6k8qlw3a] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .form-row.checkboxes[b-df6k8qlw3a] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Customers/WorkLogs/WorkLogList.razor.rz.scp.css */
/* Sort indicator */
.sort-indicator[b-1unawc6j25] {
    margin-left: 0.375rem;
    font-size: 0.625rem;
}

/* Date Cell */
.date-cell[b-1unawc6j25] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.date-value[b-1unawc6j25] {
    font-weight: 500;
}

.time-value[b-1unawc6j25] {
    font-size: 0.75rem;
    color: #6c757d;
}

/* Staff Cell */
.staff-cell[b-1unawc6j25] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.staff-initials[b-1unawc6j25] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: 600;
    flex-shrink: 0;
}

.staff-name[b-1unawc6j25] {
    font-size: 0.85rem;
}

/* Task Description */
.task-desc[b-1unawc6j25] {
    display: block;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Time Cell */
.time-cell[b-1unawc6j25] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.time-total[b-1unawc6j25] {
    font-weight: 500;
}

.time-billable[b-1unawc6j25] {
    font-size: 0.75rem;
    color: #6c757d;
}

/* Badge variant */
.badge-primary[b-1unawc6j25] {
    background-color: #d4e5ff;
    color: #1b4a98;
}

/* Form control min-width override */
.filter-group .form-control[b-1unawc6j25],
.filter-group .form-select[b-1unawc6j25] {
    min-width: 130px;
}
/* /Components/Pages/Customers/WorkLogs/WorkLogView.razor.rz.scp.css */
/* Page meta badges */
.page-meta[b-ldic85fac2] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
    flex-wrap: wrap;
}

/* Button variants */
.btn-danger[b-ldic85fac2] {
    background-color: #dc3545;
    color: white;
}

.btn-danger:hover[b-ldic85fac2] {
    background-color: #c82333;
}

/* Badge variant */
.badge-primary[b-ldic85fac2] {
    background-color: #d4e5ff;
    color: #1b4a98;
}

/* Content Grid */
.content-grid[b-ldic85fac2] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

.content-grid .full-width[b-ldic85fac2] {
    grid-column: 1 / -1;
}

/* Time Card */
.time-card .card-body[b-ldic85fac2] {
    padding: 1.5rem;
}

.time-stats[b-ldic85fac2] {
    display: flex;
    justify-content: space-around;
    text-align: center;
}

.stat[b-ldic85fac2] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.stat-value[b-ldic85fac2] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #333;
}

.stat-label[b-ldic85fac2] {
    font-size: 0.75rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Detail grid two-column */
.detail-grid[b-ldic85fac2] {
    grid-template-columns: repeat(2, 1fr);
}

.detail-label[b-ldic85fac2] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.detail-value[b-ldic85fac2] {
    font-size: 0.9rem;
    color: #333;
}

.detail-value a[b-ldic85fac2] {
    color: #1b4a98;
    text-decoration: none;
}

.detail-value a:hover[b-ldic85fac2] {
    text-decoration: underline;
}

/* Description */
.description-content[b-ldic85fac2] {
    white-space: pre-wrap;
    line-height: 1.6;
}

/* Project Progress */
.project-progress[b-ldic85fac2] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.progress-bar-large[b-ldic85fac2] {
    width: 100%;
    height: 12px;
    background-color: #e9ecef;
    border-radius: 6px;
    overflow: hidden;
}

.progress-fill[b-ldic85fac2] {
    height: 100%;
    background: linear-gradient(90deg, #1b4a98, #2d6fd6);
    border-radius: 6px;
    transition: width 0.3s ease;
}

.progress-stats[b-ldic85fac2] {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
    color: #6c757d;
}

.text-danger[b-ldic85fac2] {
    color: #dc3545;
}

/* Error container alias */
.error-container[b-ldic85fac2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    text-align: center;
}

/* Responsive */
@media (max-width: 992px) {
    .content-grid[b-ldic85fac2] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .page-header-right[b-ldic85fac2] {
        width: 100%;
        justify-content: flex-start;
    }

    .time-stats[b-ldic85fac2] {
        flex-direction: column;
        gap: 1rem;
    }
}

/* Delete Confirmation Modal */
.delete-backdrop[b-ldic85fac2] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.delete-modal[b-ldic85fac2] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.delete-modal .modal-header[b-ldic85fac2] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.delete-modal .modal-header h3[b-ldic85fac2] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.delete-modal .modal-body[b-ldic85fac2] {
    padding: 1.5rem;
}

.delete-modal .modal-footer[b-ldic85fac2] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}
/* /Components/Pages/Customers/WorkLogs/WorkTracker.razor.rz.scp.css */
/* Error container */
.error-container[b-ysatd8rxbs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    text-align: center;
}

/* Breadcrumb last child */
.breadcrumb span[b-ysatd8rxbs] { color: #6c757d; }

/* Badge variants */
.badge-primary[b-ysatd8rxbs] { background-color: #d4e5ff; color: #1b4a98; }
.badge-danger[b-ysatd8rxbs] { background-color: #f8d7da; color: #721c24; }

/* Button disabled override */
.btn-primary:hover:not(:disabled)[b-ysatd8rxbs] { background-color: #153a7a; }
.btn-primary:disabled[b-ysatd8rxbs] { opacity: 0.7; cursor: not-allowed; }

/* Tracker Layout - Side by Side */
.tracker-layout[b-ysatd8rxbs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    align-items: start;
}

.left-panel[b-ysatd8rxbs],
.right-panel[b-ysatd8rxbs] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Project Info Card */
.project-info-card .card-body[b-ysatd8rxbs] { padding: 1.5rem; }

.project-name[b-ysatd8rxbs] {
    margin: 0 0 0.25rem 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #333;
}

.customer-name[b-ysatd8rxbs] {
    margin: 0 0 0.75rem 0;
    font-size: 0.95rem;
    color: #6c757d;
}

.social-client-name[b-ysatd8rxbs] {
    margin: -0.5rem 0 0.75rem 0;
    font-size: 0.85rem;
    color: #1b4a98;
    font-weight: 500;
}

.project-meta[b-ysatd8rxbs] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.project-description[b-ysatd8rxbs] {
    margin: 0 0 1rem 0;
    font-size: 0.875rem;
    color: #495057;
    font-style: italic;
    padding: 0.75rem;
    background-color: #f8f9fa;
    border-radius: 6px;
}

.project-stats[b-ysatd8rxbs] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
}

.project-stats .stat[b-ysatd8rxbs] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    text-align: center;
    flex: 1;
}

.project-stats .stat-value[b-ysatd8rxbs] { font-size: 1.125rem; font-weight: 600; color: #333; }
.project-stats .stat-label[b-ysatd8rxbs] { font-size: 0.7rem; color: #6c757d; text-transform: uppercase; letter-spacing: 0.5px; }

/* Timer Card */
.timer-card .card-body[b-ysatd8rxbs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem 1.5rem;
}

.timer-display[b-ysatd8rxbs] {
    display: flex;
    align-items: center;
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', monospace;
    font-size: 3.5rem;
    font-weight: 300;
    color: #333;
    margin-bottom: 0.5rem;
}

.timer-display.tracking[b-ysatd8rxbs] { color: #1b4a98; }
.timer-display.paused[b-ysatd8rxbs] { color: #ffc107; animation: pulse-b-ysatd8rxbs 1.5s ease-in-out infinite; }

@keyframes pulse-b-ysatd8rxbs {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

.timer-hours[b-ysatd8rxbs], .timer-minutes[b-ysatd8rxbs], .timer-seconds[b-ysatd8rxbs] { min-width: 2ch; text-align: center; }
.timer-separator[b-ysatd8rxbs] { opacity: 0.5; padding: 0 0.125rem; }

.status-text[b-ysatd8rxbs] { margin: 0 0 1rem 0; font-size: 0.875rem; color: #6c757d; }
.paused-text[b-ysatd8rxbs] { color: #e67e00; font-weight: 500; }

.timer-actions[b-ysatd8rxbs] { display: flex; gap: 1rem; margin-bottom: 1rem; }

.btn-start[b-ysatd8rxbs] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: white;
    padding: 0.875rem 2.5rem;
    font-size: 1.125rem;
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(40, 167, 69, 0.3);
}

.btn-start:hover:not(:disabled)[b-ysatd8rxbs] { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(40, 167, 69, 0.4); }

.btn-pause[b-ysatd8rxbs] {
    background: linear-gradient(135deg, #ffc107 0%, #ffca2c 100%);
    color: #333;
    padding: 0.875rem 2rem;
    font-size: 1.125rem;
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(255, 193, 7, 0.3);
}

.btn-pause:hover:not(:disabled)[b-ysatd8rxbs] { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(255, 193, 7, 0.4); }

.btn-resume[b-ysatd8rxbs] {
    background: linear-gradient(135deg, #17a2b8 0%, #20c997 100%);
    color: white;
    padding: 0.875rem 2rem;
    font-size: 1.125rem;
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(23, 162, 184, 0.3);
}

.btn-resume:hover:not(:disabled)[b-ysatd8rxbs] { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(23, 162, 184, 0.4); }

.btn-stop[b-ysatd8rxbs] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
    padding: 0.875rem 2rem;
    font-size: 1.125rem;
    border-radius: 50px;
    box-shadow: 0 4px 15px rgba(220, 53, 69, 0.3);
}

.btn-stop:hover:not(:disabled)[b-ysatd8rxbs] { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(220, 53, 69, 0.4); }
.btn-stop:disabled[b-ysatd8rxbs] { opacity: 0.5; cursor: not-allowed; transform: none; box-shadow: none; }

.description-hint[b-ysatd8rxbs] { margin: 0; font-size: 0.8rem; color: #dc3545; text-align: center; }

.tracking-info[b-ysatd8rxbs] { width: 100%; margin-top: 0.5rem; }

.info-row[b-ysatd8rxbs] {
    display: flex;
    justify-content: center;
    gap: 2rem;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 0.5rem;
}

.info-row:last-child[b-ysatd8rxbs] { margin-bottom: 0; }
.pause-info[b-ysatd8rxbs] { background-color: #fff3cd; }

.info-item[b-ysatd8rxbs] { display: flex; flex-direction: column; gap: 0.125rem; text-align: center; }
.info-label[b-ysatd8rxbs] { font-size: 0.7rem; color: #6c757d; text-transform: uppercase; letter-spacing: 0.5px; }
.info-value[b-ysatd8rxbs] { font-size: 0.875rem; font-weight: 500; color: #333; }
.pause-value[b-ysatd8rxbs] { color: #856404; }

/* Description Card */
.description-card .card-header h2[b-ysatd8rxbs] { display: flex; align-items: center; gap: 0.25rem; }
.required[b-ysatd8rxbs] { color: #dc3545; font-weight: 700; }

.editor-hint[b-ysatd8rxbs] {
    border: 2px dashed #ffc107;
    border-radius: 6px;
    padding: 2px;
}

.editor-disabled-hint[b-ysatd8rxbs] {
    margin: 0.75rem 0 0 0;
    font-size: 0.8rem;
    color: #6c757d;
    text-align: center;
    font-style: italic;
}

/* Recent Logs Card */
.empty-message[b-ysatd8rxbs] { text-align: center; padding: 1rem; }

.logs-list[b-ysatd8rxbs] { display: flex; flex-direction: column; }

.log-item[b-ysatd8rxbs] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.5rem;
    border-bottom: 1px solid #e9ecef;
    cursor: pointer;
    transition: background-color 0.15s ease;
    border-radius: 4px;
}

.log-item:last-child[b-ysatd8rxbs] { border-bottom: none; }
.log-item:hover[b-ysatd8rxbs] { background-color: #f8f9fa; }

.log-date[b-ysatd8rxbs] { display: flex; flex-direction: column; min-width: 55px; text-align: center; }
.log-date .date[b-ysatd8rxbs] { font-weight: 500; color: #333; font-size: 0.8rem; }
.log-date .time[b-ysatd8rxbs] { font-size: 0.7rem; color: #6c757d; }

.log-details[b-ysatd8rxbs] { flex: 1; display: flex; flex-direction: column; gap: 0.125rem; min-width: 0; }
.log-staff[b-ysatd8rxbs] { font-weight: 500; font-size: 0.8rem; color: #333; }
.log-description[b-ysatd8rxbs] { font-size: 0.75rem; color: #6c757d; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.log-time[b-ysatd8rxbs] { text-align: right; }
.total-time[b-ysatd8rxbs] { font-weight: 600; color: #1b4a98; font-size: 0.8rem; }

.view-all-link[b-ysatd8rxbs] { text-align: center; padding-top: 0.75rem; border-top: 1px solid #e9ecef; margin-top: 0.5rem; }
.view-all-link a[b-ysatd8rxbs] { color: #1b4a98; text-decoration: none; font-size: 0.8rem; }
.view-all-link a:hover[b-ysatd8rxbs] { text-decoration: underline; }

/* Popup Mode Styles */
.popup-header[b-ysatd8rxbs] {
    text-align: center;
    margin-bottom: 1rem;
    padding: 0.75rem 1rem;
    background: linear-gradient(135deg, #1b4a98 0%, #2563b3 100%);
    border-radius: 10px;
    color: #fff;
}

.popup-project-name[b-ysatd8rxbs] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #fff;
}

.popup-customer-name[b-ysatd8rxbs] {
    margin: 0.125rem 0 0 0;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.8);
}

.popup-social-client-name[b-ysatd8rxbs] {
    margin: 0.125rem 0 0.5rem 0;
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.95);
    font-weight: 500;
}

.popup-meta[b-ysatd8rxbs] {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    flex-wrap: wrap;
}

.popup-stats[b-ysatd8rxbs] {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.popup-stat[b-ysatd8rxbs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.125rem;
}

.popup-stat-value[b-ysatd8rxbs] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #fff;
}

.popup-stat-label[b-ysatd8rxbs] {
    font-size: 0.65rem;
    color: rgba(255, 255, 255, 0.7);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.tracker-layout-popup[b-ysatd8rxbs] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Quick Load Buttons */
.quick-load-bar[b-ysatd8rxbs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    flex-wrap: wrap;
}

.quick-load-label[b-ysatd8rxbs] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.btn-quick-load[b-ysatd8rxbs] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.65rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: #495057;
    background-color: #f0f2f5;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.btn-quick-load:hover[b-ysatd8rxbs] {
    background-color: #e2e6ea;
    border-color: #c8cdd3;
    color: #1b4a98;
}

.btn-quick-load:active[b-ysatd8rxbs] {
    background-color: #d4e5ff;
    border-color: #1b4a98;
    color: #1b4a98;
}

/* Responsive - keep existing rules */
@media (max-width: 1200px) {
    .timer-display[b-ysatd8rxbs] { font-size: 3rem; }
    .info-row[b-ysatd8rxbs] { gap: 1.5rem; }
}

@media (max-width: 992px) {
    .tracker-layout[b-ysatd8rxbs] { grid-template-columns: 1fr; }
    .timer-display[b-ysatd8rxbs] { font-size: 3.5rem; }
    .left-panel[b-ysatd8rxbs] { order: 2; }
    .right-panel[b-ysatd8rxbs] { order: 1; }
}

@media (max-width: 768px) {
    .page-header-right[b-ysatd8rxbs] { width: 100%; justify-content: flex-start; }
    .timer-display[b-ysatd8rxbs] { font-size: 2.5rem; }
    .btn-start[b-ysatd8rxbs], .btn-pause[b-ysatd8rxbs], .btn-resume[b-ysatd8rxbs], .btn-stop[b-ysatd8rxbs] { padding: 0.75rem 1.5rem; font-size: 1rem; }
    .timer-actions[b-ysatd8rxbs] { flex-direction: column; width: 100%; }
    .timer-actions .btn[b-ysatd8rxbs] { width: 100%; }
    .info-row[b-ysatd8rxbs] { flex-wrap: wrap; gap: 1rem; }
    .project-stats[b-ysatd8rxbs] { flex-wrap: wrap; }
}
/* /Components/Pages/Dashboard.razor.rz.scp.css */
.dashboard-header[b-wi38o8hlyy] {
    margin-bottom: 2rem;
}

.dashboard-header h1[b-wi38o8hlyy] {
    margin: 0 0 0.25rem 0;
    font-size: 1.75rem;
    font-weight: 600;
    color: #333;
}

.dashboard-subtitle[b-wi38o8hlyy] {
    margin: 0;
    color: #6c757d;
    font-size: 0.95rem;
}

.dashboard-grid[b-wi38o8hlyy] {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    gap: 1.5rem;
    align-items: start;
}

.dashboard-column[b-wi38o8hlyy] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.widget-cell[b-wi38o8hlyy] {
    min-height: 200px;
}

/* Responsive adjustments */
@media (max-width: 1200px) {
    .dashboard-grid[b-wi38o8hlyy] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 768px) {
    .dashboard-grid[b-wi38o8hlyy] {
        grid-template-columns: 1fr;
    }
    
    .dashboard-header h1[b-wi38o8hlyy] {
        font-size: 1.5rem;
    }
}
/* /Components/Pages/Messages/Inbox.razor.rz.scp.css */
/* Page Layout */
.page-container[b-5hryydlelm] {
    max-width: 900px;
    margin: 0 auto;
    padding: 1.5rem;
}

.page-header[b-5hryydlelm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

.page-header-left[b-5hryydlelm] {
    display: flex;
    align-items: center;
}

.page-title[b-5hryydlelm] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a1a2e;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.page-title svg[b-5hryydlelm] {
    color: #1b4a98;
}

/* Buttons */
.btn-primary[b-5hryydlelm] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: #1b4a98;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.btn-primary:hover[b-5hryydlelm] {
    background: #163d7e;
}

.btn-primary:disabled[b-5hryydlelm] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-secondary[b-5hryydlelm] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s;
}

.btn-secondary:hover[b-5hryydlelm] {
    background: #e5e7eb;
}

.btn-back[b-5hryydlelm] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.375rem 0.75rem;
    background: transparent;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 500;
    color: #374151;
    cursor: pointer;
    transition: all 0.15s;
}

.btn-back:hover[b-5hryydlelm] {
    background: #f3f4f6;
    border-color: #9ca3af;
}

/* Loading */
.loading-state[b-5hryydlelm] {
    text-align: center;
    padding: 3rem;
    color: #6b7280;
}

.spinner[b-5hryydlelm] {
    width: 32px;
    height: 32px;
    border: 3px solid #e5e7eb;
    border-top: 3px solid #1b4a98;
    border-radius: 50%;
    animation: spin-b-5hryydlelm 0.8s linear infinite;
    margin: 0 auto 1rem;
}

.spinner-sm[b-5hryydlelm] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top: 2px solid #fff;
    border-radius: 50%;
    animation: spin-b-5hryydlelm 0.8s linear infinite;
}

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

/* Empty State */
.empty-state[b-5hryydlelm] {
    text-align: center;
    padding: 3rem 1rem;
    color: #9ca3af;
}

.empty-state svg[b-5hryydlelm] {
    margin-bottom: 0.75rem;
    opacity: 0.4;
}

.empty-state p[b-5hryydlelm] {
    font-size: 0.9rem;
    margin: 0;
}

/* Messages Card */
.messages-card[b-5hryydlelm] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

/* Tab Bar */
.tab-bar[b-5hryydlelm] {
    display: flex;
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
}

.tab-btn[b-5hryydlelm] {
    padding: 0.75rem 1.5rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #6b7280;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: all 0.15s;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tab-btn:hover[b-5hryydlelm] {
    color: #1b4a98;
}

.tab-btn.active[b-5hryydlelm] {
    color: #1b4a98;
    border-bottom-color: #1b4a98;
}

.tab-badge[b-5hryydlelm] {
    background: #dc2626;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 10px;
    line-height: 1.4;
}

/* Message List */
.message-list[b-5hryydlelm] {
    /* No extra styles needed */
}

.message-row[b-5hryydlelm] {
    display: grid;
    grid-template-columns: 24px 140px 1fr 80px;
    align-items: center;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #f3f4f6;
    cursor: pointer;
    transition: background 0.1s;
    gap: 0.5rem;
}

.message-row:last-child[b-5hryydlelm] {
    border-bottom: none;
}

.message-row:hover[b-5hryydlelm] {
    background: #f9fafb;
}

.message-row.unread[b-5hryydlelm] {
    background: #f0f5ff;
}

.message-row.unread:hover[b-5hryydlelm] {
    background: #e8effd;
}

.message-row.unread .message-row-sender[b-5hryydlelm],
.message-row.unread .message-row-subject[b-5hryydlelm] {
    font-weight: 700;
}

.message-row-indicator[b-5hryydlelm] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.unread-dot[b-5hryydlelm] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #1b4a98;
}

.message-row-sender[b-5hryydlelm] {
    font-size: 0.82rem;
    color: #374151;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.message-row-subject[b-5hryydlelm] {
    font-size: 0.82rem;
    color: #4b5563;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.message-row-date[b-5hryydlelm] {
    font-size: 0.75rem;
    color: #9ca3af;
    text-align: right;
    white-space: nowrap;
}

/* Message Detail */
.message-detail-card[b-5hryydlelm] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.message-detail-header[b-5hryydlelm] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #f0f0f0;
    background: #f9fafb;
}

.message-detail-subject[b-5hryydlelm] {
    padding: 1rem 1.25rem 0.5rem;
    font-size: 1.2rem;
    font-weight: 700;
    color: #1a1a2e;
}

.message-detail-meta[b-5hryydlelm] {
    padding: 0 1.25rem 1rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: 0.8rem;
    color: #6b7280;
    border-bottom: 1px solid #f0f0f0;
}

.message-detail-meta strong[b-5hryydlelm] {
    color: #374151;
}

.message-detail-body[b-5hryydlelm] {
    padding: 1.25rem;
    font-size: 0.9rem;
    color: #374151;
    line-height: 1.6;
    word-break: break-word;
}

.message-detail-body img[b-5hryydlelm] {
    max-width: 100%;
    height: auto;
}

/* Compose Modal */
.compose-backdrop[b-5hryydlelm] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.compose-modal[b-5hryydlelm] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 700px;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-header[b-5hryydlelm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e5e7eb;
}

.modal-header h3[b-5hryydlelm] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #1a1a2e;
}

.modal-close[b-5hryydlelm] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #9ca3af;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.modal-close:hover[b-5hryydlelm] {
    color: #374151;
}

.modal-body[b-5hryydlelm] {
    padding: 1.25rem;
}

.modal-footer[b-5hryydlelm] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
    border-radius: 0 0 12px 12px;
}

/* Form elements */
.form-group[b-5hryydlelm] {
    margin-bottom: 1rem;
}

.form-label[b-5hryydlelm] {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.375rem;
}

.form-control[b-5hryydlelm] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    color: #374151;
    box-sizing: border-box;
}

.form-control:focus[b-5hryydlelm] {
    outline: none;
    border-color: #1b4a98;
    box-shadow: 0 0 0 2px rgba(27, 74, 152, 0.15);
}

.form-select[b-5hryydlelm] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    color: #374151;
    box-sizing: border-box;
}

.form-check[b-5hryydlelm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.form-check-input[b-5hryydlelm] {
    width: 1rem;
    height: 1rem;
}

.form-check-label[b-5hryydlelm] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #374151;
}

.mb-3[b-5hryydlelm] {
    margin-bottom: 1rem;
}

.validation-message[b-5hryydlelm] {
    font-size: 0.75rem;
    color: #dc2626;
    margin-top: 0.25rem;
}

/* Responsive */
@media (max-width: 640px) {
    .message-row[b-5hryydlelm] {
        grid-template-columns: 20px 1fr 60px;
    }

    .message-row-sender[b-5hryydlelm] {
        display: none;
    }

    .message-detail-meta[b-5hryydlelm] {
        flex-direction: column;
        gap: 0.25rem;
    }
}
/* /Components/Pages/Public/CalendarReview.razor.rz.scp.css */
.review-page[b-1j8hxrch91] {
    width: 100%;
}

.review-instructions[b-1j8hxrch91] {
    background: #f0f7ff;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    margin-bottom: 0.5rem;
}

.review-instructions p[b-1j8hxrch91] {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.6;
    color: #1e3a5f;
}

.client-notes-card[b-1j8hxrch91] {
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 10px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1rem;
}

.client-notes-content[b-1j8hxrch91] {
    font-size: 0.95rem;
    line-height: 1.7;
    color: #1e293b;
}

.client-notes-content :deep(p:last-child)[b-1j8hxrch91] {
    margin-bottom: 0;
}

.review-container[b-1j8hxrch91] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 1.5rem 0;
    max-width: 900px;
    margin: 0 auto;
}

/* Layout */
.calendar-review-layout[b-1j8hxrch91] {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 1.5rem;
    padding: 1.5rem;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    align-items: start;
    box-sizing: border-box;
}

.calendar-review-main[b-1j8hxrch91] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    min-width: 0;
    order: 1;
}

/* Sidebar */
.review-sidebar[b-1j8hxrch91] {
    position: sticky;
    top: 1.5rem;
    order: 2;
    width: 280px;
    flex-shrink: 0;
}

.sidebar-card[b-1j8hxrch91] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    padding: 1.5rem;
}

.sidebar-header[b-1j8hxrch91] {
    margin-bottom: 1.25rem;
}

.sidebar-header h3[b-1j8hxrch91] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
}

.sidebar-subtitle[b-1j8hxrch91] {
    margin: 0.25rem 0 0 0;
    font-size: 0.8125rem;
    color: #64748b;
    line-height: 1.5;
}

.sidebar-info[b-1j8hxrch91] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
    padding: 1rem;
    background: #f8fafc;
    border-radius: 8px;
}

.info-row[b-1j8hxrch91] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.8125rem;
}

.info-label[b-1j8hxrch91] {
    color: #64748b;
}

.info-value[b-1j8hxrch91] {
    font-weight: 600;
    color: #1e293b;
}

.sidebar-instructions[b-1j8hxrch91] {
    margin-bottom: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.instruction-item[b-1j8hxrch91] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 0.8125rem;
    color: #64748b;
}

.instruction-item svg[b-1j8hxrch91] {
    flex-shrink: 0;
    opacity: 0.7;
}

/* Sidebar Form */
.sidebar-card .form-group[b-1j8hxrch91] {
    margin-bottom: 1rem;
}

.sidebar-card .form-group label[b-1j8hxrch91] {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.375rem;
}

.sidebar-card .form-control[b-1j8hxrch91] {
    width: 100%;
    padding: 0.625rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.875rem;
    box-sizing: border-box;
}

.sidebar-card .form-control:focus[b-1j8hxrch91] {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.btn-approve[b-1j8hxrch91] {
    width: 100%;
    padding: 0.875rem 1rem;
    font-size: 0.9375rem;
    justify-content: center;
}

.sidebar-card .error-message[b-1j8hxrch91] {
    padding: 0.625rem;
    background: #fee2e2;
    color: #991b1b;
    border-radius: 6px;
    margin-bottom: 1rem;
    font-size: 0.8125rem;
}

.sidebar-card .submit-hint[b-1j8hxrch91] {
    margin: 0.75rem 0 0 0;
    padding: 0.5rem;
    font-size: 0.8125rem;
    color: #92400e;
    background: #fef3c7;
    border-radius: 6px;
    text-align: center;
}

/* Approve All Button */
.btn-approve-all[b-1j8hxrch91] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.625rem 1rem;
    margin-bottom: 1.25rem;
    background: #ffffff;
    color: #16a34a;
    border: 2px solid #22c55e;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-approve-all:hover[b-1j8hxrch91] {
    background: #dcfce7;
    border-color: #16a34a;
    color: #15803d;
}

.btn-approve-all svg[b-1j8hxrch91] {
    flex-shrink: 0;
}

/* Loading & Error States */
.review-card[b-1j8hxrch91] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.review-card.error-card[b-1j8hxrch91] {
    max-width: 500px;
    margin: 0 auto;
}

.review-card.empty-card[b-1j8hxrch91] {
    text-align: center;
}

.review-body[b-1j8hxrch91] {
    padding: 3rem 2rem;
}

.loading-content[b-1j8hxrch91] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    color: #64748b;
    padding: 2rem;
}

.loading-content .spinner[b-1j8hxrch91] {
    width: 40px;
    height: 40px;
    border: 3px solid #e2e8f0;
    border-top-color: #3b82f6;
    border-radius: 50%;
    animation: spin-b-1j8hxrch91 1s linear infinite;
    margin-bottom: 1rem;
}

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

.error-content[b-1j8hxrch91],
.empty-content[b-1j8hxrch91] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    color: #64748b;
}

.error-icon[b-1j8hxrch91] {
    color: #ef4444;
    margin-bottom: 1.5rem;
}

.error-content h2[b-1j8hxrch91] {
    margin: 0 0 0.5rem 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #dc2626;
}

.error-content p[b-1j8hxrch91],
.empty-content p[b-1j8hxrch91] {
    margin: 0.25rem 0;
    font-size: 1rem;
}

.error-hint[b-1j8hxrch91] {
    margin-top: 1rem !important;
    color: #94a3b8;
    font-size: 0.875rem;
}

.empty-content svg[b-1j8hxrch91] {
    color: #cbd5e1;
    margin-bottom: 1rem;
}

.empty-content h3[b-1j8hxrch91] {
    margin: 0 0 0.5rem 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #475569;
}

/* Review Header */
.review-header-card[b-1j8hxrch91] {
    background: #164e9b;
    border-radius: 12px;
    padding: 2rem;
    color: #ffffff;
}

.review-header-content[b-1j8hxrch91] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.review-header-info[b-1j8hxrch91] {
    flex: 1;
}

.client-name[b-1j8hxrch91] {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    opacity: 0.8;
    margin-bottom: 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.review-header-card h1[b-1j8hxrch91] {
    margin: 0 0 1rem 0;
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.3;
}

.review-meta[b-1j8hxrch91] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.meta-item[b-1j8hxrch91] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9375rem;
    opacity: 0.9;
}

.meta-item svg[b-1j8hxrch91] {
    opacity: 0.8;
}

.review-status-badge[b-1j8hxrch91] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
    white-space: nowrap;
}

.review-status-badge.status-pending[b-1j8hxrch91] {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

.review-status-badge.status-approved[b-1j8hxrch91] {
    background: #22c55e;
    color: #ffffff;
}

.review-status-badge.status-with-changes[b-1j8hxrch91] {
    background: #f59e0b;
    color: #ffffff;
}

.review-status-badge.status-requesting[b-1j8hxrch91] {
    background: #ef4444;
    color: #ffffff;
}

/* Success Card */
.review-complete-card[b-1j8hxrch91] {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
    border-radius: 12px;
    padding: 3rem 2rem;
    text-align: center;
    color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(34, 197, 94, 0.3), 0 2px 4px -1px rgba(34, 197, 94, 0.2);
}

.review-complete-content svg[b-1j8hxrch91] {
    margin-bottom: 1.5rem;
    opacity: 0.95;
}

.review-complete-content h3[b-1j8hxrch91] {
    margin: 0 0 0.75rem 0;
    font-size: 1.75rem;
    font-weight: 700;
}

.review-complete-content > p[b-1j8hxrch91] {
    margin: 0;
    font-size: 1.125rem;
    opacity: 0.95;
}

/* Calendar */
.calendar-container[b-1j8hxrch91] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.calendar-month[b-1j8hxrch91] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.month-header[b-1j8hxrch91] {
    padding: 1rem 1.5rem;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.month-header h2[b-1j8hxrch91] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #1e293b;
}

.calendar-grid[b-1j8hxrch91] {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0;
    padding: 0.5rem;
}

.calendar-weekdays[b-1j8hxrch91] {
    display: contents;
}

.weekday[b-1j8hxrch91] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #94a3b8;
    padding: 0.5rem 0;
    text-align: center;
    border-bottom: 1px solid #f1f5f9;
}

.calendar-days[b-1j8hxrch91] {
    display: contents;
}

.calendar-day[b-1j8hxrch91] {
    min-height: 100px;
    min-width: 0;
    overflow: hidden;
    padding: 0.375rem;
    border: 1px solid #f1f5f9;
    position: relative;
    transition: background-color 0.15s ease;
}

.calendar-day.empty[b-1j8hxrch91] {
    background: #fafafa;
    min-height: 60px;
}

.calendar-day.today[b-1j8hxrch91] {
    background: #eff6ff;
}

.calendar-day.today .day-number[b-1j8hxrch91] {
    background: #164e9b;
    color: #ffffff;
    border-radius: 50%;
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.calendar-day.has-posts[b-1j8hxrch91] {
    background: #fefce8;
}

.calendar-day.drag-over[b-1j8hxrch91] {
    background: #dbeafe;
    border-color: #3b82f6;
    box-shadow: inset 0 0 0 2px #3b82f6;
}

.day-number[b-1j8hxrch91] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #64748b;
    margin-bottom: 0.25rem;
}

.day-posts[b-1j8hxrch91] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.post-chip[b-1j8hxrch91] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    background: #e2e8f0;
    color: #475569;
    border-radius: 4px;
    font-size: 0.6875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    overflow-wrap: break-word;
    word-break: break-word;
    user-select: none;
}

.post-chip.chip-pending[b-1j8hxrch91] {
    background: #e2e8f0;
    color: #475569;
}

.post-chip.chip-approved[b-1j8hxrch91] {
    background: #dcfce7;
    color: #166534;
}

.post-chip.chip-with-changes[b-1j8hxrch91] {
    background: #fef3c7;
    color: #92400e;
}

.post-chip.chip-requesting[b-1j8hxrch91] {
    background: #fee2e2;
    color: #991b1b;
}

.post-chip:hover[b-1j8hxrch91] {
    filter: brightness(0.93);
    transform: translateY(-1px);
}

.post-chip.dragging[b-1j8hxrch91] {
    opacity: 0.5;
}

.chip-check[b-1j8hxrch91] {
    flex-shrink: 0;
    opacity: 0.7;
}

.post-chip-name[b-1j8hxrch91] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.post-chip-more[b-1j8hxrch91] {
    font-size: 0.625rem;
    color: #94a3b8;
    text-align: center;
    padding: 0.125rem 0;
}

/* Progress Bar */
.progress-section[b-1j8hxrch91] {
    margin-bottom: 1.25rem;
}

.progress-bar-container[b-1j8hxrch91] {
    height: 8px;
    background: #e2e8f0;
    border-radius: 4px;
    overflow: hidden;
}

.progress-bar[b-1j8hxrch91] {
    height: 100%;
    background: linear-gradient(90deg, #22c55e, #16a34a);
    border-radius: 4px;
    transition: width 0.3s ease;
}

.progress-text[b-1j8hxrch91] {
    margin: 0.5rem 0 0 0;
    font-size: 0.8125rem;
    color: #64748b;
    text-align: center;
}

/* Review Summary */
.review-summary[b-1j8hxrch91] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
    padding: 1rem;
    background: #f8fafc;
    border-radius: 8px;
}

.summary-row[b-1j8hxrch91] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
}

.summary-row.pending[b-1j8hxrch91] {
    color: #94a3b8;
}

.summary-dot[b-1j8hxrch91] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #e2e8f0;
    flex-shrink: 0;
}

.summary-dot.approved[b-1j8hxrch91] { background: #22c55e; }
.summary-dot.with-changes[b-1j8hxrch91] { background: #f59e0b; }
.summary-dot.requesting[b-1j8hxrch91] { background: #ef4444; }

.summary-label[b-1j8hxrch91] {
    flex: 1;
    color: #475569;
}

.summary-count[b-1j8hxrch91] {
    font-weight: 600;
    color: #1e293b;
    min-width: 20px;
    text-align: right;
}

.summary-row.pending .summary-count[b-1j8hxrch91] {
    color: #94a3b8;
}

/* Review badge in modal header */
.modal-header-right[b-1j8hxrch91] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}

.review-badge[b-1j8hxrch91] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.625rem;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.review-badge.badge-approved[b-1j8hxrch91] {
    background: #dcfce7;
    color: #166534;
}

.review-badge.badge-with-changes[b-1j8hxrch91] {
    background: #fef3c7;
    color: #92400e;
}

.review-badge.badge-requesting[b-1j8hxrch91] {
    background: #fee2e2;
    color: #991b1b;
}

/* Modal Review Section */
.modal-review-section[b-1j8hxrch91] {
    padding: 1.25rem 1.5rem;
    background: #f1f5f9;
    border-top: 1px solid #e2e8f0;
}

.review-options[b-1j8hxrch91] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.review-label[b-1j8hxrch91] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;
}

.review-label-row[b-1j8hxrch91] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Auto-save indicator */
.auto-save-indicator[b-1j8hxrch91] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
    transition: opacity 0.3s ease;
}

.auto-save-indicator.saving[b-1j8hxrch91] {
    color: #64748b;
}

.auto-save-indicator.saved[b-1j8hxrch91] {
    color: #16a34a;
}

.auto-save-indicator.error[b-1j8hxrch91] {
    color: #dc2626;
}

.spinner-tiny[b-1j8hxrch91] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border: 1.5px solid transparent;
    border-top-color: currentColor;
    border-radius: 50%;
    animation: spin-b-1j8hxrch91 0.8s linear infinite;
}

.review-buttons[b-1j8hxrch91] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.review-option-btn[b-1j8hxrch91] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    font-size: 0.875rem;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    transition: all 0.2s ease;
}

.review-option-btn:hover[b-1j8hxrch91] {
    border-color: #cbd5e1;
    background: #f8fafc;
}

.review-option-btn.btn-option-approved:hover[b-1j8hxrch91],
.review-option-btn.btn-option-approved.selected[b-1j8hxrch91] {
    border-color: #22c55e;
    background: #dcfce7;
    color: #166534;
}

.review-option-btn.btn-option-with-changes:hover[b-1j8hxrch91],
.review-option-btn.btn-option-with-changes.selected[b-1j8hxrch91] {
    border-color: #f59e0b;
    background: #fef3c7;
    color: #92400e;
}

.review-option-btn.btn-option-requesting:hover[b-1j8hxrch91],
.review-option-btn.btn-option-requesting.selected[b-1j8hxrch91] {
    border-color: #ef4444;
    background: #fee2e2;
    color: #991b1b;
}

.changes-input[b-1j8hxrch91] {
    margin-top: 1rem;
}

.changes-input label[b-1j8hxrch91] {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 0.5rem;
}

.modal-save-actions[b-1j8hxrch91] {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.75rem;
}

.btn-save-review[b-1j8hxrch91] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1.25rem;
    background: #3b82f6;
    color: #ffffff;
    border: none;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease;
}

.btn-save-review:hover[b-1j8hxrch91] {
    background: #2563eb;
}

textarea.form-control[b-1j8hxrch91] {
    resize: vertical;
    min-height: 80px;
    width: 100%;
}

/* Success details */
.success-details[b-1j8hxrch91] {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
    margin-top: 1rem;
    display: inline-block;
}

.success-summary[b-1j8hxrch91] {
    margin: 0 0 0.5rem 0;
    font-size: 1rem;
}

.success-summary strong[b-1j8hxrch91] {
    font-size: 1.25rem;
}

.success-note[b-1j8hxrch91] {
    margin: 0;
    font-size: 0.9375rem;
    opacity: 0.9;
}

/* Spinner */
.spinner-small[b-1j8hxrch91] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top-color: currentColor;
    border-radius: 50%;
    animation: spin-b-1j8hxrch91 0.8s linear infinite;
}

/* Modal backdrop & container */
.modal-backdrop[b-1j8hxrch91] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    backdrop-filter: blur(2px);
}

.post-detail-modal[b-1j8hxrch91] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    z-index: 1001;
    width: 90%;
    max-width: 700px;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.post-detail-modal .modal-header[b-1j8hxrch91] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 1.5rem;
    border-bottom: 1px solid #e2e8f0;
    background: #f8fafc;
}

.modal-title-area[b-1j8hxrch91] {
    flex: 1;
    min-width: 0;
}

.modal-title-area h3[b-1j8hxrch91] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #1e293b;
}

.modal-date[b-1j8hxrch91] {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #64748b;
}

.modal-close[b-1j8hxrch91] {
    background: none;
    border: none;
    padding: 0.25rem;
    cursor: pointer;
    color: #94a3b8;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.modal-close:hover[b-1j8hxrch91] {
    background: #e2e8f0;
    color: #475569;
}

.post-detail-modal .modal-body[b-1j8hxrch91] {
    padding: 1.5rem;
    overflow-y: auto;
    flex: 1;
}

.modal-content-section[b-1j8hxrch91] {
    margin-bottom: 1.5rem;
}

.modal-content-section:last-child[b-1j8hxrch91] {
    margin-bottom: 0;
}

.content-section-label[b-1j8hxrch91] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #64748b;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e2e8f0;
}

.content-section-label svg[b-1j8hxrch91] {
    opacity: 0.7;
}

.modal-image-content img[b-1j8hxrch91] {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: 0.75rem;
    display: block;
}

.modal-image-content p img[b-1j8hxrch91] {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: 0.75rem;
    display: block;
}

.modal-text-content[b-1j8hxrch91] {
    font-size: 1rem;
    line-height: 1.7;
    color: #374151;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.modal-text-content p[b-1j8hxrch91] {
    margin: 0 0 1rem 0;
}

.modal-text-content p:last-child[b-1j8hxrch91] {
    margin-bottom: 0;
}

.no-content-placeholder[b-1j8hxrch91] {
    padding: 2rem;
    text-align: center;
    color: #94a3b8;
    background: #f8fafc;
    border-radius: 8px;
}

.no-content-placeholder p[b-1j8hxrch91] {
    margin: 0;
}

/* Responsive */
@media (max-width: 1100px) {
    .calendar-review-layout[b-1j8hxrch91] {
        grid-template-columns: 1fr;
        padding: 1rem;
    }

    .review-sidebar[b-1j8hxrch91] {
        position: relative;
        top: 0;
        order: -1;
        width: 100%;
    }
}

@media (max-width: 768px) {
    .calendar-day[b-1j8hxrch91] {
        min-height: 70px;
        padding: 0.25rem;
    }

    .post-chip[b-1j8hxrch91] {
        font-size: 0.625rem;
        padding: 0.2rem 0.375rem;
    }

    .day-number[b-1j8hxrch91] {
        font-size: 0.75rem;
    }
}

@media (max-width: 640px) {
    .review-header-content[b-1j8hxrch91] {
        flex-direction: column;
    }

    .review-header-card h1[b-1j8hxrch91] {
        font-size: 1.5rem;
    }

    .review-meta[b-1j8hxrch91] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .review-status-badge[b-1j8hxrch91] {
        align-self: flex-start;
    }

    .post-detail-modal[b-1j8hxrch91] {
        width: 95%;
        max-height: 90vh;
    }

    .calendar-day[b-1j8hxrch91] {
        min-height: 55px;
    }

    .post-chip-name[b-1j8hxrch91] {
        font-size: 0.5625rem;
    }

    .review-buttons[b-1j8hxrch91] {
        flex-direction: column;
    }

    .review-option-btn[b-1j8hxrch91] {
        width: 100%;
        justify-content: center;
    }
}

/* Internal Review Badge */
.internal-badge[b-1j8hxrch91] {
    background: rgba(255, 193, 7, 0.2);
    padding: 0.25rem 0.75rem;
    border-radius: 4px;
    font-weight: 600;
    color: #ffd54f;
}
/* /Components/Pages/Public/InstanceReview.razor.rz.scp.css */
.review-page[b-0kkvy06say] {
    width: 100%;
}

.review-instructions[b-0kkvy06say] {
    background: #f0f7ff;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    margin-bottom: 0.5rem;
}

.review-instructions p[b-0kkvy06say] {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.6;
    color: #1e3a5f;
}

.client-notes-card[b-0kkvy06say] {
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 10px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1rem;
}

.client-notes-content[b-0kkvy06say] {
    font-size: 0.95rem;
    line-height: 1.7;
    color: #1e293b;
}

.client-notes-content :deep(p:last-child)[b-0kkvy06say] {
    margin-bottom: 0;
}

.review-container[b-0kkvy06say] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 1.5rem 0;
    max-width: 900px;
    margin: 0 auto;
}

/* Wide layout - main content on left (75%), sidebar on right (25%) */
.review-layout-wide[b-0kkvy06say] {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 1.5rem;
    padding: 1.5rem;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    align-items: start;
    box-sizing: border-box;
}

.review-main-wide[b-0kkvy06say] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    min-width: 0;
    order: 1;
}

/* Floating Sidebar - fixed width on right */
.review-sidebar[b-0kkvy06say] {
    position: sticky;
    top: 1.5rem;
    order: 2;
    width: 300px;
    flex-shrink: 0;
}

.sidebar-card[b-0kkvy06say] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    padding: 1.5rem;
}

.sidebar-header[b-0kkvy06say] {
    margin-bottom: 1.25rem;
}

.sidebar-header h3[b-0kkvy06say] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
}

.sidebar-header .reviewer-name[b-0kkvy06say] {
    margin: 0.25rem 0 0 0;
    font-size: 0.875rem;
    color: #64748b;
}

/* Progress Bar */
.progress-section[b-0kkvy06say] {
    margin-bottom: 1.25rem;
}

.progress-bar-container[b-0kkvy06say] {
    height: 8px;
    background: #e2e8f0;
    border-radius: 4px;
    overflow: hidden;
}

.progress-bar[b-0kkvy06say] {
    height: 100%;
    background: linear-gradient(90deg, #22c55e, #16a34a);
    border-radius: 4px;
    transition: width 0.3s ease;
}

.progress-text[b-0kkvy06say] {
    margin: 0.5rem 0 0 0;
    font-size: 0.8125rem;
    color: #64748b;
    text-align: center;
}

/* Summary in Sidebar */
.review-summary[b-0kkvy06say] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
    padding: 1rem;
    background: #f8fafc;
    border-radius: 8px;
}

.summary-row[b-0kkvy06say] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
}

.summary-row.pending[b-0kkvy06say] {
    color: #94a3b8;
}

.summary-dot[b-0kkvy06say] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #e2e8f0;
    flex-shrink: 0;
}

.summary-dot.approved[b-0kkvy06say] { background: #22c55e; }
.summary-dot.with-changes[b-0kkvy06say] { background: #f59e0b; }
.summary-dot.requesting[b-0kkvy06say] { background: #ef4444; }

.summary-label[b-0kkvy06say] {
    flex: 1;
    color: #475569;
}

.summary-count[b-0kkvy06say] {
    font-weight: 600;
    color: #1e293b;
    min-width: 20px;
    text-align: right;
}

.summary-row.pending .summary-count[b-0kkvy06say] {
    color: #94a3b8;
}

/* Sidebar Form */
.sidebar-card .form-group[b-0kkvy06say] {
    margin-bottom: 1rem;
}

.sidebar-card .form-group label[b-0kkvy06say] {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.375rem;
}

.sidebar-card .form-control[b-0kkvy06say] {
    padding: 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 1rem;
    transition: border-color 0.2s ease;
    box-sizing: border-box;
}

.sidebar-card .form-control:focus[b-0kkvy06say] {
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.sidebar-card .btn-submit[b-0kkvy06say] {
    width: 100%;
    padding: 0.875rem 1rem;
    font-size: 0.9375rem;
    justify-content: center;
}

.sidebar-card .submit-hint[b-0kkvy06say] {
    margin: 0;
    padding: 0.75rem;
    background: #fef3c7;
    border-radius: 6px;
    font-size: 0.8125rem;
    color: #92400e;
    text-align: center;
}

.sidebar-card .error-message[b-0kkvy06say] {
    padding: 0.625rem;
    background: #fee2e2;
    color: #991b1b;
    border-radius: 6px;
    margin-bottom: 1rem;
    font-size: 0.8125rem;
}

/* Approve All Button */
.btn-approve-all[b-0kkvy06say] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.625rem 1rem;
    margin-bottom: 1.25rem;
    border: 2px solid #22c55e;
    border-radius: 8px;
    background: #dcfce7;
    color: #166534;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-approve-all:hover[b-0kkvy06say] {
    background: #22c55e;
    color: #ffffff;
}

/* Loading & Error States */
.review-card[b-0kkvy06say] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.review-card.error-card[b-0kkvy06say] {
    max-width: 500px;
    margin: 0 auto;
}

.review-card.empty-card[b-0kkvy06say] {
    text-align: center;
}

.review-body[b-0kkvy06say] {
    padding: 3rem 2rem;
}

.loading-content[b-0kkvy06say] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    color: #64748b;
    padding: 2rem;
}

.loading-content .spinner[b-0kkvy06say] {
    width: 40px;
    height: 40px;
    border: 3px solid #e2e8f0;
    border-top-color: #3b82f6;
    border-radius: 50%;
    animation: spin-b-0kkvy06say 1s linear infinite;
    margin-bottom: 1rem;
}

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

.error-content[b-0kkvy06say],
.empty-content[b-0kkvy06say] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    color: #64748b;
}

.error-icon[b-0kkvy06say] {
    color: #ef4444;
    margin-bottom: 1.5rem;
}

.error-content h2[b-0kkvy06say] {
    margin: 0 0 0.5rem 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #dc2626;
}

.error-content p[b-0kkvy06say],
.empty-content p[b-0kkvy06say] {
    margin: 0.25rem 0;
    font-size: 1rem;
}

.error-hint[b-0kkvy06say] {
    margin-top: 1rem !important;
    color: #94a3b8;
    font-size: 0.875rem;
}

.empty-content svg[b-0kkvy06say] {
    color: #cbd5e1;
    margin-bottom: 1rem;
}

.empty-content h3[b-0kkvy06say] {
    margin: 0 0 0.5rem 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #475569;
}

/* Review Header Card */
.review-header-card[b-0kkvy06say] {
    background: #164e9b;
    border-radius: 12px;
    padding: 2rem;
    color: #ffffff;
}

.review-header-content[b-0kkvy06say] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.review-header-info[b-0kkvy06say] {
    flex: 1;
}

.client-name[b-0kkvy06say] {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    opacity: 0.8;
    margin-bottom: 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.review-header-card h1[b-0kkvy06say] {
    margin: 0 0 1rem 0;
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.3;
}

.review-meta[b-0kkvy06say] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.meta-item[b-0kkvy06say] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9375rem;
    opacity: 0.9;
}

.meta-item svg[b-0kkvy06say] {
    opacity: 0.8;
}

.review-status-badge[b-0kkvy06say] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
    white-space:nowrap;
}

.review-status-badge.status-pending[b-0kkvy06say] {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

.review-status-badge.status-approved[b-0kkvy06say] {
    background: #22c55e;
    color: #ffffff;
}

.review-status-badge.status-with-changes[b-0kkvy06say] {
    background: #f59e0b;
    color: #ffffff;
}

.review-status-badge.status-requesting[b-0kkvy06say] {
    background: #ef4444;
    color: #ffffff;
}

/* Wide Posts List */
.posts-list-wide[b-0kkvy06say] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Wide Post Card */
.post-card-wide[b-0kkvy06say] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    overflow: hidden;
    transition: border-color 0.2s ease;
    border-left: 4px solid transparent;
}

.post-card-wide.post-reviewed[b-0kkvy06say] {
    border-left-color: #22c55e;
}

.post-header-wide[b-0kkvy06say] {
    display: flex;
    gap: 1rem;
    padding: 1.25rem;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.post-date-badge[b-0kkvy06say] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 60px;
    padding: 0.5rem;
    background: #164e9b;
    color: #ffffff;
    border-radius: 8px;
    text-align: center;
}

.date-day[b-0kkvy06say] {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
}

.date-month[b-0kkvy06say] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 0.125rem;
}

.date-weekday[b-0kkvy06say] {
    font-size: 0.625rem;
    opacity: 0.8;
    margin-top: 0.25rem;
    text-transform: uppercase;
}

.post-header-content[b-0kkvy06say] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.post-title[b-0kkvy06say] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
}

.post-badges[b-0kkvy06say] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
    flex-wrap: wrap;
}

.scheduled-badge[b-0kkvy06say] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    background: #dcfce7;
    color: #166534;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 500;
}

.review-badge[b-0kkvy06say] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 500;
}

.review-badge.badge-approved[b-0kkvy06say] {
    background: #dcfce7;
    color: #166534;
}

.review-badge.badge-with-changes[b-0kkvy06say] {
    background: #fef3c7;
    color: #92400e;
}

.review-badge.badge-requesting[b-0kkvy06say] {
    background: #fee2e2;
    color: #991b1b;
}

/* Post Content Area - Side by Side Layout */
.post-content-area[b-0kkvy06say] {
    padding: 1.5rem;
}

.post-content-area.side-by-side[b-0kkvy06say] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.post-content-area.images-only .content-images[b-0kkvy06say],
.post-content-area.text-only .content-text[b-0kkvy06say] {
    max-width: 100%;
}

.content-images[b-0kkvy06say],
.content-text[b-0kkvy06say] {
    display: flex;
    flex-direction: column;
}

.content-section-label[b-0kkvy06say] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #64748b;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e2e8f0;
}

.content-section-label svg[b-0kkvy06say] {
    opacity: 0.7;
}

.image-content[b-0kkvy06say] {
    flex: 1;
    line-height: 1.5;
}

/* Strict image size limit - max 300px width, override inline styles */
.image-content img[b-0kkvy06say] {
    max-width: 300px !important;
    width: auto !important;
    height: auto !important;
    border-radius: 8px;
    margin-bottom: 0.75rem;
    display: block;
    cursor: pointer;
    transition: opacity 0.15s ease;
}

.image-content img:hover[b-0kkvy06say] {
    opacity: 0.85;
}

.image-content p[b-0kkvy06say] {
    line-height: 1.5;
}

/* Also target images that might be wrapped in other elements */
.image-content p img[b-0kkvy06say],
.image-content div img[b-0kkvy06say],
.image-content span img[b-0kkvy06say] {
    max-width: 300px !important;
    width: auto !important;
    height: auto !important;
    border-radius: 8px;
    margin-bottom: 0.75rem;
    display: block;
    cursor: pointer;
    transition: opacity 0.15s ease;
}

.text-content[b-0kkvy06say] {
    flex: 1;
    font-size: 1rem;
    line-height: 1.7;
    color: #374151;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.text-content p[b-0kkvy06say] {
    margin: 0 0 1rem 0;
}

.text-content p:last-child[b-0kkvy06say] {
    margin-bottom: 0;
}

.no-content-placeholder[b-0kkvy06say] {
    padding: 2rem;
    text-align: center;
    color: #94a3b8;
    background: #f8fafc;
    border-radius: 8px;
}

.no-content-placeholder p[b-0kkvy06say] {
    margin: 0;
}

/* Post Review Section */
.post-review-section[b-0kkvy06say] {
    padding: 1.25rem;
    background: #f1f5f9;
    border-top: 1px solid #e2e8f0;
}

.review-options[b-0kkvy06say] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.review-label[b-0kkvy06say] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;
}

.review-label-row[b-0kkvy06say] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Auto-save indicator */
.auto-save-indicator[b-0kkvy06say] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
    transition: opacity 0.3s ease;
}

.auto-save-indicator.saving[b-0kkvy06say] {
    color: #64748b;
}

.auto-save-indicator.saved[b-0kkvy06say] {
    color: #16a34a;
}

.auto-save-indicator.error[b-0kkvy06say] {
    color: #dc2626;
}

.spinner-tiny[b-0kkvy06say] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border: 1.5px solid transparent;
    border-top-color: currentColor;
    border-radius: 50%;
    animation: spin-b-0kkvy06say 0.8s linear infinite;
}

.review-buttons[b-0kkvy06say] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.review-option-btn[b-0kkvy06say] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    font-size: 0.875rem;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    transition: all 0.2s ease;
}

.review-option-btn:hover[b-0kkvy06say] {
    border-color: #cbd5e1;
    background: #f8fafc;
}

.review-option-btn.btn-option-approved:hover[b-0kkvy06say],
.review-option-btn.btn-option-approved.selected[b-0kkvy06say] {
    border-color: #22c55e;
    background: #dcfce7;
    color: #166534;
}

.review-option-btn.btn-option-with-changes:hover[b-0kkvy06say],
.review-option-btn.btn-option-with-changes.selected[b-0kkvy06say] {
    border-color: #f59e0b;
    background: #fef3c7;
    color: #92400e;
}

.review-option-btn.btn-option-requesting:hover[b-0kkvy06say],
.review-option-btn.btn-option-requesting.selected[b-0kkvy06say] {
    border-color: #ef4444;
    background: #fee2e2;
    color: #991b1b;
}

.changes-input[b-0kkvy06say] {
    margin-top: 1rem;
}

.changes-input label[b-0kkvy06say] {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 0.5rem;
}

/* Direct Edit Section */
.direct-edit-section[b-0kkvy06say] {
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px dashed #d1d5db;
}

.direct-edit-toggle[b-0kkvy06say] {
    display: inline-flex !important;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    color: #1b4a98 !important;
    cursor: pointer;
    user-select: none;
}

.direct-edit-toggle input[type="checkbox"][b-0kkvy06say] {
    width: 1rem;
    height: 1rem;
    accent-color: #1b4a98;
    cursor: pointer;
}

.direct-edit-toggle svg[b-0kkvy06say] {
    color: #1b4a98;
    flex-shrink: 0;
}

.direct-edit-editor[b-0kkvy06say] {
    margin-top: 0.75rem;
}

.direct-edit-hint[b-0kkvy06say] {
    font-size: 0.8125rem;
    color: #6b7280;
    margin: 0 0 0.5rem 0;
    font-style: italic;
}

/* Form Elements */
.form-control[b-0kkvy06say] {
    padding: 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 1rem;
    transition: border-color 0.2s ease;
    box-sizing: border-box;
}

.form-control:focus[b-0kkvy06say] {
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

textarea.form-control[b-0kkvy06say] {
    resize: vertical;
    min-height: 80px;
}

/* Buttons */
.btn[b-0kkvy06say] {
    padding: 0.75rem 1.5rem;
    font-size: 0.9375rem;
    font-weight: 600;
}

.btn-success[b-0kkvy06say] {
    background: #22c55e;
    color: #ffffff;
}

.btn-success:hover:not(:disabled)[b-0kkvy06say] {
    background: #16a34a;
}

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

/* Review Complete Card */
.review-complete-card[b-0kkvy06say] {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
    border-radius: 12px;
    padding: 3rem 2rem;
    text-align: center;
    color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(34, 197, 94, 0.3), 0 2px 4px -1px rgba(34, 197, 94, 0.2);
}

.review-complete-content svg[b-0kkvy06say] {
    margin-bottom: 1.5rem;
    opacity: 0.95;
}

.review-complete-content h3[b-0kkvy06say] {
    margin: 0 0 0.75rem 0;
    font-size: 1.75rem;
    font-weight: 700;
}

.review-complete-content > p[b-0kkvy06say] {
    margin: 0 0 1.5rem 0;
    font-size: 1.125rem;
    opacity: 0.95;
}

.success-details[b-0kkvy06say] {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
    margin-top: 1rem;
    display: inline-block;
}

.success-summary[b-0kkvy06say] {
    margin: 0 0 0.5rem 0;
    font-size: 1rem;
}

.success-summary strong[b-0kkvy06say] {
    font-size: 1.25rem;
}

.success-note[b-0kkvy06say] {
    margin: 0;
    font-size: 0.9375rem;
    opacity: 0.9;
}

/* Spinner */
.spinner-small[b-0kkvy06say] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid transparent;
    border-top-color: currentColor;
    border-radius: 50%;
    animation: spin-b-0kkvy06say 0.8s linear infinite;
}

/* Responsive - Stack sidebar below on smaller screens */
@media (max-width: 1100px) {
    .review-layout-wide[b-0kkvy06say] {
        grid-template-columns: 1fr;
        padding: 1rem;
    }

    .review-sidebar[b-0kkvy06say] {
        position: relative;
        top: 0;
        order: -1;
    }

    .review-main-wide[b-0kkvy06say] {
        order: 2;
    }

    .post-content-area.side-by-side[b-0kkvy06say] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .review-container[b-0kkvy06say],
    .review-layout-wide[b-0kkvy06say] {
        padding: 1rem 0.5rem;
    }

    .review-header-content[b-0kkvy06say] {
        flex-direction: column;
    }

    .review-header-card h1[b-0kkvy06say] {
        font-size: 1.5rem;
    }

    .review-meta[b-0kkvy06say] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .review-status-badge[b-0kkvy06say] {
        align-self: flex-start;
    }

    .post-header-wide[b-0kkvy06say] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .post-date-badge[b-0kkvy06say] {
        flex-direction: row;
        min-width: auto;
        padding: 0.5rem 1rem;
        gap: 0.5rem;
    }

    .date-weekday[b-0kkvy06say] {
        margin-top: 0;
        margin-left: 0.25rem;
    }

    .review-buttons[b-0kkvy06say] {
        flex-direction: column;
    }

    .review-option-btn[b-0kkvy06say] {
        width: 100%;
        justify-content: center;
    }

    /* On mobile, allow images to be slightly larger */
    .image-content img[b-0kkvy06say] {
        max-width: 100%;
    }
}

/* Image Lightbox */
.image-lightbox-backdrop[b-0kkvy06say] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.85);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    cursor: pointer;
}

.image-lightbox-content[b-0kkvy06say] {
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
    cursor: default;
}

.image-lightbox-content img[b-0kkvy06say] {
    display: block;
    max-width: 90vw;
    max-height: 85vh;
    width: auto;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.image-lightbox-close[b-0kkvy06say] {
    position: absolute;
    top: -40px;
    right: 0;
    background: none;
    border: none;
    color: #ffffff;
    cursor: pointer;
    padding: 4px;
    opacity: 0.8;
    transition: opacity 0.15s ease;
}

.image-lightbox-close:hover[b-0kkvy06say] {
    opacity: 1;
}

/* Internal Review Badge */
.internal-badge[b-0kkvy06say] {
    background: rgba(255, 193, 7, 0.2);
    padding: 0.25rem 0.75rem;
    border-radius: 4px;
    font-weight: 600;
    color: #ffd54f;
}

/* View Content Toggle */
.view-content-toggle[b-0kkvy06say] {
    display: flex;
    justify-content: center;
    margin: 1.5rem 0;
}

.btn-view-content[b-0kkvy06say] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #3b82f6;
    background: #ffffff;
    border: 2px solid #3b82f6;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-view-content:hover[b-0kkvy06say] {
    background: #eff6ff;
    color: #2563eb;
    border-color: #2563eb;
}

/* Read-Only Posts Indicator */
.read-only-posts[b-0kkvy06say] {
    position: relative;
}

.read-only-posts[b-0kkvy06say]::before {
    content: "Read-only view — this review has already been submitted.";
    display: block;
    background: #f0f7ff;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    font-size: 0.875rem;
    color: #1e3a5f;
    text-align: center;
}

.read-only-posts .post-review-section[b-0kkvy06say] {
    display: none;
}
/* /Components/Pages/Public/ProjectApproval.razor.rz.scp.css */
.signoff-page[b-plwjsmzset] {
    width: 100%;
}

.signoff-container[b-plwjsmzset] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 1.5rem 0;
    max-width: 700px;
    margin: 0 auto;
}

.signoff-card[b-plwjsmzset] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.signoff-header[b-plwjsmzset] {
    background: linear-gradient(135deg, #164e9b 0%, #1e40af 100%);
    padding: 2rem 2.5rem;
}

.signoff-header h1[b-plwjsmzset] {
    margin: 0 0 0.5rem 0;
    color: #ffffff;
    font-size: 1.5rem;
    font-weight: 600;
}

.signoff-subtitle[b-plwjsmzset] {
    margin: 0;
    color: rgba(255, 255, 255, 0.85);
    font-size: 1rem;
}

.signoff-body[b-plwjsmzset] {
    padding: 2rem 2.5rem;
}

/* Project Info */
.project-info[b-plwjsmzset] {
    margin-bottom: 2rem;
}

.project-name[b-plwjsmzset] {
    margin: 0 0 1.25rem 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #1e293b;
}

.custom-message[b-plwjsmzset] {
    background: #f0f7ff;
    border-left: 4px solid #164e9b;
    border-radius: 0 8px 8px 0;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
}

.custom-message p[b-plwjsmzset] {
    margin: 0;
    color: #374151;
    font-size: 0.95rem;
    line-height: 1.6;
}

.detail-section[b-plwjsmzset] {
    margin-bottom: 1.25rem;
    background: #f8fafc;
    border-radius: 8px;
    padding: 1rem 1.25rem;
}

.detail-section h3[b-plwjsmzset] {
    margin: 0 0 0.75rem 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.detail-section p[b-plwjsmzset] {
    margin: 0;
    color: #374151;
    font-size: 0.95rem;
    line-height: 1.6;
}

.description-content[b-plwjsmzset] {
    color: #374151;
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
}

.detail-grid[b-plwjsmzset] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
    background: #f8fafc;
    border-radius: 8px;
    padding: 1.25rem;
    margin-top: 1.25rem;
}

.detail-item[b-plwjsmzset] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-label[b-plwjsmzset] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.detail-value[b-plwjsmzset] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
}

/* Files Section */
.files-section[b-plwjsmzset] {
    margin-top: 1.5rem;
}

.files-section h3[b-plwjsmzset] {
    margin: 0 0 0.75rem 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.files-list[b-plwjsmzset] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.files-list .file-item[b-plwjsmzset] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background-color: #f8fafc;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.files-list .file-icon[b-plwjsmzset] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    background-color: #e0e7ff;
    color: #4f46e5;
    flex-shrink: 0;
}

.files-list .file-info[b-plwjsmzset] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.files-list .file-link[b-plwjsmzset] {
    font-weight: 500;
    font-size: 0.875rem;
    color: #1b4a98;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
}

.files-list .file-link:hover[b-plwjsmzset] {
    text-decoration: underline;
}

.files-list .file-size[b-plwjsmzset] {
    font-size: 0.75rem;
    color: #94a3b8;
}

/* Forms */
.approval-form[b-plwjsmzset],
.completion-form[b-plwjsmzset] {
    border-top: 1px solid #e2e8f0;
    padding-top: 2rem;
}

.approval-form h3[b-plwjsmzset],
.completion-form h3[b-plwjsmzset] {
    margin: 0 0 0.5rem 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
}

.form-instruction[b-plwjsmzset] {
    margin: 0 0 1.5rem 0;
    color: #64748b;
    font-size: 0.9rem;
    line-height: 1.5;
}

.form-group[b-plwjsmzset] {
    margin-bottom: 1.25rem;
}

.form-group label[b-plwjsmzset] {
    display: block;
    margin-bottom: 0.375rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
}

.form-control[b-plwjsmzset] {
    width: 100%;
    padding: 0.625rem 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.95rem;
    color: #1e293b;
    background: #ffffff;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}

.form-control:focus[b-plwjsmzset] {
    outline: none;
    border-color: #164e9b;
    box-shadow: 0 0 0 3px rgba(22, 78, 155, 0.1);
}

.form-control-textarea[b-plwjsmzset] {
    width: 100%;
    padding: 0.625rem 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.95rem;
    color: #1e293b;
    background: #ffffff;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
    resize: vertical;
    min-height: 80px;
    font-family: inherit;
}

.form-control-textarea:focus[b-plwjsmzset] {
    outline: none;
    border-color: #164e9b;
    box-shadow: 0 0 0 3px rgba(22, 78, 155, 0.1);
}

.form-hint[b-plwjsmzset] {
    margin: 0.375rem 0 0 0;
    font-size: 0.8rem;
    color: #94a3b8;
}

/* Buttons */
.btn-approve[b-plwjsmzset],
.btn-signoff[b-plwjsmzset] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 2rem;
    border: none;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-approve[b-plwjsmzset] {
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    color: #ffffff;
}

.btn-approve:hover:not(:disabled)[b-plwjsmzset] {
    background: linear-gradient(135deg, #047857 0%, #065f46 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.3);
}

.btn-signoff[b-plwjsmzset] {
    background: linear-gradient(135deg, #164e9b 0%, #1e40af 100%);
    color: #ffffff;
}

.btn-signoff:hover:not(:disabled)[b-plwjsmzset] {
    background: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(22, 78, 155, 0.3);
}

.btn-approve:disabled[b-plwjsmzset],
.btn-signoff:disabled[b-plwjsmzset] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* Status Cards */
.success-card .signoff-body[b-plwjsmzset],
.error-card .signoff-body[b-plwjsmzset] {
    text-align: center;
    padding: 3rem 2.5rem;
}

.success-content[b-plwjsmzset],
.error-content[b-plwjsmzset] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.success-icon[b-plwjsmzset] {
    color: #059669;
}

.error-icon[b-plwjsmzset] {
    color: #dc2626;
}

.success-content h2[b-plwjsmzset],
.error-content h2[b-plwjsmzset] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #1e293b;
}

.success-content p[b-plwjsmzset],
.error-content p[b-plwjsmzset] {
    margin: 0;
    color: #64748b;
    font-size: 1rem;
    line-height: 1.6;
    max-width: 400px;
}

.error-hint[b-plwjsmzset] {
    font-size: 0.875rem !important;
    color: #94a3b8 !important;
}

/* Error Message */
.error-message[b-plwjsmzset] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    margin-bottom: 1.25rem;
    color: #991b1b;
    font-size: 0.9rem;
}

/* Loading */
.loading-content[b-plwjsmzset] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 3rem 0;
}

.loading-content p[b-plwjsmzset] {
    margin: 0;
    color: #64748b;
    font-size: 1rem;
}

.spinner[b-plwjsmzset] {
    width: 40px;
    height: 40px;
    border: 3px solid #e2e8f0;
    border-top-color: #164e9b;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

.spinner-sm[b-plwjsmzset] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    display: inline-block;
}

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

/* Responsive */
@@media (max-width: 600px) {
    .signoff-header[b-plwjsmzset] {
        padding: 1.5rem;
    }

    .signoff-body[b-plwjsmzset] {
        padding: 1.5rem;
    }

    .detail-grid[b-plwjsmzset] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Public/ProjectCompletion.razor.rz.scp.css */
.signoff-page[b-iwipnrwfw2] {
    width: 100%;
}

.signoff-container[b-iwipnrwfw2] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 1.5rem 0;
    max-width: 700px;
    margin: 0 auto;
}

.signoff-card[b-iwipnrwfw2] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.signoff-header[b-iwipnrwfw2] {
    background: linear-gradient(135deg, #164e9b 0%, #1e40af 100%);
    padding: 2rem 2.5rem;
}

.signoff-header h1[b-iwipnrwfw2] {
    margin: 0 0 0.5rem 0;
    color: #ffffff;
    font-size: 1.5rem;
    font-weight: 600;
}

.signoff-subtitle[b-iwipnrwfw2] {
    margin: 0;
    color: rgba(255, 255, 255, 0.85);
    font-size: 1rem;
}

.signoff-body[b-iwipnrwfw2] {
    padding: 2rem 2.5rem;
}

/* Project Info */
.project-info[b-iwipnrwfw2] {
    margin-bottom: 2rem;
}

.project-name[b-iwipnrwfw2] {
    margin: 0 0 1.25rem 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #1e293b;
}

.custom-message[b-iwipnrwfw2] {
    background: #f0f7ff;
    border-left: 4px solid #164e9b;
    border-radius: 0 8px 8px 0;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
}

.custom-message p[b-iwipnrwfw2] {
    margin: 0;
    color: #374151;
    font-size: 0.95rem;
    line-height: 1.6;
}

.detail-section[b-iwipnrwfw2] {
    margin-bottom: 1.25rem;
    background: #f8fafc;
    border-radius: 8px;
    padding: 1rem 1.25rem;
}

.detail-section h3[b-iwipnrwfw2] {
    margin: 0 0 0.75rem 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.detail-section p[b-iwipnrwfw2] {
    margin: 0;
    color: #374151;
    font-size: 0.95rem;
    line-height: 1.6;
}

.description-content[b-iwipnrwfw2] {
    color: #374151;
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
}

.detail-grid[b-iwipnrwfw2] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
    background: #f8fafc;
    border-radius: 8px;
    padding: 1.25rem;
    margin-top: 1.25rem;
}

.detail-item[b-iwipnrwfw2] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-label[b-iwipnrwfw2] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.detail-value[b-iwipnrwfw2] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
}

/* Files Section */
.files-section[b-iwipnrwfw2] {
    margin-top: 1.5rem;
}

.files-section h3[b-iwipnrwfw2] {
    margin: 0 0 0.75rem 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.files-list[b-iwipnrwfw2] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.files-list .file-item[b-iwipnrwfw2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background-color: #f8fafc;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.files-list .file-icon[b-iwipnrwfw2] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    background-color: #e0e7ff;
    color: #4f46e5;
    flex-shrink: 0;
}

.files-list .file-info[b-iwipnrwfw2] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.files-list .file-link[b-iwipnrwfw2] {
    font-weight: 500;
    font-size: 0.875rem;
    color: #1b4a98;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
}

.files-list .file-link:hover[b-iwipnrwfw2] {
    text-decoration: underline;
}

.files-list .file-size[b-iwipnrwfw2] {
    font-size: 0.75rem;
    color: #94a3b8;
}

/* Forms */
.completion-form[b-iwipnrwfw2] {
    border-top: 1px solid #e2e8f0;
    padding-top: 2rem;
}

.completion-form h3[b-iwipnrwfw2] {
    margin: 0 0 0.5rem 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
}

.form-instruction[b-iwipnrwfw2] {
    margin: 0 0 1.5rem 0;
    color: #64748b;
    font-size: 0.9rem;
    line-height: 1.5;
}

.form-group[b-iwipnrwfw2] {
    margin-bottom: 1.25rem;
}

.form-group label[b-iwipnrwfw2] {
    display: block;
    margin-bottom: 0.375rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
}

.form-control[b-iwipnrwfw2] {
    width: 100%;
    padding: 0.625rem 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.95rem;
    color: #1e293b;
    background: #ffffff;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}

.form-control:focus[b-iwipnrwfw2] {
    outline: none;
    border-color: #164e9b;
    box-shadow: 0 0 0 3px rgba(22, 78, 155, 0.1);
}

.form-control-textarea[b-iwipnrwfw2] {
    width: 100%;
    padding: 0.625rem 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.95rem;
    color: #1e293b;
    background: #ffffff;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
    resize: vertical;
    min-height: 80px;
    font-family: inherit;
}

.form-control-textarea:focus[b-iwipnrwfw2] {
    outline: none;
    border-color: #164e9b;
    box-shadow: 0 0 0 3px rgba(22, 78, 155, 0.1);
}

.form-hint[b-iwipnrwfw2] {
    margin: 0.375rem 0 0 0;
    font-size: 0.8rem;
    color: #94a3b8;
}

/* Buttons */
.button-container[b-iwipnrwfw2] {
    text-align: center;
    margin-top: 1rem;
}

.btn-signoff[b-iwipnrwfw2] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 2rem;
    border: none;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    background: linear-gradient(135deg, #164e9b 0%, #1e40af 100%);
    color: #ffffff;
}

.btn-signoff:hover:not(:disabled)[b-iwipnrwfw2] {
    background: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(22, 78, 155, 0.3);
}

.btn-signoff:disabled[b-iwipnrwfw2] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* Status Cards */
.success-card .signoff-body[b-iwipnrwfw2],
.error-card .signoff-body[b-iwipnrwfw2] {
    text-align: center;
    padding: 3rem 2.5rem;
}

.success-content[b-iwipnrwfw2],
.error-content[b-iwipnrwfw2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.success-icon[b-iwipnrwfw2] {
    color: #059669;
}

.error-icon[b-iwipnrwfw2] {
    color: #dc2626;
}

.success-content h2[b-iwipnrwfw2],
.error-content h2[b-iwipnrwfw2] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #1e293b;
}

.success-content p[b-iwipnrwfw2],
.error-content p[b-iwipnrwfw2] {
    margin: 0;
    color: #64748b;
    font-size: 1rem;
    line-height: 1.6;
    max-width: 400px;
}

.error-hint[b-iwipnrwfw2] {
    font-size: 0.875rem !important;
    color: #94a3b8 !important;
}

/* Error Message */
.error-message[b-iwipnrwfw2] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    margin-bottom: 1.25rem;
    color: #991b1b;
    font-size: 0.9rem;
}

/* Google Review Section (Form) */
.google-review-section[b-iwipnrwfw2] {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    border-top: 1px solid #e2e8f0;
    text-align: center;
}

.google-review-prompt[b-iwipnrwfw2] {
    margin: 0 0 1rem 0;
    color: #475569;
    font-size: 0.9375rem;
    font-weight: 500;
}

.btn-google-review[b-iwipnrwfw2] {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.75rem 1.5rem;
    background: #ffffff;
    border: 2px solid #4285f4;
    border-radius: 8px;
    color: #4285f4;
    font-weight: 600;
    font-size: 0.9375rem;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
}

.btn-google-review:hover[b-iwipnrwfw2] {
    background: #4285f4;
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(66, 133, 244, 0.3);
}

.btn-google-review svg[b-iwipnrwfw2] {
    flex-shrink: 0;
}

/* Google Review Section (Success Page) */
.google-review-success[b-iwipnrwfw2] {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid #e2e8f0;
}

.google-review-message[b-iwipnrwfw2] {
    margin: 0 0 1.25rem 0;
    color: #475569;
    font-size: 1rem;
    font-weight: 500;
}

.btn-google-review-success[b-iwipnrwfw2] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 2rem;
    background: linear-gradient(135deg, #4285f4 0%, #34a853 100%);
    border: none;
    border-radius: 10px;
    color: #ffffff;
    font-weight: 600;
    font-size: 1rem;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(66, 133, 244, 0.3);
}

.btn-google-review-success:hover[b-iwipnrwfw2] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(66, 133, 244, 0.4);
}

.btn-google-review-success svg[b-iwipnrwfw2] {
    flex-shrink: 0;
}

/* Loading */
.loading-content[b-iwipnrwfw2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 3rem 0;
}

.loading-content p[b-iwipnrwfw2] {
    margin: 0;
    color: #64748b;
    font-size: 1rem;
}

.spinner[b-iwipnrwfw2] {
    width: 40px;
    height: 40px;
    border: 3px solid #e2e8f0;
    border-top-color: #164e9b;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

.spinner-sm[b-iwipnrwfw2] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    display: inline-block;
}

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

/* Responsive */
@@media (max-width: 600px) {
    .signoff-header[b-iwipnrwfw2] {
        padding: 1.5rem;
    }

    .signoff-body[b-iwipnrwfw2] {
        padding: 1.5rem;
    }

    .detail-grid[b-iwipnrwfw2] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/ReleaseNotes/WhatsNew.razor.rz.scp.css */
/* Page Layout */
.page-container[b-x4p1mdt9qw] {
    max-width: 800px;
    margin: 0 auto;
    padding: 1.5rem;
}

.page-header[b-x4p1mdt9qw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

.page-title[b-x4p1mdt9qw] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a1a2e;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.page-title svg[b-x4p1mdt9qw] {
    color: #1b4a98;
}

/* Loading & Empty */
.loading-state[b-x4p1mdt9qw] {
    text-align: center;
    padding: 3rem;
    color: #6b7280;
}

.spinner[b-x4p1mdt9qw] {
    width: 32px;
    height: 32px;
    border: 3px solid #e5e7eb;
    border-top: 3px solid #1b4a98;
    border-radius: 50%;
    animation: spin-b-x4p1mdt9qw 0.8s linear infinite;
    margin: 0 auto 1rem;
}

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

.empty-state[b-x4p1mdt9qw] {
    text-align: center;
    padding: 3rem 1rem;
    color: #9ca3af;
}

.empty-state svg[b-x4p1mdt9qw] {
    margin-bottom: 0.75rem;
    opacity: 0.4;
}

.empty-state p[b-x4p1mdt9qw] {
    font-size: 0.9rem;
    margin: 0;
}

/* Release Timeline */
.release-timeline[b-x4p1mdt9qw] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.release-card[b-x4p1mdt9qw] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    transition: border-color 0.15s;
}

.release-card.latest[b-x4p1mdt9qw] {
    border-color: #1b4a98;
    border-width: 2px;
}

.release-header[b-x4p1mdt9qw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.release-version[b-x4p1mdt9qw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.date-badge[b-x4p1mdt9qw] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #1b4a98;
    background: #eef2ff;
    padding: 0.2rem 0.6rem;
    border-radius: 6px;
}

.latest-badge[b-x4p1mdt9qw] {
    font-size: 0.65rem;
    font-weight: 700;
    color: #fff;
    background: #1b4a98;
    padding: 2px 8px;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.release-title[b-x4p1mdt9qw] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #1a1a2e;
    margin-bottom: 0.75rem;
}

/* Change Items */
.change-list[b-x4p1mdt9qw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.change-item[b-x4p1mdt9qw] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #374151;
    line-height: 1.5;
}

.change-type[b-x4p1mdt9qw] {
    flex-shrink: 0;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-top: 2px;
}

.change-type-feature[b-x4p1mdt9qw] {
    background: #dcfce7;
    color: #166534;
}

.change-type-fix[b-x4p1mdt9qw] {
    background: #fee2e2;
    color: #991b1b;
}

.change-type-improvement[b-x4p1mdt9qw] {
    background: #dbeafe;
    color: #1e40af;
}

.change-desc[b-x4p1mdt9qw] {
    flex: 1;
}

/* Responsive */
@media (max-width: 640px) {
    .release-header[b-x4p1mdt9qw] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }
}
/* /Components/Pages/Reports/PayrollReport.razor.rz.scp.css */
/* Report Filters */
.report-filters[b-dg0a9ugkh1] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
}

.filter-row[b-dg0a9ugkh1] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
}

.filter-group[b-dg0a9ugkh1] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    min-width: 160px;
}

.filter-group label[b-dg0a9ugkh1] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.filter-action[b-dg0a9ugkh1] {
    margin-left: auto;
}

/* Report Summary */
.report-summary[b-dg0a9ugkh1] {
    margin-bottom: 1rem;
    font-size: 0.9rem;
    color: #6c757d;
}

/* Table */
.report-table-wrapper[b-dg0a9ugkh1] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
}

.report-table[b-dg0a9ugkh1] {
    width: 100%;
    border-collapse: collapse;
}

.report-table thead th[b-dg0a9ugkh1] {
    background: #f8f9fa;
    padding: 0.75rem 1rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    border-bottom: 2px solid #e5e7eb;
    text-align: left;
}

.report-table tbody td[b-dg0a9ugkh1] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #f0f0f0;
    font-size: 0.9rem;
    vertical-align: top;
}

.report-table .data-row:hover[b-dg0a9ugkh1] {
    background: #f8f9fa;
}

.report-table .data-row.expanded[b-dg0a9ugkh1] {
    background: #f0f4ff;
}

.col-expand[b-dg0a9ugkh1] {
    width: 40px;
    text-align: center;
}

.col-id[b-dg0a9ugkh1] {
    width: 60px;
}

.col-hours[b-dg0a9ugkh1] {
    width: 120px;
}

/* Expand Button */
.expand-btn[b-dg0a9ugkh1] {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem;
    color: #6c757d;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: color 0.15s;
}

.expand-btn:hover[b-dg0a9ugkh1] {
    color: #1b4a98;
}

.expand-icon[b-dg0a9ugkh1] {
    transition: transform 0.2s ease;
}

.expand-icon.rotated[b-dg0a9ugkh1] {
    transform: rotate(90deg);
}

/* OT Badge */
.ot-badge[b-dg0a9ugkh1] {
    background: #fef3cd;
    color: #856404;
    padding: 0.15rem 0.5rem;
    border-radius: 6px;
    font-weight: 600;
    font-size: 0.85rem;
}

/* Additional Pay */
.add-pay-item[b-dg0a9ugkh1] {
    margin-bottom: 0.35rem;
}

.add-pay-desc[b-dg0a9ugkh1] {
    font-weight: 600;
}

.add-pay-amount[b-dg0a9ugkh1] {
    margin-left: 0.35rem;
    color: #16a34a;
    font-weight: 600;
}

.add-pay-note[b-dg0a9ugkh1] {
    font-size: 0.8rem;
    font-style: italic;
    color: #6c757d;
}

.add-pay-total[b-dg0a9ugkh1] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.4rem;
    padding-top: 0.4rem;
    border-top: 1px solid #e5e7eb;
}

.add-pay-total-label[b-dg0a9ugkh1] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.add-pay-total-amount[b-dg0a9ugkh1] {
    font-weight: 700;
    color: #16a34a;
}

/* Detail Row */
.detail-row td[b-dg0a9ugkh1] {
    background: #f8faff;
    border-bottom: 2px solid #e5e7eb;
    padding: 1rem 1.5rem !important;
}

.detail-grid[b-dg0a9ugkh1] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin-bottom: 1rem;
}

.detail-item[b-dg0a9ugkh1] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.detail-label[b-dg0a9ugkh1] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.detail-value[b-dg0a9ugkh1] {
    font-size: 0.95rem;
    font-weight: 500;
}

/* OT Notes */
.ot-notes[b-dg0a9ugkh1] {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e5e7eb;
}

.ot-notes h6[b-dg0a9ugkh1] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    margin-bottom: 0.5rem;
}

.ot-notes-pre[b-dg0a9ugkh1] {
    background: #f1f3f5;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    font-size: 0.8rem;
    line-height: 1.5;
    white-space: pre-wrap;
    word-wrap: break-word;
    max-height: 300px;
    overflow-y: auto;
    margin: 0;
}

/* Empty State */
.empty-state[b-dg0a9ugkh1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    text-align: center;
    color: #6c757d;
}

.empty-state svg[b-dg0a9ugkh1] {
    margin-bottom: 1rem;
    opacity: 0.5;
}
/* /Components/Pages/Reports/WorkLogsByClient.razor.rz.scp.css */
/* Report Filters */
.report-filters[b-we7skwy3hv] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
}

.filter-row[b-we7skwy3hv] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
}

.filter-group[b-we7skwy3hv] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    min-width: 160px;
}

.filter-group label[b-we7skwy3hv] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.filter-action[b-we7skwy3hv] {
    margin-left: auto;
}

.filter-action-buttons[b-we7skwy3hv] {
    display: flex;
    gap: 0.5rem;
}

/* Bulk Generation Status Banner */
.bulk-status-banner[b-we7skwy3hv] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: 10px;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
}

.bulk-status-info[b-we7skwy3hv] {
    background: #e8f0fe;
    border: 1px solid #b6d4fe;
    color: #1b4a98;
}

.bulk-status-success[b-we7skwy3hv] {
    background: #d1f2eb;
    border: 1px solid #a3e4d7;
    color: #1a7a5c;
}

.bulk-status-warning[b-we7skwy3hv] {
    background: #fef3cd;
    border: 1px solid #ffc107;
    color: #856404;
}

.bulk-status-content[b-we7skwy3hv] {
    flex: 1;
}

.bulk-status-summary[b-we7skwy3hv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    font-size: 0.95rem;
    margin-bottom: 0.35rem;
}

.bulk-stat-sep[b-we7skwy3hv] {
    color: #adb5bd;
}

.bulk-stat-error[b-we7skwy3hv] {
    color: #dc3545;
}

.bulk-status-path[b-we7skwy3hv] {
    font-size: 0.8rem;
    color: #6c757d;
}

.bulk-status-path code[b-we7skwy3hv] {
    background: rgba(0, 0, 0, 0.06);
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    font-size: 0.78rem;
}

.bulk-error-list[b-we7skwy3hv] {
    margin: 0.5rem 0 0 0;
    padding-left: 1.25rem;
    font-size: 0.82rem;
    color: #dc3545;
}

.bulk-zip-download[b-we7skwy3hv] {
    margin-top: 0.35rem;
}

.bulk-zip-link[b-we7skwy3hv] {
    display: inline-flex;
    align-items: center;
    font-size: 0.85rem;
    font-weight: 600;
    color: #1b4a98;
    text-decoration: none;
    cursor: pointer;
}

.bulk-zip-link:hover[b-we7skwy3hv] {
    text-decoration: underline;
    color: #143a78;
}

/* Date Mode Toggle */
.date-mode-toggle[b-we7skwy3hv] {
    display: flex;
    gap: 0;
}

.date-mode-toggle .btn[b-we7skwy3hv] {
    border-radius: 0;
    font-size: 0.8rem;
    padding: 0.375rem 0.75rem;
}

.date-mode-toggle .btn:first-child[b-we7skwy3hv] {
    border-radius: 6px 0 0 6px;
}

.date-mode-toggle .btn:last-child[b-we7skwy3hv] {
    border-radius: 0 6px 6px 0;
}

/* Report Header Info */
.report-header-info[b-we7skwy3hv] {
    margin-bottom: 1rem;
}

.report-header-row[b-we7skwy3hv] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.report-header-info h2[b-we7skwy3hv] {
    margin: 0 0 0.25rem 0;
    font-size: 1.35rem;
    font-weight: 600;
    color: #1b4a98;
}

.report-date-range[b-we7skwy3hv] {
    margin: 0;
    color: #6c757d;
    font-size: 0.9rem;
}

/* Report Summary Cards */
.report-summary[b-we7skwy3hv] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.summary-card[b-we7skwy3hv] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 1rem 1.5rem;
    min-width: 140px;
    flex: 1;
}

.summary-label[b-we7skwy3hv] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    margin-bottom: 0.25rem;
}

.summary-value[b-we7skwy3hv] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1b4a98;
}

/* Project Groups */
.project-group[b-we7skwy3hv] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    margin-bottom: 1.25rem;
    overflow: hidden;
}

.project-group-header[b-we7skwy3hv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    background: linear-gradient(135deg, #f8f9fc 0%, #eef2f9 100%);
    border-bottom: 1px solid #e5e7eb;
}

.project-group-title[b-we7skwy3hv] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: #1b4a98;
}

.project-group-count[b-we7skwy3hv] {
    font-size: 0.8rem;
    color: #6c757d;
    background: #fff;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
}

/* Table Container */
.project-group .table-container[b-we7skwy3hv] {
    padding: 0;
}

.project-group .data-table[b-we7skwy3hv] {
    margin: 0;
    border-radius: 0;
}

/* Date Cell */
.date-cell[b-we7skwy3hv] {
    white-space: nowrap;
    font-size: 0.875rem;
}

/* Task Cell */
.task-cell[b-we7skwy3hv] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* Sub Project Badge */
.sub-project-badge[b-we7skwy3hv] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    color: #6c757d;
    background: #f0f2f5;
    padding: 0.1rem 0.5rem;
    border-radius: 4px;
    width: fit-content;
}

/* Staff Cell */
.staff-cell[b-we7skwy3hv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.staff-initials[b-we7skwy3hv] {
    width: 26px;
    height: 26px;
    border-radius: 6px;
    background: linear-gradient(135deg, #1b4a98 0%, #2d6fd6 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 600;
    flex-shrink: 0;
}

.staff-name[b-we7skwy3hv] {
    font-size: 0.85rem;
}

/* Project Totals Row */
.project-totals-row[b-we7skwy3hv] {
    background: #f8f9fc;
}

.project-totals-row td[b-we7skwy3hv] {
    border-top: 2px solid #e5e7eb;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

/* Responsive */
@media (max-width: 768px) {
    .filter-row[b-we7skwy3hv] {
        flex-direction: column;
    }

    .filter-group[b-we7skwy3hv] {
        min-width: 100%;
    }

    .filter-action[b-we7skwy3hv] {
        margin-left: 0;
    }

    .report-summary[b-we7skwy3hv] {
        flex-direction: column;
    }

    .summary-card[b-we7skwy3hv] {
        min-width: 100%;
    }
}
/* /Components/Pages/StaffTime/Expenses.razor.rz.scp.css */
/* === Page Header === */
.page-header[b-avbf3pds70] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header-left h1[b-avbf3pds70] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #1a1a2e;
}

.page-subtitle[b-avbf3pds70] {
    color: #6b7280;
    margin: 0.25rem 0 0;
    font-size: 0.9rem;
}

/* === Loading === */
.loading-container[b-avbf3pds70] {
    display: flex;
    justify-content: center;
    padding: 3rem 0;
}

/* === Filter Card === */
.filter-card[b-avbf3pds70] {
    background: #fff;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e5e7eb;
}

.filter-row[b-avbf3pds70] {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
    flex-wrap: wrap;
}

.filter-field[b-avbf3pds70] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 160px;
}

    .filter-field label[b-avbf3pds70] {
        font-size: 0.8rem;
        font-weight: 600;
        color: #6b7280;
        text-transform: uppercase;
        letter-spacing: 0.025em;
    }

.filter-field-search[b-avbf3pds70] {
    flex: 1;
    min-width: 200px;
}

/* === Summary Bar === */
.summary-bar[b-avbf3pds70] {
    display: flex;
    gap: 1.5rem;
    padding: 0.75rem 1.25rem;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    border-radius: 10px;
    margin-bottom: 1.25rem;
    font-size: 0.9rem;
}

.summary-item strong[b-avbf3pds70] {
    font-weight: 700;
}

/* === Table Card === */
.table-card[b-avbf3pds70] {
    background: #fff;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e5e7eb;
}

.table[b-avbf3pds70] {
    margin-bottom: 0;
}

    .table thead th[b-avbf3pds70] {
        background: #f8f9fa;
        font-size: 0.8rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.025em;
        color: #6b7280;
        padding: 0.75rem;
        border-bottom: 2px solid #e5e7eb;
        white-space: nowrap;
    }

    .table tbody td[b-avbf3pds70] {
        padding: 0.75rem;
        vertical-align: middle;
        border-bottom: 1px solid #f0f0f0;
        font-size: 0.9rem;
    }

    .table tbody tr:hover[b-avbf3pds70] {
        background-color: #f8f9ff;
    }

.sortable[b-avbf3pds70] {
    cursor: pointer;
    user-select: none;
}

    .sortable:hover[b-avbf3pds70] {
        color: #4f46e5;
    }

.sort-icon[b-avbf3pds70] {
    font-size: 0.7rem;
    margin-left: 0.25rem;
}

.description-cell[b-avbf3pds70] {
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* === Badges === */
.badge-approved[b-avbf3pds70] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.6rem;
    font-size: 0.78rem;
    font-weight: 600;
    border-radius: 20px;
    background: #d1fae5;
    color: #065f46;
}

.badge-pending[b-avbf3pds70] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.6rem;
    font-size: 0.78rem;
    font-weight: 600;
    border-radius: 20px;
    background: #fef3c7;
    color: #92400e;
}

.badge-billing[b-avbf3pds70] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.6rem;
    font-size: 0.78rem;
    font-weight: 600;
    border-radius: 20px;
    background: #dbeafe;
    color: #1e40af;
}

/* === Receipt Link === */
.receipt-link[b-avbf3pds70] {
    color: #4f46e5;
    transition: color 0.2s;
}

    .receipt-link:hover[b-avbf3pds70] {
        color: #3730a3;
    }

/* === Action Buttons === */
.btn-icon[b-avbf3pds70] {
    background: none;
    border: none;
    padding: 0.35rem;
    border-radius: 6px;
    cursor: pointer;
    color: #6b7280;
    transition: all 0.2s;
}

    .btn-icon:hover[b-avbf3pds70] {
        background: #f0f0f5;
        color: #4f46e5;
    }

.btn-icon-danger:hover[b-avbf3pds70] {
    background: #fef2f2;
    color: #dc2626;
}

/* === Empty State === */
.empty-state[b-avbf3pds70] {
    text-align: center;
    padding: 3rem 1rem;
    color: #9ca3af;
}

.empty-icon[b-avbf3pds70] {
    margin-bottom: 1rem;
    opacity: 0.5;
}

.empty-state p[b-avbf3pds70] {
    font-size: 1rem;
    margin: 0;
}

/* === Modal === */
.expense-backdrop[b-avbf3pds70] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.expense-modal[b-avbf3pds70] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 600px;
    max-height: 90vh;
    overflow-y: auto;
}

.expense-modal-sm[b-avbf3pds70] {
    max-width: 450px;
}

.modal-header[b-avbf3pds70] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

    .modal-header h5[b-avbf3pds70] {
        margin: 0;
        font-size: 1.1rem;
        font-weight: 700;
        color: #1a1a2e;
    }

.modal-close[b-avbf3pds70] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

    .modal-close:hover[b-avbf3pds70] {
        color: #1a1a2e;
    }

.modal-body[b-avbf3pds70] {
    padding: 1.5rem;
}

.modal-footer[b-avbf3pds70] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e5e7eb;
}

.modal-actions[b-avbf3pds70] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1.25rem;
}

/* === Photo Upload Zone === */
.photo-upload-zone[b-avbf3pds70] {
    border: 2px dashed #d1d5db;
    border-radius: 8px;
    padding: 0.75rem;
    transition: border-color 0.2s;
}

    .photo-upload-zone:hover[b-avbf3pds70] {
        border-color: #4f46e5;
    }

.photo-input[b-avbf3pds70] {
    width: 100%;
}

.photo-selected[b-avbf3pds70] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
    padding: 0.4rem 0.75rem;
    background: #f0fdf4;
    border-radius: 6px;
    font-size: 0.85rem;
    color: #166534;
}

.photo-file-name[b-avbf3pds70] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.photo-remove[b-avbf3pds70] {
    background: none;
    border: none;
    color: #dc2626;
    font-size: 1.1rem;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.entry-hint[b-avbf3pds70] {
    font-size: 0.78rem;
    color: #9ca3af;
    margin-top: 0.25rem;
    display: block;
}

/* === Responsive === */
@media (max-width: 768px) {
    .page-header[b-avbf3pds70] {
        flex-direction: column;
    }

    .filter-row[b-avbf3pds70] {
        flex-direction: column;
    }

    .filter-field[b-avbf3pds70] {
        min-width: 100%;
    }

    .summary-bar[b-avbf3pds70] {
        flex-direction: column;
        gap: 0.5rem;
    }

    .description-cell[b-avbf3pds70] {
        max-width: 150px;
    }

    .expense-modal[b-avbf3pds70] {
        width: 95%;
    }
}
/* /Components/Pages/StaffTime/MyCommissions.razor.rz.scp.css */
.filter-bar[b-zw99d0fr2q] {
    display: flex;
    gap: 16px;
    align-items: flex-end;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.filter-group[b-zw99d0fr2q] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.filter-group label[b-zw99d0fr2q] {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.filter-group .form-control-sm[b-zw99d0fr2q] {
    min-width: 140px;
}

.rate-cell[b-zw99d0fr2q] {
    font-size: 13px;
    color: #6b7280;
    white-space: nowrap;
}

.commission-table-container[b-zw99d0fr2q] {
    overflow-x: auto;
    border-radius: 10px;
    box-shadow: 0 1px 6px rgba(0,0,0,0.07);
}

.commission-table[b-zw99d0fr2q] {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    font-size: 14px;
}

.commission-table thead tr[b-zw99d0fr2q] {
    background: #f8f9fa;
    border-bottom: 2px solid #e9ecef;
}

.commission-table th[b-zw99d0fr2q] {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

.commission-table td[b-zw99d0fr2q] {
    padding: 12px 16px;
    border-bottom: 1px solid #f0f0f0;
    color: #374151;
    vertical-align: middle;
}

.commission-table tbody tr:last-child td[b-zw99d0fr2q] {
    border-bottom: none;
}

.commission-table tbody tr:hover[b-zw99d0fr2q] {
    background: #f8f9fa;
}

.project-cell[b-zw99d0fr2q] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.project-name[b-zw99d0fr2q] {
    font-weight: 500;
}

.customer-name[b-zw99d0fr2q] {
    font-size: 12px;
    color: #6b7280;
}

.amount-cell[b-zw99d0fr2q] {
    font-weight: 600;
}

.note-cell[b-zw99d0fr2q] {
    max-width: 220px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #6b7280;
}

.badge[b-zw99d0fr2q] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.badge-pending[b-zw99d0fr2q] {
    background: #fef9c3;
    color: #a16207;
}

.badge-approved[b-zw99d0fr2q] {
    background: #d1fae5;
    color: #065f46;
}

.badge-rejected[b-zw99d0fr2q] {
    background: #fee2e2;
    color: #991b1b;
}

/* Commission Modal */
.commission-backdrop[b-zw99d0fr2q] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.commission-modal[b-zw99d0fr2q] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 520px;
    max-height: 90vh;
    overflow-y: auto;
}

.commission-modal .modal-body[b-zw99d0fr2q] {
    padding: 20px 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.commission-modal .form-group[b-zw99d0fr2q] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 0;
}

.commission-modal .form-group label[b-zw99d0fr2q] {
    font-weight: 600;
    font-size: 13px;
    color: #374151;
}

.commission-modal .form-row[b-zw99d0fr2q] {
    display: grid;
    gap: 16px;
}

.commission-modal .form-row-2[b-zw99d0fr2q] {
    grid-template-columns: 1fr 1fr;
}

.commission-modal .input-prefix-group[b-zw99d0fr2q] {
    display: flex;
    align-items: center;
    border: 1px solid #ced4da;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
}

.commission-modal .input-prefix-group .form-control[b-zw99d0fr2q] {
    border: none;
    border-radius: 0;
    box-shadow: none;
    flex: 1;
}

.commission-modal .input-prefix-group .form-control:focus[b-zw99d0fr2q] {
    outline: none;
    box-shadow: none;
}

.commission-modal .input-prefix[b-zw99d0fr2q],
.commission-modal .input-suffix[b-zw99d0fr2q] {
    padding: 6px 10px;
    background: #f8f9fa;
    color: #6b7280;
    font-size: 14px;
    white-space: nowrap;
    border-left: 1px solid #ced4da;
    border-right: none;
}

.commission-modal .input-prefix[b-zw99d0fr2q] {
    border-left: none;
    border-right: 1px solid #ced4da;
}

.commission-modal .input-suffix[b-zw99d0fr2q] {
    border-left: 1px solid #ced4da;
    border-right: none;
}

/* Adornment inputs — symbol sits inside the input via padding + absolute positioning */
.commission-modal .input-adornment-wrap[b-zw99d0fr2q] {
    position: relative;
    display: flex;
    align-items: center;
}

.commission-modal .input-adornment[b-zw99d0fr2q] {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: #6b7280;
    font-size: 14px;
    pointer-events: none;
    z-index: 1;
    line-height: 1;
}

.commission-modal .input-adornment-left[b-zw99d0fr2q] {
    left: 10px;
}

.commission-modal .input-adornment-right[b-zw99d0fr2q] {
    right: 10px;
}

.commission-modal .input-with-left-adornment[b-zw99d0fr2q] {
    padding-left: 24px;
}

.commission-modal .input-with-right-adornment[b-zw99d0fr2q] {
    padding-right: 28px;
}

.commission-modal .field-hint[b-zw99d0fr2q] {
    font-size: 11px;
    color: #9ca3af;
    margin-top: 2px;
}
/* /Components/Pages/StaffTime/PtoLogs.razor.rz.scp.css */
/* Balance Bar */
.pto-balance-bar[b-475xb6p31v] {
    display: flex;
    gap: 1.5rem;
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    padding: 1rem 1.5rem;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
}

.balance-item[b-475xb6p31v] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.balance-label[b-475xb6p31v] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.balance-value[b-475xb6p31v] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #374151;
}

.balance-value.primary[b-475xb6p31v] {
    color: #1b4a98;
    font-size: 1.3rem;
}

/* Accrual Forecast */
.accrual-forecast[b-475xb6p31v] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    padding: 1rem 1.5rem;
    margin-bottom: 1.25rem;
}

.forecast-header[b-475xb6p31v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.75rem;
}

.forecast-header svg[b-475xb6p31v] {
    color: #1b4a98;
    flex-shrink: 0;
}

.hire-date[b-475xb6p31v] {
    margin-left: auto;
    font-size: 0.75rem;
    font-weight: 400;
    color: #9ca3af;
}

.forecast-items[b-475xb6p31v] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.forecast-item[b-475xb6p31v] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.5rem 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.forecast-type[b-475xb6p31v] {
    flex-shrink: 0;
}

.forecast-detail[b-475xb6p31v] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1;
}

.forecast-amount[b-475xb6p31v] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #374151;
}

.forecast-date[b-475xb6p31v] {
    font-size: 0.75rem;
    color: #6b7280;
}

.forecast-countdown[b-475xb6p31v] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #1b4a98;
    white-space: nowrap;
}

/* Tabs */
.pto-tabs[b-475xb6p31v] {
    display: flex;
    gap: 0;
    border-bottom: 2px solid #e9ecef;
    margin-bottom: 0;
}

.pto-tab[b-475xb6p31v] {
    padding: 0.625rem 1.25rem;
    font-size: 0.85rem;
    font-weight: 500;
    color: #6b7280;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    transition: all 0.15s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.pto-tab:hover[b-475xb6p31v] {
    color: #1b4a98;
}

.pto-tab.active[b-475xb6p31v] {
    color: #1b4a98;
    border-bottom-color: #1b4a98;
    font-weight: 600;
}

.tab-badge[b-475xb6p31v] {
    font-size: 0.7rem;
    font-weight: 600;
    background: #fbbf24;
    color: #78350f;
    padding: 1px 7px;
    border-radius: 10px;
    line-height: 1.4;
}

.tab-badge.upcoming[b-475xb6p31v] {
    background: #d1fae5;
    color: #065f46;
}

/* Tab Content */
.pto-tab-content[b-475xb6p31v] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-top: none;
    border-radius: 0 0 10px 10px;
    padding: 1rem 0 0 0;
    min-height: 200px;
}

.empty-tab[b-475xb6p31v] {
    text-align: center;
    padding: 2.5rem 1rem;
    color: #9ca3af;
    font-size: 0.9rem;
}

/* Table inside tabs */
.pto-table-container[b-475xb6p31v] {
    overflow-x: auto;
}

.pto-table-container .data-table[b-475xb6p31v] {
    margin-bottom: 0;
    border: none;
}

.pto-table-container .data-table thead th[b-475xb6p31v] {
    background: #f8f9fa;
    font-size: 0.75rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.5rem 1rem;
    border-bottom: 1px solid #e9ecef;
}

.pto-table-container .data-table tbody td[b-475xb6p31v] {
    padding: 0.625rem 1rem;
    font-size: 0.85rem;
    color: #374151;
    border-bottom: 1px solid #f3f4f6;
}

.hours-cell[b-475xb6p31v] {
    font-weight: 600;
    color: #dc2626;
}

.hours-cell.accrual[b-475xb6p31v] {
    color: #059669;
}

.description-cell[b-475xb6p31v] {
    max-width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.badge-type[b-475xb6p31v] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
    background: #e8f0fe;
    color: #1b4a98;
}

/* Request Modal */
.pto-request-backdrop[b-475xb6p31v] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.pto-request-modal[b-475xb6p31v] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 520px;
    max-height: 90vh;
    overflow-y: auto;
}

.pto-request-modal .modal-header[b-475xb6p31v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.pto-request-modal .modal-header h3[b-475xb6p31v] {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
    color: #1a1a2e;
}

.pto-request-modal .modal-close[b-475xb6p31v] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    line-height: 1;
    padding: 0;
}

.pto-request-modal .modal-body[b-475xb6p31v] {
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Balance callout inside modal */
.type-balance-callout[b-475xb6p31v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0.875rem;
    background: #e8f0fe;
    border-radius: 8px;
    font-size: 0.8125rem;
    color: #1b4a98;
    line-height: 1.4;
}

.type-balance-callout svg[b-475xb6p31v] {
    flex-shrink: 0;
    color: #1b4a98;
}

.type-balance-callout .balance-hours[b-475xb6p31v] {
    color: #6b7280;
    font-weight: 400;
}

/* Mode Toggle */
.mode-toggle[b-475xb6p31v] {
    display: flex;
    gap: 0;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}

.mode-btn[b-475xb6p31v] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.5rem 0.5rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: #6b7280;
    background: #f8f9fa;
    border: none;
    border-right: 1px solid #dee2e6;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.mode-btn:last-child[b-475xb6p31v] {
    border-right: none;
}

.mode-btn:hover[b-475xb6p31v] {
    background: #e9ecef;
    color: #374151;
}

.mode-btn.active[b-475xb6p31v] {
    background: #1b4a98;
    color: #fff;
}

.mode-btn.active svg[b-475xb6p31v] {
    stroke: #fff;
}

/* Hours summary */
.hours-summary[b-475xb6p31v] {
    text-align: center;
    font-size: 0.8rem;
    color: #6b7280;
    background: #f8f9fa;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-weight: 500;
}

.pto-request-modal .modal-footer[b-475xb6p31v] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
}

.form-row[b-475xb6p31v] {
    display: flex;
    gap: 1rem;
}

.form-row .form-group[b-475xb6p31v] {
    flex: 1;
}

.form-group label[b-475xb6p31v] {
    display: block;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.375rem;
}

.required[b-475xb6p31v] {
    color: #dc2626;
}

.validation-message[b-475xb6p31v] {
    font-size: 0.75rem;
    color: #dc2626;
    margin-top: 0.25rem;
    display: block;
}

/* Filter bar */
.filter-bar[b-475xb6p31v] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
}

.filter-group[b-475xb6p31v] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.filter-group label[b-475xb6p31v] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.filter-group .form-select[b-475xb6p31v] {
    min-width: 220px;
    font-size: 0.875rem;
}

/* Delete button */
.actions-cell[b-475xb6p31v] {
    width: 50px;
    text-align: center;
}

.btn-icon[b-475xb6p31v] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: none;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-icon-danger[b-475xb6p31v] {
    color: #9ca3af;
}

.btn-icon-danger:hover[b-475xb6p31v] {
    background: #fef2f2;
    color: #dc2626;
}

.btn-icon-danger:disabled[b-475xb6p31v] {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Delete Modal */
.pto-delete-backdrop[b-475xb6p31v] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.pto-delete-modal[b-475xb6p31v] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 480px;
    max-height: 90vh;
    overflow-y: auto;
}

.pto-delete-modal .modal-header[b-475xb6p31v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.pto-delete-modal .modal-header h3[b-475xb6p31v] {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0;
    color: #1a1a2e;
}

.pto-delete-modal .modal-close[b-475xb6p31v] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    line-height: 1;
    padding: 0;
}

.pto-delete-modal .modal-body[b-475xb6p31v] {
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pto-delete-modal .modal-body p[b-475xb6p31v] {
    margin: 0;
    font-size: 0.9rem;
    color: #374151;
}

.pto-delete-modal .modal-footer[b-475xb6p31v] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
}

.delete-summary[b-475xb6p31v] {
    padding: 0.75rem;
    background: #f8f9fa;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #374151;
}

.delete-warning[b-475xb6p31v] {
    font-size: 0.8rem !important;
    color: #b91c1c !important;
    font-style: italic;
}
/* /Components/Pages/StaffTime/TimeLogs.razor.rz.scp.css */
/* Button variants */
.btn-danger[b-suttm3uk0i] {
    background-color: #dc3545;
    color: white;
}

.btn-danger:hover[b-suttm3uk0i] {
    background-color: #c82333;
}

/* Filter bar background override */
.filter-bar[b-suttm3uk0i] {
    background-color: #f8f9fa;
}

.filter-actions[b-suttm3uk0i] {
    margin-left: auto;
}

.filter-group .form-select[b-suttm3uk0i],
.filter-group .form-control[b-suttm3uk0i] {
    min-width: 180px;
}

/* --- Week sections --- */
.week-section[b-suttm3uk0i] {
    margin-bottom: 1.5rem;
}

.week-header[b-suttm3uk0i] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 1px solid #dee2e6;
    border-radius: 10px 10px 0 0;
    gap: 1rem;
}

.week-header-left[b-suttm3uk0i] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.week-title[b-suttm3uk0i] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
}

.week-record-count[b-suttm3uk0i] {
    font-size: 0.8rem;
    color: #6c757d;
}

.week-header-right[b-suttm3uk0i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.week-total[b-suttm3uk0i] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #212529;
}

.week-total-decimal[b-suttm3uk0i] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 400;
}

.badge-overtime[b-suttm3uk0i] {
    background-color: #fff3cd;
    color: #856404;
    border: 1px solid #ffc107;
    padding: 0.2rem 0.55rem;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.week-section .table-container[b-suttm3uk0i] {
    border-top: none;
    border-radius: 0 0 10px 10px;
    overflow: hidden;
}

.week-section .data-table[b-suttm3uk0i] {
    border-radius: 0;
}

/* --- Grand total bar --- */
.grand-total-bar[b-suttm3uk0i] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, #212529 0%, #343a40 100%);
    color: #fff;
    border-radius: 10px;
    margin-top: 0.5rem;
}

.grand-total-label[b-suttm3uk0i] {
    font-size: 0.95rem;
    font-weight: 500;
}

.grand-total-value[b-suttm3uk0i] {
    font-size: 1.2rem;
    font-weight: 700;
}

.grand-total-decimal[b-suttm3uk0i] {
    font-size: 0.9rem;
    font-weight: 400;
    opacity: 0.7;
    margin-left: 0.25rem;
}

/* Table overrides */
.actions-col[b-suttm3uk0i] {
    width: 120px;
    text-align: right;
}

.actions-cell[b-suttm3uk0i] {
    text-align: right;
    white-space: nowrap;
}

.actions-cell .btn-icon[b-suttm3uk0i] {
    display: inline-flex;
    margin-left: 0.25rem;
}

.staff-name[b-suttm3uk0i] {
    font-weight: 500;
}

.datetime[b-suttm3uk0i] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.datetime .date[b-suttm3uk0i] {
    font-weight: 500;
}

.datetime .time[b-suttm3uk0i] {
    font-size: 0.8rem;
    color: #6c757d;
}

.duration-active[b-suttm3uk0i] {
    color: #28a745;
    font-weight: 500;
}

.note-cell[b-suttm3uk0i] {
    max-width: 200px;
}

.note-text[b-suttm3uk0i] {
    color: #6c757d;
    font-size: 0.85rem;
}

/* Badge variants */
.badge-active[b-suttm3uk0i] {
    background-color: #d4edda;
    color: #155724;
}

.badge-type[b-suttm3uk0i] {
    background-color: #e9ecef;
    color: #495057;
}

/* Warning icon button for Fix Clock-Out */
.btn-icon-warning[b-suttm3uk0i] {
    color: #d97706;
}

.btn-icon-warning:hover[b-suttm3uk0i] {
    background-color: #fffbeb;
    color: #b45309;
}

/* Correction modal summary */
.correction-summary[b-suttm3uk0i] {
    padding: 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.25rem;
}

.correction-detail[b-suttm3uk0i] {
    display: flex;
    justify-content: space-between;
    padding: 0.25rem 0;
}

.correction-detail label[b-suttm3uk0i] {
    font-weight: 600;
    font-size: 0.85rem;
    color: #6c757d;
}

.correction-detail span[b-suttm3uk0i] {
    font-size: 0.9rem;
    color: #212529;
}

/* Modal - self-contained positioning to avoid Bootstrap .modal conflict */
.timelog-backdrop[b-suttm3uk0i] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.timelog-modal[b-suttm3uk0i] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 600px;
    max-height: 90vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.timelog-modal-sm[b-suttm3uk0i] {
    max-width: 400px;
}

.modal-header h2[b-suttm3uk0i] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.modal-close[b-suttm3uk0i] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6c757d;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.15s ease;
}

.modal-close:hover[b-suttm3uk0i] {
    background-color: #f0f0f0;
    color: #333;
}

.modal-footer[b-suttm3uk0i] {
    background-color: #f8f9fa;
}

/* Form group margin-based spacing */
.form-group[b-suttm3uk0i] {
    margin-bottom: 1.25rem;
}

.form-group label[b-suttm3uk0i] {
    display: block;
    margin-bottom: 0.375rem;
}

.form-group textarea.form-control[b-suttm3uk0i] {
    resize: vertical;
    min-height: 80px;
}

/* Detail grid two-column */
.detail-grid[b-suttm3uk0i] {
    grid-template-columns: 1fr 1fr;
}

/* Delete Modal */
.delete-summary[b-suttm3uk0i] {
    padding: 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    margin: 1rem 0;
}

.text-danger[b-suttm3uk0i] {
    color: #dc3545;
    font-size: 0.85rem;
}

/* Alerts */
.alert[b-suttm3uk0i] {
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.875rem;
    margin-top: 1rem;
}

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

/* Responsive */
@media (max-width: 768px) {
    .filter-actions[b-suttm3uk0i] {
        margin-left: 0;
        width: 100%;
    }

    .filter-actions .btn[b-suttm3uk0i] {
        width: 100%;
        justify-content: center;
    }

    .data-table th[b-suttm3uk0i],
    .data-table td[b-suttm3uk0i] {
        padding: 0.75rem 0.5rem;
    }

    .note-cell[b-suttm3uk0i] {
        display: none;
    }

    .week-header[b-suttm3uk0i] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .week-header-right[b-suttm3uk0i] {
        width: 100%;
        justify-content: flex-end;
    }

    .grand-total-bar[b-suttm3uk0i] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }
}
/* /Components/Pages/StaffTime/UpcomingPtoCalendar.razor.rz.scp.css */
/* Loading state */
.loading-container[b-3qvhbrvmqv] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem;
    color: #6b7280;
    font-size: 0.9rem;
}
/* /Components/Pages/TimeClock/ClockOut.razor.rz.scp.css */
/* Clock Out Page Styles */

.clockout-page[b-vgl7ksa2q1] {
    padding: 0 1rem;
}

/* Loading & Empty States */
.loading-state[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 4rem 0;
    color: #6c757d;
    font-size: 0.95rem;
}

.not-clocked-in-card[b-vgl7ksa2q1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 4rem 2rem;
    text-align: center;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e9ecef;
    margin-top: 2rem;
}

    .not-clocked-in-card h2[b-vgl7ksa2q1] {
        margin: 0;
        font-size: 1.25rem;
        font-weight: 600;
        color: #343a40;
    }

    .not-clocked-in-card p[b-vgl7ksa2q1] {
        margin: 0;
        color: #6c757d;
        font-size: 0.95rem;
    }

/* Page Header */
.clockout-header[b-vgl7ksa2q1] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.clockout-header-left h1[b-vgl7ksa2q1] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a1a2e;
}

.page-subtitle[b-vgl7ksa2q1] {
    margin: 0.25rem 0 0 0;
    color: #6c757d;
    font-size: 0.9rem;
}

.clockout-header-right[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-clockout[b-vgl7ksa2q1] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-weight: 600;
}

/* Summary Cards Grid */
.time-summary-grid[b-vgl7ksa2q1] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.summary-card[b-vgl7ksa2q1] {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    padding: 1.25rem;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e9ecef;
    transition: box-shadow 0.15s ease;
}

    .summary-card:hover[b-vgl7ksa2q1] {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    }

.summary-card-icon[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    flex-shrink: 0;
}

    .summary-card-icon.clocked[b-vgl7ksa2q1] {
        background: #e8f0fe;
        color: #1b4a98;
    }

    .summary-card-icon.logged[b-vgl7ksa2q1] {
        background: #e6f7ed;
        color: #198754;
    }

    .summary-card-icon.coverage-excellent[b-vgl7ksa2q1] {
        background: #e6f7ed;
        color: #198754;
    }

    .summary-card-icon.coverage-good[b-vgl7ksa2q1] {
        background: #e6f7ed;
        color: #198754;
    }

    .summary-card-icon.coverage-fair[b-vgl7ksa2q1] {
        background: #fff8e1;
        color: #f59e0b;
    }

    .summary-card-icon.coverage-low[b-vgl7ksa2q1] {
        background: #fde8e8;
        color: #dc3545;
    }

.summary-card-body[b-vgl7ksa2q1] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.summary-label[b-vgl7ksa2q1] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.summary-value[b-vgl7ksa2q1] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a1a2e;
    line-height: 1.2;
}

    .summary-value.coverage-excellent[b-vgl7ksa2q1],
    .summary-value.coverage-good[b-vgl7ksa2q1] {
        color: #198754;
    }

    .summary-value.coverage-fair[b-vgl7ksa2q1] {
        color: #f59e0b;
    }

    .summary-value.coverage-low[b-vgl7ksa2q1] {
        color: #dc3545;
    }

.summary-detail[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8rem;
    color: #6c757d;
}

.pulse-dot[b-vgl7ksa2q1] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #198754;
    animation: pulse-b-vgl7ksa2q1 2s infinite;
}

@keyframes pulse-b-vgl7ksa2q1 {
    0% {
        box-shadow: 0 0 0 0 rgba(25, 135, 84, 0.4);
    }

    70% {
        box-shadow: 0 0 0 6px rgba(25, 135, 84, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(25, 135, 84, 0);
    }
}

/* Coverage Bar */
.coverage-bar-section[b-vgl7ksa2q1] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e9ecef;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

.coverage-bar-labels[b-vgl7ksa2q1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #343a40;
}

.coverage-bar-track[b-vgl7ksa2q1] {
    width: 100%;
    height: 10px;
    background: #e9ecef;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 0.75rem;
}

.coverage-bar-fill[b-vgl7ksa2q1] {
    height: 100%;
    border-radius: 5px;
    transition: width 0.5s ease;
}

    .coverage-bar-fill.coverage-excellent[b-vgl7ksa2q1],
    .coverage-bar-fill.coverage-good[b-vgl7ksa2q1] {
        background: linear-gradient(90deg, #198754, #20c997);
    }

    .coverage-bar-fill.coverage-fair[b-vgl7ksa2q1] {
        background: linear-gradient(90deg, #f59e0b, #fbbf24);
    }

    .coverage-bar-fill.coverage-low[b-vgl7ksa2q1] {
        background: linear-gradient(90deg, #dc3545, #ef4444);
    }

.coverage-warning[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0.875rem;
    background: #fff8e1;
    border: 1px solid #ffe082;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #92600a;
}

.coverage-success[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0.875rem;
    background: #e6f7ed;
    border: 1px solid #a3d9b1;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #0f5132;
}

/* Coverage label classes */
.coverage-excellent[b-vgl7ksa2q1],
.coverage-good[b-vgl7ksa2q1] {
    color: #198754;
}

.coverage-fair[b-vgl7ksa2q1] {
    color: #f59e0b;
}

.coverage-low[b-vgl7ksa2q1] {
    color: #dc3545;
}

/* Quick Add Section */
.quick-add-section[b-vgl7ksa2q1] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e9ecef;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

    .quick-add-section h3[b-vgl7ksa2q1] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 1rem;
        font-weight: 600;
        color: #1a1a2e;
        margin: 0 0 1rem 0;
    }

.quick-add-layout[b-vgl7ksa2q1] {
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
}

/* Assigned Projects Panel */
.assigned-projects-panel[b-vgl7ksa2q1] {
    flex: 0 0 400px;
    min-width: 0;
}

.panel-label[b-vgl7ksa2q1] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #6c757d;
    margin-bottom: 0.5rem;
}

.empty-projects[b-vgl7ksa2q1] {
    font-size: 0.85rem;
    color: #adb5bd;
    padding: 1rem 0;
}

.assigned-project-list[b-vgl7ksa2q1] {
    display: flex;
    flex-direction: column;
    gap: 0;
    max-height: 260px;
    overflow-y: auto;
    border: 1px solid #e9ecef;
    border-radius: 8px;
}

.assigned-project-item[b-vgl7ksa2q1] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    padding: 0.5rem 0.75rem;
    border: none;
    border-bottom: 1px solid #f0f0f0;
    background: transparent;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.1s ease;
    width: 100%;
}

    .assigned-project-item:last-child[b-vgl7ksa2q1] {
        border-bottom: none;
    }

    .assigned-project-item:hover[b-vgl7ksa2q1] {
        background: #f8f9fa;
    }

    .assigned-project-item.selected[b-vgl7ksa2q1] {
        background: #e8f0fe;
        border-left: 3px solid #1b4a98;
    }

.assigned-project-name[b-vgl7ksa2q1] {
    font-size: 0.825rem;
    font-weight: 600;
    color: #1a1a2e;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.assigned-project-meta[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.assigned-project-customer[b-vgl7ksa2q1] {
    font-size: 0.75rem;
    color: #6c757d;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.assigned-project-hours[b-vgl7ksa2q1] {
    font-size: 0.7rem;
    font-weight: 500;
    color: #1b4a98;
    white-space: nowrap;
    flex-shrink: 0;
}

.quick-add-form[b-vgl7ksa2q1] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-width: 0;
}

.form-row[b-vgl7ksa2q1] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-end;
}

.form-group[b-vgl7ksa2q1] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
    min-width: 0;
}

    .form-group label[b-vgl7ksa2q1] {
        font-size: 0.8rem;
        font-weight: 500;
        color: #6c757d;
    }

.form-group-grow[b-vgl7ksa2q1] {
    flex: 2;
}

.form-group-time[b-vgl7ksa2q1] {
    flex: 0 0 90px;
}

.form-group-btn[b-vgl7ksa2q1] {
    flex: 0 0 auto;
}

/* Label with badge */
.label-with-badge[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.billable-pill[b-vgl7ksa2q1] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    background: #fff3cd;
    color: #856404;
    font-size: 0.7rem;
    font-weight: 600;
    border-radius: 12px;
    white-space: nowrap;
}

/* Unlogged quick fill button */
.form-group-unlogged-quick-fill[b-vgl7ksa2q1] {
    flex: 0 0 auto;
}

.unlogged-quick-fill-btn[b-vgl7ksa2q1] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8rem;
    font-weight: 500;
    white-space: nowrap;
    padding: 0.5rem 0.75rem;
}

    .unlogged-quick-fill-btn svg[b-vgl7ksa2q1] {
        flex-shrink: 0;
    }

/* Logs Section */
.logs-section[b-vgl7ksa2q1] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e9ecef;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

    .logs-section h3[b-vgl7ksa2q1] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 1rem;
        font-weight: 600;
        color: #1a1a2e;
        margin: 0 0 1rem 0;
    }

.empty-logs[b-vgl7ksa2q1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 2rem;
    color: #6c757d;
    text-align: center;
}

    .empty-logs p[b-vgl7ksa2q1] {
        margin: 0;
        font-size: 0.9rem;
    }

.log-list[b-vgl7ksa2q1] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.log-item[b-vgl7ksa2q1] {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f0f0f0;
}

    .log-item:last-child[b-vgl7ksa2q1] {
        border-bottom: none;
    }

.log-item-time[b-vgl7ksa2q1] {
    flex-shrink: 0;
    min-width: 70px;
}

.log-minutes[b-vgl7ksa2q1] {
    display: inline-block;
    padding: 0.2rem 0.625rem;
    background: #e8f0fe;
    color: #1b4a98;
    font-size: 0.8rem;
    font-weight: 600;
    border-radius: 6px;
    white-space: nowrap;
}

.log-item-body[b-vgl7ksa2q1] {
    flex: 1;
    min-width: 0;
}

.log-item-project[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #343a40;
    flex-wrap: wrap;
}

.log-customer[b-vgl7ksa2q1] {
    color: #6c757d;
    font-weight: 500;
}

.log-separator[b-vgl7ksa2q1] {
    color: #ced4da;
    font-weight: 400;
}

.log-project[b-vgl7ksa2q1] {
    color: #1b4a98;
}

.log-item-desc[b-vgl7ksa2q1] {
    font-size: 0.825rem;
    color: #6c757d;
    margin-top: 0.2rem;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.log-item-time-range[b-vgl7ksa2q1] {
    flex-shrink: 0;
    font-size: 0.8rem;
    color: #adb5bd;
    white-space: nowrap;
}

/* Edit button on log items */
.btn-edit-log[b-vgl7ksa2q1] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: #adb5bd;
    cursor: pointer;
    opacity: 0;
    transition: all 0.15s ease;
}

.log-item:hover .btn-edit-log[b-vgl7ksa2q1] {
    opacity: 1;
}

.btn-edit-log:hover[b-vgl7ksa2q1] {
    background: #e3f2fd;
    border-color: #1b4a98;
    color: #1b4a98;
}

/* Inline edit mode */
.log-item-editing[b-vgl7ksa2q1] {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 0.75rem !important;
    margin: -0.25rem -0.5rem;
}

.log-edit-form[b-vgl7ksa2q1] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.log-edit-row[b-vgl7ksa2q1] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.log-edit-actions[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding-bottom: 1px;
}

.log-edit-context[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8rem;
    padding-left: 0.125rem;
}

/* Bottom Actions */
.bottom-actions[b-vgl7ksa2q1] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 1rem 0 2rem 0;
}

/* Responsive */
@media (max-width: 992px) {
    .quick-add-layout[b-vgl7ksa2q1] {
        flex-direction: column;
    }

    .assigned-projects-panel[b-vgl7ksa2q1] {
        flex: none;
        width: 100%;
    }

    .assigned-project-list[b-vgl7ksa2q1] {
        max-height: 180px;
    }
}

@media (max-width: 768px) {
    .time-summary-grid[b-vgl7ksa2q1] {
        grid-template-columns: 1fr;
    }

    .form-row[b-vgl7ksa2q1] {
        flex-direction: column;
    }

    .form-group-time[b-vgl7ksa2q1] {
        flex: none;
        width: 100%;
    }

    .clockout-header[b-vgl7ksa2q1] {
        flex-direction: column;
    }

    .clockout-header-right[b-vgl7ksa2q1] {
        width: 100%;
    }

        .clockout-header-right .btn[b-vgl7ksa2q1] {
            flex: 1;
        }
}

/* Billable badges */
.billable-badge[b-vgl7ksa2q1] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    margin-top: 0.25rem;
}

.billable-badge.non-billable[b-vgl7ksa2q1] {
    background: #fff3cd;
    color: #856404;
}

/* Billable sub-badge on log items */
.log-billable-minutes[b-vgl7ksa2q1] {
    display: block;
    font-size: 0.7rem;
    font-weight: 500;
    color: #6c757d;
    white-space: nowrap;
    margin-top: 0.2rem;
}

.log-billable-minutes.non-billable[b-vgl7ksa2q1] {
    color: #856404;
}

/* Label with badge */
.label-with-badge[b-vgl7ksa2q1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Billable pill badge */
.billable-pill[b-vgl7ksa2q1] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: 12px;
    white-space: nowrap;
}

.billable-pill.non-billable[b-vgl7ksa2q1] {
    background: #fff3cd;
    color: #856404;
}

/* Unlogged quick fill button */
.unlogged-quick-fill[b-vgl7ksa2q1] {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e9ecef;
}

.unlogged-quick-fill .btn[b-vgl7ksa2q1] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.375rem 0.75rem;
}

.unlogged-quick-fill svg[b-vgl7ksa2q1] {
    opacity: 0.7;
}
/* /Components/Pages/TimeClock/TimeLogReview.razor.rz.scp.css */
/* Time Log Review Page */

.review-page[b-tcjnarlid3] {
    padding: 0 1rem;
}

/* Loading */
.loading-state[b-tcjnarlid3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 4rem 0;
    color: #6c757d;
    font-size: 0.95rem;
}

/* Header */
.review-header[b-tcjnarlid3] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.review-header-left h1[b-tcjnarlid3] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a1a2e;
}

.page-subtitle[b-tcjnarlid3] {
    margin: 0.25rem 0 0 0;
    color: #6c757d;
    font-size: 0.9rem;
}

.review-header-right[b-tcjnarlid3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.review-header-right .form-select[b-tcjnarlid3] {
    width: auto;
    min-width: 160px;
}

.staff-select[b-tcjnarlid3] {
    min-width: 200px !important;
}

.show-all-toggle[b-tcjnarlid3] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #495057;
    cursor: pointer;
    white-space: nowrap;
    padding: 0.375rem 0;
}

.show-all-toggle input[type="checkbox"][b-tcjnarlid3] {
    width: 16px;
    height: 16px;
    accent-color: #1b4a98;
    cursor: pointer;
}

/* Summary Cards */
.review-summary-grid[b-tcjnarlid3] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.summary-card[b-tcjnarlid3] {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    padding: 1.25rem;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e9ecef;
    transition: box-shadow 0.15s ease;
}

    .summary-card:hover[b-tcjnarlid3] {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    }

.summary-card-icon[b-tcjnarlid3] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    flex-shrink: 0;
}

    .summary-card-icon.clocked[b-tcjnarlid3] {
        background: #e8f0fe;
        color: #1b4a98;
    }

    .summary-card-icon.coverage-excellent[b-tcjnarlid3],
    .summary-card-icon.coverage-good[b-tcjnarlid3] {
        background: #e6f7ed;
        color: #198754;
    }

    .summary-card-icon.coverage-fair[b-tcjnarlid3] {
        background: #fff8e1;
        color: #f59e0b;
    }

    .summary-card-icon.coverage-low[b-tcjnarlid3] {
        background: #fde8e8;
        color: #dc3545;
    }

.summary-card-body[b-tcjnarlid3] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.summary-label[b-tcjnarlid3] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.summary-value[b-tcjnarlid3] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a1a2e;
    line-height: 1.2;
}

    .summary-value.coverage-excellent[b-tcjnarlid3],
    .summary-value.coverage-good[b-tcjnarlid3] {
        color: #198754;
    }

    .summary-value.coverage-fair[b-tcjnarlid3] {
        color: #f59e0b;
    }

    .summary-value.coverage-low[b-tcjnarlid3] {
        color: #dc3545;
    }

.summary-detail[b-tcjnarlid3] {
    font-size: 0.8rem;
    color: #6c757d;
}

/* All Clear Card */
.all-clear-card[b-tcjnarlid3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 4rem 2rem;
    text-align: center;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e9ecef;
}

    .all-clear-card h2[b-tcjnarlid3] {
        margin: 0;
        font-size: 1.25rem;
        font-weight: 600;
        color: #198754;
    }

    .all-clear-card p[b-tcjnarlid3] {
        margin: 0;
        color: #6c757d;
        font-size: 0.95rem;
    }

/* Day List */
.day-list[b-tcjnarlid3] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 2rem;
}

.day-card[b-tcjnarlid3] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e9ecef;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

    .day-card:hover[b-tcjnarlid3] {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    }

    .day-card.expanded[b-tcjnarlid3] {
        border-color: #1b4a98;
        box-shadow: 0 2px 12px rgba(27, 74, 152, 0.1);
    }

.day-card-header[b-tcjnarlid3] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    width: 100%;
    padding: 1rem 1.25rem;
    border: none;
    background: transparent;
    cursor: pointer;
    text-align: left;
    transition: background-color 0.1s ease;
}

    .day-card-header:hover[b-tcjnarlid3] {
        background: #f8f9fa;
    }

.day-card-date[b-tcjnarlid3] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 120px;
}

.day-name[b-tcjnarlid3] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.day-full[b-tcjnarlid3] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1a1a2e;
}

.day-card-stats[b-tcjnarlid3] {
    display: flex;
    gap: 1.5rem;
    flex: 1;
}

.day-stat[b-tcjnarlid3] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.day-stat-label[b-tcjnarlid3] {
    font-size: 0.7rem;
    font-weight: 500;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.day-stat-value[b-tcjnarlid3] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #343a40;
}

    .day-stat-value.unlogged[b-tcjnarlid3] {
        color: #dc3545;
    }

.day-card-coverage[b-tcjnarlid3] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 130px;
}

.mini-bar-track[b-tcjnarlid3] {
    flex: 1;
    height: 6px;
    background: #e9ecef;
    border-radius: 3px;
    overflow: hidden;
}

.mini-bar-fill[b-tcjnarlid3] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s ease;
}

    .mini-bar-fill.coverage-excellent[b-tcjnarlid3],
    .mini-bar-fill.coverage-good[b-tcjnarlid3] {
        background: linear-gradient(90deg, #198754, #20c997);
    }

    .mini-bar-fill.coverage-fair[b-tcjnarlid3] {
        background: linear-gradient(90deg, #f59e0b, #fbbf24);
    }

    .mini-bar-fill.coverage-low[b-tcjnarlid3] {
        background: linear-gradient(90deg, #dc3545, #ef4444);
    }

.coverage-pct[b-tcjnarlid3] {
    font-size: 0.825rem;
    font-weight: 700;
    min-width: 38px;
    text-align: right;
}

.coverage-excellent[b-tcjnarlid3],
.coverage-good[b-tcjnarlid3] {
    color: #198754;
}

.coverage-fair[b-tcjnarlid3] {
    color: #f59e0b;
}

.coverage-low[b-tcjnarlid3] {
    color: #dc3545;
}

.day-card-chevron[b-tcjnarlid3] {
    flex-shrink: 0;
    color: #adb5bd;
    display: flex;
    align-items: center;
}

    .day-card-chevron svg[b-tcjnarlid3] {
        transition: transform 0.2s ease;
    }

    .day-card-chevron svg.rotated[b-tcjnarlid3] {
        transform: rotate(180deg);
    }

/* Day Card Body (expanded) */
.day-card-body[b-tcjnarlid3] {
    border-top: 1px solid #e9ecef;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Quick Add Section (reused from ClockOut) */
.quick-add-section[b-tcjnarlid3] {
    background: #f8f9fa;
    border-radius: 10px;
    padding: 1rem 1.25rem;
}

    .quick-add-section h4[b-tcjnarlid3] {
        display: flex;
        align-items: center;
        gap: 0.375rem;
        font-size: 0.9rem;
        font-weight: 600;
        color: #1a1a2e;
        margin: 0 0 0.875rem 0;
    }

.quick-add-layout[b-tcjnarlid3] {
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
}

.assigned-projects-panel[b-tcjnarlid3] {
    flex: 0 0 400px;
    min-width: 0;
}

.panel-label[b-tcjnarlid3] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #6c757d;
    margin-bottom: 0.5rem;
}

.empty-projects[b-tcjnarlid3] {
    font-size: 0.85rem;
    color: #adb5bd;
    padding: 1rem 0;
}

.assigned-project-list[b-tcjnarlid3] {
    display: flex;
    flex-direction: column;
    gap: 0;
    max-height: 220px;
    overflow-y: auto;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    background: #fff;
}

.assigned-project-item[b-tcjnarlid3] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    padding: 0.5rem 0.75rem;
    border: none;
    border-bottom: 1px solid #f0f0f0;
    background: transparent;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.1s ease;
    width: 100%;
}

    .assigned-project-item:last-child[b-tcjnarlid3] {
        border-bottom: none;
    }

    .assigned-project-item:hover[b-tcjnarlid3] {
        background: #f8f9fa;
    }

    .assigned-project-item.selected[b-tcjnarlid3] {
        background: #e8f0fe;
        border-left: 3px solid #1b4a98;
    }

.assigned-project-name[b-tcjnarlid3] {
    font-size: 0.825rem;
    font-weight: 600;
    color: #1a1a2e;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.assigned-project-meta[b-tcjnarlid3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.assigned-project-customer[b-tcjnarlid3] {
    font-size: 0.75rem;
    color: #6c757d;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.assigned-project-hours[b-tcjnarlid3] {
    font-size: 0.7rem;
    font-weight: 500;
    color: #1b4a98;
    white-space: nowrap;
    flex-shrink: 0;
}

.quick-add-form[b-tcjnarlid3] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-width: 0;
}

.form-row[b-tcjnarlid3] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-end;
}

.form-group[b-tcjnarlid3] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
    min-width: 0;
}

    .form-group label[b-tcjnarlid3] {
        font-size: 0.8rem;
        font-weight: 500;
        color: #6c757d;
    }

.form-group-grow[b-tcjnarlid3] {
    flex: 2;
}

.form-group-time[b-tcjnarlid3] {
    flex: 0 0 90px;
}

.form-group-btn[b-tcjnarlid3] {
    flex: 0 0 auto;
}

/* Day Logs Section */
.day-logs-section h4[b-tcjnarlid3] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: #1a1a2e;
    margin: 0 0 0.75rem 0;
}

.empty-logs[b-tcjnarlid3] {
    text-align: center;
    color: #adb5bd;
    padding: 1rem;
    font-size: 0.85rem;
}

    .empty-logs p[b-tcjnarlid3] {
        margin: 0;
    }

.log-list[b-tcjnarlid3] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.log-item[b-tcjnarlid3] {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid #f0f0f0;
}

    .log-item:last-child[b-tcjnarlid3] {
        border-bottom: none;
    }

.log-item-time[b-tcjnarlid3] {
    flex-shrink: 0;
    min-width: 70px;
}

.log-minutes[b-tcjnarlid3] {
    display: inline-block;
    padding: 0.2rem 0.625rem;
    background: #e8f0fe;
    color: #1b4a98;
    font-size: 0.8rem;
    font-weight: 600;
    border-radius: 6px;
    white-space: nowrap;
}

.log-item-body[b-tcjnarlid3] {
    flex: 1;
    min-width: 0;
}

.log-item-project[b-tcjnarlid3] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #343a40;
    flex-wrap: wrap;
}

.log-customer[b-tcjnarlid3] {
    color: #6c757d;
    font-weight: 500;
}

.log-separator[b-tcjnarlid3] {
    color: #ced4da;
    font-weight: 400;
}

.log-project[b-tcjnarlid3] {
    color: #1b4a98;
}

.log-item-desc[b-tcjnarlid3] {
    font-size: 0.825rem;
    color: #6c757d;
    margin-top: 0.2rem;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Edit button on log items */
.btn-edit-log[b-tcjnarlid3] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: #adb5bd;
    cursor: pointer;
    opacity: 0;
    transition: all 0.15s ease;
}

.log-item:hover .btn-edit-log[b-tcjnarlid3] {
    opacity: 1;
}

.btn-edit-log:hover[b-tcjnarlid3] {
    background: #e3f2fd;
    border-color: #1b4a98;
    color: #1b4a98;
}

/* Inline edit mode */
.log-item-editing[b-tcjnarlid3] {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 0.75rem !important;
    margin: -0.25rem -0.5rem;
}

.log-edit-form[b-tcjnarlid3] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.log-edit-row[b-tcjnarlid3] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.log-edit-actions[b-tcjnarlid3] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding-bottom: 1px;
}

.log-edit-context[b-tcjnarlid3] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8rem;
    padding-left: 0.125rem;
}

/* Responsive */
@media (max-width: 992px) {
    .quick-add-layout[b-tcjnarlid3] {
        flex-direction: column;
    }

    .assigned-projects-panel[b-tcjnarlid3] {
        flex: none;
        width: 100%;
    }

    .assigned-project-list[b-tcjnarlid3] {
        max-height: 160px;
    }

    .day-card-stats[b-tcjnarlid3] {
        flex-wrap: wrap;
        gap: 0.75rem;
    }
}

@media (max-width: 768px) {
    .review-summary-grid[b-tcjnarlid3] {
        grid-template-columns: 1fr;
    }

    .day-card-header[b-tcjnarlid3] {
        flex-wrap: wrap;
        gap: 0.75rem;
    }

    .day-card-coverage[b-tcjnarlid3] {
        min-width: 100%;
    }

    .form-row[b-tcjnarlid3] {
        flex-direction: column;
    }

    .form-group-time[b-tcjnarlid3] {
        flex: none;
        width: 100%;
    }

    .review-header[b-tcjnarlid3] {
        flex-direction: column;
    }
}

/* Label with badge */
.label-with-badge[b-tcjnarlid3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Billable pill */
.billable-pill[b-tcjnarlid3] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: 12px;
    white-space: nowrap;
}

.billable-pill.non-billable[b-tcjnarlid3] {
    background: #fff3cd;
    color: #856404;
}

/* Billable badges (legacy - kept for other usages) */
.billable-badge[b-tcjnarlid3] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    margin-top: 0.25rem;
}

.billable-badge.non-billable[b-tcjnarlid3] {
    background: #fff3cd;
    color: #856404;
}

/* Unlogged quick fill button */
.unlogged-quick-fill[b-tcjnarlid3] {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e9ecef;
}

.unlogged-quick-fill .btn[b-tcjnarlid3] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.375rem 0.75rem;
}

.unlogged-quick-fill svg[b-tcjnarlid3] {
    opacity: 0.7;
}

/* Billable sub-badge on log items */
.log-billable-minutes[b-tcjnarlid3] {
    display: block;
    font-size: 0.7rem;
    font-weight: 500;
    color: #6c757d;
    white-space: nowrap;
    margin-top: 0.2rem;
}

.log-billable-minutes.non-billable[b-tcjnarlid3] {
    color: #856404;
}
/* /Components/Shared/ComingSoon.razor.rz.scp.css */
.coming-soon-container[b-agphxsjmee] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    text-align: center;
}

.coming-soon-icon[b-agphxsjmee] {
    color: #1b4a98;
    margin-bottom: 1.5rem;
    opacity: 0.7;
}

.coming-soon-container h1[b-agphxsjmee] {
    margin-bottom: 0.5rem;
    color: #333;
}

.coming-soon-container .text-muted[b-agphxsjmee] {
    color: #6c757d;
    margin-bottom: 2rem;
}
/* /Components/Shared/PtoCalendar.razor.rz.scp.css */
/* PTO Calendar Component */
.pto-calendar[b-21yhjf603f] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    overflow: hidden;
}

.calendar-nav[b-21yhjf603f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #e9ecef;
}

.calendar-nav-btn[b-21yhjf603f] {
    background: none;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 0.35rem;
    cursor: pointer;
    color: #6b7280;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
}

.calendar-nav-btn:hover[b-21yhjf603f] {
    background: #f3f4f6;
    color: #374151;
}

.calendar-nav-center[b-21yhjf603f] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.calendar-month-label[b-21yhjf603f] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #1a1a2e;
}

.calendar-today-btn[b-21yhjf603f] {
    padding: 0.2rem 0.6rem;
    font-size: 0.7rem;
    font-weight: 600;
    color: #1b4a98;
    background: #e8f0fe;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.calendar-today-btn:hover[b-21yhjf603f] {
    background: #d0e0fc;
}

.calendar-header-row[b-21yhjf603f] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    background: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
}

.calendar-header-cell[b-21yhjf603f] {
    padding: 0.5rem;
    text-align: center;
    font-size: 0.7rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.calendar-header-cell.weekend[b-21yhjf603f] {
    color: #d1d5db;
}

.calendar-week[b-21yhjf603f] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    border-bottom: 1px solid #f0f0f0;
}

.calendar-week:last-child[b-21yhjf603f] {
    border-bottom: none;
}

.calendar-day[b-21yhjf603f] {
    min-height: 80px;
    padding: 0.375rem;
    border-right: 1px solid #f0f0f0;
    position: relative;
}

.calendar-day:last-child[b-21yhjf603f] {
    border-right: none;
}

.calendar-day.weekend[b-21yhjf603f] {
    background: #fafbfc;
}

.calendar-day.today[b-21yhjf603f] {
    background: #eff6ff;
}

.calendar-day.today .day-number[b-21yhjf603f] {
    background: #1b4a98;
    color: #fff;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.calendar-day.other-month[b-21yhjf603f] {
    background: #f9fafb;
}

.calendar-day.other-month .day-number[b-21yhjf603f] {
    color: #d1d5db;
}

.calendar-day.other-month .calendar-item[b-21yhjf603f] {
    opacity: 0.45;
}

.day-number[b-21yhjf603f] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #374151;
    display: inline-block;
    margin-bottom: 2px;
}

.calendar-item[b-21yhjf603f] {
    padding: 2px 6px;
    margin-top: 2px;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: default;
    display: flex;
    align-items: center;
    gap: 3px;
}

.calendar-item.full-day[b-21yhjf603f] {
    background: #1b4a98;
    color: #fff;
}

.calendar-item.partial-day[b-21yhjf603f] {
    background: #fff;
    color: #1b4a98;
    border: 1.5px dashed #93b4e8;
}

.calendar-item-name[b-21yhjf603f] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}

.calendar-item-hours[b-21yhjf603f] {
    flex-shrink: 0;
    font-size: 0.6rem;
    font-weight: 600;
    opacity: 0.8;
}
/* /Components/Shared/RecentlyViewedPanel.razor.rz.scp.css */
.recently-viewed-panel[b-9dwdv0hxt1] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 20px;
}

.recently-viewed-header[b-9dwdv0hxt1] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}

.recently-viewed-items[b-9dwdv0hxt1] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.recently-viewed-item[b-9dwdv0hxt1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    text-decoration: none;
    color: inherit;
    font-size: 0.875rem;
    transition: all 0.15s ease;
    max-width: 260px;
}

    .recently-viewed-item:hover[b-9dwdv0hxt1] {
        border-color: #0d6efd;
        background: #f0f6ff;
        text-decoration: none;
        color: inherit;
    }

.entity-icon[b-9dwdv0hxt1] {
    font-size: 0.875rem;
    flex-shrink: 0;
}

.entity-info[b-9dwdv0hxt1] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.entity-name[b-9dwdv0hxt1] {
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.entity-meta[b-9dwdv0hxt1] {
    font-size: 0.75rem;
    color: #6c757d;
}
/* /Components/Shared/SocialNotesPanel.razor.rz.scp.css */
/* ─── Notes Panel ─── */
.notes-panel[b-nle4f5tq8x] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: visible;
}

.notes-panel-header[b-nle4f5tq8x] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #f0f0f0;
}

.notes-panel-header h2[b-nle4f5tq8x] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #333;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.notes-panel-body[b-nle4f5tq8x] {
    padding: 1.25rem;
}

/* ─── Badge ─── */
.note-count-badge[b-nle4f5tq8x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #e8eef7;
    color: #1b4a98;
    font-size: 0.75rem;
    font-weight: 600;
    min-width: 22px;
    height: 22px;
    border-radius: 11px;
    padding: 0 6px;
    margin-left: 0.5rem;
    vertical-align: middle;
}

/* ─── Add Note Form ─── */
.add-note-form[b-nle4f5tq8x] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: flex-end;
    margin-bottom: 1rem;
}

.note-editor-wrapper[b-nle4f5tq8x] {
    width: 100%;
}

.add-note-form .btn[b-nle4f5tq8x] {
    flex-shrink: 0;
    white-space: nowrap;
}

.notes-empty[b-nle4f5tq8x] {
    margin: 0;
    font-style: italic;
}

/* ─── Notes List ─── */
.notes-list[b-nle4f5tq8x] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.note-item[b-nle4f5tq8x] {
    padding: 0.75rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 3px solid #1b4a98;
    transition: border-color 0.15s;
}

.note-item-editing[b-nle4f5tq8x] {
    border-left-color: #ffc107;
    background-color: #fffdf5;
}

/* ─── Note Content (read mode) ─── */
.note-content[b-nle4f5tq8x] {
    font-size: 0.875rem;
    color: #333;
    line-height: 1.5;
    word-break: break-word;
    overflow-wrap: break-word;
}

/* ─── Note Meta Row ─── */
.note-meta[b-nle4f5tq8x] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.5rem;
    font-size: 0.75rem;
    color: #6c757d;
}

.note-author[b-nle4f5tq8x] {
    font-weight: 600;
    color: #495057;
}

.note-separator[b-nle4f5tq8x] {
    color: #adb5bd;
}

.note-time[b-nle4f5tq8x] {
    cursor: default;
}

/* ─── Action Buttons (edit + delete) ─── */
.note-action-btn[b-nle4f5tq8x] {
    background: none;
    border: none;
    color: #adb5bd;
    cursor: pointer;
    padding: 2px 4px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    opacity: 0;
    transition: opacity 0.15s, color 0.15s, background-color 0.15s;
}

.note-edit-btn[b-nle4f5tq8x] {
    margin-left: auto;
}

.note-item:hover .note-action-btn[b-nle4f5tq8x] {
    opacity: 1;
}

.note-edit-btn:hover[b-nle4f5tq8x] {
    color: #1b4a98;
    background-color: #e8eef7;
}

.note-delete-btn:hover[b-nle4f5tq8x] {
    color: #dc3545;
    background-color: #fee;
}

/* ─── Inline Edit ─── */
.note-edit-editor[b-nle4f5tq8x] {
    width: 100%;
}

.note-edit-actions[b-nle4f5tq8x] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

/* ─── Delete Confirmation Modal ─── */
.notes-delete-backdrop[b-nle4f5tq8x] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1050;
}

.notes-delete-modal[b-nle4f5tq8x] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    z-index: 1051;
    width: 90%;
    max-width: 420px;
    overflow: hidden;
}

.notes-delete-modal .modal-header[b-nle4f5tq8x] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #f0f0f0;
}

.notes-delete-modal .modal-header h3[b-nle4f5tq8x] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.notes-delete-modal .modal-close[b-nle4f5tq8x] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

.notes-delete-modal .modal-close:hover[b-nle4f5tq8x] {
    background-color: #f0f0f0;
    color: #333;
}

.notes-delete-modal .modal-body[b-nle4f5tq8x] {
    padding: 1.25rem;
}

.notes-delete-modal .modal-footer[b-nle4f5tq8x] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 1rem 1.25rem;
    background-color: #f8f9fa;
    border-top: 1px solid #f0f0f0;
}

.delete-note-preview[b-nle4f5tq8x] {
    background-color: #f8f9fa;
    border-left: 3px solid #6c757d;
    padding: 0.75rem;
    border-radius: 4px;
    margin: 0.75rem 0;
    font-size: 0.875rem;
    color: #333;
    word-break: break-word;
    max-height: 120px;
    overflow-y: auto;
}

/* ─── Loading ─── */
.loading-inline[b-nle4f5tq8x] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    padding: 0.5rem 0;
    font-size: 0.875rem;
}

/* ─── Shared Button Styles ─── */
.btn[b-nle4f5tq8x] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 500;
    border: none;
    cursor: pointer;
    transition: background-color 0.15s, color 0.15s;
}

.btn-sm[b-nle4f5tq8x] {
    padding: 0.25rem 0.625rem;
    font-size: 0.8125rem;
}

.btn-primary[b-nle4f5tq8x] {
    background-color: #1b4a98;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-nle4f5tq8x] {
    background-color: #153a7a;
}

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

.btn-secondary[b-nle4f5tq8x] {
    background-color: #6c757d;
    color: white;
}

.btn-secondary:hover:not(:disabled)[b-nle4f5tq8x] {
    background-color: #5a6268;
}

.btn-danger[b-nle4f5tq8x] {
    background-color: #dc3545;
    color: white;
}

.btn-danger:hover:not(:disabled)[b-nle4f5tq8x] {
    background-color: #c82333;
}

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