/*
 * Clarity DX Portal - Dark Mode Overrides
 * All selectors prefixed with .dark-mode on body.
 * Light mode is never touched — this file only activates when the class is present.
 */

/* ==========================================================================
   CSS Custom Properties (dark palette)
   ========================================================================== */
.dark-mode {
    --dm-bg:            #1a1a2e;
    --dm-surface:       #16213e;
    --dm-surface-alt:   #1a2744;
    --dm-surface-hover: #1e2d4a;
    --dm-navbar:        #0f1a2e;
    --dm-text:          #e2e8f0;
    --dm-text-secondary:#94a3b8;
    --dm-text-muted:    #64748b;
    --dm-border:        #2a3a5c;
    --dm-border-light:  #1e2d4a;
    --dm-input-bg:      #1e2d4a;
    --dm-input-border:  #3a4a6c;
    --dm-link:          #4CC9F0;
    --dm-link-hover:    #7dd8f5;
    --dm-navy:          #4CC9F0;
    --dm-navy-hover:    #7dd8f5;
}

/* ==========================================================================
   Base / Body
   ========================================================================== */
.dark-mode {
    background: var(--dm-bg) !important;
    color: var(--dm-text) !important;
}

/* ==========================================================================
   Navbar
   ========================================================================== */
.dark-mode .navbar {
    background: var(--dm-navbar) !important;
    border-bottom-color: var(--dm-border) !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.3) !important;
}
.dark-mode .navbar-brand {
    color: var(--dm-navy) !important;
}
.dark-mode .navbar .nav-link {
    color: var(--dm-text-secondary) !important;
}
.dark-mode .navbar .nav-link:hover,
.dark-mode .navbar .nav-link:focus {
    color: var(--dm-navy) !important;
}
.dark-mode .navbar-toggler {
    border-color: var(--dm-border) !important;
}
.dark-mode .navbar-toggler-icon {
    filter: invert(1) grayscale(100%) brightness(200%);
}

/* ==========================================================================
   Dropdowns
   ========================================================================== */
.dark-mode .dropdown-menu {
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.4) !important;
}
.dark-mode .dropdown-item {
    color: var(--dm-text) !important;
}
.dark-mode .dropdown-item:hover,
.dark-mode .dropdown-item:focus {
    background-color: var(--dm-surface-hover) !important;
    color: var(--dm-link) !important;
}
.dark-mode .dropdown-divider {
    border-color: var(--dm-border) !important;
}

/* ==========================================================================
   Links
   ========================================================================== */
.dark-mode a {
    color: var(--dm-link);
}
.dark-mode a:hover {
    color: var(--dm-link-hover);
}

/* ==========================================================================
   Cards
   ========================================================================== */
