/* CSS Custom Properties for Theming */
:root {
  /* --- Semantic Color Roles --- */
  --water-color: #3b82f6; /* Tailwind blue-500 */
  /* Primary (Blue) */
  --color-primary-base: #3a86ff;
  --color-primary-light: #a9c9ff;
  --color-primary-dark: #0052cc;

  /* Success (Green) */
  --color-success-base: #10b981;
  --color-success-light: #d1fae5;
  --color-success-dark: #059669;

  /* Warning (Orange) */
  --color-warning-base: #f59e0b;
  --color-warning-light: #ffedd5;
  --color-warning-dark: #d97706;

  /* Accent (Purple) */
  --color-accent-purple-base: #8b5cf6;
  --color-accent-purple-light: #d6cff6;
  --color-accent-purple-dark: #7c3aed;

  /* Accent (Lime) */
  --color-accent-lime-base: #bfff00;
  --color-accent-lime-light: #f0ffc2;
  --color-accent-lime-dark: #8ccf00;

  /* Neutral (Grey & Surfaces) */
  --color-text-muted: #6c757d;
  --color-text-muted-dark: #495057;
  --color-surface-subtle: #f8f9fa;
  --color-border-default: #ced4da;
  --color-surface-track: #e9ecef;
  --color-surface-icon-bg: #e9ecef; /* Lighter grey for icon backgrounds */

  /* Standardized body/text colors */
  --color-bg-body: #e0e7ff;
  --color-text-primary: #0b132b;
  --color-text-dark-static: #0b132b; /* A static dark color that doesn't change in dark mode */
}

/* --- Dark Mode Styles --- */
html.dark-mode {
  /* Primary (Blue) */
  --color-primary-light: #2c3b5e; /* Darker blue for backgrounds */
  --color-primary-dark: #a9c9ff; /* Lighter blue for highlights/text */

  /* Success (Green) */
  --color-success-light: #047857; /* Darker green for backgrounds */
  --color-success-dark: #6ee7b7; /* Lighter green for highlights/text */

  /* Warning (Orange) */
  --color-warning-light: #9a3412; /* Darker orange for backgrounds */
  --color-warning-dark: #fdba74; /* Lighter orange for highlights/text */

  /* Accent (Purple) */
  --color-accent-purple-base: #a78bfa; /* Lighter purple for better contrast */
  --color-accent-purple-light: #5b21b6; /* Darker purple for backgrounds */
  --color-accent-purple-dark: #d6cff6; /* Lighter purple for highlights/text */

  /* Accent (Lime) */
  --color-accent-lime-base: #a3e635; /* Slightly toned down for dark bg */
  --color-accent-lime-light: #4d7c0f; /* Darker lime for backgrounds */
  --color-accent-lime-dark: #d9f99d; /* Lighter lime for highlights/text */

  /* Neutral (Grey & Surfaces) */
  --color-bg-body: #0b132b;
  --color-text-primary: #f8f9fa;
  --color-surface-subtle: #1a202c;
  --color-text-muted: #adb5bd;
  --color-border-default: #495057;
  --color-surface-track: #495057;
  --color-surface-icon-bg: #2d3748;
}