/* Global Dark / Light surfaces for overlay pages and leftover white panels. */

html.theme-light,
html[data-theme="light"],
body.theme-light {
  color-scheme: light;
  --detail-bg: #ffffff;
  --detail-bg-soft: #f8fafc;
  --detail-bg-muted: #f2f6fb;
  --detail-border: #dfe8f1;
  --detail-border-strong: #bdd4ee;
  --detail-text: #172536;
  --detail-muted: #718294;
  --detail-accent: #3977ed;
}

html.theme-dark,
html[data-theme="dark"],
body.theme-dark,
body.force-dark {
  color-scheme: dark;
  --detail-bg: #10283d;
  --detail-bg-soft: #0a1c2b;
  --detail-bg-muted: #0f2a40;
  --detail-border: #244b70;
  --detail-border-strong: #346a9e;
  --detail-text: #edf6ff;
  --detail-muted: #a7b8cc;
  --detail-accent: #5b9cff;
}

html.theme-dark,
html[data-theme="dark"],
body.theme-dark,
body.force-dark,
body.theme-dark .workspace,
body.theme-dark .page-content {
  background: #071522;
  color: #edf6ff;
}

html.theme-light,
html[data-theme="light"],
body.theme-light,
body.theme-light .workspace,
body.theme-light .page-content {
  background: #f4f7fa;
  color: #172536;
}

body.theme-dark .panel,
body.theme-dark .metric-card,
body.theme-dark .table-panel,
body.theme-dark .customer-card,
body.theme-dark .settings-card,
body.theme-dark .settings-overview-card,
body.theme-dark .modal-card,
body.theme-dark .empty-state,
body.force-dark .panel,
body.force-dark .metric-card,
body.force-dark .table-panel,
body.force-dark .customer-card,
body.force-dark .settings-card,
body.force-dark .settings-overview-card,
body.force-dark .modal-card,
html.theme-dark .panel,
html.theme-dark .metric-card,
html.theme-dark .table-panel,
html.theme-dark .customer-card,
html.theme-dark .settings-card,
html.theme-dark .settings-overview-card,
html.theme-dark .modal-card {
  color: #edf6ff !important;
  background: #10283d !important;
  border-color: #244b70 !important;
  box-shadow: 0 18px 52px rgba(0, 0, 0, .24) !important;
}

body.theme-dark .metric-card strong,
body.theme-dark .panel-head h2,
body.theme-dark .customer-card h3,
body.theme-dark .empty-state h3,
body.theme-dark .modal-card h2,
body.theme-dark .settings-overview-card strong,
html.theme-dark .metric-card strong,
html.theme-dark .panel-head h2,
html.theme-dark .customer-card h3,
html.theme-dark .empty-state h3,
html.theme-dark .modal-card h2 {
  color: #edf6ff !important;
}

body.theme-dark .metric-card span,
body.theme-dark .metric-card small,
body.theme-dark .panel-head p,
body.theme-dark .customer-card p,
body.theme-dark .customer-card small,
body.theme-dark .empty-state p,
body.theme-dark .modal-card > p,
html.theme-dark .metric-card span,
html.theme-dark .metric-card small,
html.theme-dark .panel-head p,
html.theme-dark .customer-card p,
html.theme-dark .customer-card small,
html.theme-dark .empty-state p {
  color: #9fb5cc !important;
}

body.theme-dark .donut > div,
html.theme-dark .donut > div {
  background: #10283d !important;
  color: #edf6ff !important;
}

body.theme-dark .secondary-button,
html.theme-dark .secondary-button,
body.force-dark .secondary-button {
  color: #dbeafe !important;
  background: #10243a !important;
  border-color: #244b70 !important;
}

body.theme-dark .secondary-button:hover,
html.theme-dark .secondary-button:hover {
  color: #ffffff !important;
  background: #143657 !important;
  border-color: #5a9cff !important;
}

body.theme-dark .form-grid input,
body.theme-dark .form-grid select,
body.theme-dark .form-grid textarea,
body.theme-dark .form-label input,
body.theme-dark .form-label select,
body.theme-dark .form-label textarea,
body.theme-dark .modal-form input:not([type="checkbox"]),
body.theme-dark .modal-form select,
body.theme-dark .modal-form textarea,
body.theme-dark .settings-card input:not([type="checkbox"]),
body.theme-dark .settings-card textarea,
body.theme-dark .settings-card select,
html.theme-dark .form-grid input,
html.theme-dark .form-grid select,
html.theme-dark .form-grid textarea,
html.theme-dark .modal-form input:not([type="checkbox"]),
html.theme-dark .modal-form select,
html.theme-dark .modal-form textarea {
  color: #edf6ff !important;
  background: #071827 !important;
  border-color: #244b70 !important;
}

body.theme-dark .data-table,
body.theme-dark .data-table-wrap,
body.theme-dark .table-panel,
html.theme-dark .data-table,
html.theme-dark .data-table-wrap {
  color: #dbeafe !important;
  background: #10283d !important;
  border-color: #244b70 !important;
}

