/* ==========================================================
   VibronTax Professional Site Styles
   Enterprise-grade financial software styling
   ========================================================== */

@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

/* ---------- Global Body Styling ---------- */
html, body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    background: var(--body-bg, #0d1117);
    color: var(--text, #f1f5f9);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 14px;
    line-height: 1.5;
    /* Component CSS variable compatibility - dark mode defaults */
    --text-color: #e5e7eb;
    --panel-bg: rgba(255, 255, 255, 0.04);
    --input-bg: rgba(255, 255, 255, 0.05);
    --border-color: rgba(255, 255, 255, 0.12);
    --primary-color: #2563eb;
}

/* Light mode body overrides - must come after base to have higher specificity */
html.light, html.sacred-light,
body.light, body.sacred-light {
    background: var(--body-bg, #f8fafc);
    color: var(--text, #0f172a);
    /* Component CSS variable compatibility - light mode overrides */
    --text-color: #1a1f2e;
    --panel-bg: #f8f9fa;
    --input-bg: #ffffff;
    --border-color: #e0e0e0;
    --primary-color: #2563eb;
}

/* ---------- Focus States ---------- */
h1:focus {
    outline: none;
}

h1:focus-visible {
    outline: 2px solid var(--accent-primary, #2563eb);
    outline-offset: 4px;
}

/* ---------- Text Utility Overrides ---------- */
/* Dark mode muted text */
.dark .text-muted,
:not(.light):not(.sacred-light) .text-muted {
    color: var(--sacred-text-muted, #c4c9d8) !important;
}

.dark .text-secondary,
:not(.light):not(.sacred-light) .text-secondary {
    color: var(--sacred-text-dim, #b0b8cc) !important;
}

/* Light mode muted text - must be dark enough to read */
.light .text-muted,
.sacred-light .text-muted {
    color: #4a5568 !important;
}

.light .text-secondary,
.sacred-light .text-secondary {
    color: #5a6478 !important;
}

/* text-dark in dark theme becomes light text - only apply when dark mode is active */
.dark .text-dark,
:not(.light):not(.sacred-light) .text-dark {
    color: var(--sacred-text, #e2e6f0) !important;
}

.dark .text-black,
:not(.light):not(.sacred-light) .text-black {
    color: var(--sacred-text, #e2e6f0) !important;
}

.dark .text-body,
:not(.light):not(.sacred-light) .text-body {
    color: var(--sacred-text, #e2e6f0) !important;
}

.dark .text-body-secondary,
:not(.light):not(.sacred-light) .text-body-secondary {
    color: var(--sacred-text-muted, #c4c9d8) !important;
}

/* Light mode text utilities - ensure dark text */
.light .text-dark,
.sacred-light .text-dark,
.light .text-black,
.sacred-light .text-black,
.light .text-body,
.sacred-light .text-body {
    color: #1a1f2e !important;
}

.light .text-body-secondary,
.sacred-light .text-body-secondary {
    color: #4a5568 !important;
}

/* Headings and generic text */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    color: var(--text, #e2e6f0);
}

/* Light mode headings - ensure dark text */
.light h1, .light h2, .light h3, .light h4, .light h5, .light h6,
.light .h1, .light .h2, .light .h3, .light .h4, .light .h5, .light .h6,
.sacred-light h1, .sacred-light h2, .sacred-light h3, .sacred-light h4, .sacred-light h5, .sacred-light h6,
.sacred-light .h1, .sacred-light .h2, .sacred-light .h3, .sacred-light .h4, .sacred-light .h5, .sacred-light .h6 {
    color: #1a1f2e !important;
}

p, span, div, label {
    color: inherit;
}

/* Light mode paragraphs and labels - ensure dark text */
.light p, .light span, .light div, .light label,
.sacred-light p, .sacred-light span, .sacred-light div, .sacred-light label {
    color: #1a1f2e;
}

/* Lead text */
.lead {
    color: var(--text, #e2e6f0);
}

/* Light mode lead text */
.light .lead,
.sacred-light .lead {
    color: #1a1f2e !important;
}

/* Small text */
small, .small {
    color: inherit;
}

/* Strong text */
strong, b {
    color: inherit;
    font-weight: 600;
}

/* ---------- Links ---------- */
a, .btn-link {
    color: var(--sacred-primary, #2563eb);
    transition: color 0.15s ease;
    text-decoration: none;
}

a:hover {
    color: var(--sacred-accent, #0891b2);
    text-decoration: underline;
}

/* ---------- Primary Buttons ---------- */
.btn-primary {
    background: var(--sacred-primary, #2563eb);
    border: 1px solid var(--sacred-primary, #2563eb);
    color: #ffffff;
    font-weight: 500;
    transition: background-color 0.15s ease, border-color 0.15s ease;
    border-radius: 4px;
}

.btn-primary:hover,
.btn-primary:focus {
    background: #1d4ed8;
    border-color: #1d4ed8;
    color: #ffffff;
}

.btn-primary:active {
    background: #1e40af;
    border-color: #1e40af;
}

/* ---------- Secondary Buttons ---------- */
.btn-secondary {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: var(--text, #f1f5f9);
    border-radius: 4px;
}

.btn-secondary:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.20);
    color: #fff;
}

/* Light theme secondary button */
.light .btn-secondary {
    background: transparent;
    border: 1px solid rgba(0, 0, 0, 0.15);
    color: var(--text, #0f172a);
}

.light .btn-secondary:hover {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.25);
    color: #0f172a;
}

/* Light theme outline-light adjustments for contrast */
.light .btn-outline-light,
.sacred-light .btn-outline-light {
    color: #1a1f2e;
    border-color: rgba(0, 0, 0, 0.2);
}

.light .btn-outline-light:hover,
.sacred-light .btn-outline-light:hover {
    background: rgba(0, 0, 0, 0.05);
    border-color: rgba(0, 0, 0, 0.3);
    color: #1a1f2e;
}

/* ---------- Outline Buttons ---------- */
.btn-outline-primary {
    color: #2563eb;
    border-color: rgba(37, 99, 235, 0.4);
    background: transparent;
}

.btn-outline-primary:hover {
    background: rgba(37, 99, 235, 0.1);
    border-color: #2563eb;
    color: #2563eb;
}

.btn-outline-secondary {
    color: var(--text-muted, #c8cede);
    border-color: rgba(255, 255, 255, 0.15);
}

.btn-outline-secondary:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.25);
    color: var(--text, #e2e6f0);
}

/* Outline Success Button */
.btn-outline-success {
    color: #1d4ed8;
    border-color: rgba(34, 201, 151, 0.4);
    background: transparent;
}

.btn-outline-success:hover {
    background: rgba(34, 201, 151, 0.1);
    border-color: #1d4ed8;
    color: #1d4ed8;
}

.btn-outline-success:focus-visible {
    outline: 2px solid rgba(34, 201, 151, 0.5);
    outline-offset: 2px;
}

/* Outline Info Button */
.btn-outline-info {
    color: #3b82f6;
    border-color: rgba(59, 130, 246, 0.4);
    background: transparent;
}

.btn-outline-info:hover {
    background: rgba(59, 130, 246, 0.1);
    border-color: #3b82f6;
    color: #3b82f6;
}

.btn-outline-info:focus-visible {
    outline: 2px solid rgba(59, 130, 246, 0.5);
    outline-offset: 2px;
}

/* Outline Danger Button */
.btn-outline-danger {
    color: #ef5f5f;
    border-color: rgba(239, 95, 95, 0.4);
    background: transparent;
}

.btn-outline-danger:hover {
    background: rgba(239, 95, 95, 0.1);
    border-color: #ef5f5f;
    color: #ef5f5f;
}

.btn-outline-danger:focus-visible {
    outline: 2px solid rgba(239, 95, 95, 0.5);
    outline-offset: 2px;
}

/* Outline Warning Button */
.btn-outline-warning {
    color: #f5a623;
    border-color: rgba(245, 166, 35, 0.4);
    background: transparent;
}

.btn-outline-warning:hover {
    background: rgba(245, 166, 35, 0.1);
    border-color: #f5a623;
    color: #f5a623;
}

.btn-outline-warning:focus-visible {
    outline: 2px solid rgba(245, 166, 35, 0.5);
    outline-offset: 2px;
}

/* Outline Light Button */
.btn-outline-light {
    color: #e2e6f0;
    border-color: rgba(255, 255, 255, 0.4);
    background: transparent;
}

.btn-outline-light:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.7);
    color: #ffffff;
}

.light .btn-outline-light,
.sacred-light .btn-outline-light {
    color: #1a1f2e;
    border-color: rgba(26, 31, 46, 0.3);
}

.light .btn-outline-light:hover,
.sacred-light .btn-outline-light:hover {
    background: rgba(26, 31, 46, 0.08);
    border-color: rgba(26, 31, 46, 0.5);
    color: #1a1f2e;
}

/* ---------- Danger/Warning/Success Buttons ---------- */
.btn-danger {
    background: rgba(239, 95, 95, 0.9);
    border: none;
}

.btn-danger:hover {
    background: #ef5f5f;
    box-shadow: 0 4px 16px rgba(239, 95, 95, 0.3);
}

.btn-success {
    background: rgba(34, 201, 151, 0.9);
    border: none;
}

.btn-success:hover {
    background: #1d4ed8;
    box-shadow: 0 4px 16px rgba(34, 201, 151, 0.3);
}

.btn-warning {
    background: rgba(245, 166, 35, 0.9);
    border: none;
    color: #0a0d12;
}

.btn-warning:hover {
    background: #f5a623;
    box-shadow: 0 4px 16px rgba(245, 166, 35, 0.3);
}

/* ---------- Focus States for Buttons ---------- */
.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.25);
}

/* Enhanced keyboard focus-visible for accessibility */
.btn:focus-visible,
a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}

.light .btn:focus-visible,
.light a:focus-visible,
.light button:focus-visible,
.light [tabindex]:focus-visible {
    outline-color: #0d9488;
}

/* Form input focus-visible states */
.form-control:focus-visible,
.form-select:focus-visible,
.form-check-input:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
    box-shadow: none;
}

.light .form-control:focus-visible,
.light .form-select:focus-visible,
.light .form-check-input:focus-visible {
    outline-color: #0d9488;
}

/* Focus-visible for plain input/textarea elements (fallback for unclassed elements) */
input:focus-visible,
textarea:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}

.light input:focus-visible,
.light textarea:focus-visible {
    outline-color: #0d9488;
}

/* Focus fallback for links (older browser support) */
a:focus {
    outline: 1px solid rgba(37, 99, 235, 0.5);
}

/* ---------- Content Area ---------- */
.content {
    padding-top: 1.1rem;
}

/* ---------- Form Validation States ---------- */
.valid.modified:not([type=checkbox]) {
    outline: none;
    border-color: #1d4ed8 !important;
    box-shadow: 0 0 0 3px rgba(34, 201, 151, 0.15);
}

.invalid {
    outline: none;
    border-color: #ef5f5f !important;
    box-shadow: 0 0 0 3px rgba(239, 95, 95, 0.15);
}

.validation-message {
    color: #ef5f5f;
    font-size: 0.85rem;
    margin-top: 0.25rem;
    display: block;
}

/* Enhanced validation summary styling */
.validation-errors {
    background: rgba(239, 95, 95, 0.1);
    border: 1px solid rgba(239, 95, 95, 0.3);
    border-radius: 4px;
    padding: 1rem;
    margin-bottom: 1rem;
}

.validation-errors ul {
    margin: 0;
    padding-left: 1.25rem;
}

.validation-errors li {
    color: #ef5f5f;
    margin-bottom: 0.25rem;
}

/* Light theme validation styles */
.light .valid.modified:not([type=checkbox]) {
    border-color: #059669 !important;
    box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.15);
}

.light .invalid {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15);
}

.light .validation-message {
    color: #dc2626;
}

.light .validation-errors {
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.25);
}

.light .validation-errors li {
    color: #dc2626;
}

/* Bootstrap is-invalid/is-valid overrides for dark theme */
.form-control.is-invalid,
.form-select.is-invalid {
    border-color: #ef5f5f;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ef5f5f'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ef5f5f' stroke='none'/%3e%3c/svg%3e");
}

.form-control.is-invalid:focus,
.form-select.is-invalid:focus {
    border-color: #ef5f5f;
    box-shadow: 0 0 0 3px rgba(239, 95, 95, 0.25);
}

.form-control.is-valid,
.form-select.is-valid {
    border-color: #10b981;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2310b981' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
}

.form-control.is-valid:focus,
.form-select.is-valid:focus {
    border-color: #10b981;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.25);
}

.invalid-feedback {
    color: #ef5f5f;
    font-size: 0.85rem;
    margin-top: 0.25rem;
}

.valid-feedback {
    color: #10b981;
    font-size: 0.85rem;
    margin-top: 0.25rem;
}

/* Light theme is-invalid/is-valid */
.light .form-control.is-invalid,
.light .form-select.is-invalid {
    border-color: #dc2626;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc2626'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc2626' stroke='none'/%3e%3c/svg%3e");
}

.light .form-control.is-invalid:focus,
.light .form-select.is-invalid:focus {
    border-color: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.2);
}

.light .form-control.is-valid,
.light .form-select.is-valid {
    border-color: #059669;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23059669' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
}

.light .form-control.is-valid:focus,
.light .form-select.is-valid:focus {
    border-color: #059669;
    box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.2);
}

.light .invalid-feedback {
    color: #dc2626;
}

.light .valid-feedback {
    color: #059669;
}

/* Loading message styling */
.loading-message {
    text-align: center;
    margin-top: 1rem;
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.9rem;
}

.light .loading-message {
    color: rgba(0, 0, 0, 0.6);
}

/* ---------- Blazor Error UI ---------- */
#blazor-error-ui {
    background: rgba(239, 95, 95, 0.95);
    bottom: 0;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.3);
    display: none;
    left: 0;
    padding: 0.75rem 1.5rem;
    position: fixed;
    width: 100%;
    z-index: var(--z-skip-link, 9999); /* Above all modals and floating UI */
    color: #fff;
    backdrop-filter: blur(8px);
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 1rem;
    top: 0.6rem;
    color: rgba(255, 255, 255, 0.7);
}

#blazor-error-ui .dismiss:hover {
    color: #fff;
}

.blazor-error-boundary {
    background: rgba(239, 95, 95, 0.1);
    border: 1px solid rgba(239, 95, 95, 0.3);
    border-radius: 6px;
    padding: 1.25rem;
    color: #ef5f5f;
}

.blazor-error-boundary::after {
    content: "An error has occurred. Please refresh the page.";
}

/* ---------- Form Controls ---------- */
.form-control,
.form-select {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--text, #e2e6f0);
    border-radius: 4px;
    padding: 0.6rem 0.85rem;
    font-family: inherit;
    transition: all 0.2s ease;
}

