/*
 SOVEL FIS UI FOUNDATION v1.0
 Canonical dark/light UI and Eco Ink print system.
 No pure black or pure white is used as a canonical UI surface/foreground.
*/

:root {
  color-scheme: light;

  --sovel-rich-black: #0D1B2A;
  --sovel-oxford-blue: #1B263B;
  --sovel-ylnmn-blue: #415A77;
  --sovel-silver-lake-blue: #778DA9;
  --sovel-platinum: #E5E7E6;
  --sovel-riviera-blue: #183451;
  --sovel-terracotta: #A9501C;
  --sovel-soft-ivory: #F3ECDE;
  --sovel-sand-linen: #D4AF83;

  --ui-canvas: #F3ECDE;
  --ui-canvas-fg: #0D1B2A;
  --ui-surface: #F8F3EA;
  --ui-surface-fg: #0D1B2A;
  --ui-panel: #EEE4D4;
  --ui-panel-fg: #0D1B2A;
  --ui-card: #F9F5ED;
  --ui-card-fg: #0D1B2A;
  --ui-muted: #536274;
  --ui-header: #E5E7E6;
  --ui-header-fg: #0D1B2A;
  --ui-navigation: #183451;
  --ui-navigation-fg: #F3ECDE;
  --ui-border: #C8B89F;
  --ui-border-strong: #415A77;
  --ui-divider: #D8CBB8;

  --ui-primary: #A9501C;
  --ui-primary-fg: #F3ECDE;
  --ui-primary-hover: #BE5B22;
  --ui-primary-active: #874016;
  --ui-secondary: #D4AF83;
  --ui-secondary-fg: #0D1B2A;
  --ui-secondary-hover: #DEBC94;
  --ui-secondary-active: #BE9568;
  --ui-structural: #183451;
  --ui-structural-fg: #F3ECDE;

  --ui-input: #FBF8F2;
  --ui-input-fg: #0D1B2A;
  --ui-input-placeholder: #6F7B88;
  --ui-input-border: #B7A68D;
  --ui-focus: #A9501C;

  --ui-table-header: #DFD1BE;
  --ui-table-header-fg: #0D1B2A;
  --ui-table-row: #F8F3EA;
  --ui-table-row-alt: #EFE5D7;
  --ui-table-row-hover: #E8D7C2;
  --ui-table-row-selected: #D4AF83;
  --ui-table-row-selected-fg: #0D1B2A;

  --ui-success: #356859;
  --ui-success-fg: #F1EFE6;
  --ui-warning: #B6791B;
  --ui-warning-fg: #171A1E;
  --ui-danger: #9A3D36;
  --ui-danger-fg: #F5ECE8;
  --ui-info: #415A77;
  --ui-info-fg: #E5E7E6;
  --ui-disabled: #D7D0C5;
  --ui-disabled-fg: #716B64;

  --ui-radius-sm: 8px;
  --ui-radius-md: 12px;
  --ui-radius-lg: 18px;
  --ui-radius-pill: 999px;
  --ui-shadow: 0 14px 40px rgba(13, 27, 42, 0.12);
  --ui-shadow-soft: 0 7px 22px rgba(13, 27, 42, 0.08);
  --ui-transition: 160ms ease;
}

html[data-theme="dark"],
body[data-theme="dark"],
[data-theme="dark"],
body.dark,
.dark {
  color-scheme: dark;
  --ui-canvas: #0D1B2A;
  --ui-canvas-fg: #E5E7E6;
  --ui-surface: #102237;
  --ui-surface-fg: #E5E7E6;
  --ui-panel: #1B263B;
  --ui-panel-fg: #E5E7E6;
  --ui-card: #142A42;
  --ui-card-fg: #E5E7E6;
  --ui-muted: #AEBBC9;
  --ui-header: #0B1B2B;
  --ui-header-fg: #F3ECDE;
  --ui-navigation: #11263D;
  --ui-navigation-fg: #E5E7E6;
  --ui-border: #324D69;
  --ui-border-strong: #415A77;
  --ui-divider: #263E58;
  --ui-primary: #A9501C;
  --ui-primary-fg: #F3ECDE;
  --ui-primary-hover: #C25D24;
  --ui-primary-active: #843E16;
  --ui-secondary: #415A77;
  --ui-secondary-fg: #E5E7E6;
  --ui-secondary-hover: #526E8D;
  --ui-secondary-active: #314C69;
  --ui-structural: #183451;
  --ui-structural-fg: #F3ECDE;
  --ui-input: #21364F;
  --ui-input-fg: #E5E7E6;
  --ui-input-placeholder: #A7B5C3;
  --ui-input-border: #3E5A76;
  --ui-focus: #D17A45;
  --ui-table-header: #253D58;
  --ui-table-header-fg: #E5E7E6;
  --ui-table-row: #142A42;
  --ui-table-row-alt: #11263D;
  --ui-table-row-hover: #1C3855;
  --ui-table-row-selected: #75401F;
  --ui-table-row-selected-fg: #F3ECDE;
  --ui-disabled: #273A4F;
  --ui-disabled-fg: #8394A6;
  --ui-shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
  --ui-shadow-soft: 0 8px 26px rgba(0, 0, 0, 0.20);
}

