/* ========================================
   CHDS THEME - LIGHT MODE
   Official CHDS Brand Colors: Navy #002B58 + Yellow #FED402
   ======================================== */

/* CHDS Theme Color Variables and Base Styles */
[data-theme*="chds"] {
  /* Official CHDS Colors */
  --color-primary-50: #e6eef5;
  --color-primary-100: #ccdce9;
  --color-primary-200: #99b9d3;
  --color-primary-300: #6696bd;
  --color-primary-400: #3373a7;
  --color-primary-500: #00508f;
  --color-primary-600: #002B58;   /* CHDS Navy - PRIMARY */
  --color-primary-700: #001d3b;
  --color-primary-800: #00152a;
  --color-primary-900: #000d1a;

  --color-accent-100: #fef9c3;    /* Light yellow background */
  --color-accent-500: #FED402;    /* CHDS Yellow - MAIN ACCENT */
  --color-accent-600: #FCB900;    /* CHDS Gold - borders/dividers */
  --color-interactive: #0268BB;   /* CHDS Blue - for links/buttons */
  --color-gold: #FCB900;          /* CHDS Gold - borders/dividers */

  /* Success colors */
  --color-success-50: #f0fdf4;    /* Very light green background */
  --color-success-100: #dcfce7;   /* Light green background */
  --color-success-200: #bbf7d0;   /* Light green border */
  --color-success-600: #16a34a;   /* Green icon */
  --color-success-700: #15803d;   /* Dark green text */
  --color-success-800: #166534;   /* Darker green text */

  /* Warning colors */
  --color-warning-100: #fef3c7;   /* Light amber background */
  --color-warning-600: #d97706;   /* Amber icon */

  /* Danger/Error colors */
  --color-danger-50: #fef2f2;     /* Very light red background */
  --color-danger-100: #fee2e2;    /* Light red background */
  --color-danger-200: #fecaca;    /* Light red border */
  --color-danger-600: #dc2626;    /* Red icon */
  --color-danger-800: #991b1b;    /* Dark red text */

  /* Info colors */
  --color-info-50: #eff6ff;       /* Very light blue background */
  --color-info-200: #bfdbfe;      /* Light blue border */
  --color-info-600: #2563eb;      /* Blue icon */
  --color-info-800: #1e40af;      /* Dark blue text */

  /* Text colors - additional */
  --color-text-muted: #6b7280;    /* Muted text (gray-500) */
  --color-link: #0268BB;          /* Link color (CHDS blue) */

  /* Callout background/border/text colors (for help page) */
  --color-success-bg: #dcfce7;    /* Light green background */
  --color-success-border: #bbf7d0; /* Light green border */
  --color-success-text: #166534;  /* Dark green text */
  --color-warning-bg: #fef3c7;    /* Light amber background */
  --color-warning-border: #fde68a; /* Light amber border */
  --color-warning-text: #854d0e;  /* Dark amber text */
  --color-info-bg: #eff6ff;       /* Light blue background */
  --color-info-border: #bfdbfe;   /* Light blue border */
  --color-info-text: #1e40af;     /* Dark blue text */
  --color-danger-bg: #fee2e2;     /* Light red background */
  --color-danger-border: #fecaca; /* Light red border */
  --color-danger-text: #991b1b;   /* Dark red text */

  /* CHDS Custom Grays (from style guide) */
  --color-gray-50: #F7F7F7;
  --color-gray-100: #E5E5E5;
  --color-gray-200: #CCCCCC;
  --color-gray-300: #B3B3B3;
  --color-gray-400: #999999;
  --color-gray-500: #808080;
  --color-gray-600: #666666;
  --color-gray-700: #4D4D4D;
  --color-gray-800: #333333;
  --color-gray-900: #2A2A2A;

  /* Semantic Colors - CHDS Theme */
  --color-surface: #ffffff;
  --color-surface-secondary: #F7F7F7;
  --color-surface-tertiary: #E5E5E5;
  --color-border: #CCCCCC;
  --color-text-primary: #2A2A2A;
  --color-text-secondary: #666666;
  --color-text-tertiary: #999999;
  --color-text-inverse: #ffffff;

  /* Typography - CHDS uses Navy for headings/labels */
  --color-heading: var(--color-primary-600);
  --color-label: var(--color-primary-600);

  /* CHDS Typography Specifications */
  --font-sans: 'Open Sans', Helvetica, Arial, sans-serif;
  --font-serif: 'Minion Pro', 'Source Serif Pro', Georgia, serif;
  --font-display: 'Trajan Pro', 'Minion Pro', serif;
  --line-height-base: 1.96;
  --line-height-heading: 1.3;

  /* CHDS Spacing - Sharp corners */
  --radius-base: 0;
  --radius-lg: 0;

  /* CHDS Shadows - Subtle */
  --shadow-base: 0 3px 6px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 6px 12px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 12px 24px rgba(0, 0, 0, 0.12);
}

/* CHDS-specific style overrides */
[data-theme*="chds"] body {
  line-height: 1.96;
  font-family: var(--font-sans);
}

/* CHDS Typography - Headings use Minion Pro */
[data-theme*="chds"] h1,
[data-theme*="chds"] h2,
[data-theme*="chds"] h3,
[data-theme*="chds"] h4,
[data-theme*="chds"] h5,
[data-theme*="chds"] h6 {
  font-family: var(--font-serif);
  color: var(--color-primary-600);
}