body.theme-dark .data-table th,
html.theme-dark .data-table th {
  color: #9fb5cc !important;
  background: #0b1e31 !important;
  border-color: #244b70 !important;
}

body.theme-dark .data-table td,
html.theme-dark .data-table td {
  color: #dbeafe !important;
  background: #10283d !important;
  border-color: #244b70 !important;
}

body.theme-dark .data-table td strong,
html.theme-dark .data-table td strong { color: #edf6ff !important; }
body.theme-dark .data-table td small,
html.theme-dark .data-table td small { color: #9fb5cc !important; }

body.theme-dark .todo-settings-menu,
html.theme-dark .todo-settings-menu {
  color: #edf6ff !important;
  background: #10283d !important;
  border-color: #244b70 !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .42) !important;
}

body.theme-dark .todo-settings-menu button,
html.theme-dark .todo-settings-menu button {
  color: #dbeafe !important;
  background: #0b1e31 !important;
  border-color: #244b70 !important;
}

body.theme-dark .todo-settings-menu button:hover,
html.theme-dark .todo-settings-menu button:hover {
  color: #ffffff !important;
  background: #143657 !important;
  border-color: #5a9cff !important;
}

body.theme-light .todo-settings-menu {
  color: #24364a !important;
  background: rgba(255, 255, 255, .98) !important;
  border-color: #d9e4ef !important;
}

body.theme-light .todo-settings-menu button {
  color: #25384a !important;
  background: #f8fafc !important;
  border-color: #dbe6f0 !important;
}

html.theme-dark .regab-documents-table-wrap,
html.theme-dark .regab-documents-table,
body.theme-dark .regab-documents-table-wrap,
body.theme-dark .regab-documents-table,
body.force-dark .regab-documents-table-wrap,
body.force-dark .regab-documents-table {
  color: #dbeafe !important;
  background: #10283d !important;
  border-color: #244b70 !important;
}
html.theme-dark .regab-documents-table th,
body.theme-dark .regab-documents-table th,
body.force-dark .regab-documents-table th {
  color: #9fb5cc !important;
  background: #0b1e31 !important;
  border-color: #244b70 !important;
}
html.theme-dark .regab-documents-table td,
body.theme-dark .regab-documents-table td,
body.force-dark .regab-documents-table td {
  color: #dbeafe !important;
  background: #10283d !important;
  border-color: #244b70 !important;
}
html.theme-dark .regab-documents-table td strong,
body.theme-dark .regab-documents-table td strong { color: #edf6ff !important; }
html.theme-dark .regab-documents-table td small,
html.theme-dark .regab-documents-head p,
html.theme-dark .regab-documents-hint,
html.theme-dark .regab-documents-meta,
body.theme-dark .regab-documents-table td small,
body.theme-dark .regab-documents-head p,
body.theme-dark .regab-documents-hint,
body.theme-dark .regab-documents-meta { color: #9fb5cc !important; }
html.theme-dark .regab-documents-search,
html.theme-dark .regab-documents-toolbar select,
body.theme-dark .regab-documents-search,
body.theme-dark .regab-documents-toolbar select {
  color: #edf6ff !important;
  background: #071827 !important;
  border-color: #244b70 !important;
}
html.theme-light .regab-documents-table-wrap,
html.theme-light .regab-documents-table,
body.theme-light .regab-documents-table-wrap,
body.theme-light .regab-documents-table {
  color: #24384b !important;
  background: #ffffff !important;
  border-color: #dfe8f1 !important;
}
html.theme-light .regab-documents-table th,
body.theme-light .regab-documents-table th {
  color: #718294 !important;
  background: #f4f7fb !important;
}
html.theme-light .regab-documents-table td,
body.theme-light .regab-documents-table td {
  color: #24384b !important;
  background: #ffffff !important;
}
html.theme-light .regab-documents-table td strong,
body.theme-light .regab-documents-table td strong { color: #172536 !important; }

/* Keep document/PDF canvases and overlay fields paper-white in both themes. */
html.theme-dark .pdf-page-stage,
html[data-theme="dark"] .pdf-page-stage,
body.theme-dark .pdf-page-stage,
body.force-dark .pdf-page-stage,
html.theme-dark .document-fill-stage,
html[data-theme="dark"] .document-fill-stage,
body.theme-dark .document-fill-stage,
body.force-dark .document-fill-stage,
html.theme-dark .document-draft-preview,
html[data-theme="dark"] .document-draft-preview,
body.theme-dark .document-draft-preview,
body.force-dark .document-draft-preview,
html.theme-dark .document-fill-stage img,
html[data-theme="dark"] .document-fill-stage img,
body.theme-dark .document-fill-stage img,
body.force-dark .document-fill-stage img {
  background: #ffffff !important;
  color: #111827 !important;
  color-scheme: light !important;
}

html.theme-dark .document-fill-stage :is(input, textarea, button).document-fill-field,
html[data-theme="dark"] .document-fill-stage :is(input, textarea, button).document-fill-field,
body.theme-dark .document-fill-stage :is(input, textarea, button).document-fill-field,
body.force-dark .document-fill-stage :is(input, textarea, button).document-fill-field,
html.theme-dark .document-fill-field,
html[data-theme="dark"] .document-fill-field,
body.theme-dark .document-fill-field,
body.force-dark .document-fill-field {
  color: #111827 !important;
  -webkit-text-fill-color: #111827;
  caret-color: #111827 !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  border-color: rgba(57, 119, 237, .28) !important;
  box-shadow: none !important;
  color-scheme: light !important;
}

html.theme-dark .document-fill-stage :is(input, textarea).document-fill-field:hover,
html[data-theme="dark"] .document-fill-stage :is(input, textarea).document-fill-field:hover,
body.theme-dark .document-fill-stage :is(input, textarea).document-fill-field:hover,
body.force-dark .document-fill-stage :is(input, textarea).document-fill-field:hover,
html.theme-dark .document-fill-field:hover,
html[data-theme="dark"] .document-fill-field:hover,
body.theme-dark .document-fill-field:hover,
body.force-dark .document-fill-field:hover {
  color: #111827 !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  border-color: rgba(57, 119, 237, .55) !important;
}

html.theme-dark .document-fill-stage :is(input, textarea).document-fill-field:focus,
html[data-theme="dark"] .document-fill-stage :is(input, textarea).document-fill-field:focus,
body.theme-dark .document-fill-stage :is(input, textarea).document-fill-field:focus,
body.force-dark .document-fill-stage :is(input, textarea).document-fill-field:focus,
html.theme-dark .document-fill-field:focus,
html[data-theme="dark"] .document-fill-field:focus,
body.theme-dark .document-fill-field:focus,
body.force-dark .document-fill-field:focus {
  color: #111827 !important;
  -webkit-text-fill-color: #111827;
  background: #ffffff !important;
  background-color: #ffffff !important;
  border-color: #3977ed !important;
  box-shadow: 0 0 0 2px rgba(57, 119, 237, .2) !important;
}

html.theme-dark .document-fill-field.is-empty,
html[data-theme="dark"] .document-fill-field.is-empty,
body.theme-dark .document-fill-field.is-empty,
body.force-dark .document-fill-field.is-empty {
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  background: #ffffff !important;
  background-color: #ffffff !important;
}

html.theme-dark .document-fill-field.is-empty:hover,
html[data-theme="dark"] .document-fill-field.is-empty:hover,
body.theme-dark .document-fill-field.is-empty:hover,
body.force-dark .document-fill-field.is-empty:hover,
html.theme-dark .document-fill-field.is-empty:focus,
html[data-theme="dark"] .document-fill-field.is-empty:focus,
body.theme-dark .document-fill-field.is-empty:focus,
body.force-dark .document-fill-field.is-empty:focus {
  color: #111827 !important;
  -webkit-text-fill-color: #111827;
  background: #ffffff !important;
  background-color: #ffffff !important;
}

html.theme-dark .document-fill-field.is-checkbox,
html[data-theme="dark"] .document-fill-field.is-checkbox,
body.theme-dark .document-fill-field.is-checkbox,
body.force-dark .document-fill-field.is-checkbox {
  color: #0f5132 !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
}

html.theme-dark .document-fill-stage :is(input, textarea).document-fill-field:-webkit-autofill,
html.theme-dark .document-fill-stage :is(input, textarea).document-fill-field:-webkit-autofill:hover,
html.theme-dark .document-fill-stage :is(input, textarea).document-fill-field:-webkit-autofill:focus,
body.theme-dark .document-fill-stage :is(input, textarea).document-fill-field:-webkit-autofill,
body.theme-dark .document-fill-stage :is(input, textarea).document-fill-field:-webkit-autofill:hover,
body.theme-dark .document-fill-stage :is(input, textarea).document-fill-field:-webkit-autofill:focus {
  -webkit-text-fill-color: #111827 !important;
  caret-color: #111827;
  box-shadow: 0 0 0 1000px #ffffff inset !important;
  transition: background-color 99999s ease-out;
}

html.theme-dark body.theme-dark .modal-card.document-create-modal .document-fill-stage input.document-fill-field:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
html.theme-dark body.theme-dark .modal-card.document-create-modal .document-fill-stage textarea.document-fill-field,
html.theme-dark body.force-dark .modal-card.document-create-modal .document-fill-stage input.document-fill-field:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
html.theme-dark body.force-dark .modal-card.document-create-modal .document-fill-stage textarea.document-fill-field {
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  caret-color: #111827 !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  border-color: rgba(57, 119, 237, .28) !important;
  color-scheme: light !important;
}