html, body, #root { min-height: 100%; }
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--ui-canvas) !important;
  color: var(--ui-canvas-fg) !important;
  transition: background-color var(--ui-transition), color var(--ui-transition);
}

/* Broad compatibility overlay for the current compiled SOVEL FIS frontend. */
header, .header, [class*="header"], nav, .navbar, [class*="navbar"] {
  border-color: var(--ui-divider) !important;
}

main, [role="main"], .page, .content, [class*="page"], [class*="content"] {
  color: var(--ui-canvas-fg);
}

.card, [class*="card"], .panel, [class*="panel"] {
  background: var(--ui-card) !important;
  color: var(--ui-card-fg) !important;
  border-color: var(--ui-border) !important;
}

h1, h2, h3, h4, h5, h6, legend, label, th {
  color: var(--ui-canvas-fg);
}

p, small, .muted, [class*="muted"], [class*="subtitle"], [class*="description"] {
  color: var(--ui-muted);
}

input, select, textarea {
  background: var(--ui-input) !important;
  color: var(--ui-input-fg) !important;
  border: 1px solid var(--ui-input-border) !important;
  border-radius: var(--ui-radius-sm);
}
input::placeholder, textarea::placeholder { color: var(--ui-input-placeholder) !important; opacity: 1; }
input:focus, select:focus, textarea:focus {
  outline: none !important;
  border-color: var(--ui-focus) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-focus) 24%, transparent) !important;
}

button, [role="button"], .btn, [class*="button"] {
  border-radius: var(--ui-radius-sm);
  transition: background-color var(--ui-transition), color var(--ui-transition), border-color var(--ui-transition), transform var(--ui-transition);
}
button:hover:not(:disabled), [role="button"]:hover { transform: translateY(-1px); }
button:disabled, [aria-disabled="true"] {
  background: var(--ui-disabled) !important;
  color: var(--ui-disabled-fg) !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
}

/* Navigation: structural blue, active state Terracotta or Sand Linen. */
nav a, nav button, .navbar a, .navbar button, [class*="nav"] a, [class*="nav"] button {
  color: var(--ui-navigation-fg) !important;
}
nav a[aria-current="page"], nav button[aria-current="page"],
nav .active, .navbar .active, [class*="nav"] .active,
[role="tab"][aria-selected="true"] {
  background: var(--ui-primary) !important;
  color: var(--ui-primary-fg) !important;
  border-color: var(--ui-primary) !important;
}

/* Tables */
table { border-collapse: collapse; color: var(--ui-canvas-fg); }
thead, thead tr, th {
  background: var(--ui-table-header) !important;
  color: var(--ui-table-header-fg) !important;
}
tbody tr { background: var(--ui-table-row); }
tbody tr:nth-child(even) { background: var(--ui-table-row-alt); }
tbody tr:hover { background: var(--ui-table-row-hover) !important; }
td, th { border-color: var(--ui-border) !important; }
tr[aria-selected="true"], tr.selected {
  background: var(--ui-table-row-selected) !important;
  color: var(--ui-table-row-selected-fg) !important;
}

