/* ===============================================================
   FaAz / Dental clinic: shared high-contrast dark mode, 2026-10-29.
   Loaded after style.css, responsive-uiux.css and clinic-theme.css.
   Applies ONLY to html[data-theme="dark"]. No layout or database changes.
   Colors chosen for readable text, subtle controls and distinct statuses.
   =============================================================== */
html[data-theme="dark"] {
  color-scheme: dark;
  --clinic-contrast-page: #101a29;
  --clinic-contrast-panel: #1b2b3f;
  --clinic-contrast-raised: #25394e;
  --clinic-contrast-soft: #213449;
  --clinic-contrast-line: #41566b;
  --clinic-contrast-ink: #f1f6fc;
  --clinic-contrast-muted: #c1d1e1;
  --clinic-contrast-link: #a0e1ff;
  --clinic-contrast-focus: #83d6ff;
  --bs-body-bg: #101a29;
  --bs-body-color: #f1f6fc;
  --bs-secondary-color: #c1d1e1;
  --bs-tertiary-color: #b9c9d9;
  --bs-secondary-bg: #1b2b3f;
  --bs-tertiary-bg: #23384d;
  --bs-emphasis-color: #ffffff;
  --bs-border-color: #41566b;
  --bs-link-color: #a0e1ff;
  --bs-link-hover-color: #d5efff;
  --bs-form-control-bg: #1b2b3f;
  --case-ink: #f1f6fc;
  --case-muted: #c1d1e1;
  --case-line: #41566b;
  --case-soft: #213449;
}
/* Root surfaces: public site, authentication pages and both dashboards. */
html[data-theme="dark"] body,
html[data-theme="dark"] body[data-notification-role="admin"],
html[data-theme="dark"] body[data-notification-role="patient"],
html[data-theme="dark"] :is(main,.dashboard-layout,.dashboard-content,.settings-page,.clinic-auth-page,.auth-section,.soft-section,.hero-section) {
  color: var(--clinic-contrast-ink) !important;
  background-color: var(--clinic-contrast-page) !important;
}
html[data-theme="dark"] :is(.bg-light,.bg-white,.bg-body,.bg-body-tertiary,.bg-body-secondary) {
  background-color: var(--clinic-contrast-panel) !important;
  color: var(--clinic-contrast-ink) !important;
}
/* Surfaces, not accent panels: keep the original colored KPI/brand blocks. */
html[data-theme="dark"] :is(
  .service-card,.feature-card,.page-card,.dashboard-card,.registration-card,
  .auth-box,.auth-form,.clinic-unified-auth-card,.hero-visual,
  .settings-card,.settings-tabs,.settings-panel,.tab-panel,
  .mini-stat,.security-item,.logo-box,.notice:not(.success):not(.error),
  .card:not([style*="linear-gradient"]):not(.bg-primary):not(.bg-success):not(.bg-danger):not(.bg-info):not(.bg-warning),
  .list-group-item,.dropdown-menu,.accordion-item,.modal-content,.offcanvas,
  .popover,.toast,.page-card,.table-responsive
) {
  background-color: var(--clinic-contrast-panel) !important;
  color: var(--clinic-contrast-ink) !important;
  border-color: var(--clinic-contrast-line) !important;
}
html[data-theme="dark"] :is(.card-body,.accordion-body,.modal-body,.modal-footer,.offcanvas-body,.dropdown-header) {
  color: var(--clinic-contrast-ink);
}
html[data-theme="dark"] :is(.card-header,.card-footer,.accordion-header,.accordion-button,.modal-footer,.modal-header) {
  background-color: var(--clinic-contrast-raised) !important;
  color: var(--clinic-contrast-ink) !important;
  border-color: var(--clinic-contrast-line) !important;
}
html[data-theme="dark"] :is(.modal-body,.modal-footer,.accordion-body,.settings-grid,.settings-input,.settings-select) {
  background-color: var(--clinic-contrast-panel) !important;
  color: var(--clinic-contrast-ink) !important;
}
/* Named components with hardcoded light backgrounds in their own PHP <style>. */
html[data-theme="dark"] :is(
  .patient-cases-page .surface-card,.patient-cases-page .patient-card,
  .patient-cases-page .patient-card-header,.patient-cases-page .total-chip,
  .patient-cases-page .case-info-box,.patient-cases-page .case-note,
  .patient-cases-page .appointment-item,
  .emergency-page .emergency-hero,.emergency-page .emergency-help-card,
  .emergency-page .emergency-bulk-tools,.emergency-page .emergency-records-card,
  .emergency-page .emergency-help-card,.emergency-page .emergency-item,
  .emergency-page .emergency-action-menu,
  .settings-tabs,.settings-card,.settings-input,.settings-select,
  .mini-stat,.security-item,.settings-button.outline
) {
  background: var(--clinic-contrast-panel) !important;
  color: var(--clinic-contrast-ink) !important;
  border-color: var(--clinic-contrast-line) !important;
}
html[data-theme="dark"] :is(.patient-cases-page .patient-card-header,.emergency-page .emergency-hero) {
  background: linear-gradient(125deg, #25394e, #192b3e) !important;
}
html[data-theme="dark"] .patient-cases-page .case-note,
html[data-theme="dark"] .patient-cases-page .case-info-box,
html[data-theme="dark"] .patient-cases-page .appointment-item,
html[data-theme="dark"] .emergency-page .emergency-help-card li,
html[data-theme="dark"] .emergency-page .emergency-guidance-pill {
  background: var(--clinic-contrast-soft) !important;
  border-color: var(--clinic-contrast-line) !important;
}
/* Typical text and labels should follow foreground, not their light-theme hex values. */
html[data-theme="dark"] :is(
  .section-heading,.section-heading p,.service-card p,.feature-card p,.page-card p,
  .dashboard-card p,.hero-visual p,.duration,.section-heading>span,
  .form-label,label,legend,.form-text,.form-check-label,.input-group-text,
  .settings-title h1,.settings-card h3,.settings-field label,
  .mini-stat strong,.mini-stat span,.security-item strong,
  .patient-cases-page .case-total,.patient-cases-page .case-total strong,
  .patient-cases-page .case-note,.patient-cases-page .total-chip,
  .patient-cases-page .filter-card .form-label,
  .emergency-page .emergency-case-type,.emergency-page .emergency-date-main,
  .emergency-page .emergency-description,.emergency-page .emergency-records-card thead th,
  .emergency-page .emergency-modal-x
) { color: var(--clinic-contrast-ink) !important; }
html[data-theme="dark"] :is(
  .text-muted,.text-secondary,.text-body-secondary,.text-black-50,
  .section-heading p,.service-card p,.feature-card p,.page-card p,.dashboard-card p,
  .small.text-muted,.settings-field label,.mini-stat span,
  .patient-cases-page .stat-label,.patient-cases-page .patient-meta,
  .patient-cases-page .page-subtitle,.patient-cases-page .case-date,
  .patient-cases-page .case-info-label,.patient-cases-page .appointment-detail,
  .patient-cases-page .empty-state,.patient-cases-page .case-total,
  .emergency-page .emergency-meta,.emergency-page .emergency-time,
  .emergency-page .emergency-help-card li
) { color: var(--clinic-contrast-muted) !important; opacity: 1; }
html[data-theme="dark"] :is(.text-dark,.text-body,[style*="color: #1d3440"],[style*="color:#1d3440"]) {
  color: var(--clinic-contrast-ink) !important;
}
/* Link visibility; do not recolor buttons or semantic-colored badges. */
html[data-theme="dark"] :is(main,.dashboard-content,.modal-body,.offcanvas-body) a:not(.btn):not(.badge):not(.nav-link):not(.social-circle):not(.text-white):not(.text-danger):not(.text-warning):not(.text-success) {
  color: var(--clinic-contrast-link);
}
html[data-theme="dark"] :is(.dropdown-item,.list-group-item-action,.page-link,.breadcrumb-item a) {
  color: var(--clinic-contrast-ink) !important;
}
html[data-theme="dark"] :is(.dropdown-item,.list-group-item-action,.page-link):hover,
html[data-theme="dark"] .dropdown-item:focus {
  background-color: #33516a !important;
  color: #fff !important;
}
html[data-theme="dark"] :is(.border,.border-top,.border-bottom,.border-start,.border-end,.border-light) {
  border-color: var(--clinic-contrast-line) !important;
}
/* Inputs: readable typed values, placeholders, selects, disabled and autofill. */
html[data-theme="dark"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="range"]),textarea,select,.form-control,.form-select,.settings-input,.settings-select,.input-group-text) {
  background-color: #18283a !important;
  color: #f2f7fc !important;
  border-color: #546b80 !important;
  caret-color: #f2f7fc;
}
html[data-theme="dark"] :is(input,textarea,select,.form-control,.form-select,.settings-input,.settings-select)::placeholder {
  color: #afc3d4 !important;
  opacity: 1;
}
html[data-theme="dark"] select option {
  color: #f2f7fc !important;
  background-color: #18283a !important;
}
html[data-theme="dark"] :is(input,textarea,select,.form-control,.form-select,.settings-input,.settings-select):focus-visible {
  border-color: var(--clinic-contrast-focus) !important;
  box-shadow: 0 0 0 .2rem rgba(131,214,255,.25) !important;
  outline-offset: 2px;
}
html[data-theme="dark"] :is(input,textarea,select,.form-control,.form-select):disabled,
html[data-theme="dark"] :is(.form-control,.form-select)[readonly] {
  background-color: #304254 !important;
  color: #d3e0ec !important;
  opacity: 1;
}
html[data-theme="dark"] input:-webkit-autofill,
html[data-theme="dark"] input:-webkit-autofill:hover,
html[data-theme="dark"] input:-webkit-autofill:focus {
  -webkit-text-fill-color: #f2f7fc !important;
  -webkit-box-shadow: 0 0 0 1000px #18283a inset !important;
}
html[data-theme="dark"] :is(.form-check-input,.form-check-input:checked) {
  border-color: #8bb4c9 !important;
}
/* Dark table theme, including sticky columns, hover and rows in dashboards. */
html[data-theme="dark"] :is(.table,.dashboard-content .table,.financial-table,.schedule-summary-table,.emergency-table) {
  --bs-table-color: #eef5fb;
  --bs-table-bg: #1b2b3f;
  --bs-table-striped-color: #eef5fb;
  --bs-table-striped-bg: #22384c;
  --bs-table-hover-color: #fff;
  --bs-table-hover-bg: #2c4860;
  --bs-table-border-color: #41566b;
  color: #eef5fb !important;
  border-color: #41566b !important;
  background-color: #1b2b3f !important;
}
html[data-theme="dark"] :is(.table,.dashboard-content .table,.financial-table,.schedule-summary-table,.emergency-table) :is(th,td) {
  color: #eef5fb !important;
  border-color: #41566b !important;
  background-color: #1b2b3f !important;
  box-shadow: none;
}
html[data-theme="dark"] .dashboard-content .table thead th,
html[data-theme="dark"] :is(.table,.schedule-summary-table,.emergency-table) thead th {
  background-color: #263c51 !important;
  color: #f2f7fc !important;
}
html[data-theme="dark"] :is(.table,.dashboard-content .table) tbody tr:hover :is(td,th),
html[data-theme="dark"] :is(.table,.dashboard-content .table) tbody tr.table-active :is(td,th) {
  background-color: #2b455b !important;
}
html[data-theme="dark"] .schedule-summary-table :is(td:first-child,th:first-child) {
  background: #263c51 !important;
  color: #eef5fb !important;
}
html[data-theme="dark"] .emergency-appointment-row > td {
  background-color: #3c2939 !important;
}
/* Notification, status and help panels. */
html[data-theme="dark"] .alert {
  border-color: var(--clinic-contrast-line);
  color: var(--clinic-contrast-ink);
}
html[data-theme="dark"] :is(.alert-info,.alert-primary) {
  background-color: #153a53 !important;
  color: #e1f5ff !important;
  border-color: #3a86ae !important;
}
html[data-theme="dark"] :is(.alert-warning,.alert-light) {
  background-color: #443719 !important;
  color: #ffedc0 !important;
  border-color: #8e7340 !important;
}
html[data-theme="dark"] .alert-success,
html[data-theme="dark"] .notice.success {
  background-color: #163e35 !important;
  color: #d2ffeb !important;
  border-color: #36806d !important;
}
html[data-theme="dark"] .alert-danger,
html[data-theme="dark"] .notice.error {
  background-color: #512830 !important;
  color: #ffe4e9 !important;
  border-color: #a35666 !important;
}
html[data-theme="dark"] :is(.alert,.notice) :is(p,strong,span,small,h1,h2,h3,h4,h5,h6) {
  color: inherit !important;
}
/* Buttons and semantic backgrounds: preserve contrast rather than making all ink white. */
html[data-theme="dark"] :is(.btn-primary,.btn-success,.btn-danger,.btn-dark,.bg-primary,.bg-success,.bg-danger,.bg-dark,.text-bg-primary,.text-bg-success,.text-bg-danger,.text-bg-dark) {
  color: #fff !important;
}
html[data-theme="dark"] :is(.bg-primary,.bg-success,.bg-danger,.bg-dark,.text-bg-primary,.text-bg-success,.text-bg-danger,.text-bg-dark) :is(h1,h2,h3,h4,h5,h6,p,small,span,div,li,strong) {
  color: #fff !important;
}
html[data-theme="dark"] :is(.bg-info,.bg-warning,.text-bg-info,.text-bg-warning,.badge.bg-info,.badge.bg-warning,.btn-info,.btn-warning,.btn-light) {
  color: #102331 !important;
}
html[data-theme="dark"] :is(.bg-info,.bg-warning,.text-bg-info,.text-bg-warning) :is(h1,h2,h3,h4,h5,h6,p,small,span,div,strong) {
  color: #102331 !important;
}
html[data-theme="dark"] .badge.bg-info.text-dark,
html[data-theme="dark"] .clinic-language-hero .badge.bg-info.text-dark {color:#092737!important;}
html[data-theme="dark"] :is(.btn-outline-primary,.btn-outline-info) {
  color: #a4e2ff !important;
  border-color: #77bddc !important;
}
html[data-theme="dark"] :is(.btn-outline-danger,.text-danger,.emergency-link) {color:#ff9ea7 !important;}
html[data-theme="dark"] .clinic-language-hero a.btn.btn-outline-danger {color:#fff!important;}
html[data-theme="dark"] :is(.btn-outline-success,.text-success) {color:#82dfb4 !important;}
html[data-theme="dark"] :is(.btn-outline-warning,.text-warning) {color:#ffd88b !important;}
html[data-theme="dark"] :is(.btn-outline-primary,.btn-outline-info,.btn-outline-danger,.btn-outline-success,.btn-outline-warning):hover,
html[data-theme="dark"] :is(.btn-outline-primary,.btn-outline-info,.btn-outline-danger,.btn-outline-success,.btn-outline-warning):focus-visible {
  color: #081e2d !important;
}
html[data-theme="dark"] :is(.btn,.badge,.nav-link,.dropdown-item) :is(i,svg) {color:inherit;}
/* Special case: the public header and doctor dashboard are already dark. */
html[data-theme="dark"] .main-header :is(.nav-link,.navbar-brand strong) { color: #eef5fb !important; }
html[data-theme="dark"] .main-header .nav-link.active {color:#a7e3ff!important;}
html[data-theme="dark"] .main-header .nav-link.text-danger {color:#ff9ea7!important;}
html[data-theme="dark"] .clinic-preferences .clinic-pref-button {color:#fff!important;}
html[data-theme="dark"] .sidebar :is(a,strong,h1,h2,h3,h4,h5,h6) {color:#e9f1f8;}
html[data-theme="dark"] .sidebar .sidebar-heading small {color:#c2d4e0!important;}
/* Page-specific inline styles: overridden after their embedded <style> declarations. */
html[data-theme="dark"] .settings-tab {color:#d9eaf8!important;}
html[data-theme="dark"] .settings-tab.active {background:#31536b!important;color:#fff!important;}
html[data-theme="dark"] .settings-button.primary {color:#fff!important;}
html[data-theme="dark"] .settings-button.outline {background:#23384d!important;color:#b5e7ff!important;}
html[data-theme="dark"] .settings-title h1,
html[data-theme="dark"] .settings-card h3,
html[data-theme="dark"] .mini-stat strong {color:#f1f6fc!important;}
html[data-theme="dark"] .patient-cases-page .patient-card-header,
html[data-theme="dark"] .patient-cases-page .patient-card {border-color:#41566b!important;}
html[data-theme="dark"] .patient-cases-page .patient-avatar {color:#b7e9ff!important;}
html[data-theme="dark"] :is(.emergency-page .emergency-case-type,.emergency-page .emergency-date-main,.emergency-page .emergency-description,.emergency-page .emergency-modal-x) {color:#f1f6fc!important;}
html[data-theme="dark"] :is(#newEmergencyModal,#editEmergencyModal,#emergencyDetailsModal) :is(.modal-header,.modal-footer) {
  background-color:#25394e!important;border-color:#41566b!important;
}
html[data-theme="dark"] .emergency-page .emergency-help-card li {color:#d3e3f0!important;}
html[data-theme="dark"] .emergency-page .emergency-records-card thead th {background:#263c51!important;color:#eef5fb!important;}
html[data-theme="dark"] .emergency-page .emergency-action-menu,
html[data-theme="dark"] body > .emergency-floating-menu,
html[data-theme="dark"] body > .consultation-floating-menu {
  background:#1b2b3f!important;color:#edf4fb!important;border-color:#41566b!important;
}
html[data-theme="dark"] .password-visibility-toggle {color:#c2d3e2!important;}
html[data-theme="dark"] .password-visibility-toggle:hover {background:#2b485e!important;color:#fff!important;}
/* Ensure hero text remains readable across photo and light/dark; no change to image sizing. */
@media (min-width:768px) {
  html[data-theme="dark"] .clinic-language-hero .clinic-hero-content :is(h1,h2,h3,p) {color:#fff!important;}
}
html[data-theme="dark"] .clinic-language-hero .badge.bg-info.text-dark,
html[data-theme="dark"] .clinic-language-hero .badge.bg-info.text-dark i {color:#092737!important;}
/* Print always uses dark text on white paper even if user selected dark mode. */
@media print {
  html[data-theme="dark"] :is(body,main,.dashboard-content,.card,.table,.table td,.table th,.page-card) {
    color:#111827!important;background:#fff!important;
  }
}
/* Bootstrap utility colors: blue-on-navy is not sufficiently readable. */
html[data-theme="dark"] :is(.text-primary,.link-primary,.text-primary-emphasis) {
  color: #a0e1ff !important;
}
html[data-theme="dark"] :is(.bg-primary-subtle,.bg-info-subtle,.bg-success-subtle,.bg-warning-subtle,.bg-danger-subtle,.bg-secondary-subtle) {
  background-color: #233a51 !important;
}
html[data-theme="dark"] :is(.text-bg-light,.text-bg-white) {
  background-color: #25394e !important;
  color: #eef6fb !important;
}
html[data-theme="dark"] :is(.bg-info,.bg-warning,.text-bg-info,.text-bg-warning) .text-primary {
  color: #102331 !important;
}
html[data-theme="dark"] input[type="file"]::file-selector-button {
  background-color: #31536b;
  color: #f1f6fc;
  border-color: #546b80;
}
html[data-theme="dark"] input[type="file"]:hover::file-selector-button {
  background-color: #406681;
  color: #ffffff;
}