/* CHDS Navbar Brand - Uses Trajan Pro (display font) */
[data-theme*="chds"] .navbar-brand {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: 0.05em;
}

/* Sharp corners except for rounded-full */
[data-theme*="chds"] .rounded,
[data-theme*="chds"] .rounded-sm,
[data-theme*="chds"] .rounded-md,
[data-theme*="chds"] .rounded-lg,
[data-theme*="chds"] .rounded-xl {
  border-radius: 0 !important;
}

/* Keep rounded-full for avatars/icons */
[data-theme*="chds"] .rounded-full {
  border-radius: 9999px !important;
}

/* CHDS Form Styling */
[data-theme*="chds"] button,
[data-theme*="chds"] .btn,
[data-theme*="chds"] input[type="submit"] {
  text-transform: uppercase;
  font-weight: 400;
  letter-spacing: 0.025em;
  border-radius: 0 !important;
  cursor: pointer;
}

/* Exception: Navigation buttons should not be uppercase */
[data-theme*="chds"] aside[id="drawer-navigation"] button {
  text-transform: none !important;
}

/* Exception: Release notes accordion should not be uppercase */
[data-theme*="chds"] #release-notes-accordion button {
  text-transform: none !important;
}

[data-theme*="chds"] h1,
[data-theme*="chds"] h2,
[data-theme*="chds"] h3,
[data-theme*="chds"] h4,
[data-theme*="chds"] h5,
[data-theme*="chds"] h6 {
  font-family: var(--font-serif);
  color: var(--color-primary-600);
  line-height: var(--line-height-heading);
}

/* ========================================
   SIDEBAR NAVIGATION STYLES - LIGHT MODE
   ======================================== */

/* Sidebar container - CHDS theme uses navy background */
[data-theme*="chds"] aside[id="drawer-navigation"] {
  background-color: var(--color-primary-600) !important;
  border-right-color: var(--color-primary-700) !important;
}

[data-theme*="chds"] aside[id="drawer-navigation"] > div {
  background-color: var(--color-primary-600) !important;
}

/* Sidebar links - default state */
[data-theme*="chds"] aside[id="drawer-navigation"] a,
[data-theme*="chds"] aside[id="drawer-navigation"] button {
  color: #ffffff !important;
  transition: all 0.2s ease;
}

/* Sidebar links - hover state with CHDS yellow */
[data-theme*="chds"] aside[id="drawer-navigation"] a:hover,
[data-theme*="chds"] aside[id="drawer-navigation"] button:hover {
  background-color: rgba(254, 212, 2, 0.15) !important; /* CHDS Yellow with transparency */
  border-left: 4px solid var(--color-accent-500) !important; /* Yellow left border */
  padding-left: calc(0.5rem - 4px) !important; /* Compensate for border */
}

/* Sidebar links - active/selected state */
[data-theme*="chds"] aside[id="drawer-navigation"] a.active,
[data-theme*="chds"] aside[id="drawer-navigation"] a[aria-current="page"] {
  background-color: rgba(254, 212, 2, 0.25) !important; /* Brighter yellow for active */
  border-left: 4px solid var(--color-accent-500) !important; /* Yellow left border */
  padding-left: calc(0.5rem - 4px) !important;
  font-weight: 600 !important;
}

/* Sidebar icons - keep visible */
[data-theme*="chds"] aside[id="drawer-navigation"] i {
  color: rgba(255, 255, 255, 0.8) !important;
}

[data-theme*="chds"] aside[id="drawer-navigation"] a:hover i,
[data-theme*="chds"] aside[id="drawer-navigation"] a.active i {
  color: var(--color-accent-500) !important; /* Yellow icons on hover/active */
}

/* Sidebar section dividers */
[data-theme*="chds"] aside[id="drawer-navigation"] .border-t {
  border-color: var(--color-primary-700) !important;
}

/* Admin dropdown section */
[data-theme*="chds"] aside[id="drawer-navigation"] button[aria-controls="dropdown-admin"] {
  color: #ffffff !important;
}

[data-theme*="chds"] aside[id="drawer-navigation"] #dropdown-admin a {
  padding-left: 2.75rem !important; /* Indent nested items */
}

/* ========================================
   CHDS SHARP CORNER OVERRIDES
   ======================================== */

/* CHDS Theme - Sharp corners on dropdowns */
[data-theme*="chds"] [data-dropdown-menu] {
  border-radius: 0 !important;
}

/* CHDS Theme - Sharp corners on modals */
[data-theme*="chds"] [data-modal] {
  border-radius: 0 !important;
}

/* CHDS Theme - Sharp corners on datepicker */
[data-theme*="chds"] .datepicker {
  border-radius: 0 !important;
}

[data-theme*="chds"] .datepicker .datepicker-cell {
  border-radius: 0 !important;
}

/* CHDS Theme - Sharp corners on tooltips */
[data-theme*="chds"] [data-tooltip] {
  border-radius: 0 !important;
}

/* CHDS Theme - Sharp corners on accordion */
[data-theme*="chds"] [data-accordion-target] {
  border-radius: 0 !important;
}

/* CHDS Theme - Sharp corners on toasts */
[data-theme*="chds"] [data-toast] {
  border-radius: 0 !important;
}