/* Explicit utility classes for future source-level integration. */
.sovel-ui-surface { background: var(--ui-surface); color: var(--ui-surface-fg); }
.sovel-ui-panel { background: var(--ui-panel); color: var(--ui-panel-fg); border: 1px solid var(--ui-border); border-radius: var(--ui-radius-lg); box-shadow: var(--ui-shadow-soft); }
.sovel-ui-card { background: var(--ui-card); color: var(--ui-card-fg); border: 1px solid var(--ui-border); border-radius: var(--ui-radius-lg); box-shadow: var(--ui-shadow-soft); }
.sovel-ui-primary { background: var(--ui-primary) !important; color: var(--ui-primary-fg) !important; border-color: var(--ui-primary) !important; }
.sovel-ui-secondary { background: var(--ui-secondary) !important; color: var(--ui-secondary-fg) !important; border-color: var(--ui-secondary) !important; }
.sovel-ui-structural { background: var(--ui-structural) !important; color: var(--ui-structural-fg) !important; }
.sovel-ui-muted { color: var(--ui-muted) !important; }

/* Search result surface: intended for Formula Builder and database search suggestions. */
.sovel-search-results {
  background: var(--ui-card);
  color: var(--ui-card-fg);
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius-md);
  box-shadow: var(--ui-shadow);
  max-height: 360px;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.sovel-search-result {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--ui-divider);
}
.sovel-search-result:last-child { border-bottom: 0; }
.sovel-search-result:hover { background: var(--ui-table-row-hover); }

/* ECO INK PRINT SYSTEM
   Eliminates full-page dark fills, converts colored controls to bordered indicators,
   preserves hierarchy, and uses restrained accent lines instead of ink-heavy blocks. */
@media print {
  @page { margin: 12mm; }
  html, body, #root {
    background: #FAF8F2 !important;
    color: #20252B !important;
    print-color-adjust: economy !important;
    -webkit-print-color-adjust: economy !important;
  }

  header, nav, .navbar, [class*="navbar"],
  .doctor, [class*="doctor"],
  .floating, [class*="floating"],
  button:not(.print-keep), [role="button"]:not(.print-keep),
  .no-print, [data-print="hide"] {
    display: none !important;
  }

  *, *::before, *::after {
    box-shadow: none !important;
    text-shadow: none !important;
  }

  main, section, article, .card, [class*="card"], .panel, [class*="panel"] {
    background: transparent !important;
    color: #20252B !important;
  }

  .card, [class*="card"], .panel, [class*="panel"] {
    border: 0.6pt solid #8C9298 !important;
    border-left: 3pt solid #183451 !important;
    break-inside: avoid;
  }

  h1, h2, h3, h4, h5, h6 {
    color: #183451 !important;
    break-after: avoid;
  }

  a { color: #20252B !important; text-decoration: underline; }
  input, select, textarea {
    background: transparent !important;
    color: #20252B !important;
    border: 0.6pt solid #8C9298 !important;
  }

  table { width: 100% !important; border-collapse: collapse !important; }
  thead, thead tr, th {
    background: transparent !important;
    color: #20252B !important;
    border-bottom: 1.2pt solid #183451 !important;
  }
  tbody tr, tbody tr:nth-child(even), tbody tr:hover {
    background: transparent !important;
  }
  td, th { border: 0.5pt solid #B4B7BA !important; }

  .sovel-ui-primary, .sovel-ui-secondary, .sovel-ui-structural,
  [class*="primary"], [class*="active"], [aria-selected="true"] {
    background: transparent !important;
    color: #20252B !important;
    border: 1pt solid #A9501C !important;
  }

  .print-accent, [data-print-accent="true"] {
    background: transparent !important;
    color: #20252B !important;
    border-left: 3pt solid #A9501C !important;
    padding-left: 8pt !important;
  }

  img, svg, canvas { max-width: 100% !important; page-break-inside: avoid; }
}

/* Optional on-screen preview of Eco Ink mode. */
html[data-print-mode="eco"], body.print-eco {
  --ui-canvas: #FAF8F2;
  --ui-canvas-fg: #20252B;
  --ui-surface: #FAF8F2;
  --ui-surface-fg: #20252B;
  --ui-panel: #FAF8F2;
  --ui-panel-fg: #20252B;
  --ui-card: #FAF8F2;
  --ui-card-fg: #20252B;
  --ui-border: #8C9298;
  --ui-primary: transparent;
  --ui-primary-fg: #20252B;
  --ui-secondary: transparent;
  --ui-secondary-fg: #20252B;
  --ui-shadow: none;
  --ui-shadow-soft: none;
}