/* Styles variables for Sobriety Hub Alt */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Outfit:wght@400;500;600;700;800&display=swap');

:root {
  /* Font Families */
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-display: Georgia, "Times New Roman", serif;
  --mobile-browser-bottom: 0px;
  --mobile-nav-height: 4.35rem;

  /* Border Radii */
  --radius-xs: 0.375rem;
  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1.25rem;
  --radius-xl: 2rem;
  --radius-full: 9999px;

  /* Transitions */
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: 150ms var(--ease-in-out);
  --transition-normal: 250ms var(--ease-in-out);
  --transition-slow: 350ms var(--ease-in-out);

  /* Elevation (Shadows) */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.06), 0 2px 4px -1px rgba(0, 0, 0, 0.04);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -2px rgba(0, 0, 0, 0.04);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  --shadow-glow: 0 0 15px rgba(82, 109, 47, 0.15);

  /* Light Theme Colors (Default - Purpose and Prosperity Olive/Sage theme) */
  --brand-h: 84;
  --brand-s: 50%;
  --brand-l: 33%;
  
  /* Brand color (#557e2a - High contrast brand olive green) */
  --color-brand: hsl(var(--brand-h), var(--brand-s), var(--brand-l));
  --color-brand-light: #eaefe0; /* Pale sage background */
  --color-brand-hover: hsl(var(--brand-h), var(--brand-s), 25%);
  --color-brand-glow: rgba(141, 176, 90, 0.2);

  /* Slate & Sage palette */
  --bg-app: #f9f9f5; /* Warm off-white website body background */
  --bg-card: #ffffff; /* White cards for separation */
  --bg-sidebar: #ffffff; /* White landing-page style navigation surface */
  --bg-input: #ffffff;
  --border-color: #d7ddd0; /* Soft sage border */
  --border-hover: #7d886f;

  /* Text colors */
  --text-primary: #1c1917; /* Warm dark brown website text color */
  --text-secondary: #4f7d35; /* Landing-page olive secondary text */
  --text-tertiary: #46503f; /* Muted olive-grey text */
  --text-on-brand: hsl(0, 0%, 100%);

  /* System States */
  --color-success: hsl(142, 70%, 29%);
  --color-success-bg: hsl(142, 70%, 95%);
  --color-warning: hsl(38, 92%, 50%);
  --color-warning-bg: hsl(38, 92%, 96%);
  --color-danger: hsl(350, 89%, 43%);
  --color-danger-bg: hsl(350, 89%, 96%);
  --color-info: hsl(200, 80%, 40%);
  --color-info-bg: hsl(200, 80%, 95%);

  /* Status and stability badge backgrounds */
  --status-active-bg: #eaefe0;
  --status-active-color: #3f6606;
  --status-applicant-bg: hsl(200, 60%, 93%);
  --status-applicant-color: hsl(200, 70%, 20%);
  --status-inactive-bg: hsl(0, 0%, 90%);
  --status-inactive-color: hsl(0, 0%, 30%);
  --status-discharged-bg: hsl(30, 30%, 90%);
  --status-discharged-color: hsl(30, 30%, 30%);

  --stability-stable-bg: #eaefe0;
  --stability-stable-color: #3f6606;
  --stability-support-bg: hsl(38, 80%, 92%);
  --stability-support-color: hsl(38, 90%, 25%);
  --stability-risk-bg: hsl(350, 80%, 92%);
  --stability-risk-color: hsl(350, 80%, 30%);
  --stability-intake-bg: hsl(280, 50%, 94%);
  --stability-intake-color: hsl(280, 60%, 35%);

  /* Scrollbar theme */
  --scrollbar-thumb: #939d85;
  --scrollbar-track: transparent;
  
  /* Glassmorphism options */
  --glass-bg: rgba(255, 255, 255, 0.75);
  --glass-border: rgba(147, 157, 133, 0.4);
  --glass-blur: 16px;

}

/* Dark Theme Colors Override */
[data-theme="dark"] {
  /* Premium Dark Forest-Charcoal Palette */
  --bg-app: #0d120a; /* Deep forest-black */
  --bg-card: #151b11; /* Deep charcoal-green */
  --bg-sidebar: #090c07; /* Extremely dark green-black */
  --bg-input: #1b2216; /* Slightly lighter dark green-gray */
  --border-color: #2b3824; /* Dark sage border */
  --border-hover: #3f5035;

  /* Text colors */
  --text-primary: #f5f7f2; /* Very pale green-white */
  --text-secondary: #a7c47d; /* Sage green */
  --text-tertiary: #6b7a5e; /* Muted dark green-gray */
  
  /* Brand color (Sage Green glow in dark theme) */
  --color-brand: #8db05a; /* Warm olive green */
  --color-brand-light: #1c2617;
  --color-brand-hover: #a7c47d;
  --color-brand-glow: rgba(141, 176, 90, 0.15);
  
  /* System States (Dark adjustments) */
  --color-success: #22c55e;
  --color-success-bg: rgba(34, 197, 94, 0.12);
  --color-warning: #f59e0b;
  --color-warning-bg: rgba(245, 158, 11, 0.12);
  --color-danger: #ef4444;
  --color-danger-bg: rgba(239, 68, 68, 0.12);
  --color-info: #3b82f6;
  --color-info-bg: rgba(59, 130, 246, 0.12);

  /* Statuses */
  --status-active-bg: rgba(141, 176, 90, 0.15);
  --status-active-color: #a7c47d;
  --status-applicant-bg: rgba(59, 130, 246, 0.15);
  --status-applicant-color: #93c5fd;
  --status-inactive-bg: rgba(255, 255, 255, 0.08);
  --status-inactive-color: #d1d5db;
  --status-discharged-bg: rgba(245, 158, 11, 0.15);
  --status-discharged-color: #fde047;

  --stability-stable-bg: rgba(34, 197, 94, 0.15);
  --stability-stable-color: #4ade80;
  --stability-support-bg: rgba(245, 158, 11, 0.15);
  --stability-support-color: #fcd34d;
  --stability-risk-bg: rgba(239, 68, 68, 0.15);
  --stability-risk-color: #fca5a5;
  --stability-intake-bg: rgba(168, 85, 247, 0.15);
  --stability-intake-color: #d8b4fe;

  /* Scrollbar theme */
  --scrollbar-thumb: #2b3824;
  
  /* Glassmorphism options */
  --glass-bg: rgba(21, 27, 17, 0.7);
  --glass-border: rgba(43, 56, 36, 0.4);
  
  --shadow-glow: 0 0 20px rgba(141, 176, 90, 0.1);
}