.form-control:focus,
.form-select:focus {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(37, 99, 235, 0.5);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
    color: var(--text, #e2e6f0);
}

.form-control::placeholder {
    color: var(--text-muted, #c8cede);
    opacity: 0.7;
}

.light .form-control::placeholder {
    color: #6b7280; /* Improved contrast for WCAG AA compliance */
    opacity: 1;
}

.form-control:disabled,
.form-select:disabled {
    background: rgba(255, 255, 255, 0.02);
    color: var(--text-muted, #c8cede);
    cursor: not-allowed;
}

/* Light theme disabled form controls */
.light .form-control:disabled,
.light .form-select:disabled {
    background: rgba(0, 0, 0, 0.04);
    color: rgba(0, 0, 0, 0.5);
}

/* ---------- Button Disabled States ---------- */
.btn:disabled,
.btn.disabled,
button:disabled,
button.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

.btn-primary:disabled,
.btn-primary.disabled {
    background: rgba(37, 99, 235, 0.3);
    border-color: rgba(37, 99, 235, 0.2);
    color: rgba(255, 255, 255, 0.6); /* Explicit text color for accessibility */
}

.btn-secondary:disabled,
.btn-secondary.disabled,
.btn-outline-secondary:disabled,
.btn-outline-secondary.disabled {
    background: rgba(255, 255, 255, 0.02);
    border-color: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.55); /* Improved contrast for accessibility */
}

/* Light theme disabled button styles */
.light .btn:disabled,
.light .btn.disabled,
.light button:disabled {
    opacity: 0.5;
}

.light .btn-primary:disabled {
    background: rgba(26, 32, 53, 0.3);
    border-color: rgba(26, 32, 53, 0.2);
    color: rgba(26, 32, 53, 0.6);
}

.light .btn-secondary:disabled,
.light .btn-outline-secondary:disabled {
    background: rgba(0, 0, 0, 0.02);
    border-color: rgba(0, 0, 0, 0.1);
    color: rgba(0, 0, 0, 0.6);
}

/* ---------- Form Labels ---------- */
.form-label {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--text-muted, #c8cede);
    margin-bottom: 0.4rem;
}

/* ---------- Form Check (Checkbox/Radio) ---------- */
.form-check-input {
    background-color: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.2);
}

.form-check-input:checked {
    background-color: #2563eb;
    border-color: #2563eb;
}

.form-check-label {
    color: var(--text, #e2e6f0);
}

/* ---------- Input Groups ---------- */
.input-group-text {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--text-muted, #c8cede);
}

/* ---------- Cards ---------- */
.card {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.card-header {
    background: rgba(255, 255, 255, 0.02);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.75rem 1rem;
}

.card-body {
    padding: 1rem;
}

.card-footer {
    background: rgba(255, 255, 255, 0.01);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding: 0.75rem 1rem;
}

.card-title {
    color: var(--text, #f1f5f9);
    font-weight: 600;
    font-size: 0.9375rem;
    margin-bottom: 0.5rem;
}

.card-text {
    color: var(--text, #f1f5f9);
    font-size: 0.875rem;
}

.card-subtitle {
    color: var(--sacred-text-muted, #94a3b8);
    font-size: 0.8125rem;
}

/* ---------- Tables ---------- */
.table {
    color: var(--text, #f1f5f9);
    --bs-table-bg: transparent;
    --bs-table-striped-bg: rgba(255, 255, 255, 0.015);
    --bs-table-hover-bg: rgba(255, 255, 255, 0.03);
    font-size: 0.8125rem;
}

.table > :not(caption) > * > * {
    border-bottom-color: rgba(255, 255, 255, 0.06);
    padding: 0.625rem 0.875rem;
}

.table th {
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-dim, #64748b);
    background: rgba(255, 255, 255, 0.015);
    border-bottom: 2px solid rgba(255, 255, 255, 0.08) !important;
}

.table td {
    vertical-align: middle;
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    background: rgba(255, 255, 255, 0.015);
}

.table-hover > tbody > tr:hover > * {
    background: rgba(255, 255, 255, 0.03);
}

/* Table active/selected row state */
.table-active,
.table > tbody > tr.table-active,
.table > tbody > tr.table-active > td,
.table > tbody > tr.table-active > th {
    background: rgba(37, 99, 235, 0.1) !important;
    box-shadow: inset 2px 0 0 #2563eb;
}

.table > tbody > tr.table-active:hover > td,
.table > tbody > tr.table-active:hover > th {
    background: rgba(37, 99, 235, 0.15) !important;
}

/* Bootstrap table variant overrides for dark theme */
.table-warning,
.table-warning > td,
.table-warning > th {
    --bs-table-bg: rgba(242, 194, 107, 0.12);
    --bs-table-color: var(--text, #e2e6f0);
    background-color: rgba(242, 194, 107, 0.12) !important;
    color: var(--text, #e2e6f0);
}

.table-warning:hover > td,
.table-warning:hover > th {
    --bs-table-hover-bg: rgba(242, 194, 107, 0.18);
    background-color: rgba(242, 194, 107, 0.18) !important;
}

.light .table-warning,
.light .table-warning > td,
.light .table-warning > th,
.sacred-light .table-warning,
.sacred-light .table-warning > td,
.sacred-light .table-warning > th {
    --bs-table-bg: rgba(255, 193, 7, 0.15);
    background-color: rgba(255, 193, 7, 0.15) !important;
    color: var(--text, #1a1f2e);
}

/* table-danger (for emphasizing important rows like totals) */
.table-danger,
.table-danger > td,
.table-danger > th {
    --bs-table-bg: rgba(239, 95, 95, 0.12);
    --bs-table-color: var(--text, #e2e6f0);
    background-color: rgba(239, 95, 95, 0.12) !important;
    color: var(--text, #e2e6f0);
}

.table-danger:hover > td,
.table-danger:hover > th {
    --bs-table-hover-bg: rgba(239, 95, 95, 0.18);
    background-color: rgba(239, 95, 95, 0.18) !important;
}

.light .table-danger,
.light .table-danger > td,
.light .table-danger > th,
.sacred-light .table-danger,
.sacred-light .table-danger > td,
.sacred-light .table-danger > th {
    --bs-table-bg: rgba(220, 53, 69, 0.12);
    background-color: rgba(220, 53, 69, 0.12) !important;
    color: var(--text, #1a1f2e);
}

/* table-success (for paid/completed items) */
.table-success,
.table-success > td,
.table-success > th {
    --bs-table-bg: rgba(34, 201, 151, 0.12);
    --bs-table-color: var(--text, #e2e6f0);
    background-color: rgba(34, 201, 151, 0.12) !important;
    color: var(--text, #e2e6f0);
}

.table-success:hover > td,
.table-success:hover > th {
    --bs-table-hover-bg: rgba(34, 201, 151, 0.18);
    background-color: rgba(34, 201, 151, 0.18) !important;
}

.light .table-success,
.light .table-success > td,
.light .table-success > th,
.sacred-light .table-success,
.sacred-light .table-success > td,
.sacred-light .table-success > th {
    --bs-table-bg: rgba(25, 135, 84, 0.12);
    background-color: rgba(25, 135, 84, 0.12) !important;
    color: var(--text, #1a1f2e);
}

/* ---------- Badges ---------- */
.badge {
    font-weight: 500;
    font-size: 0.75rem;
    padding: 0.4em 0.7em;
    border-radius: 6px;
}

.badge.bg-primary,
.bg-primary {
    background: rgba(37, 99, 235, 0.15) !important;
    color: #2563eb !important;
}

.badge.bg-secondary,
.bg-secondary {
    background: rgba(255, 255, 255, 0.08) !important;
    color: var(--text-muted, #c8cede) !important;
}

.badge.bg-success,
.bg-success {
    background: rgba(34, 201, 151, 0.15) !important;
    color: #1d4ed8 !important;
}

.badge.bg-danger,
.bg-danger {
    background: rgba(239, 95, 95, 0.15) !important;
    color: #ef5f5f !important;
}

.badge.bg-warning,
.bg-warning {
    background: rgba(245, 166, 35, 0.15) !important;
    color: #f5a623 !important;
}

.badge.bg-info,
.bg-info {
    background: rgba(59, 130, 246, 0.15) !important;
    color: #3b82f6 !important;
}

.badge.bg-light {
    background: rgba(255, 255, 255, 0.1) !important;
    color: var(--text, #e2e6f0) !important;
}

.badge.bg-dark {
    background: rgba(0, 0, 0, 0.3) !important;
    color: var(--text, #e2e6f0) !important;
}

/* General bg-light override for dark theme (non-badge containers) */
.bg-light:not(.badge) {
    background-color: rgba(255, 255, 255, 0.04) !important;
    color: var(--text, #e2e6f0);
}

.light .bg-light:not(.badge) {
    background-color: #f8f9fa !important;
    color: #212529;
}

/* ---------- Alerts ---------- */
.alert {
    border-radius: 4px;
    border: 1px solid;
    backdrop-filter: blur(8px);
    padding: 0.875rem 1rem;
}

.alert-primary {
    background: rgba(37, 99, 235, 0.1);
    border-color: rgba(37, 99, 235, 0.25);
    color: #2563eb;
}

.alert-secondary {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.1);
    color: var(--text, #e2e6f0);
}

.alert-success {
    background: rgba(34, 197, 94, 0.1);
    border-color: rgba(34, 197, 94, 0.25);
    color: #166534;
}

.alert-danger {
    background: rgba(239, 95, 95, 0.1);
    border-color: rgba(239, 95, 95, 0.25);
    color: #ef5f5f;
}

.alert-warning {
    background: rgba(245, 166, 35, 0.1);
    border-color: rgba(245, 166, 35, 0.25);
    color: #f5a623;
}

.alert-info {
    background: rgba(59, 130, 246, 0.1);
    border-color: rgba(59, 130, 246, 0.25);
    color: #3b82f6;
}

.alert-light {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.15);
    color: var(--text, #e2e6f0);
}

.alert-dark {
    background: rgba(0, 0, 0, 0.2);
    border-color: rgba(0, 0, 0, 0.3);
    color: var(--text, #e2e6f0);
}

/* ---------- Modals ---------- */
.modal-content {
    background: rgba(18, 22, 32, 0.98);
    border: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(8px);
    border-radius: 6px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

.modal-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    padding: 1.25rem 1.5rem;
}

.modal-title {
    font-weight: 600;
    color: var(--text, #e2e6f0);
}

.modal-body {
    padding: 1.5rem;
}

.modal-footer {
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding: 1rem 1.5rem;
}

.modal-backdrop.show {
    opacity: 0.7;
    backdrop-filter: blur(4px);
}

.btn-close {
    filter: invert(1) brightness(0.8);
    opacity: 0.6;
}

.btn-close:hover {
    opacity: 1;
}

/* ---------- Dropdown Menus ---------- */
.dropdown-menu {
    background: rgba(18, 22, 32, 0.98);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(12px);
    padding: 0.375rem;
}

.dropdown-item {
    color: var(--text, #e2e6f0);
    border-radius: 6px;
    padding: 0.5rem 0.85rem;
    transition: all 0.15s ease;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background: rgba(37, 99, 235, 0.1);
    color: #2563eb;
}

.dropdown-item.active,
.dropdown-item:active {
    background: rgba(37, 99, 235, 0.15);
    color: #2563eb;
}

.dropdown-divider {
    border-color: rgba(255, 255, 255, 0.08);
    margin: 0.35rem 0;
}

/* ---------- Nav Tabs & Pills ---------- */
.nav-tabs {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

.nav-tabs .nav-link {
    color: var(--text-muted, #c8cede);
    border: none;
    border-bottom: 2px solid transparent;
    background: transparent;
    padding: 0.75rem 1.25rem;
    transition: all 0.2s ease;
}

.nav-tabs .nav-link:hover {
    color: var(--text, #e2e6f0);
    border-bottom-color: rgba(37, 99, 235, 0.3);
}

.nav-tabs .nav-link.active {
    color: #2563eb;
    background: transparent;
    border-bottom-color: #2563eb;
}

.nav-pills .nav-link {
    color: var(--text-muted, #c8cede);
    border-radius: 4px;
    padding: 0.6rem 1rem;
    transition: all 0.2s ease;
}

.nav-pills .nav-link:hover {
    background: rgba(255, 255, 255, 0.05);
    color: var(--text, #e2e6f0);
}

.nav-pills .nav-link.active {
    background: rgba(37, 99, 235, 0.12);
    color: #2563eb;
}

/* ---------- Progress Bars ---------- */
.progress {
    background: rgba(255, 255, 255, 0.06);
    border-radius: 4px;
    height: 8px;
    overflow: hidden;
}

.progress-bar {
    background: linear-gradient(90deg, #2563eb, #3b82f6);
    border-radius: 4px;
}

.progress-bar.bg-success {
    background: linear-gradient(90deg, #1d4ed8, #2563eb) !important;
}

.progress-bar.bg-danger {
    background: linear-gradient(90deg, #ef5f5f, #ff8a8a) !important;
}

.progress-bar.bg-warning {
    background: linear-gradient(90deg, #f5a623, #ffc107) !important;
}

/* ---------- List Groups ---------- */
.list-group {
    border-radius: 4px;
    overflow: hidden;
}

.list-group-item {
    background: rgba(255, 255, 255, 0.02);
    border-color: rgba(255, 255, 255, 0.06);
    color: var(--text, #e2e6f0);
    padding: 0.85rem 1.15rem;
}

.list-group-item:hover {
    background: rgba(255, 255, 255, 0.04);
}

.list-group-item.active {
    background: rgba(37, 99, 235, 0.12);
    border-color: rgba(37, 99, 235, 0.2);
    color: #2563eb;
}

.list-group-item-action:hover {
    background: rgba(37, 99, 235, 0.06);
    color: var(--text, #e2e6f0);
}

/* ---------- Pagination ---------- */
.pagination {
    gap: 0.25rem;
}

.page-item .page-link {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--text-muted, #c8cede);
    border-radius: 4px;
    padding: 0.5rem 0.85rem;
    transition: all 0.2s ease;
}

.page-item .page-link:hover {
    background: rgba(37, 99, 235, 0.1);
    border-color: rgba(37, 99, 235, 0.3);
    color: #2563eb;
}

.page-item.active .page-link {
    background: linear-gradient(135deg, #2563eb, #3b82f6);
    border-color: transparent;
    color: #0a0d12;
}

.page-item.disabled .page-link {
    background: rgba(255, 255, 255, 0.02);
    color: var(--text-muted, #c8cede);
    opacity: 0.5;
}

/* ---------- Breadcrumbs ---------- */
.breadcrumb {
    background: rgba(255, 255, 255, 0.03);
    border-radius: 4px;
    padding: 0.75rem 1rem;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: var(--text-muted, #c8cede);
}

.breadcrumb-item a {
    color: var(--text-muted, #c8cede);
}

.breadcrumb-item a:hover {
    color: #2563eb;
}

.breadcrumb-item.active {
    color: var(--text, #e2e6f0);
}

/* ---------- Spinners ---------- */
.spinner-border {
    border-color: rgba(37, 99, 235, 0.2);
    border-right-color: #2563eb;
}

.spinner-grow {
    background-color: #2563eb;
}

/* ---------- Tooltips ---------- */
.tooltip-inner {
    background: rgba(18, 22, 32, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
}

.bs-tooltip-top .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before {
    border-top-color: rgba(18, 22, 32, 0.95);
}

.bs-tooltip-bottom .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before {
    border-bottom-color: rgba(18, 22, 32, 0.95);
}

/* ---------- Popovers ---------- */
.popover {
    background: rgba(18, 22, 32, 0.98);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
}

.popover-header {
    background: rgba(255, 255, 255, 0.03);
    border-bottom-color: rgba(255, 255, 255, 0.08);
    color: var(--text, #e2e6f0);
    font-weight: 600;
}

.popover-body {
    color: var(--text-muted, #c8cede);
}

/* ---------- Toasts ---------- */
.toast {
    background: rgba(18, 22, 32, 0.98);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    backdrop-filter: blur(12px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
}

.toast-header {
    background: rgba(255, 255, 255, 0.03);
    border-bottom-color: rgba(255, 255, 255, 0.08);
    color: var(--text, #e2e6f0);
}

.toast-body {
    color: var(--text-muted, #c8cede);
}

/* ---------- Accordion ---------- */
.accordion-item {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.accordion-button {
    background: rgba(255, 255, 255, 0.03);
    color: var(--text, #e2e6f0);
    font-weight: 500;
}

.accordion-button:not(.collapsed) {
    background: rgba(37, 99, 235, 0.08);
    color: #2563eb;
    box-shadow: none;
}

.accordion-button:focus {
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
    border-color: rgba(37, 99, 235, 0.3);
}

.accordion-button::after {
    filter: invert(1) brightness(0.6);
}

.accordion-body {
    background: rgba(255, 255, 255, 0.01);
    color: var(--text-muted, #c8cede);
}

/* ---------- Close Button ---------- */
.btn-close {
    filter: invert(1) brightness(0.7);
}

.btn-close:hover {
    filter: invert(1) brightness(1);
}

/* ---------- Text Utilities Override ---------- */
.text-muted {
    color: var(--text-muted, #c8cede) !important;
}

.text-primary {
    color: #2563eb !important;
}

.text-secondary {
    color: #3b82f6 !important;
}

.text-success {
    color: #1d4ed8 !important;
}

.text-danger {
    color: #ef5f5f !important;
}

.text-warning {
    color: #f5a623 !important;
}

.text-info {
    color: #3b82f6 !important;
}

/* ---------- Borders ---------- */
.border {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.border-top,
.border-bottom,
.border-start,
.border-end {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.border-primary {
    border-color: rgba(37, 99, 235, 0.4) !important;
}

.border-secondary {
    border-color: rgba(59, 130, 246, 0.4) !important;
}

/* ---------- Shadows ---------- */
.shadow-sm {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
}

.shadow {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
}

.shadow-lg {
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.3) !important;
}

/* ---------- Scrollbar Styling ---------- */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.12);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.2);
}

/* Firefox scrollbar */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.12) transparent;
}

/* ---------- Selection ---------- */
::selection {
    background: rgba(37, 99, 235, 0.3);
    color: #fff;
}

/* ---------- Responsive Tables ---------- */
@media (max-width: 767.98px) {
    .table td, .table th {
        white-space: nowrap;
        font-size: 0.85rem;
    }
    .table .btn-sm {
        padding: 0.2rem 0.4rem;
        font-size: 0.75rem;
    }
    .card > .table-responsive {
        margin: -0.5rem;
    }
}

/* ---------- Custom Utilities ---------- */
.sacred-glow {
    box-shadow: none;
}

.sacred-card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 6px;
    backdrop-filter: blur(8px);
}

.sacred-gradient-text {
    background: linear-gradient(135deg, #2563eb, #3b82f6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ---------- Animation Utilities (Disabled for Professional Look) ---------- */
.animate-pulse {
    /* Disabled: animation: sacred-pulse 2s ease-in-out infinite; */
}

.animate-glow {
    /* Disabled: animation: sacred-glow-pulse 2s ease-in-out infinite; */
}

/* ---------- Light Theme Overrides ---------- */
.light .form-control,
.light .form-select {
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(0, 0, 0, 0.1);
    color: #1a1f2e;
}

.light .card {
    background: rgba(255, 255, 255, 0.85);
    border-color: rgba(0, 0, 0, 0.08);
}

.light .table {
    color: #1a1f2e;
}

.light .table th {
    color: #4a5568; /* Improved WCAG AA contrast */
    background: rgba(0, 0, 0, 0.02);
}

.light .dropdown-menu {
    background: rgba(255, 255, 255, 0.98);
    border-color: rgba(0, 0, 0, 0.1);
}

.light .dropdown-item {
    color: #1a1f2e;
}

.light .dropdown-item:hover,
.light .dropdown-item:focus {
    background: rgba(37, 99, 235, 0.08);
    color: #1e40af;
}

.light .dropdown-item.active,
.light .dropdown-item:active {
    background: rgba(37, 99, 235, 0.12);
    color: #1e40af;
}

.light .modal-content {
    background: rgba(255, 255, 255, 0.98);
    border-color: rgba(0, 0, 0, 0.1);
}

.light .btn-close {
    filter: none;
}

.light .accordion-button::after {
    filter: none;
}

.light .accordion-item {
    background: #ffffff;
    border-color: rgba(0, 0, 0, 0.08);
}

.light .accordion-button {
    background: #f8f9fa;
    color: #1a1f2e;
}

.light .accordion-button:not(.collapsed) {
    background: rgba(37, 99, 235, 0.06);
    color: #059669;
}

.light .accordion-body {
    background: #ffffff;
    color: #4a5568;
}

/* Light mode list groups */
.light .list-group-item {
    background: #ffffff;
    border-color: rgba(0, 0, 0, 0.08);
    color: #1a1f2e;
}

.light .list-group-item:hover {
    background: #f8f9fa;
}

.light .list-group-item.active {
    background: rgba(37, 99, 235, 0.12);
    border-color: rgba(37, 99, 235, 0.2);
    color: #059669;
}

/* Light mode pagination */
.light .page-item .page-link {
    background: #ffffff;
    border-color: rgba(0, 0, 0, 0.1);
    color: #4a5568;
}

.light .page-item .page-link:hover {
    background: rgba(37, 99, 235, 0.08);
    border-color: rgba(37, 99, 235, 0.2);
    color: #059669;
}

.light .page-item.active .page-link {
    color: #ffffff;
}

.light ::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
}

.light ::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.25);
}

/* Light theme text colors for better contrast */
.light .text-muted {
    color: #5f6a80 !important; /* WCAG AA compliant ~5:1 ratio */
}

.light .text-secondary {
    color: #4a5568 !important;
}

.light .small.text-muted,
.light small.text-muted {
    color: #4b5563 !important; /* Improved contrast for small text - WCAG AA compliant */
}

/* ═══════════════════════════════════════════════════════════
   SACRED AI CHAT PANEL
   ═══════════════════════════════════════════════════════════ */

.sacred-chat-panel {
    background: rgba(255, 255, 255, 0.02);
    border-radius: 6px;
    padding: 0.875rem;
}

.sacred-chat-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    margin-bottom: 0.75rem;
}

.sacred-chat-icon {
    font-size: 1.25rem;
    color: #2563eb;
    filter: none;
}

.sacred-chat-header h6 {
    color: var(--text, #e2e6f0);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.sacred-chat-input {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: var(--text, #e2e6f0) !important;
    resize: none;
}

.sacred-chat-input::placeholder {
    color: var(--text-muted, #c8cede) !important;
}

.sacred-chat-input:focus {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(37, 99, 235, 0.3) !important;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15) !important;
}

.sacred-chat-history {
    background: rgba(0, 0, 0, 0.2) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: var(--text, #e2e6f0) !important;
    border-radius: 4px !important;
}

.sacred-chat-history strong {
    color: #3b82f6;
}

.sacred-chat-history > div {
    padding: 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.sacred-chat-history > div:last-child {
    border-bottom: none;
}

/* ═══════════════════════════════════════════════════════════
   SACRED ENTITY SELECTOR
   ═══════════════════════════════════════════════════════════ */

.entity-selector {
    background: rgba(255, 255, 255, 0.03);
    padding: 0.625rem 0.875rem;
    border-radius: 4px;
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.entity-selector label {
    color: var(--text-muted, #c8cede);
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.05em;
}

.entity-selector .form-select {
    background-color: rgba(0, 0, 0, 0.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: var(--text, #e2e6f0) !important;
}

.entity-selector .form-select:focus {
    background-color: rgba(0, 0, 0, 0.4) !important;
    border-color: rgba(37, 99, 235, 0.3) !important;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15) !important;
}

.entity-selector .form-select option {
    background-color: #1a1f2e;
    color: var(--text, #e2e6f0);
}

.entity-selector .btn-outline-secondary {
    border-color: rgba(255, 255, 255, 0.15);
    color: var(--text-muted, #c8cede);
}

.entity-selector .btn-outline-secondary:hover {
    background: rgba(37, 99, 235, 0.1);
    border-color: rgba(37, 99, 235, 0.3);
    color: #2563eb;
}

/* ═══════════════════════════════════════════════════════════
   SACRED UTILITY CLASSES
   ═══════════════════════════════════════════════════════════ */

/* Selected card state (replaces bg-light) */
.sacred-card-selected {
    background: rgba(37, 99, 235, 0.08) !important;
    border-color: rgba(37, 99, 235, 0.4) !important;
}

/* Summary card (replaces bg-light) */
.sacred-summary-card {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* Toolbar (replaces background:#fff) */
.sacred-toolbar {
    background: rgba(15, 17, 24, 0.95) !important;
    backdrop-filter: blur(8px);
    border-radius: 4px;
    padding: 0.5rem !important;
}

/* Pending import section (replaces background:#fffef7) */
.sacred-pending-import {
    background: rgba(255, 193, 7, 0.08) !important;
    border-color: rgba(255, 193, 7, 0.25) !important;
}

.sacred-pending-import strong {
    color: #ffc107;
}

/* Empty state card (replaces bg-light-subtle, border-info) */
.sacred-empty-card {
    background: rgba(37, 99, 235, 0.05) !important;
    border: 1px solid rgba(37, 99, 235, 0.15) !important;
}

.sacred-empty-card .card-title {
    color: #3b82f6;
}

.sacred-empty-card .card-text {
    color: var(--text-muted, #c8cede);
}

/* Muted badge (replaces bg-light text-dark) */
.sacred-badge-muted {
    background: rgba(255, 255, 255, 0.1) !important;
    color: var(--text-muted, #c8cede) !important;
}

/* ---------- Setup Card (First-time onboarding) ---------- */
.sacred-setup-card {
    background: rgba(37, 99, 235, 0.05);
    border: 1px solid rgba(37, 99, 235, 0.2);
    border-radius: 6px;
    padding: 2rem 1.5rem;
    text-align: center;
}

.sacred-setup-icon {
    font-size: 3rem;
    color: #2563eb;
    margin-bottom: 1rem;
    filter: none;
    animation: none;
}

@keyframes sacred-pulse-scale {
    /* Disabled for professional look */
    0%, 100% { transform: none; opacity: 1; }
    50% { transform: none; opacity: 1; }
}

.sacred-setup-card h4 {
    color: var(--text, #e2e6f0);
    margin-bottom: 0.5rem;
}

/* ---------- Progress Card (Ingestion feedback) ---------- */
.sacred-progress-card {
    background: rgba(15, 17, 24, 0.95) !important;
    border: 1px solid rgba(37, 99, 235, 0.3) !important;
    backdrop-filter: blur(10px);
}

.sacred-progress-card .progress {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    overflow: hidden;
}

.sacred-progress-card .progress-bar {
    background: linear-gradient(90deg, #2563eb, #3b82f6);
}

/* ============================================
   FLOATING AI SIDE PANEL
   ============================================ */

.floating-ai {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: var(--z-floating, 1000);
    font-family: 'Inter', system-ui, sans-serif;
}

.floating-ai-trigger {
    width: 52px;
    height: 52px;
    border-radius: 4px;
    background: #2563eb;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease;
    position: relative;
}

.floating-ai-trigger:hover {
    background: #1d4ed8;
    box-shadow: 0 4px 16px rgba(37, 99, 235, 0.4);
}

.floating-ai-trigger.active {
    opacity: 0.85;
    background: #1e40af;
}

.floating-ai-trigger .trigger-icon {
    font-size: 24px;
    color: #0a0b0d;
}

.floating-ai-trigger .trigger-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 12px;
    height: 12px;
    background: #ff6b6b;
    border-radius: 50%;
    border: 2px solid #0a0b0d;
}

/* Side Panel */
/* Note: Panel visibility is now controlled by Blazor conditional rendering in FloatingAI.razor */
/* The .floating-ai-panel is only rendered when isOpen=true, so no need for display:none */
.floating-ai-panel {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: fixed !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 400px;
    max-width: 90vw;
    background: #0a0b0d !important;
    border-left: 1px solid rgba(37, 99, 235, 0.3);
    flex-direction: column;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.5);
    z-index: 9000 !important;
    backdrop-filter: blur(12px);
}

/* Header */
.floating-ai-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid rgba(37, 99, 235, 0.2);
    background: rgba(15, 17, 24, 0.9);
}

.floating-ai-title {
    display: flex;
    align-items: center;
    gap: 12px;
}

.floating-ai-title .ai-glyph {
    font-size: 24px;
    color: #2563eb;
}

.floating-ai-title .title-stack {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.floating-ai-title .title-stack span:first-child {
    font-weight: 600;
    font-size: 1.05rem;
    color: #e8e9eb;
}

.floating-ai-title .model-badge {
    font-size: 0.7rem;
    color: rgba(37, 99, 235, 0.8);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.floating-ai-actions {
    display: flex;
    gap: 8px;
}

.floating-ai-actions .btn-icon {
    width: 44px;
    height: 44px;
    min-width: 44px; /* WCAG 2.5.5 touch target size */
    min-height: 44px;
    border: none;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 6px;
    color: rgba(255, 255, 255, 0.85); /* Improved contrast */
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: all 0.2s;
}

.floating-ai-actions .btn-icon:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

/* Messages Area */
.floating-ai-messages {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Welcome State */
.ai-welcome {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 32px 16px;
    gap: 20px;
}

.ai-welcome-icon {
    font-size: 48px;
    color: #2563eb;
    opacity: 0.8;
}

.ai-welcome-text {
    font-size: 1.15rem;
    color: #e8e9eb;
    font-weight: 500;
}

.ai-quick-categories {
    display: flex;
    flex-direction: column;
    gap: 18px;
    width: 100%;
    margin-top: 12px;
}

.quick-category {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.category-label {
    font-size: 0.72rem;
    color: rgba(37, 99, 235, 0.7);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    font-weight: 600;
}

.ai-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
}

.ai-quick-actions button {
    padding: 8px 14px;
    border: 1px solid rgba(37, 99, 235, 0.3);
    background: rgba(37, 99, 235, 0.08);
    border-radius: 4px;
    color: #e8e9eb;
    font-size: 0.82rem;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease;
    white-space: nowrap;
}

.ai-quick-actions button:hover {
    background: rgba(37, 99, 235, 0.18);
    border-color: rgba(37, 99, 235, 0.5);
}

/* Messages */
.ai-message {
    display: flex;
    flex-direction: column;
    max-width: 90%;
}

.ai-message.user {
    align-self: flex-end;
}

.ai-message.assistant {
    align-self: flex-start;
}

.ai-message-content {
    padding: 10px 14px;
    border-radius: 4px;
    font-size: 0.875rem;
    line-height: 1.5;
    word-wrap: break-word;
}

.ai-message.user .ai-message-content {
    background: rgba(37, 99, 235, 0.15);
    border: 1px solid rgba(37, 99, 235, 0.25);
    color: #e8e9eb;
    border-bottom-right-radius: 2px;
}

.ai-message.assistant .ai-message-content {
    background: rgba(30, 33, 40, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #d5d8dd;
    border-bottom-left-radius: 2px;
}

/* Typing Indicator */
.ai-message.thinking .ai-typing {
    display: flex;
    gap: 6px;
    padding: 16px;
}

.ai-typing span {
    width: 8px;
    height: 8px;
    background: #2563eb;
    border-radius: 50%;
    animation: typing 1.4s infinite ease-in-out;
}

.ai-typing span:nth-child(2) { animation-delay: 0.2s; }
.ai-typing span:nth-child(3) { animation-delay: 0.4s; }

@keyframes typing {
    0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
    40% { transform: scale(1); opacity: 1; }
}

/* Sources */
.ai-sources {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
    padding-left: 16px;
}

.sources-label {
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.5);
    margin-right: 4px;
}

.source-tag {
    font-size: 0.68rem;
    padding: 2px 6px;
    background: rgba(59, 130, 246, 0.15);
    border-radius: 2px;
    color: rgba(59, 130, 246, 0.9);
}

/* Input Area */
.floating-ai-input {
    display: flex;
    gap: 10px;
    padding: 12px 16px;
    border-top: 1px solid rgba(37, 99, 235, 0.2);
    background: rgba(15, 17, 24, 0.95);
}

.floating-ai-input input {
    flex: 1;
    padding: 12px 16px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 4px;
    color: #e8e9eb;
    font-size: 0.92rem;
    outline: none;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.floating-ai-input input::placeholder {
    color: rgba(255, 255, 255, 0.6); /* Improved contrast for accessibility */
}

.floating-ai-input input:focus {
    border-color: rgba(37, 99, 235, 0.5);
    background: rgba(255, 255, 255, 0.08);
}

.floating-ai-input input:focus-visible {
    outline: 2px solid var(--accent-primary, #2563eb);
    outline-offset: 2px;
}

.floating-ai-input input:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.floating-ai-input button {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: none;
    background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%);
    color: #0a0b0d;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    transition: all 0.2s;
}

.floating-ai-input button:hover:not(:disabled) {
    background-color: #1d4ed8;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.3);
}

.floating-ai-input button:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Minimized State */
.floating-ai.minimized .floating-ai-panel {
    height: 60px;
    overflow: hidden;
}

.floating-ai.minimized .floating-ai-messages,
.floating-ai.minimized .floating-ai-input {
    display: none;
}

/* Responsive - Tablet */
@media (max-width: 768px) {
    .floating-ai-panel {
        width: 100%;
        max-width: 100vw;
        border-left: none;
        border-radius: 0;
    }

    .floating-ai-trigger {
        width: 56px;
        height: 56px;
        bottom: 20px;
        right: 20px;
    }

    .floating-ai-header {
        padding: 14px 16px;
    }

    .floating-ai-input-container {
        padding: 12px;
    }

    .floating-ai-quick-actions button {
        font-size: 0.82rem;
        padding: 8px 12px;
    }
}

/* Responsive - Mobile */
@media (max-width: 480px) {
    .floating-ai-panel {
        width: 100%;
        max-width: 100vw;
    }

    .floating-ai-trigger {
        width: 52px;
        height: 52px;
        bottom: 16px;
        right: 16px;
    }

    .floating-ai-header {
        padding: 12px;
    }

    .floating-ai-title .title-stack span:first-child {
        font-size: 0.95rem;
    }

    .ai-quick-actions button {
        font-size: 0.75rem;
        padding: 6px 10px;
    }

    .ai-welcome-text {
        font-size: 1rem;
    }
}

/* ---------- Responsive Tables ---------- */
/* Make tables scrollable on small screens */
.table-responsive-wrapper {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 768px) {
    .table {
        font-size: 0.85rem;
    }

    .table th,
    .table td {
        padding: 0.5rem 0.4rem;
        white-space: nowrap;
    }

    /* Allow content area to scroll for wide tables */
    .card-body:has(> table),
    .card-body:has(> .table-responsive) {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Stack form controls in table cells on mobile */
    .table .btn-group {
        display: flex;
        flex-direction: column;
        gap: 0.25rem;
    }

    .table .btn-group .btn {
        width: 100%;
    }
}

@media (max-width: 576px) {
    .table {
        font-size: 0.8rem;
    }

    .table th,
    .table td {
        padding: 0.4rem 0.3rem;
    }

    /* Hide less important columns on very small screens */
    .table .d-sm-none {
        display: none !important;
    }
}

/* ---------- Theme-Adaptive Component Styles ---------- */

/* AIChat pending document item (dark theme default) */
.sacred-pending-doc-item {
    background: rgba(255, 255, 255, 0.08);
}

/* TaxKnowledge source item (dark theme default) */
.sacred-source-item {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Light theme overrides */
.sacred-light .sacred-pending-doc-item {
    background: rgba(0, 0, 0, 0.03);
}

.sacred-light .sacred-source-item {
    background: rgba(0, 0, 0, 0.03);
    border-color: rgba(0, 0, 0, 0.08);
}

/* Light mode overrides for FloatingAI */
.sacred-light .floating-ai-panel {
    background: rgba(255, 255, 255, 0.98);
    border-left-color: rgba(37, 99, 235, 0.3);
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.15);
}

.sacred-light .floating-ai-header {
    background: rgba(247, 248, 252, 0.95);
    border-bottom-color: rgba(37, 99, 235, 0.2);
}

.sacred-light .floating-ai-title .ai-glyph {
    color: #2563eb;
}

.sacred-light .floating-ai-title .title-stack span:first-child {
    color: #1a1f2e;
}

.sacred-light .floating-ai-title .model-badge {
    color: rgba(37, 99, 235, 0.9);
}

.sacred-light .floating-ai-actions .btn-icon {
    background: rgba(0, 0, 0, 0.05);
    color: rgba(0, 0, 0, 0.6);
}

.sacred-light .floating-ai-actions .btn-icon:hover {
    background: rgba(0, 0, 0, 0.1);
    color: #1a1f2e;
}

.sacred-light .ai-welcome-text {
    color: #4a5568;
}

.sacred-light .ai-quick-actions button {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.1);
    color: #2d3748;
}

.sacred-light .ai-quick-actions button:hover {
    background: rgba(37, 99, 235, 0.1);
    border-color: #2563eb;
}

.sacred-light .category-label {
    color: #718096;
}

.sacred-light .ai-message.user {
    background: rgba(37, 99, 235, 0.1);
}

.sacred-light .ai-message.user .ai-message-content {
    color: #1a1f2e;
}

.sacred-light .ai-message.assistant .ai-message-content {
    color: #2d3748;
}

.sacred-light .floating-ai-input input {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.1);
    color: #1a1f2e;
}

.sacred-light .floating-ai-input input::placeholder {
    color: #718096;
}

.sacred-light .floating-ai-input button {
    background: #2563eb;
}

.sacred-light .pending-file-chip {
    background: rgba(0, 0, 0, 0.05);
    border-color: rgba(0, 0, 0, 0.1);
    color: #2d3748;
}

.sacred-light .ai-thinking-label {
    color: #718096;
}

/* ---------- Print Styles ---------- */
@media print {
    /* Hide non-essential UI elements */
    .app-nav,
    .app-header,
    .mobile-nav-toggle,
    .mobile-nav-overlay,
    .floating-ai,
    .floating-ai-trigger,
    .toast-container,
    .contextual-assistant,
    .btn:not(.btn-print),
    .header-actions,
    .checkin-trigger,
    .help-trigger,
    .theme-toggle,
    .llm-command-bar,
    .sacred-ambient,
    .quick-actions-fab,
    .daily-checkin-modal,
    .onboarding-modal,
    .ksh-modal,
    footer,
    .no-print {
        display: none !important;
    }

    /* Reset backgrounds and colors */
    body,
    .app-shell,
    .app-body,
    .app-main {
        background: white !important;
        color: black !important;
    }

    /* Adjust main content for printing */
    .app-main,
    .app-body {
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .app-shell {
        display: block !important;
        grid-template-columns: 1fr !important;
    }

    /* Card styling for print */
    .card,
    .sacred-card,
    .metric,
    .metric-card {
        background: white !important;
        border: 1px solid #ccc !important;
        box-shadow: none !important;
        page-break-inside: avoid;
        margin-bottom: 1rem !important;
    }

    /* Table styling for print */
    .table {
        border-collapse: collapse !important;
    }

    .table th,
    .table td {
        border: 1px solid #ccc !important;
        background: white !important;
        color: black !important;
        padding: 0.5rem !important;
    }

    .table th {
        background: #f5f5f5 !important;
        font-weight: bold !important;
    }

    /* Ensure text is readable */
    h1, h2, h3, h4, h5, h6,
    p, span, div, td, th, li {
        color: black !important;
    }

    /* Financial reports specific */
    .reports .grid,
    .metric-grid {
        display: block !important;
    }

    .reports .card,
    .metric {
        width: 100% !important;
        margin-bottom: 1.5rem !important;
    }

    /* Ensure URLs are visible in links */
    a[href]::after {
        content: " (" attr(href) ")";
        font-size: 0.8em;
        font-style: italic;
    }

    a[href^="#"]::after,
    a[href^="javascript"]::after {
        content: "";
    }

    /* Page breaks */
    h1, h2, h3 {
        page-break-after: avoid;
    }

    .page-break {
        page-break-before: always;
    }

    /* Show print-only elements */
    .print-only {
        display: block !important;
    }
}

/* ==========================================================
   COMPREHENSIVE LIGHT/DAWN MODE TEXT FIXES
   Ensures all text is readable on light backgrounds
   ========================================================== */

/* Base text color for light mode */
.light,
.light body,
.sacred-light,
.sacred-light body {
    color: var(--text, #1a1f2e);
}

/* Headings in light mode */
.light h1, .light h2, .light h3, .light h4, .light h5, .light h6,
.light .h1, .light .h2, .light .h3, .light .h4, .light .h5, .light .h6,
.sacred-light h1, .sacred-light h2, .sacred-light h3, .sacred-light h4, .sacred-light h5, .sacred-light h6 {
    color: #1a1f2e;
}

/* Ghost buttons in light mode */
.light .btn.ghost,
.light .ghost,
.sacred-light .btn.ghost {
    background: rgba(0, 0, 0, 0.04);
    color: #1a1f2e;
    border-color: rgba(0, 0, 0, 0.12);
}

.light .btn.ghost:hover,
.light .ghost:hover,
.sacred-light .btn.ghost:hover {
    background: rgba(0, 0, 0, 0.08);
    color: #1a1f2e;
}

/* Select dropdowns in light mode */
.light select,
.light .view-select,
.light .entity-filter,
.light .report-filter,
.light .dash-year,
.light .dash-view,
.sacred-light select {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(0, 0, 0, 0.12);
    color: #1a1f2e;
}

/* Card and panel headers in light mode */
.light .card-header,
.light .panel-header,
.light .section-header,
.sacred-light .card-header {
    color: #1a1f2e;
}

/* Links and badge text in light mode */
.light a,
.light .btn-link,
.sacred-light a {
    color: #059669;
}

.light a:hover,
.sacred-light a:hover {
    color: #047857;
}

/* Input chips and suggestion chips in light mode */
.light .suggestion-chip,
.light .chip,
.sacred-light .suggestion-chip {
    background: rgba(0, 0, 0, 0.04);
    border: 1px solid rgba(0, 0, 0, 0.08);
    color: #1a1f2e;
}

.light .suggestion-chip:hover,
.sacred-light .suggestion-chip:hover {
    background: rgba(0, 0, 0, 0.08);
    color: #1a1f2e;
}

/* Dashboard urgent text in light mode */
.light .urgent-text strong,
.sacred-light .urgent-text strong {
    color: #1a1f2e;
}

/* Hero CTAs in light mode */
.light .hero-cta.ghost,
.light .hero-cta.ghost:hover,
.sacred-light .hero-cta.ghost {
    color: #1a1f2e;
}

/* Return buttons in light mode */
.light .return-btn.ghost,
.light .return-btn.ghost:hover,
.sacred-light .return-btn.ghost {
    color: #1a1f2e;
}

/* LLM workspace and command bar in light mode */
.light .llm-workspace,
.light .llm-command-bar,
.light .llm-message,
.sacred-light .llm-workspace {
    color: #1a1f2e;
}

/* Modal and dialog text in light mode */
.light .modal-title,
.light .modal-body,
.light .dialog-content,
.sacred-light .modal-title,
.sacred-light .modal-body {
    color: #1a1f2e;
}

/* Form labels in light mode */
.light .form-label,
.light label,
.sacred-light .form-label,
.sacred-light label {
    color: #374151;
}

/* Input and textarea placeholders in light mode */
.light input::placeholder,
.light textarea::placeholder,
.sacred-light input::placeholder,
.sacred-light textarea::placeholder {
    color: #6b7280;
}

/* Table cells in light mode */
.light .table td,
.light .table-cell,
.light td,
.sacred-light .table td {
    color: #1a1f2e;
}

/* Nav items in light mode - keep dark nav background with light text */
.light .nav-item,
.light .nav-link,
.sacred-light .nav-item {
    color: #c8d0e0;
}

/* Main content text in light mode */
.light .main-content,
.light .page-content,
.light .content-area,
.light main,
.sacred-light .main-content,
.sacred-light main {
    color: #1a1f2e;
}

/* Stats and metric values in light mode */
.light .stat-value,
.light .metric-value,
.light .stat-label,
.sacred-light .stat-value {
    color: #1a1f2e;
}

/* Empty states and messages in light mode */
.light .empty-state,
.light .no-data,
.light .placeholder-text,
.sacred-light .empty-state {
    color: #4a5568;
}

/* Floating AI panel light mode overrides are defined later in this file
   (around line 3222) with !important to keep the panel dark-themed */

/* Hub page in light mode */
.light .hub-card,
.light .hub-title,
.light .hub-description,
.sacred-light .hub-card {
    color: #1a1f2e;
}

/* AI Inbox in light mode */
.light .inbox-item,
.light .inbox-title,
.light .inbox-preview,
.sacred-light .inbox-item {
    color: #1a1f2e;
}

/* Admin setup in light mode */
.light .admin-setup,
.light .setup-step,
.sacred-light .admin-setup {
    color: #1a1f2e;
}

/* PFS page in light mode */
.light .pfs-section,
.light .pfs-row,
.sacred-light .pfs-section {
    color: #1a1f2e;
}

/* Smart Upload page in light mode */
.light .upload-zone,
.light .upload-status,
.light .file-info,
.sacred-light .upload-zone {
    color: #1a1f2e;
}

/* Compliance tracker in light mode */
.light .compliance-item,
.light .deadline-text,
.sacred-light .compliance-item {
    color: #1a1f2e;
}

/* Guidance panel in light mode */
.light .guidance-panel,
.light .guidance-title,
.light .guidance-content,
.sacred-light .guidance-panel {
    color: #1a1f2e;
}

/* Tax filing wizard in light mode */
.light .wizard-step,
.light .wizard-title,
.light .wizard-content,
.sacred-light .wizard-step {
    color: #1a1f2e;
}

/* LLM command bar in light mode */
.light .command-input,
.light .command-suggestion,
.light .command-result {
    color: #1a1f2e;
}

/* Financial reports in light mode */
.light .report-header,
.light .report-row,
.light .report-total,
.sacred-light .report-header {
    color: #1a1f2e;
}

/* Deduction optimizer in light mode */
.light .deduction-card,
.light .deduction-title,
.light .deduction-amount,
.sacred-light .deduction-card {
    color: #1a1f2e;
}

/* General overrides for white text to dark */
.light [style*="color: #fff"],
.light [style*="color:#fff"],
.light [style*="color: white"],
.sacred-light [style*="color: #fff"],
.sacred-light [style*="color: white"] {
    color: #1a1f2e !important;
}

/* Badge text colors in light mode */
.light .badge:not(.bg-primary):not(.bg-success):not(.bg-danger):not(.bg-warning):not(.bg-info) {
    color: #1a1f2e;
}

/* Card body text in light mode */
.light .card-body,
.light .card-text,
.light .card-title,
.sacred-light .card-body {
    color: #1a1f2e;
}

/* List items in light mode */
.light li,
.light ul,
.light ol,
.sacred-light li {
    color: inherit;
}

/* Span and div text in light mode */
.light span:not(.badge):not(.icon),
.light div:not(.badge),
.sacred-light span:not(.badge) {
    color: inherit;
}

/* Button text in light mode (except primary buttons) */
.light .btn-secondary,
.light .btn-outline-secondary,
.sacred-light .btn-secondary {
    color: #374151;
    border-color: rgba(0, 0, 0, 0.15);
}

.light .btn-secondary:hover,
.light .btn-outline-secondary:hover,
.sacred-light .btn-secondary:hover {
    color: #1a1f2e;
    background: rgba(0, 0, 0, 0.06);
}

/* Toast notifications in light mode */
.light .toast,
.light .toast-body,
.sacred-light .toast {
    color: #1a1f2e;
    background: rgba(255, 255, 255, 0.98);
}

/* Popover and tooltip in light mode */
.light .popover,
.light .popover-body,
.light .tooltip-inner {
    color: #1a1f2e;
}

/* Progress labels in light mode */
.light .progress-label,
.light .progress-value,
.sacred-light .progress-label {
    color: #1a1f2e;
}

/* Alert text in light mode */
.light .alert,
.light .alert-info,
.light .alert-warning,
.sacred-light .alert {
    color: #1a1f2e;
}

/* Breadcrumb in light mode */
.light .breadcrumb-item,
.light .breadcrumb-item a,
.sacred-light .breadcrumb-item {
    color: #4a5568;
}

.light .breadcrumb-item.active,
.sacred-light .breadcrumb-item.active {
    color: #1a1f2e;
}

/* ============================================
   Comprehensive Light Theme Text Color Fixes
   ============================================ */

/* Ensure headings are dark in light mode */
.light h1, .light h2, .light h3, .light h4, .light h5, .light h6,
.sacred-light h1, .sacred-light h2, .sacred-light h3,
.sacred-light h4, .sacred-light h5, .sacred-light h6 {
    color: #1a1f2e;
}

/* All paragraphs and general text */
.light p, .light div:not(.badge):not([class*="btn"]),
.sacred-light p {
    color: inherit;
}

/* Ensure body text uses dark color */
.light, .sacred-light {
    color: #1a1f2e;
}

/* Fix any text that might be using light text vars */
.light .text-light,
.sacred-light .text-light {
    color: #1a1f2e !important;
}

/* Hero sections with hardcoded white text */
.light .sacred-hero-title,
.light .sacred-primary-title,
.light .sacred-section-title {
    color: #1a1f2e;
}

/* Modal and dialog content */
.light .modal-title,
.light .modal-body,
.sacred-light .modal-title,
.sacred-light .modal-body {
    color: #1a1f2e;
}

/* All label elements */
.light label,
.sacred-light label {
    color: #4a5568;
}

/* Data values and stats */
.light .stat-value,
.light .data-value,
.light .metric-value,
.sacred-light .stat-value {
    color: #1a1f2e;
}

/* ==========================================================
   Comprehensive Light Mode / Dawn Mode Text Fixes
   Ensures all text is readable with dark text on light backgrounds
   ========================================================== */

/* Base text color reset for light mode */
.light *, .sacred-light * {
    --text: #1a1f2e;
    --sacred-text: #1a1f2e;
    --sacred-text-muted: #4a5568;
    --sacred-text-dim: #5a6478;
}

/* Override fallback colors in selectors that have hardcoded light text */
.light h1, .light h2, .light h3, .light h4, .light h5, .light h6,
.light .h1, .light .h2, .light .h3, .light .h4, .light .h5, .light .h6,
.sacred-light .h1, .sacred-light .h2, .sacred-light .h3 {
    color: #1a1f2e !important;
}

/* Text utility classes - force dark text in light mode */
.light .text-dark, .light .text-black, .light .text-body,
.sacred-light .text-dark, .sacred-light .text-body {
    color: #1a1f2e !important;
}

.light .text-muted, .light .text-body-secondary,
.sacred-light .text-muted {
    color: #4a5568 !important;
}

.light .text-secondary,
.sacred-light .text-secondary {
    color: #5a6478 !important;
}

/* Lead text in light mode */
.light .lead,
.sacred-light .lead {
    color: #1a1f2e !important;
}

/* Nav links and menu items */
.light .nav-link, .light .nav-item,
.sacred-light .nav-link {
    color: #374151;
}

.light .nav-link:hover, .light .nav-item:hover,
.sacred-light .nav-link:hover {
    color: #1a1f2e;
}

.light .nav-link.active, .light .nav-item.active,
.sacred-light .nav-link.active {
    color: var(--sacred-primary, #2563eb);
}

/* Table text in light mode */
.light table, .light th, .light td,
.light .table, .light .table th, .light .table td,
.sacred-light table, .sacred-light th, .sacred-light td {
    color: #1a1f2e;
}

/* Form controls in light mode */
.light input, .light select, .light textarea,
.light .form-control, .light .form-select,
.sacred-light input, .sacred-light select, .sacred-light textarea {
    color: #1a1f2e;
    background-color: #fff;
    border-color: rgba(0, 0, 0, 0.15);
}

.light input::placeholder, .light textarea::placeholder,
.light .form-control::placeholder,
.sacred-light input::placeholder {
    color: #6b7280;
}

/* Dropdown menus in light mode */
.light .dropdown-menu, .light .dropdown-item,
.sacred-light .dropdown-menu, .sacred-light .dropdown-item {
    color: #1a1f2e;
    background-color: #fff;
}

.light .dropdown-item:hover,
.sacred-light .dropdown-item:hover {
    background-color: #f3f4f6;
    color: #1a1f2e;
}

/* List groups in light mode */
.light .list-group-item,
.sacred-light .list-group-item {
    color: #1a1f2e;
    background-color: #fff;
    border-color: rgba(0, 0, 0, 0.125);
}

/* Sacred panel/card text in light mode */
.light .sacred-panel, .light .sacred-card,
.light .sacred-glass-panel, .light .sacred-glass-card,
.sacred-light .sacred-panel, .sacred-light .sacred-card {
    color: #1a1f2e;
}

/* Sacred stat values in light mode */
.light .sacred-stat-value, .light .sacred-stat-label,
.sacred-light .sacred-stat-value, .sacred-light .sacred-stat-label {
    color: #1a1f2e;
}

/* Transaction and amount displays in light mode */
.light .amount, .light .balance, .light .total,
.light .transaction-amount, .light .account-balance,
.sacred-light .amount, .sacred-light .balance {
    color: #1a1f2e;
}

/* Entity/business card text in light mode */
.light .entity-name, .light .business-name,
.light .account-name, .light .category-name,
.sacred-light .entity-name, .sacred-light .business-name {
    color: #1a1f2e;
}

/* Date and timestamp displays in light mode */
.light .date, .light .timestamp, .light time,
.sacred-light .date, .sacred-light time {
    color: #4a5568;
}

/* Code and preformatted text in light mode */
.light code, .light pre, .light .code,
.sacred-light code, .sacred-light pre {
    color: #1a1f2e;
    background-color: #f3f4f6;
}

/* Chat and message content in light mode */
.light .message, .light .chat-message,
.light .ai-response, .light .user-message,
.sacred-light .message, .sacred-light .chat-message {
    color: #1a1f2e;
}

/* Sidebar and navigation panel text in light mode */
.light .sidebar, .light .side-panel,
.light .nav-panel, .light .menu-panel,
.sacred-light .sidebar, .sacred-light .side-panel {
    color: #1a1f2e;
}

/* Force background colors for panels in light mode */
.light .sacred-panel, .light .card,
.sacred-light .sacred-panel, .sacred-light .card {
    background-color: rgba(255, 255, 255, 0.95);
    border-color: rgba(0, 0, 0, 0.08);
}

/* Ensure all text inside cards is dark in light mode */
.light .card *, .light .sacred-card *,
.sacred-light .card * {
    color: inherit;
}

/* Any remaining white text should become dark */
.light [style*="color: rgb(238"],
.light [style*="color: rgb(226"],
.light [style*="color: #eef"],
.light [style*="color: #e2e"],
.sacred-light [style*="color: rgb(238"],
.sacred-light [style*="color: #eef"] {
    color: #1a1f2e !important;
}

/* ==========================================================
   Critical Light/Dawn Mode Text Color Fix
   Forces dark text throughout the main content area
   ========================================================== */

/* Main content area - force dark text in light mode */
.light .app-body,
.light .app-body *,
.light .sacred-content,
.light .sacred-content *,
.sacred-light .app-body,
.sacred-light .app-body *,
.sacred-light .sacred-content,
.sacred-light .sacred-content * {
    color: #1a1f2e;
}

/* Preserve colored badges and status indicators */
.light .badge,
.light .badge *,
.light .status-badge,
.light .alert *,
.sacred-light .badge,
.sacred-light .badge *,
.sacred-light .alert * {
    color: inherit;
}

/* Preserve button text colors */
.light .btn,
.light .btn *,
.light button[class*="btn"],
.sacred-light .btn,
.sacred-light .btn * {
    color: inherit;
}

/* Primary buttons should have light text on colored backgrounds */
.light .btn-primary,
.light .btn-success,
.light .btn-danger,
.light .btn-warning,
.sacred-light .btn-primary,
.sacred-light .btn-success {
    color: #fff !important;
}

/* Secondary and outline buttons use dark text */
.light .btn-secondary,
.light .btn-outline-primary,
.light .btn-outline-secondary,
.light .btn-link,
.sacred-light .btn-secondary,
.sacred-light .btn-outline-primary {
    color: #1a1f2e;
}

/* Floating AI panel - keep dark background with light text */
.light .floating-ai-panel,
.sacred-light .floating-ai-panel {
    background: rgba(20, 24, 35, 0.98) !important;
    border-color: rgba(255, 255, 255, 0.1);
}

.light .floating-ai-panel *,
.light .floating-ai-header *,
.light .floating-ai-messages *,
.light .floating-ai-input *,
.sacred-light .floating-ai-panel * {
    color: #e8e9eb !important;
}

/* Floating AI title text */
.light .floating-ai-title span,
.sacred-light .floating-ai-title span {
    color: #e8e9eb !important;
}

/* AI welcome and quick actions preserve their styling */
.light .ai-welcome-text,
.light .ai-quick-actions button,
.light .ai-message-content,
.sacred-light .ai-welcome-text,
.sacred-light .ai-quick-actions button {
    color: #e8e9eb !important;
}

/* Muted text in light mode */
.light .text-muted,
.light .text-secondary,
.light small.text-muted,
.sacred-light .text-muted,
.sacred-light .text-secondary {
    color: #4a5568 !important;
}

/* Nav items in the sidebar - keep their styling (dark sidebar) */
.light .app-nav,
.light .app-nav *,
.light .sacred-nav-container *,
.sacred-light .app-nav,
.sacred-light .app-nav * {
    /* Sidebar stays dark themed */
    color: inherit;
}

/* Header in light mode */
.light .app-header,
.light .sacred-header {
    background: #fff;
    border-color: rgba(0, 0, 0, 0.08);
}

/* Header action buttons - use a visible color */
.light .header-actions .btn,
.light .header-actions button,
.sacred-light .header-actions .btn,
.sacred-light .header-actions button {
    color: #374151;
}

.light .header-actions .btn:hover,
.light .header-actions button:hover,
.sacred-light .header-actions .btn:hover {
    color: #1a1f2e;
}

/* Entity selector text in header */
.light .header-context,
.light .header-context *,
.sacred-light .header-context,
.sacred-light .header-context * {
    color: #1a1f2e;
}

/* Form inputs preserve their dark text */
.light input,
.light select,
.light textarea,
.light .form-control,
.light .form-select,
.sacred-light input,
.sacred-light select,
.sacred-light textarea {
    color: #1a1f2e !important;
    background-color: #fff !important;
}

/* Placeholder text */
.light input::placeholder,
.light textarea::placeholder,
.light .form-control::placeholder,
.sacred-light input::placeholder,
.sacred-light textarea::placeholder {
    color: #6b7280 !important;
}

/* Error text stays red */
.light .text-danger,
.light .invalid-feedback,
.light .validation-message,
.sacred-light .text-danger,
.sacred-light .invalid-feedback {
    color: #dc3545 !important;
}

/* Success text stays green */
.light .text-success,
.light .valid-feedback,
.sacred-light .text-success,
.sacred-light .valid-feedback {
    color: #198754 !important;
}

/* Warning text stays orange/yellow */
.light .text-warning,
.sacred-light .text-warning {
    color: #d97706 !important;
}

/* Info text stays blue */
.light .text-info,
.sacred-light .text-info {
    color: #0891b2 !important;
}

/* Links should remain visible */
.light a,
.light .nav-link,
.sacred-light a {
    color: #2563eb;
}

.light a:hover,
.light .nav-link:hover,
.sacred-light a:hover {
    color: #1d4ed8;
}

/* Table headers and content */
.light table,
.light table *,
.light .table,
.light .table *,
.sacred-light table,
.sacred-light table * {
    color: #1a1f2e;
}

/* Table header background */
.light thead th,
.light .table thead th,
.sacred-light thead th {
    background-color: #f3f4f6;
    color: #1a1f2e;
}

/* Modal content */
.light .modal-content,
.light .modal-content *,
.sacred-light .modal-content,
.sacred-light .modal-content * {
    color: #1a1f2e;
}

.light .modal-content {
    background-color: #fff;
}

/* Dropdown menus */
.light .dropdown-menu,
.light .dropdown-menu *,
.sacred-light .dropdown-menu,
.sacred-light .dropdown-menu * {
    color: #1a1f2e;
    background-color: #fff;
}

/* Accordion components */
.light .accordion-button,
.light .accordion-body,
.light .accordion-body *,
.sacred-light .accordion-button,
.sacred-light .accordion-body {
    color: #1a1f2e;
}

/* Cards - text should be dark */
.light .card,
.light .card *,
.light .sacred-card,
.light .sacred-card *,
.sacred-light .card,
.sacred-light .card *,
.sacred-light .sacred-card * {
    color: #1a1f2e;
}

/* Preserve icon colors in light mode */
.light .oi,
.light [class*="bi-"],
.light [class*="fa-"],
.sacred-light .oi,
.sacred-light [class*="bi-"] {
    color: inherit;
}

/* ==========================================================
   FINAL LIGHT MODE OVERRIDE - Highest Priority Text Fixes
   This catches any scoped component styles that use white text
   ========================================================== */

/* Force dark text on all elements in main content - excludes nav/floating panels */
html.light main,
html.light main *,
html.sacred-light main,
html.sacred-light main *,
body.light main,
body.light main *,
body.sacred-light main,
body.sacred-light main * {
    --text: #1a1f2e !important;
    --sacred-text: #1a1f2e !important;
}

/* Exclude components that have their own dark backgrounds and white text by design */
html.light .refund-tracker,
html.light .refund-tracker *,
html.light .floating-ai-panel,
html.light .floating-ai-panel *,
html.light .app-nav,
html.light .app-nav *,
html.light .sacred-nav-container,
html.light .sacred-nav-container *,
body.light .refund-tracker,
body.light .refund-tracker *,
body.light .floating-ai-panel,
body.light .floating-ai-panel *,
body.sacred-light .refund-tracker,
body.sacred-light .refund-tracker * {
    --text: #fff !important;
    --sacred-text: #fff !important;
    color: inherit;
}

/* Comprehensive selector for common text elements */
html.light .sacred-hero-title,
html.light .sacred-primary-title,
html.light .hub-promo-title,
html.light .promo-title,
html.light .section-title,
html.light .card-title,
html.light .panel-title,
html.light .wizard-title,
html.light .quick-action-text,
body.light .sacred-hero-title,
body.light .sacred-primary-title,
body.light .hub-promo-title,
body.light .promo-title,
body.sacred-light .sacred-hero-title,
body.sacred-light .sacred-primary-title,
body.sacred-light .hub-promo-title {
    color: #1a1f2e !important;
}

/* PreFilingChecklist and RefundTracker specific fixes */
html.light .prefiling-item,
html.light .prefiling-title,
html.light .refund-tracker-value,
html.light .tracker-label,
html.light .tracker-status,
body.light .prefiling-item,
body.light .prefiling-title,
body.light .refund-tracker-value,
body.sacred-light .prefiling-item,
body.sacred-light .refund-tracker-value {
    color: #1a1f2e !important;
}

/* DailyCheckIn and OnboardingWizard specific fixes */
html.light .checkin-item,
html.light .checkin-title,
html.light .onboarding-step,
html.light .wizard-step-title,
html.light .wizard-step-desc,
body.light .checkin-item,
body.light .wizard-step-title,
body.sacred-light .checkin-item,
body.sacred-light .wizard-step-title {
    color: #1a1f2e !important;
}

/* RequiredDocs and StartupVentures specific fixes */
html.light .doc-item,
html.light .doc-name,
html.light .venture-item,
html.light .venture-title,
body.light .doc-item,
body.light .venture-item,
body.sacred-light .doc-item,
body.sacred-light .venture-item {
    color: #1a1f2e !important;
}

/* ValidationAlert and ConfirmDialog fixes */
html.light .validation-message,
html.light .alert-message,
html.light .confirm-title,
html.light .dialog-text,
body.light .validation-message,
body.light .confirm-title,
body.sacred-light .validation-message,
body.sacred-light .confirm-title {
    color: #1a1f2e !important;
}

/* QuickActions and TaxProgressMini fixes */
html.light .quick-action-label,
html.light .tax-progress-label,
html.light .action-item,
body.light .quick-action-label,
body.light .tax-progress-label,
body.sacred-light .quick-action-label,
body.sacred-light .tax-progress-label {
    color: #1a1f2e !important;
}

/* EmptyState and QuickStartTips fixes */
html.light .empty-state-title,
html.light .empty-state-text,
html.light .tips-title,
html.light .tip-text,
body.light .empty-state-title,
body.light .tips-title,
body.sacred-light .empty-state-title,
body.sacred-light .tips-title {
    color: #1a1f2e !important;
}

/* Preserve button inner text colors appropriately */
html.light .btn-primary,
html.light .btn-success,
html.light .btn-danger,
body.light .btn-primary,
body.light .btn-success,
body.light .btn-danger,
body.sacred-light .btn-primary,
body.sacred-light .btn-success {
    color: #fff !important;
}

/* Ghost/outline buttons should have dark text */
html.light .btn.ghost,
html.light .btn-ghost,
html.light .btn-outline-dark,
html.light .btn-light,
body.light .btn.ghost,
body.light .btn-ghost,
body.sacred-light .btn.ghost,
body.sacred-light .btn-ghost {
    color: #1a1f2e !important;
}

/* ==========================================================
   COMPREHENSIVE LIGHT/DAWN MODE TEXT FIX FOR SCOPED CSS
   Overrides hardcoded white text from .razor.css files
   ========================================================== */

/* Force dark text on ALL content elements in light mode - max specificity */
html.light .app-body,
html.light .app-body *:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.badge):not(.floating-ai-panel):not(.floating-ai-panel *):not(.app-nav):not(.app-nav *),
html.sacred-light .app-body,
html.sacred-light .app-body *:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.badge):not(.floating-ai-panel):not(.floating-ai-panel *):not(.app-nav):not(.app-nav *),
body.light .app-body,
body.light .app-body *:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.badge):not(.floating-ai-panel):not(.floating-ai-panel *):not(.app-nav):not(.app-nav *),
body.sacred-light .app-body,
body.sacred-light .app-body *:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.badge):not(.floating-ai-panel):not(.floating-ai-panel *):not(.app-nav):not(.app-nav *) {
    color: #1a1f2e !important;
}

/* AdminSetup page specific fixes */
html.light .status-text,
html.light .check-status,
html.light .info-value,
html.light .check-text,
body.light .status-text,
body.light .check-status,
body.light .info-value,
body.sacred-light .status-text,
body.sacred-light .check-status {
    color: #1a1f2e !important;
}

/* Preserve semantic colors */
html.light .status-success .status-icon,
html.light .check-item.passing .check-status,
html.light .info-value.text-success,
body.light .status-success .status-icon,
body.sacred-light .status-success .status-icon {
    color: #16a34a !important;
}

html.light .status-warning .status-icon,
html.light .info-value.text-warning,
body.light .status-warning .status-icon,
body.sacred-light .status-warning .status-icon {
    color: #ca8a04 !important;
}

html.light .status-error .status-icon,
html.light .check-item.failing .check-status,
html.light .info-value.text-danger,
body.light .status-error .status-icon,
body.sacred-light .status-error .status-icon {
    color: #dc2626 !important;
}

/* SmartUpload page specific fixes */
html.light .upload-zone,
html.light .upload-zone *,
html.light .file-item,
html.light .file-item *,
html.light .preview-panel,
html.light .preview-panel *,
body.light .upload-zone,
body.light .upload-zone *,
body.light .file-item,
body.light .file-item *,
body.sacred-light .upload-zone,
body.sacred-light .upload-zone * {
    color: #1a1f2e !important;
}

/* Landing page - keep dark themed since it has a dark background */
html.light .landing-hero,
html.light .landing-hero *,
body.light .landing-hero,
body.light .landing-hero * {
    color: #eef0f5 !important;
}

/* PFS page fixes - selects and form elements */
html.light .view-select,
html.light .pfs-container select,
html.light .pfs-container input,
html.light .value,
html.light .biz-metric-value,
body.light .view-select,
body.light .pfs-container select,
body.light .value,
body.sacred-light .view-select {
    color: #1a1f2e !important;
    background: #fff !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

/* FinancialReports page fixes */
html.light .report-filter,
html.light .reports select,
html.light .reports input,
body.light .report-filter,
body.light .reports select,
body.sacred-light .report-filter {
    color: #1a1f2e !important;
    background: #fff !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

/* DeductionOptimizer page fixes */
html.light .entity-filter,
html.light .opt-container select,
html.light .opt-container input,
body.light .entity-filter,
body.light .opt-container select,
body.sacred-light .entity-filter {
    color: #1a1f2e !important;
    background: #fff !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

/* Hub page fixes */
html.light .hub-card,
html.light .hub-card *,
html.light .hub-section-title,
html.light .hub-promo-title,
html.light .wizard-step-title,
html.light .wizard-step-desc,
html.light .recent-name,
html.light .doc-name,
html.light .action-text,
body.light .hub-card,
body.light .hub-card *,
body.light .hub-section-title,
body.sacred-light .hub-card,
body.sacred-light .hub-card * {
    color: #1a1f2e !important;
}

/* Hub status items - preserve colors */
html.light .status-item.attention,
body.light .status-item.attention,
body.sacred-light .status-item.attention {
    color: #ca8a04 !important;
}

html.light .doc-status.processing,
html.light .doc-status.analyzing,
html.light .doc-status.uploading,
body.light .doc-status.processing,
body.sacred-light .doc-status.processing {
    color: #ca8a04 !important;
}

html.light .doc-status.error,
body.light .doc-status.error,
body.sacred-light .doc-status.error {
    color: #dc2626 !important;
}

/* Dashboard page fixes */
html.light .dash-year,
html.light .dash-view,
body.light .dash-year,
body.light .dash-view,
body.sacred-light .dash-year {
    color: #1a1f2e !important;
    background: #fff !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

html.light .hero-cta.ghost,
html.light .btn.ghost,
body.light .hero-cta.ghost,
body.light .btn.ghost,
body.sacred-light .hero-cta.ghost {
    color: #1a1f2e !important;
    background: rgba(0, 0, 0, 0.05) !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

html.light .suggestion-chip,
body.light .suggestion-chip,
body.sacred-light .suggestion-chip {
    color: #1a1f2e !important;
    background: rgba(0, 0, 0, 0.05) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

html.light .form-status.pending,
html.light .pill-warn,
body.light .form-status.pending,
body.sacred-light .form-status.pending {
    color: #ca8a04 !important;
}

/* AIInbox page fixes */
html.light .inbox-header,
html.light .inbox-header *,
html.light .message-item,
html.light .message-item *,
html.light .inbox-actions,
html.light .inbox-actions *,
body.light .inbox-header,
body.light .inbox-header *,
body.light .message-item,
body.light .message-item *,
body.sacred-light .inbox-header,
body.sacred-light .inbox-header * {
    color: #1a1f2e !important;
}

html.light .message-date.priority,
html.light .priority-indicator,
body.light .message-date.priority,
body.sacred-light .message-date.priority {
    color: #ca8a04 !important;
}

/* LlmWorkspace fixes */
html.light .workspace-header,
html.light .workspace-header *,
html.light .model-selector,
html.light .model-selector *,
body.light .workspace-header,
body.light .workspace-header *,
body.sacred-light .workspace-header,
body.sacred-light .workspace-header * {
    color: #1a1f2e !important;
}

/* ComplianceTracker fixes */
html.light .tracker-card,
html.light .tracker-card *,
html.light .deadline-item,
html.light .deadline-item *,
body.light .tracker-card,
body.light .tracker-card *,
body.sacred-light .tracker-card,
body.sacred-light .tracker-card * {
    color: #1a1f2e !important;
}

/* Card and section headers in light mode */
html.light .sacred-card-header,
html.light .sacred-card-body,
html.light .section-header,
html.light h1, html.light h2, html.light h3, html.light h4, html.light h5, html.light h6,
body.light .sacred-card-header,
body.light .sacred-card-body,
body.light h1, body.light h2, body.light h3, body.light h4, body.light h5, body.light h6,
body.sacred-light .sacred-card-header,
body.sacred-light h1, body.sacred-light h2, body.sacred-light h3 {
    color: #1a1f2e !important;
}

/* Ensure paragraph text is dark */
html.light p,
html.light span,
html.light div:not(.btn):not(.badge):not(.floating-ai-panel):not([class*="nav"]),
html.light label,
html.light li,
body.light p,
body.light span,
body.light div:not(.btn):not(.badge):not(.floating-ai-panel):not([class*="nav"]),
body.light label,
body.light li,
body.sacred-light p,
body.sacred-light span {
    color: inherit;
}

/* Form1099Management fixes */
html.light .form-1099-header,
html.light .vendor-name,
html.light .amount-display,
body.light .form-1099-header,
body.light .vendor-name,
body.sacred-light .form-1099-header {
    color: #1a1f2e !important;
}

/* EstimatedTax page fixes */
html.light .estimated-header,
html.light .estimated-header *,
html.light .tax-summary,
html.light .tax-summary *,
body.light .estimated-header,
body.light .estimated-header *,
body.sacred-light .estimated-header,
body.sacred-light .estimated-header * {
    color: #1a1f2e !important;
}

/* Assets page fixes */
html.light .asset-card,
html.light .asset-card *,
html.light .asset-name,
html.light .asset-value,
body.light .asset-card,
body.light .asset-card *,
body.sacred-light .asset-card,
body.sacred-light .asset-card * {
    color: #1a1f2e !important;
}

/* ==========================================================
   LIGHT MODE BACKGROUND FIXES
   Makes dark-themed elements look proper in light mode
   ========================================================== */

/* SmartUpload page - card backgrounds */
html.light .upload-zone,
html.light .upload-dropzone,
html.light .file-item,
html.light .preview-panel,
html.light .extracted-data,
body.light .upload-zone,
body.light .file-item,
body.sacred-light .upload-zone {
    background: rgba(0, 0, 0, 0.03) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

html.light .upload-dropzone:hover,
html.light .file-item:hover,
body.light .upload-dropzone:hover,
body.sacred-light .upload-dropzone:hover {
    background: rgba(0, 0, 0, 0.06) !important;
}

/* AIInbox page backgrounds */
html.light .message-item,
html.light .inbox-sidebar,
html.light .action-btn,
body.light .message-item,
body.light .inbox-sidebar,
body.sacred-light .message-item {
    background: rgba(0, 0, 0, 0.03) !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

html.light .message-item:hover,
html.light .action-btn:hover,
body.light .message-item:hover,
body.sacred-light .message-item:hover {
    background: rgba(0, 0, 0, 0.06) !important;
}

/* Dashboard ghost buttons */
html.light .hero-cta.ghost,
body.light .hero-cta.ghost,
body.sacred-light .hero-cta.ghost {
    background: rgba(0, 0, 0, 0.05) !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
}

html.light .hero-cta.ghost:hover,
body.light .hero-cta.ghost:hover,
body.sacred-light .hero-cta.ghost:hover {
    background: rgba(0, 0, 0, 0.08) !important;
    border-color: rgba(0, 0, 0, 0.2) !important;
}

/* General card/panel backgrounds in light mode */
html.light .sacred-card,
html.light .hub-card,
html.light .tracker-card,
html.light .stat-card,
body.light .sacred-card,
body.light .hub-card,
body.sacred-light .sacred-card {
    background: #fff !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
}

/* Table backgrounds in light mode */
html.light .table,
html.light table,
body.light .table,
body.light table,
body.sacred-light .table {
    background: #fff !important;
}

html.light .table thead th,
html.light table thead th,
body.light .table thead th,
body.sacred-light .table thead th {
    background: #f9fafb !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

html.light .table tbody tr:hover,
html.light table tbody tr:hover,
body.light .table tbody tr:hover,
body.sacred-light .table tbody tr:hover {
    background: rgba(0, 0, 0, 0.02) !important;
}

/* List items in light mode */
html.light .list-group-item,
html.light .nav-item,
body.light .list-group-item,
body.sacred-light .list-group-item {
    background: #fff !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

/* Accordion in light mode */
html.light .accordion-item,
html.light .accordion-button,
body.light .accordion-item,
body.light .accordion-button,
body.sacred-light .accordion-item {
    background: #fff !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

html.light .accordion-button:not(.collapsed),
body.light .accordion-button:not(.collapsed),
body.sacred-light .accordion-button:not(.collapsed) {
    background: rgba(37, 99, 235, 0.08) !important;
}

/* ==========================================================
   ADDITIONAL LIGHT MODE FIXES FOR RAZOR COMPONENT SCOPED CSS
   These override the scoped CSS in .razor.css files
   ========================================================== */

/* Hub page light mode fixes */
html.light .hub-card-title,
html.light .hub-card-text,
html.light .hub-stat-value,
html.light .hub-section-title,
html.light .recent-name,
html.light .quick-action-text,
html.light .progress-item-name,
html.light .hub-welcome-title,
html.light .hub-welcome-text,
body.light .hub-card-title,
body.light .hub-card-text,
body.light .hub-stat-value,
body.sacred-light .hub-card-title,
body.sacred-light .hub-card-text {
    color: #1a1f2e !important;
}

/* Dashboard page light mode fixes */
html.light .urgent-text,
html.light .urgent-text strong,
html.light .dash-card-title,
html.light .dash-stat-value,
html.light .suggestion-chip,
html.light .return-btn.ghost,
html.light .hero-cta.ghost,
body.light .urgent-text,
body.light .urgent-text strong,
body.light .dash-card-title,
body.sacred-light .dash-card-title,
body.sacred-light .dash-stat-value {
    color: #1a1f2e !important;
}

html.light .dash-year,
html.light .dash-view,
body.light .dash-year,
body.light .dash-view,
body.sacred-light .dash-year {
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
    color: #1a1f2e !important;
}

html.light .suggestion-chip,
body.light .suggestion-chip,
body.sacred-light .suggestion-chip {
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
    color: #1a1f2e !important;
}

/* AIInbox page light mode fixes */
html.light .inbox-item-title,
html.light .inbox-item-text,
html.light .inbox-header-title,
body.light .inbox-item-title,
body.light .inbox-item-text,
body.sacred-light .inbox-item-title {
    color: #1a1f2e !important;
}

/* Compliance Tracker light mode fixes */
html.light .compliance-title,
html.light .compliance-text,
html.light .deadline-text,
html.light .task-name,
html.light .section-header,
body.light .compliance-title,
body.light .compliance-text,
body.sacred-light .compliance-title,
body.sacred-light .compliance-text {
    color: #1a1f2e !important;
}

/* LlmWorkspace light mode fixes */
html.light .workspace-title,
html.light .workspace-text,
html.light .message-text,
html.light .input-label,
body.light .workspace-title,
body.light .workspace-text,
body.sacred-light .workspace-title {
    color: #1a1f2e !important;
}

/* LlmCommandBar light mode fixes */
html.light .command-palette-title,
html.light .command-item-text,
html.light .shortcut-text,
html.light .command-category,
body.light .command-palette-title,
body.light .command-item-text,
body.sacred-light .command-palette-title {
    color: #1a1f2e !important;
}

/* Guidance Panel light mode fixes */
html.light .guidance-title,
html.light .guidance-text,
html.light .guidance-step,
html.light .tip-text,
body.light .guidance-title,
body.light .guidance-text,
body.sacred-light .guidance-title {
    color: #1a1f2e !important;
}

/* Tax Filing Wizard light mode fixes */
html.light .wizard-step-title,
html.light .wizard-step-text,
html.light .step-label,
body.light .wizard-step-title,
body.light .wizard-step-text,
body.sacred-light .wizard-step-title {
    color: #1a1f2e !important;
}

/* Select and input elements in light mode - global override */
html.light select,
html.light .view-select,
html.light .report-filter,
html.light .entity-filter,
body.light select:not(.nav-select),
body.light .view-select,
body.light .report-filter,
body.sacred-light select:not(.nav-select),
body.sacred-light .view-select {
    background: #fff !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
    color: #1a1f2e !important;
}

/* Ghost buttons in light mode */
html.light .btn.ghost,
html.light .btn-ghost,
body.light .btn.ghost,
body.light .btn-ghost,
body.sacred-light .btn.ghost {
    background: rgba(0, 0, 0, 0.04) !important;
    color: #1a1f2e !important;
}

html.light .btn.ghost:hover,
html.light .btn-ghost:hover,
body.light .btn.ghost:hover,
body.light .btn-ghost:hover,
body.sacred-light .btn.ghost:hover {
    background: rgba(0, 0, 0, 0.08) !important;
    color: #1a1f2e !important;
}

/* Generic text colors for light mode - catch-all */
html.light h1, html.light h2, html.light h3, html.light h4, html.light h5, html.light h6,
html.light .h1, html.light .h2, html.light .h3, html.light .h4, html.light .h5, html.light .h6,
body.light h1, body.light h2, body.light h3, body.light h4, body.light h5, body.light h6,
body.sacred-light h1, body.sacred-light h2, body.sacred-light h3 {
    color: #1a1f2e !important;
}

html.light p, html.light span:not(.badge):not(.icon):not(.btn *),
html.light label, html.light td, html.light th,
body.light p, body.light span:not(.badge):not(.icon):not(.btn *),
body.light label, body.light td, body.light th,
body.sacred-light p, body.sacred-light label {
    color: #1a1f2e !important;
}

/* Preserve semantic colors in light mode */
html.light .text-success,
body.light .text-success,
body.sacred-light .text-success {
    color: #16a34a !important;
}

html.light .text-danger,
body.light .text-danger,
body.sacred-light .text-danger {
    color: #dc2626 !important;
}

html.light .text-warning,
body.light .text-warning,
body.sacred-light .text-warning {
    color: #ca8a04 !important;
}

html.light .text-info,
body.light .text-info,
body.sacred-light .text-info {
    color: #0891b2 !important;
}

/* Badge colors remain intact */
html.light .badge.bg-success,
body.light .badge.bg-success,
body.sacred-light .badge.bg-success {
    color: #fff !important;
}

html.light .badge.bg-danger,
body.light .badge.bg-danger,
body.sacred-light .badge.bg-danger {
    color: #fff !important;
}

html.light .badge.bg-warning,
body.light .badge.bg-warning,
body.sacred-light .badge.bg-warning {
    color: #1a1f2e !important;
}

/* Card backgrounds in light mode */
html.light .card,
html.light .sacred-card,
body.light .card,
body.light .sacred-card,
body.sacred-light .card {
    background: #fff !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

/* Ensure main content area has proper light background */
html.light .app-body,
html.light .app-main,
html.light .sacred-content,
body.light .app-body,
body.light .app-main,
body.sacred-light .app-body {
    background: var(--body-bg, #f4f6fa) !important;
}

/* ==========================================================
   GLOBAL LIGHT MODE TEXT COLOR FIX (Dawn Mode)
   This is a catch-all to ensure all text is readable on white backgrounds
   ========================================================== */
html.light,
html.sacred-light,
body.light,
body.sacred-light {
    color: #1a1f2e !important;
}

/* Universal text color for all common elements in light mode */
html.light *:not(.btn):not(.badge):not(.nav-link):not(.dropdown-toggle):not([class*="bg-"]),
html.sacred-light *:not(.btn):not(.badge):not(.nav-link):not(.dropdown-toggle):not([class*="bg-"]),
body.light *:not(.btn):not(.badge):not(.nav-link):not(.dropdown-toggle):not([class*="bg-"]),
body.sacred-light *:not(.btn):not(.badge):not(.nav-link):not(.dropdown-toggle):not([class*="bg-"]) {
    --text: #1a1f2e;
}

/* Ensure app-body and main content inherits proper color */
html.light .app-body,
html.light .app-main,
html.light main,
body.light .app-body,
body.light .app-main,
body.light main,
body.sacred-light .app-body,
body.sacred-light main {
    color: #1a1f2e !important;
}

/* Tables must have dark text in light mode */
html.light table,
html.light tbody,
html.light tr,
html.light td,
html.light th,
body.light table,
body.light tbody,
body.light tr,
body.light td,
body.light th,
body.sacred-light table,
body.sacred-light tbody,
body.sacred-light tr,
body.sacred-light td,
body.sacred-light th {
    color: #1a1f2e !important;
}

/* All standard text elements in light mode - with !important for override */
html.light p,
html.light span:not(.btn *):not(.badge *),
html.light div:not(.btn):not(.badge),
html.light label,
html.light li,
html.light dt,
html.light dd,
html.light blockquote,
html.light figcaption,
html.light address,
body.light p,
body.light span:not(.btn *):not(.badge *),
body.light div:not(.btn):not(.badge),
body.light label,
body.light li,
body.light dt,
body.light dd,
body.sacred-light p,
body.sacred-light span:not(.btn *):not(.badge *),
body.sacred-light div:not(.btn):not(.badge),
body.sacred-light label,
body.sacred-light li {
    color: #1a1f2e !important;
}

/* Ensure the side nav text stays light (dark sidebar) */
html.light .app-nav,
body.light .app-nav,
body.sacred-light .app-nav {
    color: #c8d0e0 !important;
}

html.light .app-nav *,
body.light .app-nav *,
body.sacred-light .app-nav * {
    color: inherit !important;
}

/* ==========================================================
   FINAL LIGHT MODE CATCH-ALL
   Forces dark text on all text elements in light/dawn mode
   ========================================================== */
html.light,
html.sacred-light,
body.light,
body.sacred-light {
    --text: #1a1f2e !important;
    --sacred-text: #1a1f2e !important;
    --vt-muted: #4a5568 !important;
}

/* Ultra-high specificity override for any remaining white text */
html.light *:not(.app-nav):not(.app-nav *):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.badge):not(.badge *):not([class*="bg-primary"]):not([class*="bg-success"]):not([class*="bg-danger"]) {
    --text: #1a1f2e;
}

html.sacred-light *:not(.app-nav):not(.app-nav *):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.badge):not(.badge *):not([class*="bg-primary"]):not([class*="bg-success"]):not([class*="bg-danger"]) {
    --text: #1a1f2e;
}

body.light *:not(.app-nav):not(.app-nav *):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.badge):not(.badge *):not([class*="bg-primary"]):not([class*="bg-success"]):not([class*="bg-danger"]) {
    --text: #1a1f2e;
}

body.sacred-light *:not(.app-nav):not(.app-nav *):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.badge):not(.badge *):not([class*="bg-primary"]):not([class*="bg-success"]):not([class*="bg-danger"]) {
    --text: #1a1f2e;
}

/* ==========================================================
   FINAL DAWN MODE TEXT FIX - Absolute Final Override
   Forces ALL text to be dark in light/dawn mode
   ========================================================== */

/* Universal dark text for light mode - applied to sacred-content area */
html.light .sacred-content,
html.sacred-light .sacred-content,
body.light .sacred-content,
body.sacred-light .sacred-content {
    color: #1a1f2e !important;
}

/* Force dark text on ALL elements in light mode main content */
html.light .sacred-content *:not(.app-nav *):not(.btn):not(.btn *):not(.badge):not(.badge *):not(.nav-link):not(.dropdown-item),
html.sacred-light .sacred-content *:not(.app-nav *):not(.btn):not(.btn *):not(.badge):not(.badge *):not(.nav-link):not(.dropdown-item),
body.light .sacred-content *:not(.app-nav *):not(.btn):not(.btn *):not(.badge):not(.badge *):not(.nav-link):not(.dropdown-item),
body.sacred-light .sacred-content *:not(.app-nav *):not(.btn):not(.btn *):not(.badge):not(.badge *):not(.nav-link):not(.dropdown-item) {
    color: #1a1f2e !important;
}

/* Ensure form inputs have dark text in light mode */
html.light input,
html.light textarea,
html.light select,
html.sacred-light input,
html.sacred-light textarea,
html.sacred-light select,
body.light input,
body.light textarea,
body.light select,
body.sacred-light input,
body.sacred-light textarea,
body.sacred-light select {
    color: #1a1f2e !important;
}

/* Card text must be dark in light mode */
html.light .card,
html.light .card *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.sacred-light .card,
html.sacred-light .card *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .card,
body.light .card *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.sacred-light .card,
body.sacred-light .card *:not(.btn):not(.btn *):not(.badge):not(.badge *) {
    color: #1a1f2e !important;
}

/* Sacred card text dark in light mode */
html.light .sacred-card,
html.light .sacred-card *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.sacred-light .sacred-card,
html.sacred-light .sacred-card *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .sacred-card,
body.light .sacred-card *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.sacred-light .sacred-card,
body.sacred-light .sacred-card *:not(.btn):not(.btn *):not(.badge):not(.badge *) {
    color: #1a1f2e !important;
}

/* Fix specific components that might still have white text */
html.light .sacred-metric-value,
html.light .sacred-section-title,
html.light .sacred-stat-value,
html.light .onboarding-step-title,
html.sacred-light .sacred-metric-value,
html.sacred-light .sacred-section-title,
html.sacred-light .sacred-stat-value,
html.sacred-light .onboarding-step-title,
body.light .sacred-metric-value,
body.light .sacred-section-title,
body.light .sacred-stat-value,
body.light .onboarding-step-title,
body.sacred-light .sacred-metric-value,
body.sacred-light .sacred-section-title,
body.sacred-light .sacred-stat-value,
body.sacred-light .onboarding-step-title {
    color: #1a1f2e !important;
}

/* Modal content must have dark text in light mode */
html.light .modal-content,
html.light .modal-content *:not(.btn):not(.btn *):not(.badge):not(.close),
html.sacred-light .modal-content,
html.sacred-light .modal-content *:not(.btn):not(.btn *):not(.badge):not(.close),
body.light .modal-content,
body.light .modal-content *:not(.btn):not(.btn *):not(.badge):not(.close),
body.sacred-light .modal-content,
body.sacred-light .modal-content *:not(.btn):not(.btn *):not(.badge):not(.close) {
    color: #1a1f2e !important;
}

/* ==========================================================
   ULTRA-AGGRESSIVE LIGHT MODE TEXT FIX
   These overrides use high specificity to fix component-scoped
   styles that may override global light mode rules
   ========================================================== */

/* Fix text colors for all common text containers in light mode */
html.light .app-body,
html.light .app-body *,
html.sacred-light .app-body,
html.sacred-light .app-body *,
body.light .app-body,
body.light .app-body *,
body.sacred-light .app-body,
body.sacred-light .app-body * {
    --text: #1a1f2e;
    --sacred-text: #1a1f2e;
    --text-muted: #4a5568;
    --sacred-text-muted: #4a5568;
}

/* Force dark text on ALL elements that inherit color in light mode */
html.light .app-main *:not(.app-nav):not(.app-nav *):not(.btn):not(.btn *):not(.badge):not([class*="bg-"]):not([style*="background"]),
html.sacred-light .app-main *:not(.app-nav):not(.app-nav *):not(.btn):not(.btn *):not(.badge):not([class*="bg-"]):not([style*="background"]) {
    color: var(--text, #1a1f2e);
}

/* Specific component overrides for light mode */
html.light [class*="tpm-"],
html.sacred-light [class*="tpm-"],
body.light [class*="tpm-"],
body.sacred-light [class*="tpm-"] {
    color: #1a1f2e !important;
}

html.light [class*="tpm-badge"],
html.sacred-light [class*="tpm-badge"],
body.light [class*="tpm-badge"],
body.sacred-light [class*="tpm-badge"] {
    color: #fff !important; /* Badge on colored bg stays white */
}

/* Dropdown and popup fixes for light mode */
html.light [class*="dropdown"],
html.light [class*="popup"],
html.light [class*="panel"],
html.sacred-light [class*="dropdown"],
html.sacred-light [class*="popup"],
html.sacred-light [class*="panel"],
body.light [class*="dropdown"],
body.light [class*="popup"],
body.light [class*="panel"],
body.sacred-light [class*="dropdown"],
body.sacred-light [class*="popup"],
body.sacred-light [class*="panel"] {
    background: rgba(255, 255, 255, 0.98) !important;
    color: #1a1f2e !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
}

html.light [class*="dropdown"] *:not(.btn):not(.badge),
html.sacred-light [class*="dropdown"] *:not(.btn):not(.badge),
body.light [class*="dropdown"] *:not(.btn):not(.badge),
body.sacred-light [class*="dropdown"] *:not(.btn):not(.badge) {
    color: #1a1f2e !important;
}

/* FloatingAI panel light mode fix */
html.light .floating-ai,
html.light .floating-ai *:not(.btn):not(.badge),
html.sacred-light .floating-ai,
html.sacred-light .floating-ai *:not(.btn):not(.badge),
body.light .floating-ai,
body.light .floating-ai *:not(.btn):not(.badge),
body.sacred-light .floating-ai,
body.sacred-light .floating-ai *:not(.btn):not(.badge) {
    --text: #1a1f2e !important;
}

/* OnboardingWizard light mode fixes */
html.light .onboarding-overlay,
html.light .onboarding-overlay *:not(.btn):not(.badge),
html.sacred-light .onboarding-overlay,
html.sacred-light .onboarding-overlay *:not(.btn):not(.badge),
body.light .onboarding-overlay,
body.light .onboarding-overlay *:not(.btn):not(.badge),
body.sacred-light .onboarding-overlay,
body.sacred-light .onboarding-overlay *:not(.btn):not(.badge) {
    color: #1a1f2e !important;
}

/* Form control labels and inputs in light mode */
html.light label,
html.light .form-label,
html.light .form-text,
html.sacred-light label,
html.sacred-light .form-label,
html.sacred-light .form-text,
body.light label,
body.light .form-label,
body.light .form-text,
body.sacred-light label,
body.sacred-light .form-label,
body.sacred-light .form-text {
    color: #1a1f2e !important;
}

/* Table text in light mode */
html.light table,
html.light table *:not(.btn):not(.badge),
html.sacred-light table,
html.sacred-light table *:not(.btn):not(.badge),
body.light table,
body.light table *:not(.btn):not(.badge),
body.sacred-light table,
body.sacred-light table *:not(.btn):not(.badge) {
    color: #1a1f2e !important;
}

/* Stats and metrics in light mode */
html.light [class*="stat"],
html.light [class*="metric"],
html.light [class*="value"],
html.sacred-light [class*="stat"],
html.sacred-light [class*="metric"],
html.sacred-light [class*="value"],
body.light [class*="stat"],
body.light [class*="metric"],
body.light [class*="value"],
body.sacred-light [class*="stat"],
body.sacred-light [class*="metric"],
body.sacred-light [class*="value"] {
    color: #1a1f2e !important;
}

/* Fix ContextualAssistant component */
html.light [class*="assistant"],
html.light [class*="assistant"] *:not(.btn):not(.badge),
html.sacred-light [class*="assistant"],
html.sacred-light [class*="assistant"] *:not(.btn):not(.badge),
body.light [class*="assistant"],
body.light [class*="assistant"] *:not(.btn):not(.badge),
body.sacred-light [class*="assistant"],
body.sacred-light [class*="assistant"] *:not(.btn):not(.badge) {
    color: #1a1f2e !important;
}

/* Fix TaxTerm tooltip in light mode */
html.light .tax-term-tooltip,
html.light .tax-term-tooltip *,
html.sacred-light .tax-term-tooltip,
html.sacred-light .tax-term-tooltip *,
body.light .tax-term-tooltip,
body.light .tax-term-tooltip *,
body.sacred-light .tax-term-tooltip,
body.sacred-light .tax-term-tooltip * {
    color: #1a1f2e !important;
    background: rgba(255, 255, 255, 0.98) !important;
}

/* Ensure link colors work in light mode but remain distinct */
html.light a:not(.btn):not(.nav-link):not([class*="brand"]),
html.sacred-light a:not(.btn):not(.nav-link):not([class*="brand"]),
body.light a:not(.btn):not(.nav-link):not([class*="brand"]),
body.sacred-light a:not(.btn):not(.nav-link):not([class*="brand"]) {
    color: var(--sacred-primary, #2563eb) !important;
}

/* List items and navigation items (except sidebar) */
html.light li:not(.app-nav li),
html.sacred-light li:not(.app-nav li),
body.light li:not(.app-nav li),
body.sacred-light li:not(.app-nav li) {
    color: #1a1f2e;
}

/* Headings in light mode - ultimate fix */
html.light h1:not(.app-nav h1), html.light h2:not(.app-nav h2), html.light h3:not(.app-nav h3),
html.light h4:not(.app-nav h4), html.light h5:not(.app-nav h5), html.light h6:not(.app-nav h6),
html.sacred-light h1:not(.app-nav h1), html.sacred-light h2:not(.app-nav h2), html.sacred-light h3:not(.app-nav h3),
html.sacred-light h4:not(.app-nav h4), html.sacred-light h5:not(.app-nav h5), html.sacred-light h6:not(.app-nav h6),
body.light h1:not(.app-nav h1), body.light h2:not(.app-nav h2), body.light h3:not(.app-nav h3),
body.light h4:not(.app-nav h4), body.light h5:not(.app-nav h5), body.light h6:not(.app-nav h6),
body.sacred-light h1:not(.app-nav h1), body.sacred-light h2:not(.app-nav h2), body.sacred-light h3:not(.app-nav h3),
body.sacred-light h4:not(.app-nav h4), body.sacred-light h5:not(.app-nav h5), body.sacred-light h6:not(.app-nav h6) {
    color: #1a1f2e !important;
}

/* ==========================================================
   COMPONENT-SCOPED STYLE OVERRIDES FOR LIGHT MODE
   These ultra-specific rules override Blazor scoped CSS
   that may use hard-coded white/light text colors
   ========================================================== */

/* Override any inline white text colors */
html.light [style*="color: #fff"],
html.light [style*="color: white"],
html.light [style*="color:#fff"],
html.light [style*="color:white"],
html.light [style*="color: rgb(255"],
body.light [style*="color: #fff"],
body.light [style*="color: white"],
body.light [style*="color:#fff"],
body.light [style*="color:white"],
body.light [style*="color: rgb(255"],
html.sacred-light [style*="color: #fff"],
html.sacred-light [style*="color: white"],
body.sacred-light [style*="color: #fff"],
body.sacred-light [style*="color: white"] {
    color: #1a1f2e !important;
}

/* Exclude buttons and badges from the above */
html.light .btn,
html.light .badge,
html.light [class*="btn-"],
body.light .btn,
body.light .badge,
body.light [class*="btn-"],
html.sacred-light .btn,
html.sacred-light .badge,
body.sacred-light .btn,
body.sacred-light .badge {
    /* Keep their original text colors */
}

/* Override any element with Blazor scoped attribute that has light text */
html.light [class*="b-"]:not(.app-nav *):not(.btn):not(.badge):not(.btn *):not(.badge *),
body.light [class*="b-"]:not(.app-nav *):not(.btn):not(.badge):not(.btn *):not(.badge *),
html.sacred-light [class*="b-"]:not(.app-nav *):not(.btn):not(.badge):not(.btn *):not(.badge *),
body.sacred-light [class*="b-"]:not(.app-nav *):not(.btn):not(.badge):not(.btn *):not(.badge *) {
    color: inherit;
}

/* Force dark text on common dashboard/stats elements */
html.light .stat-num,
html.light .stat-label,
html.light .metric-value,
html.light .metric-label,
html.light .metric-sub,
html.light .entity-name,
html.light .entity-stats,
html.light .form-tag,
html.light .form-name,
html.light .dash-subtitle,
html.light .hero-content *,
html.light .return-entity,
html.light .list-title,
html.light .list-sub,
html.light .urgent-text,
html.light .urgent-due,
html.light .muted,
body.light .stat-num,
body.light .stat-label,
body.light .metric-value,
body.light .metric-label,
body.light .metric-sub,
body.light .entity-name,
body.light .entity-stats,
body.light .form-tag,
body.light .form-name,
body.light .dash-subtitle,
body.light .hero-content *,
body.light .return-entity,
body.light .list-title,
body.light .list-sub,
body.light .urgent-text,
body.light .urgent-due,
body.light .muted,
html.sacred-light .stat-num,
html.sacred-light .stat-label,
html.sacred-light .metric-value,
html.sacred-light .metric-label,
body.sacred-light .stat-num,
body.sacred-light .stat-label,
body.sacred-light .metric-value,
body.sacred-light .metric-label {
    color: #1a1f2e !important;
}

/* Form1099 specific light mode fixes */
html.light .issue-card,
html.light .issue-card *,
html.light .warning-card,
html.light .warning-card *,
body.light .issue-card,
body.light .issue-card *,
body.light .warning-card,
body.light .warning-card *,
html.sacred-light .issue-card,
html.sacred-light .issue-card *,
body.sacred-light .issue-card,
body.sacred-light .issue-card * {
    color: #1a1f2e !important;
}

/* Landing page light mode - explicit overrides */
html.light .landing-hero *,
html.light .feature-card *,
html.light .testimonial *,
html.light .cta-section *,
body.light .landing-hero *,
body.light .feature-card *,
body.light .testimonial *,
body.light .cta-section *,
html.sacred-light .landing-hero *,
html.sacred-light .feature-card *,
body.sacred-light .landing-hero *,
body.sacred-light .feature-card * {
    color: #1a1f2e !important;
}

/* TaxFilingWizard light mode fixes */
html.light .wizard-step,
html.light .wizard-step *,
html.light .step-title,
html.light .step-description,
html.light .wizard-content *,
body.light .wizard-step,
body.light .wizard-step *,
body.light .step-title,
body.light .step-description,
body.light .wizard-content *,
html.sacred-light .wizard-step,
html.sacred-light .wizard-step *,
body.sacred-light .wizard-step,
body.sacred-light .wizard-step * {
    color: #1a1f2e !important;
}

/* Assets/EstimatedTax light mode fixes */
html.light .asset-card,
html.light .asset-card *,
html.light .tax-estimate *,
html.light .estimate-section *,
body.light .asset-card,
body.light .asset-card *,
body.light .tax-estimate *,
body.light .estimate-section *,
html.sacred-light .asset-card,
html.sacred-light .asset-card *,
body.sacred-light .asset-card,
body.sacred-light .asset-card * {
    color: #1a1f2e !important;
}

/* Ensure all section titles and subtitles are dark in light mode */
html.light .section-title,
html.light .section-subtitle,
html.light .page-title,
html.light .page-subtitle,
html.light .card-title,
html.light .card-subtitle,
html.light .panel-title,
html.light .panel-header,
body.light .section-title,
body.light .section-subtitle,
body.light .page-title,
body.light .page-subtitle,
body.light .card-title,
body.light .card-subtitle,
body.light .panel-title,
body.light .panel-header,
html.sacred-light .section-title,
html.sacred-light .section-subtitle,
body.sacred-light .section-title,
body.sacred-light .section-subtitle {
    color: #1a1f2e !important;
}

/* Ghost buttons in light mode */
html.light .ghost,
html.light [class*="ghost"],
html.light .btn-outline-light,
html.light .btn-outline-secondary,
body.light .ghost,
body.light [class*="ghost"],
body.light .btn-outline-light,
body.light .btn-outline-secondary,
html.sacred-light .ghost,
html.sacred-light [class*="ghost"],
body.sacred-light .ghost,
body.sacred-light [class*="ghost"] {
    color: #374151 !important;
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
}

html.light .ghost:hover,
html.light [class*="ghost"]:hover,
body.light .ghost:hover,
body.light [class*="ghost"]:hover,
html.sacred-light .ghost:hover,
body.sacred-light .ghost:hover {
    color: #1a1f2e !important;
    background: rgba(0, 0, 0, 0.08) !important;
}

/* Dropdown and select elements in light mode */
html.light select option,
html.light datalist option,
body.light select option,
body.light datalist option,
html.sacred-light select option,
body.sacred-light select option {
    background: #fff;
    color: #1a1f2e;
}

/* Placeholder text in light mode */
html.light ::placeholder,
body.light ::placeholder,
html.sacred-light ::placeholder,
body.sacred-light ::placeholder {
    color: #6b7280 !important;
    opacity: 1;
}

/* Chip elements in light mode */
html.light .chip,
html.light [class*="-chip"],
html.light .tag,
html.light [class*="-tag"]:not(.badge),
body.light .chip,
body.light [class*="-chip"],
body.light .tag,
body.light [class*="-tag"]:not(.badge),
html.sacred-light .chip,
html.sacred-light [class*="-chip"],
body.sacred-light .chip,
body.sacred-light [class*="-chip"] {
    background: rgba(0, 0, 0, 0.05) !important;
    color: #374151 !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

/* Empty state and placeholder content */
html.light .empty,
html.light .empty-state,
html.light .placeholder-text,
html.light .no-data,
body.light .empty,
body.light .empty-state,
body.light .placeholder-text,
body.light .no-data,
html.sacred-light .empty,
html.sacred-light .empty-state,
body.sacred-light .empty,
body.sacred-light .empty-state {
    color: #6b7280 !important;
}

/* Progress indicators in light mode */
html.light .progress-text,
html.light .progress-label,
html.light .progress-value,
body.light .progress-text,
body.light .progress-label,
body.light .progress-value,
html.sacred-light .progress-text,
body.sacred-light .progress-text {
    color: #1a1f2e !important;
}

/* Fix tooltip content in light mode */
html.light [class*="tooltip"],
html.light [class*="tooltip"] *,
body.light [class*="tooltip"],
body.light [class*="tooltip"] *,
html.sacred-light [class*="tooltip"],
body.sacred-light [class*="tooltip"] {
    color: #1a1f2e !important;
}

/* Ensure primary colored text stays visible */
html.light .text-primary,
body.light .text-primary,
html.sacred-light .text-primary,
body.sacred-light .text-primary {
    color: var(--sacred-primary, #2563eb) !important;
}

html.light .text-secondary,
body.light .text-secondary,
html.sacred-light .text-secondary,
body.sacred-light .text-secondary {
    color: var(--sacred-secondary-dark, #3b82f6) !important;
}

html.light .text-success,
body.light .text-success,
html.sacred-light .text-success,
body.sacred-light .text-success {
    color: #059669 !important;
}

html.light .text-warning,
body.light .text-warning,
html.sacred-light .text-warning,
body.sacred-light .text-warning {
    color: #d97706 !important;
}

html.light .text-danger,
body.light .text-danger,
html.sacred-light .text-danger,
body.sacred-light .text-danger {
    color: #dc2626 !important;
}

html.light .text-info,
body.light .text-info,
html.sacred-light .text-info,
body.sacred-light .text-info {
    color: #0891b2 !important;
}

/* ==========================================================
   COMPREHENSIVE LIGHT MODE TEXT FIXES
   Forces dark text on all Dashboard and page-level components
   ========================================================== */

/* Dashboard page light mode */
html.light .dash-container,
html.light .dash-container *:not(.btn):not(.btn *):not(.badge):not(.badge *):not(.hero-cta):not(.hero-cta *):not(.urgent-deadline-bar),
body.light .dash-container,
body.light .dash-container *:not(.btn):not(.btn *):not(.badge):not(.badge *):not(.hero-cta):not(.hero-cta *):not(.urgent-deadline-bar),
html.sacred-light .dash-container,
html.sacred-light .dash-container *:not(.btn):not(.btn *):not(.badge):not(.badge *):not(.hero-cta):not(.hero-cta *),
body.sacred-light .dash-container,
body.sacred-light .dash-container *:not(.btn):not(.btn *):not(.badge):not(.badge *):not(.hero-cta):not(.hero-cta *) {
    color: #1a1f2e !important;
}

/* Dashboard metric cards */
html.light .metric-card,
html.light .metric-card-mini,
body.light .metric-card,
body.light .metric-card-mini,
html.sacred-light .metric-card,
body.sacred-light .metric-card {
    background: rgba(255, 255, 255, 0.9) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

html.light .metric-value,
html.light .metric-label,
html.light .metric-sub,
body.light .metric-value,
body.light .metric-label,
body.light .metric-sub,
html.sacred-light .metric-value,
html.sacred-light .metric-label,
body.sacred-light .metric-label {
    color: #1a1f2e !important;
}

/* Dashboard hero section */
html.light .dash-hero,
body.light .dash-hero,
html.sacred-light .dash-hero,
body.sacred-light .dash-hero {
    background: rgba(255, 255, 255, 0.95) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

html.light .hero-content,
html.light .hero-content *:not(.hero-cta):not(.hero-cta *),
body.light .hero-content,
body.light .hero-content *:not(.hero-cta):not(.hero-cta *),
html.sacred-light .hero-content,
body.sacred-light .hero-content {
    color: #1a1f2e !important;
}

html.light .dash-subtitle,
body.light .dash-subtitle,
html.sacred-light .dash-subtitle,
body.sacred-light .dash-subtitle {
    color: #4a5568 !important;
}

/* Dashboard controls (dropdowns) */
html.light .dash-year,
html.light .dash-view,
body.light .dash-year,
body.light .dash-view,
html.sacred-light .dash-year,
body.sacred-light .dash-year {
    background: rgba(255, 255, 255, 0.95) !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
    color: #1a1f2e !important;
}

/* Ghost buttons in light mode - keep them visible */
html.light .hero-cta.ghost,
body.light .hero-cta.ghost,
html.sacred-light .hero-cta.ghost,
body.sacred-light .hero-cta.ghost {
    background: rgba(26, 31, 46, 0.08) !important;
    border-color: rgba(26, 31, 46, 0.2) !important;
    color: #1a1f2e !important;
}

html.light .hero-cta.ghost:hover,
body.light .hero-cta.ghost:hover,
html.sacred-light .hero-cta.ghost:hover,
body.sacred-light .hero-cta.ghost:hover {
    background: rgba(26, 31, 46, 0.12) !important;
    color: #1a1f2e !important;
}

/* Entity cards */
html.light .entity-card,
html.light .entity-card *,
body.light .entity-card,
body.light .entity-card *,
html.sacred-light .entity-card,
body.sacred-light .entity-card {
    color: #1a1f2e !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

/* Hub page */
html.light .hub-container,
html.light .hub-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .hub-container,
body.light .hub-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.sacred-light .hub-container,
body.sacred-light .hub-container {
    color: #1a1f2e !important;
}

/* AI Inbox page */
html.light .inbox-container,
html.light .inbox-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .inbox-container,
body.light .inbox-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.sacred-light .inbox-container,
body.sacred-light .inbox-container {
    color: #1a1f2e !important;
}

/* LLM Workspace */
html.light .llm-workspace,
html.light .llm-workspace *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .llm-workspace,
body.light .llm-workspace *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.sacred-light .llm-workspace,
body.sacred-light .llm-workspace {
    color: #1a1f2e !important;
}

/* SmartUpload page */
html.light .smart-upload-container,
html.light .smart-upload-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.light .upload-zone,
html.light .upload-zone *,
body.light .smart-upload-container,
body.light .smart-upload-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .upload-zone,
body.light .upload-zone *,
html.sacred-light .smart-upload-container,
body.sacred-light .smart-upload-container {
    color: #1a1f2e !important;
}

html.light .upload-zone,
body.light .upload-zone,
html.sacred-light .upload-zone,
body.sacred-light .upload-zone {
    background: rgba(255, 255, 255, 0.9) !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

/* Tax Filing Wizard */
html.light .wizard-container,
html.light .wizard-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .wizard-container,
body.light .wizard-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.sacred-light .wizard-container,
body.sacred-light .wizard-container {
    color: #1a1f2e !important;
}

/* Financial Reports */
html.light .reports-container,
html.light .reports-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .reports-container,
body.light .reports-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.sacred-light .reports-container,
body.sacred-light .reports-container {
    color: #1a1f2e !important;
}

/* PFS (Personal Financial Statement) */
html.light .pfs-container,
html.light .pfs-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .pfs-container,
body.light .pfs-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.sacred-light .pfs-container,
body.sacred-light .pfs-container {
    color: #1a1f2e !important;
}

/* Compliance Tracker */
html.light .compliance-container,
html.light .compliance-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .compliance-container,
body.light .compliance-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.sacred-light .compliance-container,
body.sacred-light .compliance-container {
    color: #1a1f2e !important;
}

/* Deduction Optimizer */
html.light .optimizer-container,
html.light .optimizer-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .optimizer-container,
body.light .optimizer-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.sacred-light .optimizer-container,
body.sacred-light .optimizer-container {
    color: #1a1f2e !important;
}

/* Admin Setup */
html.light .admin-container,
html.light .admin-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
body.light .admin-container,
body.light .admin-container *:not(.btn):not(.btn *):not(.badge):not(.badge *),
html.sacred-light .admin-container,
body.sacred-light .admin-container {
    color: #1a1f2e !important;
}

/* Ensure all semi-transparent white backgrounds become readable */
html.light [style*="background: rgba(255"],
html.light [style*="background:rgba(255"],
body.light [style*="background: rgba(255"],
body.light [style*="background:rgba(255"],
html.sacred-light [style*="background: rgba(255"],
body.sacred-light [style*="background: rgba(255"] {
    background: rgba(0, 0, 0, 0.04) !important;
}

/* Fix checklist items */
html.light .checklist li,
body.light .checklist li,
html.sacred-light .checklist li,
body.sacred-light .checklist li {
    color: #4a5568 !important;
}

html.light .checklist li.done,
body.light .checklist li.done,
html.sacred-light .checklist li.done,
body.sacred-light .checklist li.done {
    color: #059669 !important;
}

/* Fix today activity cards */
html.light .today-card,
html.light .today-card *,
body.light .today-card,
body.light .today-card *,
html.sacred-light .today-card,
body.sacred-light .today-card {
    color: #1a1f2e !important;
    background: rgba(255, 255, 255, 0.9) !important;
}

/* Status values should keep their semantic colors */
html.light .text-success,
html.light .stat-value.text-success,
body.light .text-success,
body.light .stat-value.text-success {
    color: #059669 !important;
}

html.light .text-warn,
html.light .stat-value.text-warn,
body.light .text-warn,
body.light .stat-value.text-warn {
    color: #d97706 !important;
}

/* Fix form tags */
html.light .form-tag,
body.light .form-tag,
html.sacred-light .form-tag,
body.sacred-light .form-tag {
    background: rgba(0, 0, 0, 0.06) !important;
    color: #4a5568 !important;
}

/* Fix entity pills */
html.light .entity-pill,
body.light .entity-pill,
html.sacred-light .entity-pill,
body.sacred-light .entity-pill {
    color: #2563eb !important;
}

html.light .entity-pill.pill-biz,
body.light .entity-pill.pill-biz,
html.sacred-light .entity-pill.pill-biz,
body.sacred-light .entity-pill.pill-biz {
    color: #3b82f6 !important;
}

/* Universal fallback for any remaining light-colored text */
html.light .app-body,
html.light .app-main,
html.light .sacred-content,
body.light .app-body,
body.light .app-main,
body.light .sacred-content,
html.sacred-light .app-body,
html.sacred-light .app-main,
body.sacred-light .app-body,
body.sacred-light .app-main {
    color: #1a1f2e !important;
}

/* ==========================================================
   BLAZOR SCOPED CSS OVERRIDE FOR LIGHT MODE
   Uses attribute selectors to match Blazor's scoped CSS pattern
   and force dark text on all elements in light/dawn mode
   ========================================================== */

/* Ultra-high specificity override for scoped CSS elements */
html.light [class][class],
html.light [class][class] *,
body.light [class][class],
body.light [class][class] *,
html.sacred-light [class][class],
html.sacred-light [class][class] *,
body.sacred-light [class][class],
body.sacred-light [class][class] * {
    --text: #1a1f2e;
    --sacred-text: #1a1f2e;
}

/* Force all text elements to inherit dark color in light mode */
html.light:not(.app-nav):not(.app-nav *) h1,
html.light:not(.app-nav):not(.app-nav *) h2,
html.light:not(.app-nav):not(.app-nav *) h3,
html.light:not(.app-nav):not(.app-nav *) h4,
html.light:not(.app-nav):not(.app-nav *) h5,
html.light:not(.app-nav):not(.app-nav *) h6,
html.light:not(.app-nav):not(.app-nav *) p,
html.light:not(.app-nav):not(.app-nav *) span,
html.light:not(.app-nav):not(.app-nav *) div,
html.light:not(.app-nav):not(.app-nav *) label,
html.light:not(.app-nav):not(.app-nav *) li,
html.light:not(.app-nav):not(.app-nav *) td,
html.light:not(.app-nav):not(.app-nav *) th,
html.light:not(.app-nav):not(.app-nav *) strong,
html.light:not(.app-nav):not(.app-nav *) b,
body.light:not(.app-nav):not(.app-nav *) h1,
body.light:not(.app-nav):not(.app-nav *) h2,
body.light:not(.app-nav):not(.app-nav *) h3,
body.light:not(.app-nav):not(.app-nav *) h4,
body.light:not(.app-nav):not(.app-nav *) h5,
body.light:not(.app-nav):not(.app-nav *) h6,
body.light:not(.app-nav):not(.app-nav *) p,
body.light:not(.app-nav):not(.app-nav *) span,
body.light:not(.app-nav):not(.app-nav *) div,
body.light:not(.app-nav):not(.app-nav *) label,
body.light:not(.app-nav):not(.app-nav *) li,
body.light:not(.app-nav):not(.app-nav *) td,
body.light:not(.app-nav):not(.app-nav *) th,
body.light:not(.app-nav):not(.app-nav *) strong,
body.light:not(.app-nav):not(.app-nav *) b {
    color: #1a1f2e !important;
}

/* Exclude nav, buttons and badges from dark text override */
html.light .app-nav,
html.light .app-nav *,
body.light .app-nav,
body.light .app-nav *,
html.sacred-light .app-nav,
html.sacred-light .app-nav *,
body.sacred-light .app-nav,
body.sacred-light .app-nav * {
    color: inherit;
}

html.light .btn,
html.light .badge,
body.light .btn,
body.light .badge,
html.sacred-light .btn,
html.sacred-light .badge,
body.sacred-light .btn,
body.sacred-light .badge {
    /* Keep button/badge colors as defined */
}

/* Additional strong/bold text override for light mode */
html.light strong,
html.light b,
html.light .fw-bold,
html.light .font-bold,
body.light strong,
body.light b,
body.light .fw-bold,
body.light .font-bold,
html.sacred-light strong,
html.sacred-light b,
body.sacred-light strong,
body.sacred-light b {
    color: #1a1f2e !important;
}

/* Fix metric/stat values that may have white text */
html.light .stat-num,
html.light .metric-value,
html.light [class*="value"],
body.light .stat-num,
body.light .metric-value,
body.light [class*="value"],
html.sacred-light .stat-num,
html.sacred-light .metric-value,
body.sacred-light .stat-num,
body.sacred-light .metric-value {
    color: #1a1f2e !important;
}

/* Override any element with explicit white color in light mode */
html.light [style*="fff"],
html.light [style*="FFF"],
body.light [style*="fff"],
body.light [style*="FFF"],
html.sacred-light [style*="fff"],
body.sacred-light [style*="fff"] {
    color: #1a1f2e !important;
}

/* ==========================================================
   FINAL COMPREHENSIVE LIGHT/DAWN MODE TEXT FIX
   Ensures all text content is readable in light mode
   Uses very high specificity to override any existing rules
   ========================================================== */

/* Global text color override for main content area in light mode */
html.light .app-body *,
html.sacred-light .app-body *,
body.light .app-body *,
body.sacred-light .app-body * {
    color: #1a1f2e;
}

/* Exclude elements that need their own colors preserved */
html.light .app-body .btn,
html.light .app-body .badge,
html.light .app-body .text-success,
html.light .app-body .text-danger,
html.light .app-body .text-warning,
html.light .app-body .text-info,
html.light .app-body .text-primary,
html.sacred-light .app-body .btn,
html.sacred-light .app-body .badge,
html.sacred-light .app-body .text-success,
html.sacred-light .app-body .text-danger,
html.sacred-light .app-body .text-warning,
html.sacred-light .app-body .text-info,
html.sacred-light .app-body .text-primary,
body.light .app-body .btn,
body.light .app-body .badge,
body.sacred-light .app-body .btn,
body.sacred-light .app-body .badge {
    color: unset;
}

/* Make sure muted text is readable but visually lighter */
html.light .text-muted,
html.sacred-light .text-muted,
body.light .text-muted,
body.sacred-light .text-muted {
    color: #6b7280 !important;
}

/* Force high contrast for primary content elements */
html.light .card,
html.light .card *,
html.sacred-light .card,
html.sacred-light .card *,
body.light .card,
body.light .card *,
body.sacred-light .card,
body.sacred-light .card * {
    color: #1a1f2e;
}

/* Floating AI panel keeps its dark theme even in light mode */
html.light .floating-ai-panel,
html.light .floating-ai-panel *,
html.sacred-light .floating-ai-panel,
html.sacred-light .floating-ai-panel *,
body.light .floating-ai-panel,
body.light .floating-ai-panel *,
body.sacred-light .floating-ai-panel,
body.sacred-light .floating-ai-panel * {
    color: #e8e9eb !important;
}

html.light .floating-ai-panel,
html.sacred-light .floating-ai-panel,
body.light .floating-ai-panel,
body.sacred-light .floating-ai-panel {
    background: rgba(20, 24, 35, 0.98) !important;
}

/* Override for selects and inputs */
html.light select,
html.light input:not([type="checkbox"]):not([type="radio"]),
html.light textarea,
html.sacred-light select,
html.sacred-light input:not([type="checkbox"]):not([type="radio"]),
html.sacred-light textarea,
body.light select,
body.light input:not([type="checkbox"]):not([type="radio"]),
body.light textarea,
body.sacred-light select,
body.sacred-light input:not([type="checkbox"]):not([type="radio"]),
body.sacred-light textarea {
    color: #1a1f2e !important;
    background-color: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.2) !important;
}

/* Placeholders should be lighter but still visible */
html.light ::placeholder,
html.sacred-light ::placeholder,
body.light ::placeholder,
body.sacred-light ::placeholder {
    color: #9ca3af !important;
}

/* Dashboard and main page elements */
html.light .dash-hero,
html.light .dash-hero *,
html.sacred-light .dash-hero,
html.sacred-light .dash-hero *,
body.light .dash-hero,
body.light .dash-hero *,
body.sacred-light .dash-hero,
body.sacred-light .dash-hero * {
    color: #1a1f2e !important;
}

/* Ensure tables are readable */
html.light table,
html.light table th,
html.light table td,
html.sacred-light table,
html.sacred-light table th,
html.sacred-light table td,
body.light table,
body.light table th,
body.light table td,
body.sacred-light table,
body.sacred-light table th,
body.sacred-light table td {
    color: #1a1f2e !important;
}

/* Fix ghost/outline buttons in light mode */
html.light .btn-ghost,
html.light .btn.ghost,
html.light .ghost,
html.sacred-light .btn-ghost,
html.sacred-light .btn.ghost,
html.sacred-light .ghost,
body.light .btn-ghost,
body.light .btn.ghost,
body.light .ghost,
body.sacred-light .btn-ghost,
body.sacred-light .btn.ghost,
body.sacred-light .ghost {
    color: #374151 !important;
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

html.light .btn-ghost:hover,
html.light .btn.ghost:hover,
html.light .ghost:hover,
html.sacred-light .btn-ghost:hover,
html.sacred-light .btn.ghost:hover,
html.sacred-light .ghost:hover,
body.light .btn-ghost:hover,
body.light .btn.ghost:hover,
body.light .ghost:hover,
body.sacred-light .btn-ghost:hover,
body.sacred-light .btn.ghost:hover,
body.sacred-light .ghost:hover {
    color: #1a1f2e !important;
    background: rgba(0, 0, 0, 0.08) !important;
}

/* ==========================================================
   NUCLEAR LIGHT MODE TEXT FIX
   This is the final catch-all for any remaining white text
   in light/dawn mode. Uses extreme specificity with !important.
   ========================================================== */

/* Force ALL text within app-body to be dark in light mode */
html.light .app-body,
html.light .app-body *:not(.btn):not(.badge):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not([class*="text-"]):not(.floating-ai-panel):not(.floating-ai-panel *):not(.app-nav):not(.app-nav *),
html.sacred-light .app-body,
html.sacred-light .app-body *:not(.btn):not(.badge):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not([class*="text-"]):not(.floating-ai-panel):not(.floating-ai-panel *):not(.app-nav):not(.app-nav *),
body.light .app-body,
body.light .app-body *:not(.btn):not(.badge):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not([class*="text-"]):not(.floating-ai-panel):not(.floating-ai-panel *):not(.app-nav):not(.app-nav *),
body.sacred-light .app-body,
body.sacred-light .app-body *:not(.btn):not(.badge):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not([class*="text-"]):not(.floating-ai-panel):not(.floating-ai-panel *):not(.app-nav):not(.app-nav *) {
    color: #1a1f2e !important;
}

/* Restore proper colors for utility classes */
html.light .text-success,
html.sacred-light .text-success,
body.light .text-success,
body.sacred-light .text-success {
    color: #059669 !important;
}

html.light .text-danger,
html.sacred-light .text-danger,
body.light .text-danger,
body.sacred-light .text-danger {
    color: #dc2626 !important;
}

html.light .text-warning,
html.sacred-light .text-warning,
body.light .text-warning,
body.sacred-light .text-warning {
    color: #d97706 !important;
}

html.light .text-info,
html.sacred-light .text-info,
body.light .text-info,
body.sacred-light .text-info {
    color: #0284c7 !important;
}

html.light .text-primary,
html.sacred-light .text-primary,
body.light .text-primary,
body.sacred-light .text-primary {
    color: #2563eb !important;
}

/* Muted text in light mode should be visible but subdued */
html.light .text-muted,
html.light .muted,
html.sacred-light .text-muted,
html.sacred-light .muted,
body.light .text-muted,
body.light .muted,
body.sacred-light .text-muted,
body.sacred-light .muted {
    color: #6b7280 !important;
}

/* Ensure nav and floating panel keep their dark design */
html.light .app-nav,
html.light .app-nav *,
html.light .floating-ai-panel,
html.light .floating-ai-panel *,
html.sacred-light .app-nav,
html.sacred-light .app-nav *,
html.sacred-light .floating-ai-panel,
html.sacred-light .floating-ai-panel *,
body.light .app-nav,
body.light .app-nav *,
body.light .floating-ai-panel,
body.light .floating-ai-panel *,
body.sacred-light .app-nav,
body.sacred-light .app-nav *,
body.sacred-light .floating-ai-panel,
body.sacred-light .floating-ai-panel * {
    color: inherit;
}

/* Fix any remaining --vt-muted variable usage in light mode */
html.light,
html.sacred-light,
body.light,
body.sacred-light {
    --vt-muted: #4a5568;
}

/* ==========================================================
   FINAL COMPREHENSIVE DAWN/LIGHT MODE FIX
   This section ensures ALL text content is readable in light mode
   Uses highest specificity to override component-scoped styles
   ========================================================== */

/* Force dark text color on all content in light mode */
html.light .app-body,
html.light .app-body h1,
html.light .app-body h2,
html.light .app-body h3,
html.light .app-body h4,
html.light .app-body h5,
html.light .app-body h6,
html.light .app-body p,
html.light .app-body span:not(.badge):not([class*="text-"]),
html.light .app-body div:not(.badge),
html.light .app-body label,
html.light .app-body strong,
html.light .app-body b,
html.light .sacred-content,
html.light .sacred-content h1,
html.light .sacred-content h2,
html.light .sacred-content h3,
html.light .sacred-content h4,
html.light .sacred-content p,
html.light .sacred-content span:not(.badge):not([class*="text-"]),
html.light .sacred-content div:not(.badge),
html.sacred-light .app-body,
html.sacred-light .app-body h1,
html.sacred-light .app-body h2,
html.sacred-light .app-body h3,
html.sacred-light .app-body h4,
html.sacred-light .app-body h5,
html.sacred-light .app-body h6,
html.sacred-light .app-body p,
html.sacred-light .app-body span:not(.badge):not([class*="text-"]),
html.sacred-light .app-body div:not(.badge),
html.sacred-light .sacred-content,
html.sacred-light .sacred-content h1,
html.sacred-light .sacred-content h2,
html.sacred-light .sacred-content h3,
html.sacred-light .sacred-content h4,
html.sacred-light .sacred-content p,
html.sacred-light .sacred-content span:not(.badge):not([class*="text-"]),
html.sacred-light .sacred-content div:not(.badge),
body.light .app-body,
body.light .app-body h1,
body.light .app-body h2,
body.light .app-body h3,
body.light .app-body h4,
body.light .app-body h5,
body.light .app-body h6,
body.light .app-body p,
body.light .app-body span:not(.badge):not([class*="text-"]),
body.light .app-body div:not(.badge),
body.light .sacred-content,
body.light .sacred-content h1,
body.light .sacred-content h2,
body.light .sacred-content h3,
body.light .sacred-content h4,
body.light .sacred-content p,
body.light .sacred-content span:not(.badge):not([class*="text-"]),
body.light .sacred-content div:not(.badge),
body.sacred-light .app-body,
body.sacred-light .sacred-content {
    color: #1a1f2e !important;
}

/* Ensure select and input elements have dark text */
html.light select,
html.light input[type="text"],
html.light input[type="number"],
html.light input[type="email"],
html.light input[type="password"],
html.light input[type="date"],
html.light input[type="search"],
html.light textarea,
html.sacred-light select,
html.sacred-light input[type="text"],
html.sacred-light input[type="number"],
html.sacred-light input[type="email"],
html.sacred-light input[type="password"],
html.sacred-light input[type="date"],
html.sacred-light input[type="search"],
html.sacred-light textarea,
body.light select,
body.light input[type="text"],
body.light input[type="number"],
body.light input[type="email"],
body.light input[type="password"],
body.light input[type="date"],
body.light input[type="search"],
body.light textarea,
body.sacred-light select,
body.sacred-light input[type="text"],
body.sacred-light input[type="number"],
body.sacred-light input[type="email"],
body.sacred-light input[type="password"],
body.sacred-light input[type="date"],
body.sacred-light input[type="search"],
body.sacred-light textarea {
    color: #1a1f2e !important;
    background-color: #ffffff !important;
}

/* Force light background on cards and containers in light mode */
html.light .card,
html.light .sacred-card,
html.light [class*="-card"],
html.light [class*="Card"],
html.sacred-light .card,
html.sacred-light .sacred-card,
html.sacred-light [class*="-card"],
html.sacred-light [class*="Card"],
body.light .card,
body.light .sacred-card,
body.light [class*="-card"],
body.light [class*="Card"],
body.sacred-light .card,
body.sacred-light .sacred-card {
    background: rgba(255, 255, 255, 0.9) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

/* Ensure muted/dim text is visible in light mode */
html.light [class*="muted"],
html.light [class*="-muted"],
html.light [class*="dim"],
html.light [class*="secondary"],
html.light [class*="-sub"],
html.light [class*="hint"],
html.sacred-light [class*="muted"],
html.sacred-light [class*="-muted"],
html.sacred-light [class*="dim"],
html.sacred-light [class*="secondary"],
html.sacred-light [class*="-sub"],
body.light [class*="muted"],
body.light [class*="-muted"],
body.light [class*="dim"],
body.light [class*="secondary"],
body.light [class*="-sub"],
body.light [class*="hint"],
body.sacred-light [class*="muted"],
body.sacred-light [class*="-muted"] {
    color: #4a5568 !important;
}

/* Override any inline color styles for white text */
html.light [style*="color: #fff"],
html.light [style*="color:#fff"],
html.light [style*="color: white"],
html.light [style*="color:white"],
html.sacred-light [style*="color: #fff"],
html.sacred-light [style*="color:#fff"],
html.sacred-light [style*="color: white"],
html.sacred-light [style*="color:white"],
body.light [style*="color: #fff"],
body.light [style*="color:#fff"],
body.light [style*="color: white"],
body.light [style*="color:white"],
body.sacred-light [style*="color: #fff"],
body.sacred-light [style*="color:#fff"] {
    color: #1a1f2e !important;
}

/* Preserve proper colors for semantic text classes */
html.light .text-success,
html.sacred-light .text-success,
body.light .text-success,
body.sacred-light .text-success {
    color: #059669 !important;
}

html.light .text-danger,
html.sacred-light .text-danger,
body.light .text-danger,
body.sacred-light .text-danger {
    color: #dc2626 !important;
}

html.light .text-warning,
html.sacred-light .text-warning,
body.light .text-warning,
body.sacred-light .text-warning {
    color: #d97706 !important;
}

html.light .text-info,
html.sacred-light .text-info,
body.light .text-info,
body.sacred-light .text-info {
    color: #0284c7 !important;
}

html.light .text-primary,
html.sacred-light .text-primary,
body.light .text-primary,
body.sacred-light .text-primary {
    color: #2563eb !important;
}

/* ==========================================================
   CRITICAL LIGHT MODE FIX - Ensure all text is visible
   Forces dark text in light mode for elements that might
   have missed explicit overrides
   ========================================================== */

/* Root level CSS variable overrides for light mode */
html.light,
html.sacred-light,
body.light,
body.sacred-light {
    --text: #1a1f2e;
    --text-muted: #4a5568;
    --sacred-text: #1a1f2e;
    --sacred-text-muted: #4a5568;
    --sacred-text-dim: #5a6478;
}

/* Catch-all for any element inside light mode container */
html.light *:not(.btn):not(.badge):not([class*="btn-"]):not(.app-nav *):not(.sacred-brand *),
html.sacred-light *:not(.btn):not(.badge):not([class*="btn-"]):not(.app-nav *):not(.sacred-brand *),
body.light *:not(.btn):not(.badge):not([class*="btn-"]):not(.app-nav *):not(.sacred-brand *),
body.sacred-light *:not(.btn):not(.badge):not([class*="btn-"]):not(.app-nav *):not(.sacred-brand *) {
    --text: #1a1f2e;
    --text-muted: #4a5568;
    --sacred-text: #1a1f2e;
    --sacred-text-muted: #4a5568;
}

/* Force inherit for elements that don't pick up the color */
html.light .app-body,
html.light .app-main,
html.light .sacred-content,
html.sacred-light .app-body,
html.sacred-light .app-main,
html.sacred-light .sacred-content,
body.light .app-body,
body.light .app-main,
body.light .sacred-content,
body.sacred-light .app-body,
body.sacred-light .app-main,
body.sacred-light .sacred-content {
    color: #1a1f2e;
}

/* ==========================================================
   AGGRESSIVE LIGHT MODE FIX - Override component-scoped CSS
   Uses !important to ensure visibility on white backgrounds
   ========================================================== */

/* Override all hardcoded white text in main content area */
html.light .app-body h1,
html.light .app-body h2,
html.light .app-body h3,
html.light .app-body h4,
html.light .app-body h5,
html.light .app-body h6,
html.light .app-body p,
html.light .app-body span:not(.badge):not(.icon):not([class*="oi-"]),
html.light .app-body div:not(.badge),
html.light .app-body label,
html.light .app-body strong,
html.light .app-body em,
html.light .app-body li,
html.light .app-body td,
html.light .app-body th,
html.sacred-light .app-body h1,
html.sacred-light .app-body h2,
html.sacred-light .app-body h3,
html.sacred-light .app-body h4,
html.sacred-light .app-body h5,
html.sacred-light .app-body h6,
html.sacred-light .app-body p,
html.sacred-light .app-body span:not(.badge):not(.icon):not([class*="oi-"]),
html.sacred-light .app-body div:not(.badge),
html.sacred-light .app-body label,
html.sacred-light .app-body strong,
html.sacred-light .app-body em,
html.sacred-light .app-body li,
html.sacred-light .app-body td,
html.sacred-light .app-body th,
body.light .app-body h1,
body.light .app-body h2,
body.light .app-body h3,
body.light .app-body h4,
body.light .app-body h5,
body.light .app-body h6,
body.light .app-body p,
body.light .app-body span:not(.badge):not(.icon):not([class*="oi-"]),
body.light .app-body div:not(.badge),
body.light .app-body label,
body.light .app-body strong,
body.light .app-body em,
body.light .app-body li,
body.light .app-body td,
body.light .app-body th,
body.sacred-light .app-body h1,
body.sacred-light .app-body h2,
body.sacred-light .app-body h3,
body.sacred-light .app-body h4,
body.sacred-light .app-body h5,
body.sacred-light .app-body h6,
body.sacred-light .app-body p,
body.sacred-light .app-body span:not(.badge):not(.icon):not([class*="oi-"]),
body.sacred-light .app-body div:not(.badge),
body.sacred-light .app-body label,
body.sacred-light .app-body strong,
body.sacred-light .app-body em,
body.sacred-light .app-body li,
body.sacred-light .app-body td,
body.sacred-light .app-body th {
    color: #1a1f2e !important;
}

/* Override muted text colors */
html.light .app-body .text-muted,
html.light .app-body .muted,
html.light .app-body small,
html.sacred-light .app-body .text-muted,
html.sacred-light .app-body .muted,
html.sacred-light .app-body small,
body.light .app-body .text-muted,
body.light .app-body .muted,
body.light .app-body small,
body.sacred-light .app-body .text-muted,
body.sacred-light .app-body .muted,
body.sacred-light .app-body small {
    color: #4a5568 !important;
}

/* Override select/input controls with dark text */
html.light .app-body select,
html.light .app-body input:not([type="checkbox"]):not([type="radio"]),
html.light .app-body textarea,
html.sacred-light .app-body select,
html.sacred-light .app-body input:not([type="checkbox"]):not([type="radio"]),
html.sacred-light .app-body textarea,
body.light .app-body select,
body.light .app-body input:not([type="checkbox"]):not([type="radio"]),
body.light .app-body textarea,
body.sacred-light .app-body select,
body.sacred-light .app-body input:not([type="checkbox"]):not([type="radio"]),
body.sacred-light .app-body textarea {
    color: #1a1f2e !important;
    background-color: #fff !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

/* Override ghost buttons in light mode */
html.light .app-body .ghost,
html.light .app-body .btn.ghost,
html.light .app-body button.ghost,
html.sacred-light .app-body .ghost,
html.sacred-light .app-body .btn.ghost,
html.sacred-light .app-body button.ghost,
body.light .app-body .ghost,
body.light .app-body .btn.ghost,
body.light .app-body button.ghost,
body.sacred-light .app-body .ghost,
body.sacred-light .app-body .btn.ghost,
body.sacred-light .app-body button.ghost {
    color: #374151 !important;
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
}

html.light .app-body .ghost:hover,
html.light .app-body .btn.ghost:hover,
html.light .app-body button.ghost:hover,
html.sacred-light .app-body .ghost:hover,
html.sacred-light .app-body .btn.ghost:hover,
html.sacred-light .app-body button.ghost:hover,
body.light .app-body .ghost:hover,
body.light .app-body .btn.ghost:hover,
body.light .app-body button.ghost:hover,
body.sacred-light .app-body .ghost:hover,
body.sacred-light .app-body .btn.ghost:hover,
body.sacred-light .app-body button.ghost:hover {
    color: #1a1f2e !important;
    background: rgba(0, 0, 0, 0.08) !important;
}

/* Keep primary buttons with light text */
html.light .app-body .btn-primary,
html.light .app-body .btn-success,
html.light .app-body .btn-danger,
html.sacred-light .app-body .btn-primary,
html.sacred-light .app-body .btn-success,
html.sacred-light .app-body .btn-danger,
body.light .app-body .btn-primary,
body.light .app-body .btn-success,
body.light .app-body .btn-danger,
body.sacred-light .app-body .btn-primary,
body.sacred-light .app-body .btn-success,
body.sacred-light .app-body .btn-danger {
    color: #fff !important;
}

/* Cards and panels in light mode */
html.light .app-body .card,
html.light .app-body .sacred-card,
html.light .app-body .metric-card,
html.light .app-body .entity-card,
html.sacred-light .app-body .card,
html.sacred-light .app-body .sacred-card,
html.sacred-light .app-body .metric-card,
html.sacred-light .app-body .entity-card,
body.light .app-body .card,
body.light .app-body .sacred-card,
body.light .app-body .metric-card,
body.light .app-body .entity-card,
body.sacred-light .app-body .card,
body.sacred-light .app-body .sacred-card,
body.sacred-light .app-body .metric-card,
body.sacred-light .app-body .entity-card {
    background: rgba(255, 255, 255, 0.9) !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
    color: #1a1f2e !important;
}

/* Page headers/titles */
html.light .app-body .page-title,
html.light .app-body .dash-hero h1,
html.light .app-body .pfs-header h1,
html.light .app-body .section-title,
html.sacred-light .app-body .page-title,
html.sacred-light .app-body .dash-hero h1,
html.sacred-light .app-body .pfs-header h1,
html.sacred-light .app-body .section-title,
body.light .app-body .page-title,
body.light .app-body .dash-hero h1,
body.light .app-body .pfs-header h1,
body.light .app-body .section-title,
body.sacred-light .app-body .page-title,
body.sacred-light .app-body .dash-hero h1,
body.sacred-light .app-body .pfs-header h1,
body.sacred-light .app-body .section-title {
    color: #1a1f2e !important;
}

/* Floating AI panel - keep dark theme */
html.light .floating-ai-panel,
html.light .floating-ai-panel *,
html.sacred-light .floating-ai-panel,
html.sacred-light .floating-ai-panel *,
body.light .floating-ai-panel,
body.light .floating-ai-panel *,
body.sacred-light .floating-ai-panel,
body.sacred-light .floating-ai-panel * {
    color: #e8e9eb !important;
}

/* Hero section in light mode */
html.light .app-body .dash-hero,
html.sacred-light .app-body .dash-hero,
body.light .app-body .dash-hero,
body.sacred-light .app-body .dash-hero {
    background: rgba(37, 99, 235, 0.05) !important;
    border-color: rgba(37, 99, 235, 0.12) !important;
}

/* ==========================================================
   ULTIMATE LIGHT MODE TEXT FIX
   This is the final catch-all that overrides Blazor-scoped CSS
   Uses maximum specificity with multiple attribute selectors
   ========================================================== */

/* Force all text elements to be dark in light mode - override Blazor scoped CSS */
html.light .app-body *[class],
html.light .app-body *:not([class]),
html.sacred-light .app-body *[class],
html.sacred-light .app-body *:not([class]),
body.light .app-body *[class],
body.light .app-body *:not([class]),
body.sacred-light .app-body *[class],
body.sacred-light .app-body *:not([class]) {
    --vt-muted: #4a5568 !important;
    --text: #1a1f2e !important;
    --sacred-text: #1a1f2e !important;
    --sacred-text-muted: #4a5568 !important;
}

/* Explicit color override for all text elements in light mode */
html.light .app-body h1,
html.light .app-body h2,
html.light .app-body h3,
html.light .app-body h4,
html.light .app-body h5,
html.light .app-body h6,
html.light .app-body p,
html.light .app-body span,
html.light .app-body div,
html.light .app-body label,
html.light .app-body strong,
html.light .app-body em,
html.light .app-body b,
html.light .app-body li,
html.light .app-body td,
html.light .app-body th,
html.light .app-body small,
html.sacred-light .app-body h1,
html.sacred-light .app-body h2,
html.sacred-light .app-body h3,
html.sacred-light .app-body h4,
html.sacred-light .app-body h5,
html.sacred-light .app-body h6,
html.sacred-light .app-body p,
html.sacred-light .app-body span,
html.sacred-light .app-body div,
html.sacred-light .app-body label,
html.sacred-light .app-body strong,
html.sacred-light .app-body em,
html.sacred-light .app-body b,
html.sacred-light .app-body li,
html.sacred-light .app-body td,
html.sacred-light .app-body th,
html.sacred-light .app-body small,
body.light .app-body h1,
body.light .app-body h2,
body.light .app-body h3,
body.light .app-body h4,
body.light .app-body h5,
body.light .app-body h6,
body.light .app-body p,
body.light .app-body span,
body.light .app-body div,
body.light .app-body label,
body.light .app-body strong,
body.light .app-body em,
body.light .app-body b,
body.light .app-body li,
body.light .app-body td,
body.light .app-body th,
body.light .app-body small,
body.sacred-light .app-body h1,
body.sacred-light .app-body h2,
body.sacred-light .app-body h3,
body.sacred-light .app-body h4,
body.sacred-light .app-body h5,
body.sacred-light .app-body h6,
body.sacred-light .app-body p,
body.sacred-light .app-body span,
body.sacred-light .app-body div,
body.sacred-light .app-body label,
body.sacred-light .app-body strong,
body.sacred-light .app-body em,
body.sacred-light .app-body b,
body.sacred-light .app-body li,
body.sacred-light .app-body td,
body.sacred-light .app-body th,
body.sacred-light .app-body small {
    color: #1a1f2e !important;
}

/* Exclude buttons and badges from dark text */
html.light .app-body .btn-primary,
html.light .app-body .btn-success,
html.light .app-body .btn-danger,
html.light .app-body .btn-primary *,
html.light .app-body .btn-success *,
html.light .app-body .btn-danger *,
html.light .app-body .badge,
html.light .app-body .badge *,
html.sacred-light .app-body .btn-primary,
html.sacred-light .app-body .btn-success,
html.sacred-light .app-body .btn-danger,
html.sacred-light .app-body .btn-primary *,
html.sacred-light .app-body .btn-success *,
html.sacred-light .app-body .btn-danger *,
html.sacred-light .app-body .badge,
html.sacred-light .app-body .badge *,
body.light .app-body .btn-primary,
body.light .app-body .btn-success,
body.light .app-body .btn-danger,
body.light .app-body .btn-primary *,
body.light .app-body .btn-success *,
body.light .app-body .btn-danger *,
body.light .app-body .badge,
body.light .app-body .badge *,
body.sacred-light .app-body .btn-primary,
body.sacred-light .app-body .btn-success,
body.sacred-light .app-body .btn-danger,
body.sacred-light .app-body .btn-primary *,
body.sacred-light .app-body .btn-success *,
body.sacred-light .app-body .btn-danger *,
body.sacred-light .app-body .badge,
body.sacred-light .app-body .badge * {
    color: #fff !important;
}

/* Light mode muted text (secondary text) */
html.light .app-body .text-muted,
html.light .app-body .muted,
html.light .app-body [class*="muted"],
html.light .app-body [class*="-sub"],
html.light .app-body [class*="hint"],
html.light .app-body [class*="dim"],
html.sacred-light .app-body .text-muted,
html.sacred-light .app-body .muted,
html.sacred-light .app-body [class*="muted"],
html.sacred-light .app-body [class*="-sub"],
html.sacred-light .app-body [class*="hint"],
html.sacred-light .app-body [class*="dim"],
body.light .app-body .text-muted,
body.light .app-body .muted,
body.light .app-body [class*="muted"],
body.light .app-body [class*="-sub"],
body.light .app-body [class*="hint"],
body.light .app-body [class*="dim"],
body.sacred-light .app-body .text-muted,
body.sacred-light .app-body .muted,
body.sacred-light .app-body [class*="muted"],
body.sacred-light .app-body [class*="-sub"],
body.sacred-light .app-body [class*="hint"],
body.sacred-light .app-body [class*="dim"] {
    color: #4a5568 !important;
}

/* Light mode cards and containers */
html.light .app-body .card,
html.light .app-body .metric-card,
html.light .app-body .entity-card,
html.light .app-body .sacred-card,
html.light .app-body [class*="-card"],
html.sacred-light .app-body .card,
html.sacred-light .app-body .metric-card,
html.sacred-light .app-body .entity-card,
html.sacred-light .app-body .sacred-card,
html.sacred-light .app-body [class*="-card"],
body.light .app-body .card,
body.light .app-body .metric-card,
body.light .app-body .entity-card,
body.light .app-body .sacred-card,
body.light .app-body [class*="-card"],
body.sacred-light .app-body .card,
body.sacred-light .app-body .metric-card,
body.sacred-light .app-body .entity-card,
body.sacred-light .app-body .sacred-card,
body.sacred-light .app-body [class*="-card"] {
    background: rgba(255, 255, 255, 0.95) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

/* Light mode form inputs */
html.light .app-body input,
html.light .app-body select,
html.light .app-body textarea,
html.sacred-light .app-body input,
html.sacred-light .app-body select,
html.sacred-light .app-body textarea,
body.light .app-body input,
body.light .app-body select,
body.light .app-body textarea,
body.sacred-light .app-body input,
body.sacred-light .app-body select,
body.sacred-light .app-body textarea {
    color: #1a1f2e !important;
    background-color: #fff !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

/* Light mode ghost buttons */
html.light .app-body .ghost,
html.light .app-body .btn.ghost,
html.light .app-body button.ghost,
html.sacred-light .app-body .ghost,
html.sacred-light .app-body .btn.ghost,
html.sacred-light .app-body button.ghost,
body.light .app-body .ghost,
body.light .app-body .btn.ghost,
body.light .app-body button.ghost,
body.sacred-light .app-body .ghost,
body.sacred-light .app-body .btn.ghost,
body.sacred-light .app-body button.ghost {
    color: #374151 !important;
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
}

html.light .app-body .ghost:hover,
html.light .app-body .btn.ghost:hover,
html.light .app-body button.ghost:hover,
html.sacred-light .app-body .ghost:hover,
html.sacred-light .app-body .btn.ghost:hover,
html.sacred-light .app-body button.ghost:hover,
body.light .app-body .ghost:hover,
body.light .app-body .btn.ghost:hover,
body.light .app-body button.ghost:hover,
body.sacred-light .app-body .ghost:hover,
body.sacred-light .app-body .btn.ghost:hover,
body.sacred-light .app-body button.ghost:hover {
    color: #1a1f2e !important;
    background: rgba(0, 0, 0, 0.08) !important;
}

/* Preserve semantic colors in light mode */
html.light .app-body .text-success,
html.sacred-light .app-body .text-success,
body.light .app-body .text-success,
body.sacred-light .app-body .text-success {
    color: #059669 !important;
}

html.light .app-body .text-danger,
html.sacred-light .app-body .text-danger,
body.light .app-body .text-danger,
body.sacred-light .app-body .text-danger {
    color: #dc2626 !important;
}

html.light .app-body .text-warning,
html.sacred-light .app-body .text-warning,
body.light .app-body .text-warning,
body.sacred-light .app-body .text-warning {
    color: #d97706 !important;
}

html.light .app-body .text-info,
html.sacred-light .app-body .text-info,
body.light .app-body .text-info,
body.sacred-light .app-body .text-info {
    color: #0284c7 !important;
}

html.light .app-body .text-primary,
html.sacred-light .app-body .text-primary,
body.light .app-body .text-primary,
body.sacred-light .app-body .text-primary {
    color: #2563eb !important;
}

/* ==========================================================
   BLAZOR SCOPED CSS LIGHT MODE OVERRIDE
   Blazor adds unique attributes (b-xyz) to scoped CSS that increase
   specificity. These rules use [class] attribute selector to match
   the specificity of scoped CSS and force light mode colors.
   ========================================================== */

/* Force all text elements to dark color in light mode - override scoped CSS */
html.light [class*="b-"],
html.light [class*="b-"] *,
html.sacred-light [class*="b-"],
html.sacred-light [class*="b-"] *,
body.light [class*="b-"],
body.light [class*="b-"] *,
body.sacred-light [class*="b-"],
body.sacred-light [class*="b-"] * {
    --text: #1a1f2e !important;
    --sacred-text: #1a1f2e !important;
}

/* Direct color override for elements in light mode */
html.light .app-body [class] h1,
html.light .app-body [class] h2,
html.light .app-body [class] h3,
html.light .app-body [class] h4,
html.light .app-body [class] h5,
html.light .app-body [class] h6,
html.light .app-body [class] p,
html.light .app-body [class] span:not(.badge):not([class*="btn"]),
html.light .app-body [class] div:not(.badge):not([class*="btn"]),
html.light .app-body [class] label,
html.light .app-body [class] strong,
html.light .app-body [class] em,
html.light .app-body [class] li,
html.light .app-body [class] td,
html.light .app-body [class] th,
html.light .app-body [class] small,
html.sacred-light .app-body [class] h1,
html.sacred-light .app-body [class] h2,
html.sacred-light .app-body [class] h3,
html.sacred-light .app-body [class] h4,
html.sacred-light .app-body [class] h5,
html.sacred-light .app-body [class] h6,
html.sacred-light .app-body [class] p,
html.sacred-light .app-body [class] span:not(.badge):not([class*="btn"]),
html.sacred-light .app-body [class] div:not(.badge):not([class*="btn"]),
html.sacred-light .app-body [class] label,
html.sacred-light .app-body [class] strong,
html.sacred-light .app-body [class] em,
html.sacred-light .app-body [class] li,
html.sacred-light .app-body [class] td,
html.sacred-light .app-body [class] th,
html.sacred-light .app-body [class] small,
body.light .app-body [class] h1,
body.light .app-body [class] h2,
body.light .app-body [class] h3,
body.light .app-body [class] h4,
body.light .app-body [class] h5,
body.light .app-body [class] h6,
body.light .app-body [class] p,
body.light .app-body [class] span:not(.badge):not([class*="btn"]),
body.light .app-body [class] div:not(.badge):not([class*="btn"]),
body.light .app-body [class] label,
body.light .app-body [class] strong,
body.light .app-body [class] em,
body.light .app-body [class] li,
body.light .app-body [class] td,
body.light .app-body [class] th,
body.light .app-body [class] small,
body.sacred-light .app-body [class] h1,
body.sacred-light .app-body [class] h2,
body.sacred-light .app-body [class] h3,
body.sacred-light .app-body [class] h4,
body.sacred-light .app-body [class] h5,
body.sacred-light .app-body [class] h6,
body.sacred-light .app-body [class] p,
body.sacred-light .app-body [class] span:not(.badge):not([class*="btn"]),
body.sacred-light .app-body [class] div:not(.badge):not([class*="btn"]),
body.sacred-light .app-body [class] label,
body.sacred-light .app-body [class] strong,
body.sacred-light .app-body [class] em,
body.sacred-light .app-body [class] li,
body.sacred-light .app-body [class] td,
body.sacred-light .app-body [class] th,
body.sacred-light .app-body [class] small {
    color: #1a1f2e !important;
}

/* Override ghost buttons with color: #fff in light mode */
html.light .ghost,
html.light .btn.ghost,
html.light button.ghost,
html.light [class*="ghost"],
html.sacred-light .ghost,
html.sacred-light .btn.ghost,
html.sacred-light button.ghost,
html.sacred-light [class*="ghost"],
body.light .ghost,
body.light .btn.ghost,
body.light button.ghost,
body.light [class*="ghost"],
body.sacred-light .ghost,
body.sacred-light .btn.ghost,
body.sacred-light button.ghost,
body.sacred-light [class*="ghost"] {
    color: #374151 !important;
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

html.light .ghost:hover,
html.light .btn.ghost:hover,
html.light button.ghost:hover,
html.sacred-light .ghost:hover,
html.sacred-light .btn.ghost:hover,
html.sacred-light button.ghost:hover,
body.light .ghost:hover,
body.light .btn.ghost:hover,
body.light button.ghost:hover,
body.sacred-light .ghost:hover,
body.sacred-light .btn.ghost:hover,
body.sacred-light button.ghost:hover {
    color: #1a1f2e !important;
    background: rgba(0, 0, 0, 0.08) !important;
}

/* Override select, input colors from scoped CSS in light mode */
html.light select,
html.light input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
html.light textarea,
html.sacred-light select,
html.sacred-light input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
html.sacred-light textarea,
body.light select,
body.light input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
body.light textarea,
body.sacred-light select,
body.sacred-light input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
body.sacred-light textarea {
    color: #1a1f2e !important;
    background-color: #fff !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

/* Preserve white text for colored buttons */
html.light .btn-primary,
html.light .btn-success,
html.light .btn-danger,
html.light .btn-warning,
html.light .btn-info,
html.light .badge,
html.sacred-light .btn-primary,
html.sacred-light .btn-success,
html.sacred-light .btn-danger,
html.sacred-light .btn-warning,
html.sacred-light .btn-info,
html.sacred-light .badge,
body.light .btn-primary,
body.light .btn-success,
body.light .btn-danger,
body.light .btn-warning,
body.light .btn-info,
body.light .badge,
body.sacred-light .btn-primary,
body.sacred-light .btn-success,
body.sacred-light .btn-danger,
body.sacred-light .btn-warning,
body.sacred-light .btn-info,
body.sacred-light .badge {
    color: #fff !important;
}

/* Force light mode background on main content */
html.light,
html.light body,
html.sacred-light,
html.sacred-light body,
body.light,
body.sacred-light {
    background-color: #f5f5f5 !important;
}

html.light .app-main,
html.light .app-body,
html.sacred-light .app-main,
html.sacred-light .app-body,
body.light .app-main,
body.light .app-body,
body.sacred-light .app-main,
body.sacred-light .app-body {
    background-color: rgba(245, 245, 245, 0.98) !important;
}

/* ==========================================================
   COMPREHENSIVE LIGHT MODE TEXT FIX
   Uses :where() for low specificity base and !important for override
   This ensures any component with hardcoded white text will be readable
   ========================================================== */

/* Universal text color reset for light mode */
html.light .app-body *:not(.btn):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.badge):not(.app-nav *):not(.floating-ai-panel *),
html.sacred-light .app-body *:not(.btn):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.badge):not(.app-nav *):not(.floating-ai-panel *),
body.light .app-body *:not(.btn):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.badge):not(.app-nav *):not(.floating-ai-panel *),
body.sacred-light .app-body *:not(.btn):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.badge):not(.app-nav *):not(.floating-ai-panel *) {
    --text-strong: #0f1422;
    --text-primary: #1a1f2e;
    --text-secondary: #4a5568;
    --ghost-text: #374151;
    --control-text: #1a1f2e;
}

/* ==========================================================
   CRITICAL LIGHT MODE TEXT FIX - Highest Priority Override
   This uses extreme specificity to override Blazor scoped styles
   that hardcode white text colors (#fff, #ffffff, white, rgba(255,255,255))
   ========================================================== */

/* Override hardcoded white/light text in light mode with maximum specificity */
html.light[class] [class*=" "][style*="color"],
html.light[class] [class][style*="color"],
html.sacred-light[class] [class*=" "][style*="color"],
html.sacred-light[class] [class][style*="color"],
body.light[class] [class*=" "][style*="color"],
body.light[class] [class][style*="color"],
body.sacred-light[class] [class*=" "][style*="color"],
body.sacred-light[class] [class][style*="color"] {
    color: inherit !important;
}

/* Force dark text on general content elements in light mode - handles Blazor scoped CSS */
html.light .app-body h1[class],
html.light .app-body h2[class],
html.light .app-body h3[class],
html.light .app-body h4[class],
html.light .app-body h5[class],
html.light .app-body h6[class],
html.light .app-body p[class],
html.light .app-body span[class],
html.light .app-body div[class],
html.light .app-body label[class],
html.light .app-body td[class],
html.light .app-body th[class],
html.sacred-light .app-body h1[class],
html.sacred-light .app-body h2[class],
html.sacred-light .app-body h3[class],
html.sacred-light .app-body h4[class],
html.sacred-light .app-body h5[class],
html.sacred-light .app-body h6[class],
html.sacred-light .app-body p[class],
html.sacred-light .app-body span[class],
html.sacred-light .app-body div[class],
html.sacred-light .app-body label[class],
html.sacred-light .app-body td[class],
html.sacred-light .app-body th[class],
body.light .app-body h1[class],
body.light .app-body h2[class],
body.light .app-body h3[class],
body.light .app-body h4[class],
body.light .app-body h5[class],
body.light .app-body h6[class],
body.light .app-body p[class],
body.light .app-body span[class],
body.light .app-body div[class],
body.light .app-body label[class],
body.light .app-body td[class],
body.light .app-body th[class],
body.sacred-light .app-body h1[class],
body.sacred-light .app-body h2[class],
body.sacred-light .app-body h3[class],
body.sacred-light .app-body h4[class],
body.sacred-light .app-body h5[class],
body.sacred-light .app-body h6[class],
body.sacred-light .app-body p[class],
body.sacred-light .app-body span[class],
body.sacred-light .app-body div[class],
body.sacred-light .app-body label[class],
body.sacred-light .app-body td[class],
body.sacred-light .app-body th[class] {
    color: #1a1f2e !important;
}

/* Exclude buttons, badges, nav, and AI panel from the forced dark text */
html.light .app-body .btn[class],
html.light .app-body .btn-primary[class],
html.light .app-body .btn-success[class],
html.light .app-body .btn-danger[class],
html.light .app-body .btn-warning[class],
html.light .app-body .btn-info[class],
html.light .app-body .badge[class],
html.sacred-light .app-body .btn[class],
html.sacred-light .app-body .badge[class],
body.light .app-body .btn[class],
body.light .app-body .badge[class],
body.sacred-light .app-body .btn[class],
body.sacred-light .app-body .badge[class] {
    color: inherit !important;
}

/* Muted text in light mode should be properly visible */
html.light .app-body .text-muted[class],
html.light .app-body .muted[class],
html.light .app-body [class*="muted"],
html.sacred-light .app-body .text-muted[class],
html.sacred-light .app-body .muted[class],
html.sacred-light .app-body [class*="muted"],
body.light .app-body .text-muted[class],
body.light .app-body .muted[class],
body.light .app-body [class*="muted"],
body.sacred-light .app-body .text-muted[class],
body.sacred-light .app-body .muted[class],
body.sacred-light .app-body [class*="muted"] {
    color: #4a5568 !important;
}

/* ==========================================================
   Dawn Mode (Light Theme) Text Color Fixes
   Ensures text-white and other white text is visible on white backgrounds
   ========================================================== */

/* Override Bootstrap .text-white class in light/dawn mode */
html.light .text-white:not([class*="bg-"]),
html.sacred-light .text-white:not([class*="bg-"]),
body.light .text-white:not([class*="bg-"]),
body.sacred-light .text-white:not([class*="bg-"]),
.light .text-white:not([class*="bg-"]),
.sacred-light .text-white:not([class*="bg-"]) {
    color: #1a1f2e !important;
}

/* Cards with white/light backgrounds need dark text */
html.light .card .text-white,
html.light .card-body .text-white,
html.light .modal-content .text-white,
html.sacred-light .card .text-white,
body.light .card .text-white,
body.sacred-light .card .text-white {
    color: #1a1f2e !important;
}

/* Override text-light class in light mode */
html.light .text-light,
html.sacred-light .text-light,
body.light .text-light,
body.sacred-light .text-light,
.light .text-light,
.sacred-light .text-light {
    color: #4a5568 !important;
}

/* Override inline white color styles comprehensively */
html.light [style*="color: #fff"],
html.light [style*="color:#fff"],
html.light [style*="color: white"],
html.light [style*="color:white"],
html.light [style*="color: #ffffff"],
html.light [style*="color:#ffffff"],
html.sacred-light [style*="color: #fff"],
html.sacred-light [style*="color:#fff"],
html.sacred-light [style*="color: white"],
html.sacred-light [style*="color:white"],
html.sacred-light [style*="color: #ffffff"],
html.sacred-light [style*="color:#ffffff"],
body.light [style*="color: #fff"],
body.light [style*="color:#fff"],
body.light [style*="color: white"],
body.light [style*="color:white"],
body.sacred-light [style*="color: #fff"],
body.sacred-light [style*="color:#fff"],
body.sacred-light [style*="color: white"],
body.sacred-light [style*="color:white"],
body.sacred-light [style*="color: #ffffff"],
body.sacred-light [style*="color:#ffffff"] {
    color: #1a1f2e !important;
}

/* Exception: Keep white text on colored backgrounds (buttons, badges, alerts) */
html.light .bg-primary.text-white,
html.light .bg-success.text-white,
html.light .bg-danger.text-white,
html.light .bg-info.text-white,
html.light .bg-warning.text-dark,
html.sacred-light .bg-primary.text-white,
html.sacred-light .bg-success.text-white,
html.sacred-light .bg-danger.text-white,
body.light .bg-primary.text-white,
body.light .bg-success.text-white,
body.light .bg-danger.text-white,
body.sacred-light .bg-primary.text-white,
body.sacred-light .bg-success.text-white {
    color: #ffffff !important;
}

/* Alert text in light mode */
html.light .alert,
html.light .alert *,
html.sacred-light .alert,
body.light .alert,
body.sacred-light .alert {
    color: inherit;
}

/* Toast notifications - keep white on colored backgrounds */
html.light .toast.bg-success,
html.light .toast.bg-danger,
html.light .toast.bg-info,
html.light .toast.bg-warning,
html.sacred-light .toast.bg-success,
html.sacred-light .toast.bg-danger,
body.light .toast.bg-success,
body.light .toast.bg-danger,
body.sacred-light .toast.bg-success {
    color: #ffffff !important;
}

html.light .toast.bg-success .text-white,
html.light .toast.bg-danger .text-white,
html.sacred-light .toast.bg-success .text-white,
html.sacred-light .toast.bg-danger .text-white,
body.light .toast.bg-success .text-white,
body.light .toast.bg-danger .text-white,
body.sacred-light .toast.bg-success .text-white {
    color: #ffffff !important;
}

/* Progress bars - keep white text on colored backgrounds */
html.light .progress-bar,
html.sacred-light .progress-bar,
body.light .progress-bar,
body.sacred-light .progress-bar {
    color: #ffffff;
}

/* Component-specific fixes for light mode */
html.light .hub-card,
html.light .hub-card h3,
html.light .hub-card h4,
html.light .hub-card h5,
html.light .hub-card p,
html.light .hub-card span,
html.light .hub-card small,
html.sacred-light .hub-card,
html.sacred-light .hub-card h3,
html.sacred-light .hub-card p,
body.light .hub-card,
body.light .hub-card *,
body.sacred-light .hub-card,
body.sacred-light .hub-card * {
    color: #1a1f2e !important;
}

/* Tracker cards */
html.light .tracker-card,
html.light .tracker-card *,
html.sacred-light .tracker-card,
html.sacred-light .tracker-card *,
body.light .tracker-card,
body.light .tracker-card *,
body.sacred-light .tracker-card * {
    color: #1a1f2e !important;
}

/* Deduction cards */
html.light .deduction-card,
html.light .deduction-card *,
html.sacred-light .deduction-card,
html.sacred-light .deduction-card *,
body.light .deduction-card,
body.light .deduction-card *,
body.sacred-light .deduction-card * {
    color: #1a1f2e !important;
}

/* Tab content */
html.light .tab-content,
html.light .tab-content *,
html.sacred-light .tab-content,
body.light .tab-content,
body.sacred-light .tab-content {
    color: #1a1f2e;
}

/* Nav tabs text */
html.light .nav-tabs .nav-link,
html.light .nav-pills .nav-link,
html.sacred-light .nav-tabs .nav-link,
html.sacred-light .nav-pills .nav-link,
body.light .nav-tabs .nav-link,
body.light .nav-pills .nav-link,
body.sacred-light .nav-tabs .nav-link {
    color: #4a5568;
}

html.light .nav-tabs .nav-link.active,
html.light .nav-pills .nav-link.active,
html.sacred-light .nav-tabs .nav-link.active,
body.light .nav-tabs .nav-link.active,
body.sacred-light .nav-tabs .nav-link.active {
    color: #1a1f2e;
}

/* Form labels and inputs */
html.light label,
html.light .form-label,
html.light .form-check-label,
html.sacred-light label,
html.sacred-light .form-label,
body.light label,
body.light .form-label,
body.sacred-light label {
    color: #1a1f2e;
}

html.light .form-control,
html.light .form-select,
html.sacred-light .form-control,
html.sacred-light .form-select,
body.light .form-control,
body.light .form-select,
body.sacred-light .form-control {
    color: #1a1f2e;
    background-color: #ffffff;
    border-color: rgba(0, 0, 0, 0.15);
}

html.light .form-control::placeholder,
html.light .form-select::placeholder,
html.sacred-light .form-control::placeholder,
body.light .form-control::placeholder,
body.sacred-light .form-control::placeholder {
    color: #6b7280;
}

/* Table text */
html.light table,
html.light table th,
html.light table td,
html.light .table,
html.light .table th,
html.light .table td,
html.sacred-light table,
html.sacred-light table th,
html.sacred-light table td,
body.light table,
body.light table th,
body.light table td,
body.sacred-light table,
body.sacred-light .table {
    color: #1a1f2e;
}

/* List groups */
html.light .list-group-item,
html.sacred-light .list-group-item,
body.light .list-group-item,
body.sacred-light .list-group-item {
    color: #1a1f2e;
    background-color: #ffffff;
    border-color: rgba(0, 0, 0, 0.1);
}

/* Accordion */
html.light .accordion-button,
html.light .accordion-body,
html.sacred-light .accordion-button,
html.sacred-light .accordion-body,
body.light .accordion-button,
body.light .accordion-body,
body.sacred-light .accordion-button {
    color: #1a1f2e;
    background-color: #ffffff;
}

html.light .accordion-button:not(.collapsed),
html.sacred-light .accordion-button:not(.collapsed),
body.light .accordion-button:not(.collapsed),
body.sacred-light .accordion-button:not(.collapsed) {
    color: #059669;
    background-color: rgba(37, 99, 235, 0.08);
}

/* ==========================================================
   DAWN MODE ULTRA-PRIORITY TEXT FIX
   Absolute final override using attribute selectors to catch
   any remaining white text from Blazor scoped CSS
   ========================================================== */

/* Override ALL text elements except buttons/badges/nav with dark color */
html.light *:not(.btn):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.badge):not(.app-nav):not(.app-nav *):not(.floating-ai-panel):not(.floating-ai-panel *),
html.sacred-light *:not(.btn):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.badge):not(.app-nav):not(.app-nav *):not(.floating-ai-panel):not(.floating-ai-panel *),
body.light *:not(.btn):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.badge):not(.app-nav):not(.app-nav *):not(.floating-ai-panel):not(.floating-ai-panel *),
body.sacred-light *:not(.btn):not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.badge):not(.app-nav):not(.app-nav *):not(.floating-ai-panel):not(.floating-ai-panel *) {
    --sacred-text: #1a1f2e !important;
    --text: #1a1f2e !important;
}

/* Force color on all text elements in main content */
html.light .sacred-content *,
html.sacred-light .sacred-content *,
body.light .sacred-content *,
body.sacred-light .sacred-content * {
    color: #1a1f2e;
}

/* Re-exempt buttons and badges with highest specificity */
html.light .btn,
html.light .btn-primary,
html.light .btn-success,
html.light .btn-danger,
html.light .btn-warning,
html.light .btn-info,
html.light .badge,
html.sacred-light .btn,
html.sacred-light .btn-primary,
html.sacred-light .btn-success,
html.sacred-light .btn-danger,
html.sacred-light .btn-warning,
html.sacred-light .btn-info,
html.sacred-light .badge,
body.light .btn,
body.light .btn-primary,
body.light .btn-success,
body.light .btn-danger,
body.light .btn-warning,
body.light .btn-info,
body.light .badge,
body.sacred-light .btn,
body.sacred-light .btn-primary,
body.sacred-light .btn-success,
body.sacred-light .btn-danger,
body.sacred-light .btn-warning,
body.sacred-light .btn-info,
body.sacred-light .badge {
    color: #ffffff !important;
}

/* Re-exempt nav with highest specificity */
html.light .app-nav,
html.light .app-nav *,
html.sacred-light .app-nav,
html.sacred-light .app-nav *,
body.light .app-nav,
body.light .app-nav *,
body.sacred-light .app-nav,
body.sacred-light .app-nav * {
    color: inherit !important;
}

/* Re-exempt AI panel with dark theme text */
html.light .floating-ai-panel,
html.light .floating-ai-panel *,
html.sacred-light .floating-ai-panel,
html.sacred-light .floating-ai-panel *,
body.light .floating-ai-panel,
body.light .floating-ai-panel *,
body.sacred-light .floating-ai-panel,
body.sacred-light .floating-ai-panel * {
    color: var(--sacred-text, #eef0f5) !important;
}

/* ==========================================================
   CRITICAL DAWN/LIGHT MODE FIX
   Ultra-high specificity override for ALL scoped component CSS
   Fixes white text on white backgrounds in light/dawn mode
   ========================================================== */

/* Override scoped CSS white colors in light mode - main content area */
html.light .sacred-content,
html.light .sacred-content h1,
html.light .sacred-content h2,
html.light .sacred-content h3,
html.light .sacred-content h4,
html.light .sacred-content h5,
html.light .sacred-content h6,
html.light .sacred-content p,
html.light .sacred-content span:not(.badge):not(.btn),
html.light .sacred-content div:not(.btn),
html.light .sacred-content label,
html.light .sacred-content li,
html.light .sacred-content td,
html.light .sacred-content th,
html.light .sacred-content small,
html.light .sacred-content strong,
html.light .sacred-content em,
html.sacred-light .sacred-content,
html.sacred-light .sacred-content h1,
html.sacred-light .sacred-content h2,
html.sacred-light .sacred-content h3,
html.sacred-light .sacred-content h4,
html.sacred-light .sacred-content h5,
html.sacred-light .sacred-content h6,
html.sacred-light .sacred-content p,
html.sacred-light .sacred-content span:not(.badge):not(.btn),
html.sacred-light .sacred-content div:not(.btn),
html.sacred-light .sacred-content label,
html.sacred-light .sacred-content li,
html.sacred-light .sacred-content td,
html.sacred-light .sacred-content th,
html.sacred-light .sacred-content small,
html.sacred-light .sacred-content strong,
html.sacred-light .sacred-content em,
body.light .sacred-content,
body.light .sacred-content h1,
body.light .sacred-content h2,
body.light .sacred-content h3,
body.light .sacred-content h4,
body.light .sacred-content h5,
body.light .sacred-content h6,
body.light .sacred-content p,
body.light .sacred-content span:not(.badge):not(.btn),
body.light .sacred-content div:not(.btn),
body.light .sacred-content label,
body.light .sacred-content li,
body.light .sacred-content td,
body.light .sacred-content th,
body.light .sacred-content small,
body.light .sacred-content strong,
body.light .sacred-content em,
body.sacred-light .sacred-content,
body.sacred-light .sacred-content h1,
body.sacred-light .sacred-content h2,
body.sacred-light .sacred-content h3,
body.sacred-light .sacred-content h4,
body.sacred-light .sacred-content h5,
body.sacred-light .sacred-content h6,
body.sacred-light .sacred-content p,
body.sacred-light .sacred-content span:not(.badge):not(.btn),
body.sacred-light .sacred-content div:not(.btn),
body.sacred-light .sacred-content label,
body.sacred-light .sacred-content li,
body.sacred-light .sacred-content td,
body.sacred-light .sacred-content th,
body.sacred-light .sacred-content small,
body.sacred-light .sacred-content strong,
body.sacred-light .sacred-content em {
    color: #1a1f2e !important;
}

/* Fix card and panel backgrounds in light mode */
html.light .card,
html.light .sacred-card,
html.light .panel,
html.light .modal-content,
html.light .dropdown-menu,
html.light .popover,
html.sacred-light .card,
html.sacred-light .sacred-card,
html.sacred-light .panel,
html.sacred-light .modal-content,
html.sacred-light .dropdown-menu,
html.sacred-light .popover,
body.light .card,
body.light .sacred-card,
body.light .panel,
body.light .modal-content,
body.light .dropdown-menu,
body.light .popover,
body.sacred-light .card,
body.sacred-light .sacred-card,
body.sacred-light .panel,
body.sacred-light .modal-content,
body.sacred-light .dropdown-menu,
body.sacred-light .popover {
    background: rgba(255, 255, 255, 0.95) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

/* Ensure button text stays white on colored backgrounds */
html.light .btn-primary,
html.light .btn-success,
html.light .btn-danger,
html.light .btn-info,
html.light .btn-secondary,
html.sacred-light .btn-primary,
html.sacred-light .btn-success,
html.sacred-light .btn-danger,
html.sacred-light .btn-info,
html.sacred-light .btn-secondary,
body.light .btn-primary,
body.light .btn-success,
body.light .btn-danger,
body.light .btn-info,
body.light .btn-secondary,
body.sacred-light .btn-primary,
body.sacred-light .btn-success,
body.sacred-light .btn-danger,
body.sacred-light .btn-info,
body.sacred-light .btn-secondary {
    color: #ffffff !important;
}

/* Fix tooltips and popovers text */
html.light .tooltip-inner,
html.light .popover-body,
html.sacred-light .tooltip-inner,
html.sacred-light .popover-body,
body.light .tooltip-inner,
body.light .popover-body,
body.sacred-light .tooltip-inner,
body.sacred-light .popover-body {
    color: #1a1f2e !important;
}

/* Component-specific white text overrides in light mode */
html.light [style*="color: white"],
html.light [style*="color:#fff"],
html.light [style*="color: #fff"],
html.light [style*="color: #ffffff"],
html.light [style*="color:#ffffff"],
html.sacred-light [style*="color: white"],
html.sacred-light [style*="color:#fff"],
html.sacred-light [style*="color: #fff"],
html.sacred-light [style*="color: #ffffff"],
html.sacred-light [style*="color:#ffffff"],
body.light [style*="color: white"],
body.light [style*="color:#fff"],
body.light [style*="color: #fff"],
body.light [style*="color: #ffffff"],
body.light [style*="color:#ffffff"],
body.sacred-light [style*="color: white"],
body.sacred-light [style*="color:#fff"],
body.sacred-light [style*="color: #fff"],
body.sacred-light [style*="color: #ffffff"],
body.sacred-light [style*="color:#ffffff"] {
    color: #1a1f2e !important;
}

/* Exceptions: Keep white text on colored backgrounds */
html.light .bg-primary,
html.light .bg-success,
html.light .bg-danger,
html.light .bg-info,
html.light .bg-dark,
html.light .toast.bg-success,
html.light .toast.bg-danger,
html.light .toast.bg-info,
html.light .toast.bg-warning,
html.light .alert-primary,
html.light .alert-success,
html.light .alert-danger,
html.light .alert-info,
html.sacred-light .bg-primary,
html.sacred-light .bg-success,
html.sacred-light .bg-danger,
html.sacred-light .bg-info,
html.sacred-light .bg-dark,
body.light .bg-primary,
body.light .bg-success,
body.light .bg-danger,
body.light .bg-info,
body.light .bg-dark,
body.light .toast.bg-success,
body.light .toast.bg-danger,
body.light .toast.bg-info,
body.light .toast.bg-warning,
body.sacred-light .bg-primary,
body.sacred-light .bg-success,
body.sacred-light .bg-danger,
body.sacred-light .bg-info,
body.sacred-light .bg-dark {
    color: #ffffff !important;
}

/* Fix input placeholder text in light mode */
html.light input::placeholder,
html.light textarea::placeholder,
html.light .form-control::placeholder,
html.sacred-light input::placeholder,
html.sacred-light textarea::placeholder,
html.sacred-light .form-control::placeholder,
body.light input::placeholder,
body.light textarea::placeholder,
body.light .form-control::placeholder,
body.sacred-light input::placeholder,
body.sacred-light textarea::placeholder,
body.sacred-light .form-control::placeholder {
    color: #6b7280 !important;
}

/* Fix link colors in light mode */
html.light a:not(.btn):not(.nav-link),
html.sacred-light a:not(.btn):not(.nav-link),
body.light a:not(.btn):not(.nav-link),
body.sacred-light a:not(.btn):not(.nav-link) {
    color: #0d6efd !important;
}

html.light a:not(.btn):not(.nav-link):hover,
html.sacred-light a:not(.btn):not(.nav-link):hover,
body.light a:not(.btn):not(.nav-link):hover,
body.sacred-light a:not(.btn):not(.nav-link):hover {
    color: #0a58ca !important;
}

/* Override any CSS custom property that sets white text */
html.light,
html.sacred-light,
body.light,
body.sacred-light {
    --text: #1a1f2e !important;
    --sacred-text: #1a1f2e !important;
    --sacred-text-muted: #4a5568 !important;
    --sacred-text-dim: #5a6478 !important;
    --text-primary: #1a1f2e !important;
    --text-secondary: #4a5568 !important;
    --body-color: #1a1f2e !important;
}

/* ==========================================================
   DARK MODE TEXT COLOR SAFETY OVERRIDES
   Ensures readable light text on dark backgrounds
   ========================================================== */

/* ROOT CSS VARIABLE OVERRIDES FOR DARK MODE */
html:not(.light):not(.sacred-light),
body:not(.light):not(.sacred-light),
html.dark,
body.dark {
    /* Text colors - light text for dark backgrounds */
    --text: #e5e7eb;
    --text-strong: #ffffff;
    --text-primary: #e5e7eb;
    --text-secondary: #b8c0d4;
    --text-muted: #b8c0d4;
    --ghost-text: #d1d5db;
    --control-text: #ffffff;
    --sacred-text: #e5e7eb;
    --sacred-text-muted: #b8c0d4;
    --sacred-text-dim: #a0a8b8;
    --vt-muted: #b8c0d4;

    /* Bootstrap overrides for dark mode */
    --bs-body-color: #e5e7eb;
}

/* Force light text on main content containers in dark mode */
html:not(.light):not(.sacred-light) .app-body,
html.dark .app-body,
body:not(.light):not(.sacred-light) .app-body,
body.dark .app-body {
    color: #e5e7eb;
}

/* Ensure form labels and muted text are readable in dark mode */
html:not(.light):not(.sacred-light) label,
html:not(.light):not(.sacred-light) .form-label,
html:not(.light):not(.sacred-light) .text-muted,
html:not(.light):not(.sacred-light) .muted,
html:not(.light):not(.sacred-light) small,
body:not(.light):not(.sacred-light) label,
body:not(.light):not(.sacred-light) .form-label,
body:not(.light):not(.sacred-light) .text-muted,
body:not(.light):not(.sacred-light) .muted,
body:not(.light):not(.sacred-light) small {
    color: #b8c0d4 !important;
}

/* Fix table headers and content in dark mode */
html:not(.light):not(.sacred-light) th,
html:not(.light):not(.sacred-light) thead th,
html:not(.light):not(.sacred-light) .table th,
body:not(.light):not(.sacred-light) th,
body:not(.light):not(.sacred-light) thead th,
body:not(.light):not(.sacred-light) .table th {
    color: #e5e7eb !important;
}

html:not(.light):not(.sacred-light) td,
html:not(.light):not(.sacred-light) .table td,
body:not(.light):not(.sacred-light) td,
body:not(.light):not(.sacred-light) .table td {
    color: #d1d5db;
}

/* Fix section headers in dark mode */
html:not(.light):not(.sacred-light) h1,
html:not(.light):not(.sacred-light) h2,
html:not(.light):not(.sacred-light) h3,
html:not(.light):not(.sacred-light) h4,
html:not(.light):not(.sacred-light) h5,
html:not(.light):not(.sacred-light) h6,
body:not(.light):not(.sacred-light) h1,
body:not(.light):not(.sacred-light) h2,
body:not(.light):not(.sacred-light) h3,
body:not(.light):not(.sacred-light) h4,
body:not(.light):not(.sacred-light) h5,
body:not(.light):not(.sacred-light) h6 {
    color: #f3f4f6;
}

/* Fix input and select elements in dark mode */
html:not(.light):not(.sacred-light) input:not([type="checkbox"]):not([type="radio"]),
html:not(.light):not(.sacred-light) select,
html:not(.light):not(.sacred-light) textarea,
html:not(.light):not(.sacred-light) .form-control,
html:not(.light):not(.sacred-light) .form-select,
body:not(.light):not(.sacred-light) input:not([type="checkbox"]):not([type="radio"]),
body:not(.light):not(.sacred-light) select,
body:not(.light):not(.sacred-light) textarea,
body:not(.light):not(.sacred-light) .form-control,
body:not(.light):not(.sacred-light) .form-select {
    color: #e5e7eb;
    background-color: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.15);
}

/* Fix placeholder text in dark mode */
html:not(.light):not(.sacred-light) input::placeholder,
html:not(.light):not(.sacred-light) textarea::placeholder,
html:not(.light):not(.sacred-light) .form-control::placeholder,
body:not(.light):not(.sacred-light) input::placeholder,
body:not(.light):not(.sacred-light) textarea::placeholder,
body:not(.light):not(.sacred-light) .form-control::placeholder {
    color: #9ca3af !important;
}

/* Fix cards and card content in dark mode */
html:not(.light):not(.sacred-light) .card,
html:not(.light):not(.sacred-light) .card-body,
body:not(.light):not(.sacred-light) .card,
body:not(.light):not(.sacred-light) .card-body {
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .card-title,
body:not(.light):not(.sacred-light) .card-title {
    color: #f3f4f6;
}

html:not(.light):not(.sacred-light) .card-text,
body:not(.light):not(.sacred-light) .card-text {
    color: #d1d5db;
}

/* Fix list items and general paragraphs in dark mode */
html:not(.light):not(.sacred-light) p,
html:not(.light):not(.sacred-light) li,
html:not(.light):not(.sacred-light) span,
body:not(.light):not(.sacred-light) p,
body:not(.light):not(.sacred-light) li,
body:not(.light):not(.sacred-light) span {
    color: inherit;
}

/* Fix metric and stat display text in dark mode */
html:not(.light):not(.sacred-light) .metric-label,
html:not(.light):not(.sacred-light) .metric-value,
html:not(.light):not(.sacred-light) .stat-label,
html:not(.light):not(.sacred-light) .stat-value,
body:not(.light):not(.sacred-light) .metric-label,
body:not(.light):not(.sacred-light) .metric-value,
body:not(.light):not(.sacred-light) .stat-label,
body:not(.light):not(.sacred-light) .stat-value {
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .metric-sub,
html:not(.light):not(.sacred-light) .stat-sub,
body:not(.light):not(.sacred-light) .metric-sub,
body:not(.light):not(.sacred-light) .stat-sub {
    color: #b8c0d4;
}

/* Fix list titles and descriptions in dark mode */
html:not(.light):not(.sacred-light) .list-title,
html:not(.light):not(.sacred-light) .item-title,
html:not(.light):not(.sacred-light) .section-title,
body:not(.light):not(.sacred-light) .list-title,
body:not(.light):not(.sacred-light) .item-title,
body:not(.light):not(.sacred-light) .section-title {
    color: #f3f4f6;
}

html:not(.light):not(.sacred-light) .list-sub,
html:not(.light):not(.sacred-light) .item-desc,
html:not(.light):not(.sacred-light) .section-desc,
body:not(.light):not(.sacred-light) .list-sub,
body:not(.light):not(.sacred-light) .item-desc,
body:not(.light):not(.sacred-light) .section-desc {
    color: #b8c0d4;
}

/* Fix chart labels and axis text for dark mode */
html:not(.light):not(.sacred-light) .chart-label,
html:not(.light):not(.sacred-light) .axis-label,
html:not(.light):not(.sacred-light) .legend-text,
body:not(.light):not(.sacred-light) .chart-label,
body:not(.light):not(.sacred-light) .axis-label,
body:not(.light):not(.sacred-light) .legend-text {
    color: #b8c0d4 !important;
}

/* Fix status text colors in dark mode */
html:not(.light):not(.sacred-light) .status-text,
html:not(.light):not(.sacred-light) .help-text,
html:not(.light):not(.sacred-light) .hint-text,
body:not(.light):not(.sacred-light) .status-text,
body:not(.light):not(.sacred-light) .help-text,
body:not(.light):not(.sacred-light) .hint-text {
    color: #9ca3af;
}

/* Fix progress/checklist items in dark mode */
html:not(.light):not(.sacred-light) .checklist-item,
html:not(.light):not(.sacred-light) .progress-item,
body:not(.light):not(.sacred-light) .checklist-item,
body:not(.light):not(.sacred-light) .progress-item {
    color: #d1d5db;
}

/* Fix empty states and loading text in dark mode */
html:not(.light):not(.sacred-light) .empty-state,
html:not(.light):not(.sacred-light) .loading-text,
html:not(.light):not(.sacred-light) .no-data,
body:not(.light):not(.sacred-light) .empty-state,
body:not(.light):not(.sacred-light) .loading-text,
body:not(.light):not(.sacred-light) .no-data {
    color: #9ca3af;
}

/* Fix Bootstrap alert text colors in dark mode */
html:not(.light):not(.sacred-light) .alert,
body:not(.light):not(.sacred-light) .alert {
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .alert-info,
body:not(.light):not(.sacred-light) .alert-info {
    background-color: rgba(59, 130, 246, 0.15);
    border-color: rgba(59, 130, 246, 0.3);
    color: #d1d5db;
}

html:not(.light):not(.sacred-light) .alert-secondary,
body:not(.light):not(.sacred-light) .alert-secondary {
    background-color: rgba(107, 114, 128, 0.15);
    border-color: rgba(107, 114, 128, 0.3);
    color: #d1d5db;
}

html:not(.light):not(.sacred-light) .alert-warning,
body:not(.light):not(.sacred-light) .alert-warning {
    background-color: rgba(245, 158, 11, 0.15);
    border-color: rgba(245, 158, 11, 0.3);
    color: #fde68a;
}

html:not(.light):not(.sacred-light) .alert-danger,
body:not(.light):not(.sacred-light) .alert-danger {
    background-color: rgba(239, 68, 68, 0.15);
    border-color: rgba(239, 68, 68, 0.3);
    color: #fca5a5;
}

html:not(.light):not(.sacred-light) .alert-success,
body:not(.light):not(.sacred-light) .alert-success {
    background-color: rgba(34, 197, 94, 0.15);
    border-color: rgba(34, 197, 94, 0.3);
    color: #86efac;
}

/* Fix form help/description text in dark mode */
html:not(.light):not(.sacred-light) .form-text,
html:not(.light):not(.sacred-light) .help-block,
body:not(.light):not(.sacred-light) .form-text,
body:not(.light):not(.sacred-light) .help-block {
    color: #9ca3af !important;
}

/* Fix Bootstrap badge in dark mode */
html:not(.light):not(.sacred-light) .badge,
body:not(.light):not(.sacred-light) .badge {
    color: #fff;
}

html:not(.light):not(.sacred-light) .badge.bg-secondary,
body:not(.light):not(.sacred-light) .badge.bg-secondary {
    background-color: rgba(107, 114, 128, 0.8) !important;
}

/* Fix breadcrumb and navigation text in dark mode */
html:not(.light):not(.sacred-light) .breadcrumb-item,
html:not(.light):not(.sacred-light) .breadcrumb-item.active,
body:not(.light):not(.sacred-light) .breadcrumb-item,
body:not(.light):not(.sacred-light) .breadcrumb-item.active {
    color: #d1d5db;
}

/* Fix link colors in dark mode */
html:not(.light):not(.sacred-light) a:not(.btn):not(.nav-link):not([class*="text-"]),
body:not(.light):not(.sacred-light) a:not(.btn):not(.nav-link):not([class*="text-"]) {
    color: #60a5fa;
}

html:not(.light):not(.sacred-light) a:not(.btn):not(.nav-link):not([class*="text-"]):hover,
body:not(.light):not(.sacred-light) a:not(.btn):not(.nav-link):not([class*="text-"]):hover {
    color: #93c5fd;
}

/* ==========================================================================
   DARK MODE - COMPREHENSIVE TEXT CONTRAST FIXES
   ========================================================================== */

/* Fix badge text-dark in dark mode - override the inline Bootstrap class */
html:not(.light):not(.sacred-light) .badge.text-dark,
body:not(.light):not(.sacred-light) .badge.text-dark {
    color: inherit !important;
}

html:not(.light):not(.sacred-light) .bg-warning.text-dark,
html:not(.light):not(.sacred-light) .badge.bg-warning.text-dark,
body:not(.light):not(.sacred-light) .bg-warning.text-dark,
body:not(.light):not(.sacred-light) .badge.bg-warning.text-dark {
    color: #fde68a !important;
}

html:not(.light):not(.sacred-light) .bg-info.text-dark,
html:not(.light):not(.sacred-light) .badge.bg-info.text-dark,
body:not(.light):not(.sacred-light) .bg-info.text-dark,
body:not(.light):not(.sacred-light) .badge.bg-info.text-dark {
    color: #93c5fd !important;
}

html:not(.light):not(.sacred-light) .bg-light.text-dark,
html:not(.light):not(.sacred-light) .badge.bg-light.text-dark,
body:not(.light):not(.sacred-light) .bg-light.text-dark,
body:not(.light):not(.sacred-light) .badge.bg-light.text-dark {
    color: #e5e7eb !important;
}

html:not(.light):not(.sacred-light) .bg-dark-subtle.text-dark,
html:not(.light):not(.sacred-light) .badge.bg-dark-subtle.text-dark,
body:not(.light):not(.sacred-light) .bg-dark-subtle.text-dark,
body:not(.light):not(.sacred-light) .badge.bg-dark-subtle.text-dark {
    color: #e5e7eb !important;
}

/* Fix text-secondary Bootstrap utility in dark mode */
html:not(.light):not(.sacred-light) .text-secondary,
body:not(.light):not(.sacred-light) .text-secondary {
    color: #b8c0d4 !important;
}

/* Fix text-body-secondary Bootstrap utility in dark mode */
html:not(.light):not(.sacred-light) .text-body-secondary,
body:not(.light):not(.sacred-light) .text-body-secondary {
    color: #9ca3af !important;
}

/* Fix table text colors in dark mode */
html:not(.light):not(.sacred-light) table,
html:not(.light):not(.sacred-light) table th,
html:not(.light):not(.sacred-light) table td,
html:not(.light):not(.sacred-light) .table,
html:not(.light):not(.sacred-light) .table th,
html:not(.light):not(.sacred-light) .table td,
body:not(.light):not(.sacred-light) table,
body:not(.light):not(.sacred-light) table th,
body:not(.light):not(.sacred-light) table td,
body:not(.light):not(.sacred-light) .table,
body:not(.light):not(.sacred-light) .table th,
body:not(.light):not(.sacred-light) .table td {
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .table-striped > tbody > tr:nth-of-type(odd) > *,
body:not(.light):not(.sacred-light) .table-striped > tbody > tr:nth-of-type(odd) > * {
    color: #e5e7eb;
}

/* Fix small and caption text in dark mode */
html:not(.light):not(.sacred-light) small,
html:not(.light):not(.sacred-light) .small,
html:not(.light):not(.sacred-light) .fs-6,
html:not(.light):not(.sacred-light) .fs-7,
body:not(.light):not(.sacred-light) small,
body:not(.light):not(.sacred-light) .small,
body:not(.light):not(.sacred-light) .fs-6,
body:not(.light):not(.sacred-light) .fs-7 {
    color: #b8c0d4;
}

/* Fix label and form label text in dark mode */
html:not(.light):not(.sacred-light) label,
html:not(.light):not(.sacred-light) .form-label,
html:not(.light):not(.sacred-light) .col-form-label,
body:not(.light):not(.sacred-light) label,
body:not(.light):not(.sacred-light) .form-label,
body:not(.light):not(.sacred-light) .col-form-label {
    color: #e5e7eb;
}

/* Fix strong/bold text in dark mode */
html:not(.light):not(.sacred-light) strong,
html:not(.light):not(.sacred-light) b,
body:not(.light):not(.sacred-light) strong,
body:not(.light):not(.sacred-light) b {
    color: #f3f4f6;
}

/* Fix description lists in dark mode */
html:not(.light):not(.sacred-light) dt,
html:not(.light):not(.sacred-light) dd,
body:not(.light):not(.sacred-light) dt,
body:not(.light):not(.sacred-light) dd {
    color: #e5e7eb;
}

/* Fix figure caption in dark mode */
html:not(.light):not(.sacred-light) figcaption,
body:not(.light):not(.sacred-light) figcaption {
    color: #9ca3af;
}

/* Fix blockquote text in dark mode */
html:not(.light):not(.sacred-light) blockquote,
body:not(.light):not(.sacred-light) blockquote {
    color: #d1d5db;
}

/* Fix modal text colors in dark mode */
html:not(.light):not(.sacred-light) .modal-title,
body:not(.light):not(.sacred-light) .modal-title {
    color: #f3f4f6;
}

html:not(.light):not(.sacred-light) .modal-body,
body:not(.light):not(.sacred-light) .modal-body {
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .modal-header,
html:not(.light):not(.sacred-light) .modal-footer,
body:not(.light):not(.sacred-light) .modal-header,
body:not(.light):not(.sacred-light) .modal-footer {
    border-color: rgba(255, 255, 255, 0.1);
}

/* Fix dropdown text in dark mode */
html:not(.light):not(.sacred-light) .dropdown-item,
body:not(.light):not(.sacred-light) .dropdown-item {
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .dropdown-item:hover,
html:not(.light):not(.sacred-light) .dropdown-item:focus,
body:not(.light):not(.sacred-light) .dropdown-item:hover,
body:not(.light):not(.sacred-light) .dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.08);
    color: #f3f4f6;
}

html:not(.light):not(.sacred-light) .dropdown-menu,
body:not(.light):not(.sacred-light) .dropdown-menu {
    background-color: #1e293b;
    border-color: rgba(255, 255, 255, 0.1);
}

/* Fix list group items in dark mode */
html:not(.light):not(.sacred-light) .list-group-item,
body:not(.light):not(.sacred-light) .list-group-item {
    background-color: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.1);
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .list-group-item.active,
body:not(.light):not(.sacred-light) .list-group-item.active {
    background-color: rgba(59, 130, 246, 0.2);
    border-color: rgba(59, 130, 246, 0.4);
    color: #93c5fd;
}

/* Fix nav pills and tabs in dark mode */
html:not(.light):not(.sacred-light) .nav-link,
body:not(.light):not(.sacred-light) .nav-link {
    color: #b8c0d4;
}

html:not(.light):not(.sacred-light) .nav-link:hover,
html:not(.light):not(.sacred-light) .nav-link:focus,
body:not(.light):not(.sacred-light) .nav-link:hover,
body:not(.light):not(.sacred-light) .nav-link:focus {
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .nav-link.active,
html:not(.light):not(.sacred-light) .nav-pills .nav-link.active,
body:not(.light):not(.sacred-light) .nav-link.active,
body:not(.light):not(.sacred-light) .nav-pills .nav-link.active {
    color: #f3f4f6;
}

/* Fix pagination in dark mode */
html:not(.light):not(.sacred-light) .page-link,
body:not(.light):not(.sacred-light) .page-link {
    background-color: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.1);
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .page-item.active .page-link,
body:not(.light):not(.sacred-light) .page-item.active .page-link {
    background-color: #2563eb;
    border-color: #2563eb;
    color: #fff;
}

html:not(.light):not(.sacred-light) .page-item.disabled .page-link,
body:not(.light):not(.sacred-light) .page-item.disabled .page-link {
    background-color: rgba(255, 255, 255, 0.02);
    color: #6b7280;
}

/* Fix accordion in dark mode */
html:not(.light):not(.sacred-light) .accordion-button,
body:not(.light):not(.sacred-light) .accordion-button {
    background-color: rgba(255, 255, 255, 0.05);
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .accordion-button:not(.collapsed),
body:not(.light):not(.sacred-light) .accordion-button:not(.collapsed) {
    background-color: rgba(59, 130, 246, 0.1);
    color: #93c5fd;
}

html:not(.light):not(.sacred-light) .accordion-body,
body:not(.light):not(.sacred-light) .accordion-body {
    background-color: rgba(255, 255, 255, 0.02);
    color: #e5e7eb;
}

/* Fix select2/typeahead results in dark mode if used */
html:not(.light):not(.sacred-light) .tt-menu,
html:not(.light):not(.sacred-light) .tt-suggestion,
body:not(.light):not(.sacred-light) .tt-menu,
body:not(.light):not(.sacred-light) .tt-suggestion {
    background-color: #1e293b;
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .tt-suggestion:hover,
html:not(.light):not(.sacred-light) .tt-cursor,
body:not(.light):not(.sacred-light) .tt-suggestion:hover,
body:not(.light):not(.sacred-light) .tt-cursor {
    background-color: rgba(59, 130, 246, 0.2);
    color: #f3f4f6;
}

/* Fix input group text in dark mode */
html:not(.light):not(.sacred-light) .input-group-text,
body:not(.light):not(.sacred-light) .input-group-text {
    background-color: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.15);
    color: #b8c0d4;
}

/* Fix button variants text visibility in dark mode */
html:not(.light):not(.sacred-light) .btn-outline-secondary,
body:not(.light):not(.sacred-light) .btn-outline-secondary {
    color: #b8c0d4;
    border-color: rgba(255, 255, 255, 0.2);
}

html:not(.light):not(.sacred-light) .btn-outline-secondary:hover,
body:not(.light):not(.sacred-light) .btn-outline-secondary:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .btn-light,
body:not(.light):not(.sacred-light) .btn-light {
    background-color: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.2);
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .btn-dark,
body:not(.light):not(.sacred-light) .btn-dark {
    background-color: rgba(0, 0, 0, 0.3);
    color: #e5e7eb;
}

/* Fix progress bar text in dark mode */
html:not(.light):not(.sacred-light) .progress,
body:not(.light):not(.sacred-light) .progress {
    background-color: rgba(255, 255, 255, 0.1);
}

html:not(.light):not(.sacred-light) .progress-bar,
body:not(.light):not(.sacred-light) .progress-bar {
    color: #fff;
}

/* Fix toast text in dark mode */
html:not(.light):not(.sacred-light) .toast,
body:not(.light):not(.sacred-light) .toast {
    background-color: #1e293b;
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .toast-header,
body:not(.light):not(.sacred-light) .toast-header {
    background-color: rgba(255, 255, 255, 0.05);
    color: #f3f4f6;
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

/* Fix popover text in dark mode */
html:not(.light):not(.sacred-light) .popover,
body:not(.light):not(.sacred-light) .popover {
    background-color: #1e293b;
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .popover-header,
body:not(.light):not(.sacred-light) .popover-header {
    background-color: rgba(255, 255, 255, 0.05);
    color: #f3f4f6;
}

html:not(.light):not(.sacred-light) .popover-body,
body:not(.light):not(.sacred-light) .popover-body {
    color: #e5e7eb;
}

/* Fix tooltip in dark mode - ensure visible */
html:not(.light):not(.sacred-light) .tooltip-inner,
body:not(.light):not(.sacred-light) .tooltip-inner {
    background-color: #374151;
    color: #f3f4f6;
}

/* Fix offcanvas in dark mode */
html:not(.light):not(.sacred-light) .offcanvas,
body:not(.light):not(.sacred-light) .offcanvas {
    background-color: #1e293b;
    color: #e5e7eb;
}

html:not(.light):not(.sacred-light) .offcanvas-header,
body:not(.light):not(.sacred-light) .offcanvas-header {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

html:not(.light):not(.sacred-light) .offcanvas-title,
body:not(.light):not(.sacred-light) .offcanvas-title {
    color: #f3f4f6;
}

/* Fix spinner text (loading states) in dark mode */
html:not(.light):not(.sacred-light) .spinner-border,
html:not(.light):not(.sacred-light) .spinner-grow,
body:not(.light):not(.sacred-light) .spinner-border,
body:not(.light):not(.sacred-light) .spinner-grow {
    color: #60a5fa;
}