.dark-mode .card {
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .card-header {
    background-color: var(--dm-surface-alt) !important;
    border-bottom-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .card-body {
    color: var(--dm-text) !important;
}
.dark-mode .card-footer {
    background-color: var(--dm-surface-alt) !important;
    border-top-color: var(--dm-border) !important;
}

/* ==========================================================================
   Tables
   ========================================================================== */
.dark-mode .table {
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .table thead th {
    background-color: var(--dm-surface-alt) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .table td,
.dark-mode .table th {
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: rgba(255,255,255,0.02) !important;
    color: var(--dm-text) !important;
}
.dark-mode .table-hover tbody tr:hover {
    background-color: rgba(76,201,240,0.08) !important;
}
.dark-mode .clickable-row:hover {
    background-color: rgba(76,201,240,0.12) !important;
}

/* ==========================================================================
   Forms & Inputs
   ========================================================================== */
.dark-mode .form-control,
.dark-mode .form-select,
.dark-mode input[type="text"],
.dark-mode input[type="number"],
.dark-mode input[type="email"],
.dark-mode input[type="password"],
.dark-mode input[type="date"],
.dark-mode input[type="search"],
.dark-mode input[type="url"],
.dark-mode select,
.dark-mode textarea {
    background-color: var(--dm-input-bg) !important;
    border-color: var(--dm-input-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .form-control:focus,
.dark-mode .form-select:focus,
.dark-mode input:focus,
.dark-mode textarea:focus,
.dark-mode select:focus {
    background-color: var(--dm-input-bg) !important;
    border-color: var(--dm-link) !important;
    color: var(--dm-text) !important;
    box-shadow: 0 0 0 0.2rem rgba(76,201,240,0.25) !important;
}
.dark-mode .form-control::placeholder,
.dark-mode input::placeholder,
.dark-mode textarea::placeholder {
    color: var(--dm-text-muted) !important;
}
.dark-mode .form-label,
.dark-mode label {
    color: var(--dm-text) !important;
}
.dark-mode .input-group-text {
    background-color: var(--dm-surface-alt) !important;
    border-color: var(--dm-input-border) !important;
    color: var(--dm-text-secondary) !important;
}
.dark-mode .form-check-input {
    background-color: var(--dm-input-bg) !important;
    border-color: var(--dm-input-border) !important;
}
.dark-mode .form-check-input:checked {
    background-color: var(--dm-link) !important;
    border-color: var(--dm-link) !important;
}

/* Custom form classes from edit_base.html */
.dark-mode .form-input,
.dark-mode .form-textarea {
    background-color: var(--dm-input-bg) !important;
    border-color: var(--dm-input-border) !important;
    color: var(--dm-text) !important;
}

/* ==========================================================================
   Modals (Bootstrap)
   ========================================================================== */
.dark-mode .modal-content {
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .modal-header {
    border-bottom-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .modal-header .modal-title {
    color: var(--dm-text) !important;
}
.dark-mode .modal-body {
    color: var(--dm-text) !important;
}
.dark-mode .modal-footer {
    border-top-color: var(--dm-border) !important;
}
.dark-mode .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

/* Custom modals (modal-overlay / modal-box pattern) */
.dark-mode .modal-overlay .modal,
.dark-mode .modal-box {
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .modal-box h3,
.dark-mode .modal-box h4,
.dark-mode .modal-box label {
    color: var(--dm-text) !important;
}

/* ==========================================================================
   Alerts
   ========================================================================== */
.dark-mode .alert-success {
    background-color: rgba(16,185,129,0.15) !important;
    border-color: rgba(16,185,129,0.3) !important;
    color: #6ee7b7 !important;
}
.dark-mode .alert-warning {
    background-color: rgba(245,158,11,0.15) !important;
    border-color: rgba(245,158,11,0.3) !important;
    color: #fcd34d !important;
}
.dark-mode .alert-danger {
    background-color: rgba(239,68,68,0.15) !important;
    border-color: rgba(239,68,68,0.3) !important;
    color: #fca5a5 !important;
}
.dark-mode .alert-info {
    background-color: rgba(59,130,246,0.15) !important;
    border-color: rgba(59,130,246,0.3) !important;
    color: #93c5fd !important;
}

/* ==========================================================================
   Buttons
   ========================================================================== */
.dark-mode .btn-primary {
    background-color: #0E4D64 !important;
    border-color: #0E4D64 !important;
    color: #fff !important;
}
.dark-mode .btn-primary:hover {
    background-color: #13647F !important;
    border-color: #13647F !important;
}
.dark-mode .btn-outline-primary {
    color: var(--dm-link) !important;
    border-color: var(--dm-link) !important;
}
.dark-mode .btn-outline-primary:hover {
    background-color: var(--dm-link) !important;
    color: #0f1a2e !important;
}
.dark-mode .btn-outline-secondary {
    color: var(--dm-text-secondary) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .btn-outline-secondary:hover {
    background-color: var(--dm-surface-hover) !important;
    color: var(--dm-text) !important;
}
.dark-mode .btn-light {
    background-color: var(--dm-surface-hover) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .btn-secondary {
    background-color: var(--dm-surface-hover) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

/* ==========================================================================
   Badges
   ========================================================================== */
.dark-mode .badge.bg-light {
    background-color: var(--dm-surface-hover) !important;
    color: var(--dm-text) !important;
}
.dark-mode .badge.bg-secondary {
    background-color: var(--dm-surface-hover) !important;
}

/* ==========================================================================
   Text utility overrides
   ========================================================================== */
.dark-mode .text-muted {
    color: var(--dm-text-muted) !important;
}
.dark-mode .text-dark {
    color: var(--dm-text) !important;
}
.dark-mode .text-body {
    color: var(--dm-text) !important;
}
.dark-mode .text-secondary {
    color: var(--dm-text-secondary) !important;
}
.dark-mode small,
.dark-mode .small {
    color: var(--dm-text-secondary) !important;
}
.dark-mode h1, .dark-mode h2, .dark-mode h3,
.dark-mode h4, .dark-mode h5, .dark-mode h6 {
    color: var(--dm-text) !important;
}
.dark-mode p {
    color: var(--dm-text);
}
.dark-mode code {
    color: #f472b6;
    background-color: var(--dm-surface-hover);
}
.dark-mode pre {
    background-color: #0d1117 !important;
    color: #c9d1d9 !important;
    border-color: var(--dm-border) !important;
}
.dark-mode hr {
    border-color: var(--dm-border) !important;
    opacity: 0.5;
}

/* ==========================================================================
   Background utility overrides
   ========================================================================== */
.dark-mode .bg-white {
    background-color: var(--dm-surface) !important;
}
.dark-mode .bg-light {
    background-color: var(--dm-surface-alt) !important;
}
.dark-mode .border {
    border-color: var(--dm-border) !important;
}
.dark-mode .border-bottom {
    border-bottom-color: var(--dm-border) !important;
}
.dark-mode .border-top {
    border-top-color: var(--dm-border) !important;
}
.dark-mode .shadow-sm,
.dark-mode .shadow {
    box-shadow: 0 1px 4px rgba(0,0,0,0.3) !important;
}

/* ==========================================================================
   Loading overlay (common.css)
   ========================================================================== */
.dark-mode .loading-content {
    background: var(--dm-surface) !important;
    color: var(--dm-text) !important;
}
.dark-mode .loading-spinner {
    border-color: var(--dm-border) !important;
    border-top-color: var(--dm-link) !important;
}
.dark-mode .currency-input .input-group-text {
    background-color: var(--dm-surface-alt) !important;
    border-color: var(--dm-input-border) !important;
}
.dark-mode .muted-link {
    color: var(--dm-text-muted) !important;
}
.dark-mode .muted-link:hover {
    color: var(--dm-text-secondary) !important;
}

/* Validation highlights - keep semantic color but adjust for dark */
.dark-mode .charge-mismatch {
    background-color: rgba(239,68,68,0.2) !important;
    border-color: #ef4444 !important;
    color: #fca5a5 !important;
}
.dark-mode .validation-highlight {
    background-color: rgba(245,158,11,0.15) !important;
    border-left-color: #f59e0b !important;
    color: var(--dm-text) !important;
}
.dark-mode .validation-error-highlight {
    background-color: rgba(239,68,68,0.15) !important;
    border-left-color: #ef4444 !important;
    color: var(--dm-text) !important;
}

/* ==========================================================================
   Processing overlay (_processing_overlay.html)
   ========================================================================== */
.dark-mode .proc-box {
    background: var(--dm-surface) !important;
    color: var(--dm-text) !important;
}
.dark-mode .proc-log {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .proc-log-header {
    background: var(--dm-surface-alt) !important;
    color: var(--dm-text) !important;
    border-bottom-color: var(--dm-border) !important;
}
.dark-mode .proc-log-body {
    background: #0d1117 !important;
    color: #c9d1d9 !important;
}

/* ==========================================================================
   CRM Dashboard (crm/dashboard.html)
   ========================================================================== */
.dark-mode .summary-card,
.dark-mode .stage-card,
.dark-mode .wq-card,
.dark-mode .queue-card {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .sc-value,
.dark-mode .wq-count {
    color: var(--dm-text) !important;
}
.dark-mode .sc-label,
.dark-mode .wq-label,
.dark-mode .stage-name {
    color: var(--dm-text-secondary) !important;
}
.dark-mode .flag-panel {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .flag-panel-header {
    color: #fbbf24 !important;
    background: rgba(245,158,11,0.1) !important;
}
.dark-mode .flag-item {
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .flag-item:hover {
    background: var(--dm-surface-hover) !important;
}
.dark-mode .flag-name {
    color: var(--dm-text) !important;
}
.dark-mode .flag-count {
    color: var(--dm-text-secondary) !important;
}

/* ==========================================================================
   CRM Bill Detail (crm/bill_detail.html)
   ========================================================================== */
/* Container */
.dark-mode .bill-detail {
    color: var(--dm-text) !important;
}
/* Header */
.dark-mode .bill-id {
    color: var(--dm-text) !important;
}
.dark-mode .back-link {
    color: var(--dm-text-muted) !important;
}
/* Back-to dropdown */
.dark-mode .back-dropdown-toggle {
    color: var(--dm-text-muted) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .back-dropdown-toggle:hover {
    border-color: var(--dm-link) !important;
    color: var(--dm-link) !important;
}
.dark-mode .back-dropdown-menu {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.4) !important;
}
.dark-mode .back-dropdown-menu a {
    color: var(--dm-text) !important;
    border-bottom-color: var(--dm-border) !important;
}
.dark-mode .back-dropdown-menu a:hover {
    background: var(--dm-surface-hover) !important;
    color: var(--dm-link) !important;
}
.dark-mode .back-dropdown-menu .menu-header {
    color: var(--dm-text-muted) !important;
}
/* Progress bar */
.dark-mode .progress {
    background: var(--dm-surface-hover) !important;
}
.dark-mode .progress-step {
    background: var(--dm-surface-hover) !important;
    color: var(--dm-text-muted) !important;
}
.dark-mode .progress-step.complete {
    background: #059669 !important;
    color: #fff !important;
}
.dark-mode .progress-step.current {
    background: #0E4D64 !important;
    color: #fff !important;
}
/* Flags section */
.dark-mode .flags {
    background: rgba(245,158,11,0.1) !important;
    border-color: rgba(245,158,11,0.3) !important;
}
.dark-mode .flags.clear {
    background: rgba(16,185,129,0.1) !important;
    border-color: rgba(16,185,129,0.3) !important;
}
.dark-mode .flag-tag {
    background: var(--dm-surface-hover) !important;
    color: #fbbf24 !important;
}
.dark-mode .flag-resolve {
    color: #6ee7b7 !important;
}
.dark-mode .blocker-tag {
    background: rgba(239,68,68,0.2) !important;
    color: #fca5a5 !important;
    border-color: rgba(239,68,68,0.3) !important;
}
/* Action buttons */
.dark-mode .bill-detail .btn {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .bill-detail .btn:hover {
    background: var(--dm-surface-hover) !important;
}
.dark-mode .bill-detail .btn-primary {
    background: #0E4D64 !important;
    border-color: #0E4D64 !important;
    color: #fff !important;
}
.dark-mode .bill-detail .btn-primary:hover {
    background: #13647F !important;
    color: #fff !important;
}
.dark-mode .bill-detail .btn-pdf {
    background: #4CC9F0 !important;
    color: #fff !important;
}
.dark-mode .bill-detail .btn-eobr {
    background: #E76F51 !important;
    color: #fff !important;
}
.dark-mode .bill-detail .btn-remap {
    background: #f59e0b !important;
    color: #fff !important;
}
/* Column headers */
.dark-mode .column-header {
    color: var(--dm-text-muted) !important;
    border-bottom-color: var(--dm-border) !important;
}
.dark-mode .column-header.bill { border-color: var(--dm-link) !important; }
.dark-mode .column-header.order { border-color: #4CC9F0 !important; }
/* Cards */
.dark-mode .bill-detail .card {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .bill-detail .card-header {
    background: var(--dm-surface-alt) !important;
    border-bottom-color: var(--dm-border) !important;
    color: var(--dm-text-muted) !important;
}
.dark-mode .edit-link {
    color: var(--dm-link) !important;
}
/* Info rows */
.dark-mode .info-label {
    color: var(--dm-text-muted) !important;
}
.dark-mode .info-value {
    color: var(--dm-text) !important;
}
.dark-mode .info-value.mismatch {
    color: #f87171 !important;
}
.dark-mode .info-value.match {
    color: #6ee7b7 !important;
}
/* Section headers */
.dark-mode .section-title {
    color: var(--dm-text-muted) !important;
}
/* Line items table */
.dark-mode .line-table {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .line-table th {
    background: var(--dm-surface-alt) !important;
    color: var(--dm-text-muted) !important;
    border-bottom-color: var(--dm-border) !important;
}
.dark-mode .line-table td {
    color: var(--dm-text) !important;
    border-bottom-color: var(--dm-border) !important;
}
.dark-mode .line-table .status-priced { color: #6ee7b7 !important; }
.dark-mode .line-table .status-pending { color: #fbbf24 !important; }
.dark-mode .line-table .edit { color: var(--dm-link) !important; }
/* Notes & History */
.dark-mode .note-item,
.dark-mode .history-item {
    border-bottom-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .note-meta,
.dark-mode .history-time {
    color: var(--dm-text-muted) !important;
}
/* Modals (bill detail custom pattern) */
.dark-mode .modal-overlay .modal {
    background: var(--dm-surface) !important;
    color: var(--dm-text) !important;
}
.dark-mode .modal-header {
    border-bottom-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .modal-close {
    color: var(--dm-text-muted) !important;
}
.dark-mode .modal-body {
    color: var(--dm-text) !important;
}
.dark-mode .modal-body label {
    color: var(--dm-text-secondary) !important;
}
.dark-mode .modal-body input,
.dark-mode .modal-body select,
.dark-mode .modal-body textarea {
    background: var(--dm-input-bg) !important;
    border-color: var(--dm-input-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .modal-footer {
    border-top-color: var(--dm-border) !important;
}
/* PDF panel */
.dark-mode .pdf-panel {
    background: var(--dm-surface) !important;
    border-left-color: var(--dm-border) !important;
}
/* EOBR panel */
.dark-mode .eobr-panel {
    background: var(--dm-surface) !important;
    border-left-color: var(--dm-border) !important;
}
.dark-mode .eobr-panel-tabs {
    border-bottom-color: var(--dm-border) !important;
}
.dark-mode .eobr-panel-tabs button {
    background: var(--dm-surface-alt) !important;
    color: var(--dm-text-secondary) !important;
}
.dark-mode .eobr-panel-tabs button.active {
    background: var(--dm-surface) !important;
    color: var(--dm-link) !important;
    border-bottom-color: var(--dm-link) !important;
}
.dark-mode .eobr-panel-tabs button:hover:not(.active) {
    background: var(--dm-surface-hover) !important;
}
.dark-mode .eobr-edit-form {
    background: var(--dm-surface) !important;
}
.dark-mode .eobr-edit-form .ef-label {
    color: var(--dm-text-secondary) !important;
}
.dark-mode .eobr-edit-form .ef-input {
    background: var(--dm-input-bg) !important;
    border-color: var(--dm-input-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .eobr-edit-form h6 {
    color: var(--dm-link) !important;
    border-bottom-color: var(--dm-border) !important;
}
.dark-mode .eobr-edit-form .li-table input {
    background: var(--dm-input-bg) !important;
    border-color: var(--dm-input-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .eobr-regen-footer {
    background: var(--dm-surface-alt) !important;
    border-top-color: var(--dm-border) !important;
}
/* Auth docs panel */
.dark-mode .auth-panel {
    background: var(--dm-surface) !important;
    border-left-color: var(--dm-border) !important;
}
.dark-mode .auth-doc-list {
    border-bottom-color: var(--dm-border) !important;
}
.dark-mode .auth-doc-item {
    color: var(--dm-text) !important;
}
.dark-mode .auth-doc-item:hover {
    background: rgba(109,40,217,0.1) !important;
}
.dark-mode .auth-doc-item.active {
    background: rgba(109,40,217,0.15) !important;
    color: #a78bfa !important;
}
/* Fax panel */
.dark-mode .fax-panel {
    background: var(--dm-surface) !important;
    border-left-color: var(--dm-border) !important;
}
.dark-mode .fax-panel-body label {
    color: var(--dm-text) !important;
}
.dark-mode .fax-panel-body input,
.dark-mode .fax-panel-body select,
.dark-mode .fax-panel-body textarea {
    background: var(--dm-input-bg) !important;
    border-color: var(--dm-input-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .fax-reason-card {
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .fax-reason-card:hover {
    border-color: #0891b2 !important;
    background: var(--dm-surface-hover) !important;
}
.dark-mode .fax-reason-card.selected {
    border-color: #0e7490 !important;
    background: rgba(14,116,144,0.15) !important;
}
.dark-mode .fax-reason-card h6 {
    color: #22d3ee !important;
}
.dark-mode .fax-reason-card p {
    color: var(--dm-text-secondary) !important;
}
.dark-mode .fax-history-item {
    border-bottom-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .fax-status.sent { background: rgba(16,185,129,0.2) !important; color: #6ee7b7 !important; }
.dark-mode .fax-status.pending { background: rgba(245,158,11,0.2) !important; color: #fbbf24 !important; }
.dark-mode .fax-status.failed { background: rgba(239,68,68,0.2) !important; color: #fca5a5 !important; }
.dark-mode .fax-panel-footer {
    background: var(--dm-surface-alt) !important;
    border-top-color: var(--dm-border) !important;
}
/* Remap warning */
.dark-mode .remap-warning {
    background: rgba(245,158,11,0.1) !important;
    border-color: rgba(245,158,11,0.3) !important;
    color: #fbbf24 !important;
}

/* ==========================================================================
   CRM Finder (crm/finder.html)
   ========================================================================== */
.dark-mode .bill-card,
.dark-mode .order-card {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .bill-card:hover,
.dark-mode .order-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.4) !important;
}
.dark-mode .charge-amount {
    color: var(--dm-text) !important;
}
.dark-mode .linked-chip {
    background: var(--dm-surface-hover) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
}
/* Tabs */
.dark-mode .finder-tab,
.dark-mode .nav-tabs .nav-link {
    color: var(--dm-text-secondary) !important;
    border-color: transparent !important;
}
.dark-mode .finder-tab.active,
.dark-mode .nav-tabs .nav-link.active {
    color: var(--dm-link) !important;
    border-bottom-color: var(--dm-link) !important;
    background: transparent !important;
}
.dark-mode .nav-tabs {
    border-bottom-color: var(--dm-border) !important;
}

/* ==========================================================================
   Pipeline Worklist (crm/pipeline_worklist.html)
   ========================================================================== */
/* Container text */
.dark-mode .pw {
    color: var(--dm-text) !important;
}
.dark-mode .pw-back {
    color: var(--dm-text-muted) !important;
}
.dark-mode .pw-back:hover {
    color: var(--dm-link) !important;
}
/* 3-Lane Tabs */
.dark-mode .pw-lanes {
    border-color: var(--dm-border) !important;
}
.dark-mode .pw-lane {
    background: var(--dm-surface) !important;
    color: var(--dm-text) !important;
    border-right-color: var(--dm-border) !important;
}
.dark-mode .pw-lane:hover {
    background: var(--dm-surface-hover) !important;
}
.dark-mode .pw-lane.active {
    background: #0E4D64 !important;
    color: #fff !important;
}
.dark-mode .pw-lane:not(.active) .pw-lane-count {
    background: var(--dm-surface-hover) !important;
    color: var(--dm-text-secondary) !important;
}
/* Sub-tabs */
.dark-mode .pw-sub {
    background: var(--dm-surface) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .pw-sub:hover {
    border-color: #0E4D64 !important;
    background: var(--dm-surface-hover) !important;
}
.dark-mode .pw-sub.active {
    background: #0E4D64 !important;
    color: #fff !important;
    border-color: #0E4D64 !important;
}
.dark-mode .pw-sub:not(.active) .pw-sub-count {
    background: var(--dm-surface-hover) !important;
    color: var(--dm-text-secondary) !important;
}
.dark-mode .pw-sub[data-sub="auth"]:not(.active) { border-color: #7c3aed !important; }
.dark-mode .pw-sub[data-sub="rate"]:not(.active) { border-color: #3b82f6 !important; }
.dark-mode .pw-sub[data-sub="cred"]:not(.active) { border-color: #f59e0b !important; }
/* Worker tabs */
.dark-mode .pw-worker {
    background: var(--dm-surface) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .pw-worker:hover {
    border-color: #0E4D64 !important;
}
.dark-mode .pw-worker.active {
    background: #0E4D64 !important;
    color: #fff !important;
    border-color: #0E4D64 !important;
}
/* Search */
.dark-mode .pw-search input {
    background: var(--dm-input-bg) !important;
    border-color: var(--dm-input-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .pw-search button {
    background: var(--dm-text) !important;
    color: var(--dm-bg) !important;
}
/* Bill list items */
.dark-mode .pw-bill {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .pw-bill:hover {
    background: var(--dm-surface-hover) !important;
}
.dark-mode .pw-bill-id {
    color: var(--dm-link) !important;
}
.dark-mode .pw-bill-patient {
    color: var(--dm-text) !important;
}
.dark-mode .pw-bill-meta {
    color: var(--dm-text-muted) !important;
}
/* Flag badges */
.dark-mode .pw-flag-hard {
    background: rgba(239,68,68,0.2) !important;
    color: #fca5a5 !important;
}
.dark-mode .pw-flag-soft {
    background: rgba(245,158,11,0.15) !important;
    color: #fcd34d !important;
}
/* Auth status badges */
.dark-mode .pw-auth-ready {
    background: rgba(245,158,11,0.2) !important;
    color: #fbbf24 !important;
}
.dark-mode .pw-auth-reviewing {
    background: rgba(59,130,246,0.2) !important;
    color: #93c5fd !important;
}
.dark-mode .pw-auth-pending {
    background: var(--dm-surface-hover) !important;
    color: var(--dm-text-secondary) !important;
}
.dark-mode .pw-auth-review-link {
    background: rgba(109,40,217,0.15) !important;
    color: #a78bfa !important;
    border-color: #7c3aed !important;
}
.dark-mode .pw-auth-review-link:hover {
    background: rgba(109,40,217,0.25) !important;
    border-color: #8b5cf6 !important;
}
/* Pagination */
.dark-mode .pw-pag {
    color: var(--dm-text-secondary) !important;
}
.dark-mode .pw-pag a {
    color: var(--dm-link) !important;
}
/* Empty state */
.dark-mode .pw-empty {
    color: var(--dm-text-muted) !important;
}
/* Auth/Cred info banners (inline styles in template) */
.dark-mode .pw [style*="background:#f5f3ff"],
.dark-mode .pw [style*="background: #f5f3ff"] {
    background: rgba(109,40,217,0.12) !important;
    border-color: #7c3aed !important;
    color: var(--dm-text) !important;
}
.dark-mode .pw [style*="background:#fffbeb"],
.dark-mode .pw [style*="background: #fffbeb"] {
    background: rgba(245,158,11,0.12) !important;
    border-color: #f59e0b !important;
    color: var(--dm-text) !important;
}

/* ==========================================================================
   Auth Needed (crm/auth_needed.html)
   ========================================================================== */
.dark-mode .dq-page {
    color: var(--dm-text) !important;
}
.dark-mode .dq-header h1 {
    color: var(--dm-link) !important;
}
.dark-mode .dq-back {
    color: var(--dm-text-muted) !important;
}
.dark-mode .dq-back:hover {
    color: var(--dm-link) !important;
}
.dark-mode .dq-count-badge {
    background: rgba(109,40,217,0.15) !important;
    color: #a78bfa !important;
}
/* Tabs */
.dark-mode .dq-tabs {
    border-bottom-color: var(--dm-border) !important;
}
.dark-mode .dq-tab {
    color: var(--dm-text-secondary) !important;
    background: transparent !important;
}
.dark-mode .dq-tab:hover {
    background: var(--dm-surface-hover) !important;
}
.dark-mode .dq-tab.active {
    color: #a78bfa !important;
    border-bottom-color: #8b5cf6 !important;
    background: transparent !important;
}
.dark-mode .dq-tab .tab-count {
    background: var(--dm-surface-hover) !important;
    color: var(--dm-text-secondary) !important;
}
.dark-mode .dq-tab.active .tab-count {
    background: rgba(139,92,246,0.25) !important;
    color: #c4b5fd !important;
}
/* Cards */
.dark-mode .dq-card {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    border-left-color: #8b5cf6 !important;
    color: var(--dm-text) !important;
}
.dark-mode .dq-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.3) !important;
    border-color: var(--dm-border) !important;
    border-left-color: #8b5cf6 !important;
}
.dark-mode .dq-card-top {
    color: var(--dm-text) !important;
}
.dark-mode .dq-card-id {
    color: var(--dm-link) !important;
}
.dark-mode .dq-card-id:hover {
    color: var(--dm-link-hover) !important;
}
.dark-mode .dq-card-patient {
    color: var(--dm-text) !important;
}
.dark-mode .dq-card-order {
    color: var(--dm-text-secondary) !important;
}
.dark-mode .dq-card-meta {
    color: var(--dm-text-secondary) !important;
}
.dark-mode .dq-card-meta strong {
    color: var(--dm-text) !important;
}
.dark-mode .dq-card-trigger {
    background: rgba(109,40,217,0.12) !important;
    color: #c4b5fd !important;
    border-color: #7c3aed !important;
}
.dark-mode .dq-card-actions {
    color: var(--dm-text) !important;
}
/* Status badges */
.dark-mode .dq-status {
    color: var(--dm-text) !important;
}
.dark-mode .dq-status-pending_docs {
    background: var(--dm-surface-hover) !important;
    color: var(--dm-text-secondary) !important;
}
.dark-mode .dq-status-docs_ready {
    background: rgba(245,158,11,0.2) !important;
    color: #fbbf24 !important;
}
.dark-mode .dq-status-under_review {
    background: rgba(59,130,246,0.2) !important;
    color: #93c5fd !important;
}
.dark-mode .dq-status-approved {
    background: rgba(16,185,129,0.2) !important;
    color: #6ee7b7 !important;
}
.dark-mode .dq-status-denied {
    background: rgba(239,68,68,0.2) !important;
    color: #fca5a5 !important;
}
/* Buttons */
.dark-mode .dq-btn {
    background: var(--dm-surface-hover) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .dq-btn:hover {
    border-color: var(--dm-link) !important;
    color: var(--dm-link) !important;
}
.dark-mode .dq-btn-review {
    background: #8b5cf6 !important;
    color: #fff !important;
    border-color: #8b5cf6 !important;
}
.dark-mode .dq-btn-review:hover {
    background: #7c3aed !important;
    color: #fff !important;
}
.dark-mode .dq-empty {
    color: var(--dm-text-muted) !important;
}
/* Pagination */
.dark-mode .pq-pagination a {
    color: var(--dm-link) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .pq-pagination span {
    color: var(--dm-text-secondary) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .pq-pagination .current {
    background: #0E4D64 !important;
    color: #fff !important;
    border-color: #0E4D64 !important;
}

/* ==========================================================================
   Auth Review (crm/auth_review.html)
   ========================================================================== */
.dark-mode .ar-page {
    color: var(--dm-text) !important;
}
.dark-mode .ar-header h1 {
    color: var(--dm-link) !important;
}
.dark-mode .ar-back {
    color: var(--dm-text-muted) !important;
}
.dark-mode .ar-back:hover {
    color: var(--dm-link) !important;
}
/* Cards */
.dark-mode .ar-card {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .ar-card h2 {
    color: var(--dm-link) !important;
}
.dark-mode .ar-meta-label {
    color: var(--dm-text-muted) !important;
}
.dark-mode .ar-meta-value {
    color: var(--dm-text) !important;
}
/* Status badges */
.dark-mode .ar-status-pending_docs {
    background: var(--dm-surface-hover) !important;
    color: var(--dm-text-secondary) !important;
}
.dark-mode .ar-status-docs_ready {
    background: rgba(245,158,11,0.2) !important;
    color: #fbbf24 !important;
}
.dark-mode .ar-status-under_review {
    background: rgba(59,130,246,0.2) !important;
    color: #93c5fd !important;
}
.dark-mode .ar-status-approved {
    background: rgba(16,185,129,0.2) !important;
    color: #6ee7b7 !important;
}
.dark-mode .ar-status-denied {
    background: rgba(239,68,68,0.2) !important;
    color: #fca5a5 !important;
}
/* Doc list */
.dark-mode .ar-docs {
    color: var(--dm-text) !important;
}
.dark-mode .ar-docs h2 {
    color: var(--dm-text) !important;
}
.dark-mode .ar-doc-item {
    color: var(--dm-link) !important;
}
.dark-mode .ar-doc-item:hover {
    background: var(--dm-surface-hover) !important;
    border-color: #3b82f6 !important;
}
.dark-mode .ar-doc-item.active {
    background: rgba(109,40,217,0.15) !important;
    color: #a78bfa !important;
}
/* Tables */
.dark-mode .ar-trigger-table th,
.dark-mode .ar-li-table th {
    background: var(--dm-surface-alt) !important;
    color: var(--dm-text-secondary) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .ar-trigger-table td,
.dark-mode .ar-li-table td {
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
}
/* Decision area */
.dark-mode .ar-decision {
    color: var(--dm-text) !important;
}
.dark-mode .ar-decision h2 {
    color: var(--dm-text) !important;
}
.dark-mode .ar-decision textarea {
    background: var(--dm-input-bg) !important;
    border-color: var(--dm-input-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .ar-btn-more {
    background: var(--dm-surface-hover) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .ar-btn-more:hover {
    background: var(--dm-surface-alt) !important;
}
/* PDF panel */
.dark-mode .ar-pdf-panel {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .ar-pdf-panel-tabs {
    background: var(--dm-surface-alt) !important;
}
.dark-mode .ar-pdf-tab {
    color: var(--dm-text-secondary) !important;
}
.dark-mode .ar-pdf-tab:hover {
    color: var(--dm-link) !important;
}
.dark-mode .ar-pdf-tab.active {
    color: var(--dm-link) !important;
    border-bottom-color: var(--dm-link) !important;
}

/* ==========================================================================
   Chat (chat.html)
   ========================================================================== */
.dark-mode .metric-card {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .status-breakdown {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .status-bar {
    background: var(--dm-surface-alt) !important;
    color: var(--dm-text-secondary) !important;
}
.dark-mode .chat-section {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .chat-header {
    border-bottom-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .chat-messages {
    background: var(--dm-bg) !important;
}
.dark-mode .chat-message.assistant {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .chat-message.user {
    color: #fff !important;
}
.dark-mode .chat-input-area {
    border-top-color: var(--dm-border) !important;
    background: var(--dm-surface) !important;
}
.dark-mode .chat-input-area input,
.dark-mode .chat-input-area textarea {
    background: var(--dm-input-bg) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-input-border) !important;
}
.dark-mode .quick-action,
.dark-mode .quick-actions button {
    background: var(--dm-surface-hover) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}

/* ==========================================================================
   Edit forms (edit_base.html and children)
   ========================================================================== */
.dark-mode .header h1 {
    color: var(--dm-text) !important;
}
.dark-mode .form-card {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}

/* ==========================================================================
   Logs viewer (logs_viewer.html)
   ========================================================================== */
.dark-mode .filter-bar {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}

/* ==========================================================================
   Postprocess / Batch detail
   ========================================================================== */
.dark-mode .batch-card {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}

/* ==========================================================================
   Pagination
   ========================================================================== */
.dark-mode .page-link {
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-link) !important;
}
.dark-mode .page-item.active .page-link {
    background-color: #0E4D64 !important;
    border-color: #0E4D64 !important;
    color: #fff !important;
}
.dark-mode .page-item.disabled .page-link {
    background-color: var(--dm-surface-alt) !important;
    color: var(--dm-text-muted) !important;
}

/* ==========================================================================
   List groups
   ========================================================================== */
.dark-mode .list-group-item {
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}
.dark-mode .list-group-item:hover {
    background-color: var(--dm-surface-hover) !important;
}

/* ==========================================================================
   Breadcrumbs
   ========================================================================== */
.dark-mode .breadcrumb {
    background-color: transparent !important;
}
.dark-mode .breadcrumb-item a {
    color: var(--dm-link) !important;
}
.dark-mode .breadcrumb-item.active {
    color: var(--dm-text-secondary) !important;
}

/* ==========================================================================
   Tooltips & Popovers
   ========================================================================== */
.dark-mode .tooltip-inner {
    background-color: var(--dm-surface-alt) !important;
    color: var(--dm-text) !important;
}
.dark-mode .popover {
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .popover-body {
    color: var(--dm-text) !important;
}

/* ==========================================================================
   Workflow summary badges (used across CRM views)
   ========================================================================== */
.dark-mode .wf-blocked {
    background: rgba(239,68,68,0.2) !important;
    color: #fca5a5 !important;
}
.dark-mode .wf-waiting {
    background: rgba(245,158,11,0.15) !important;
    color: #fcd34d !important;
}
.dark-mode .wf-progress {
    background: rgba(59,130,246,0.15) !important;
    color: #93c5fd !important;
}
.dark-mode .wf-done {
    background: rgba(16,185,129,0.15) !important;
    color: #6ee7b7 !important;
}

/* ==========================================================================
   Catch-all: inline style color overrides
   These use !important to beat inline style="" attributes.
   Targets elements by their parent container classes.
   ========================================================================== */

/* Dark gray text colors that become invisible */
.dark-mode [style*="color: #111"],
.dark-mode [style*="color:#111"],
.dark-mode [style*="color: #374151"],
.dark-mode [style*="color:#374151"],
.dark-mode [style*="color: #4b5563"],
.dark-mode [style*="color:#4b5563"],
.dark-mode [style*="color: #1f2937"],
.dark-mode [style*="color:#1f2937"] {
    color: var(--dm-text) !important;
}
.dark-mode [style*="color: #6b7280"],
.dark-mode [style*="color:#6b7280"],
.dark-mode [style*="color: #9ca3af"],
.dark-mode [style*="color:#9ca3af"] {
    color: var(--dm-text-secondary) !important;
}
.dark-mode [style*="color: #92400e"],
.dark-mode [style*="color:#92400e"] {
    color: #fbbf24 !important;
}
.dark-mode [style*="color: #0E4D64"],
.dark-mode [style*="color:#0E4D64"],
.dark-mode [style*="color: #0e4d64"],
.dark-mode [style*="color:#0e4d64"] {
    color: var(--dm-link) !important;
}

/* White/light backgrounds that become invisible */
.dark-mode [style*="background: #fff"],
.dark-mode [style*="background:#fff"],
.dark-mode [style*="background: white"],
.dark-mode [style*="background:white"],
.dark-mode [style*="background-color: #fff"],
.dark-mode [style*="background-color:#fff"],
.dark-mode [style*="background-color: white"],
.dark-mode [style*="background-color:white"] {
    background: var(--dm-surface) !important;
}
.dark-mode [style*="background: #f9fafb"],
.dark-mode [style*="background:#f9fafb"],
.dark-mode [style*="background-color: #f9fafb"],
.dark-mode [style*="background-color:#f9fafb"],
.dark-mode [style*="background: #f8f9fa"],
.dark-mode [style*="background:#f8f9fa"],
.dark-mode [style*="background-color: #f8f9fa"],
.dark-mode [style*="background-color:#f8f9fa"],
.dark-mode [style*="background: #f3f4f6"],
.dark-mode [style*="background:#f3f4f6"],
.dark-mode [style*="background-color: #f3f4f6"],
.dark-mode [style*="background-color:#f3f4f6"] {
    background: var(--dm-surface-alt) !important;
}
/* Purple-tinted banners */
.dark-mode [style*="background:#f5f3ff"],
.dark-mode [style*="background: #f5f3ff"] {
    background: rgba(109,40,217,0.12) !important;
    color: var(--dm-text) !important;
}
/* Yellow-tinted banners */
.dark-mode [style*="background:#fffbeb"],
.dark-mode [style*="background: #fffbeb"] {
    background: rgba(245,158,11,0.12) !important;
    color: var(--dm-text) !important;
}
/* Light green backgrounds */
.dark-mode [style*="background:#f0fdf4"],
.dark-mode [style*="background: #f0fdf4"],
.dark-mode [style*="background:#f0fdfa"],
.dark-mode [style*="background: #f0fdfa"],
.dark-mode [style*="background:#ecfeff"],
.dark-mode [style*="background: #ecfeff"] {
    background: var(--dm-surface-hover) !important;
}
/* Light purple hover backgrounds */
.dark-mode [style*="background:#ede9fe"],
.dark-mode [style*="background: #ede9fe"] {
    background: rgba(109,40,217,0.15) !important;
}
/* Inline border overrides for #c4b5fd, #fcd34d, #d1d5db */
.dark-mode [style*="border:1px solid #c4b5fd"],
.dark-mode [style*="border: 1px solid #c4b5fd"] {
    border-color: #7c3aed !important;
}
.dark-mode [style*="border:1px solid #fcd34d"],
.dark-mode [style*="border: 1px solid #fcd34d"] {
    border-color: rgba(245,158,11,0.4) !important;
}

/* Light borders */
.dark-mode [style*="border-color: #e5e7eb"],
.dark-mode [style*="border-color:#e5e7eb"],
.dark-mode [style*="border-color: #dee2e6"],
.dark-mode [style*="border-color:#dee2e6"],
.dark-mode [style*="border-color: #e9ecef"],
.dark-mode [style*="border-color:#e9ecef"] {
    border-color: var(--dm-border) !important;
}
.dark-mode [style*="border: 1px solid #d1d5db"],
.dark-mode [style*="border:1px solid #d1d5db"],
.dark-mode [style*="border: 1px solid #e5e7eb"],
.dark-mode [style*="border:1px solid #e5e7eb"],
.dark-mode [style*="border: 1px solid #dee2e6"],
.dark-mode [style*="border:1px solid #dee2e6"],
.dark-mode [style*="border: 2px solid #e5e7eb"],
.dark-mode [style*="border:2px solid #e5e7eb"] {
    border-color: var(--dm-border) !important;
}
/* Inline border with #ddd6fe (purple) */
.dark-mode [style*="border: 1px solid #ddd6fe"],
.dark-mode [style*="border:1px solid #ddd6fe"] {
    border-color: #7c3aed !important;
}

/* ==========================================================================
   Hover-state light backgrounds (from template <style> blocks)
   ========================================================================== */
.dark-mode .dq-btn-reprocess:hover {
    background: var(--dm-surface-hover) !important;
}

/* ==========================================================================
   Scrollbar styling for dark mode
   ========================================================================== */
.dark-mode ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
.dark-mode ::-webkit-scrollbar-track {
    background: var(--dm-bg);
}
.dark-mode ::-webkit-scrollbar-thumb {
    background: var(--dm-border);
    border-radius: 4px;
}
.dark-mode ::-webkit-scrollbar-thumb:hover {
    background: var(--dm-text-muted);
}

/* ==========================================================================
   Accordion
   ========================================================================== */
.dark-mode .accordion-item {
    background-color: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .accordion-button {
    background-color: var(--dm-surface) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
}
.dark-mode .accordion-button:not(.collapsed) {
    background-color: var(--dm-surface-alt) !important;
    color: var(--dm-link) !important;
}
.dark-mode .accordion-body {
    background-color: var(--dm-surface) !important;
    color: var(--dm-text) !important;
}

/* ==========================================================================
   Landing / Login page
   ========================================================================== */
.dark-mode .login-card,
.dark-mode .auth-card {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
}