/* ============================================
   R.I.T.H.M - CSS Custom Properties
   Green & light tan palette. Dark mode default.
   ============================================ */

:root {
  color-scheme: dark;

  /* Brand colors — green & tan */
  --primary: #4a9e6f;
  --primary-dark: #3d8b5f;
  --primary-light: #6bb38a;
  --secondary: #d4c5a0;
  --accent: #d4c5a0;
  --success: #5aad7a;
  --warning: #d4a854;
  --danger: #e56b6f;

  /* Dark theme (default) */
  --bg-primary: #1a1d1b;
  --bg-secondary: #222524;
  --bg-card: #282c2a;
  --text-primary: #ededef;
  --text-secondary: #a0a6a2;
  --text-muted: #747a76;
  --border-color: #3a3e3b;
  --bg-navbar: #1a1d1b;
  --input-bg: #2e322f;
  --input-border: #3a3e3b;
  --shadow-dropdown: 0 8px 24px rgba(0, 0, 0, 0.4);
  --alert-error-text: #f0a0a2;
  --alert-success-text: #5aad7a;

  /* Extended palette */
  --secondary-light: #e0d5b8;
  --accent-dark: #b8a880;
  --warning-dark: #b89040;
  --success-dark: #3d8b5f;
  --danger-dark: #c85a5e;
  --olive: #8a9a6a;
  --olive-dark: #6e7e52;

  /* Surface tints */
  --surface-primary: rgba(74, 158, 111, 0.08);
  --surface-success: rgba(90, 173, 122, 0.12);
  --surface-danger: rgba(229, 107, 111, 0.08);
  --surface-warning: rgba(212, 168, 84, 0.12);

  /* Legacy compat */
  --dark: #1a1d1b;
  --dark-lighter: #222524;
  --light: #ededef;
  --gray: #747a76;
}

/* Light Mode overrides */
[data-theme="light"] {
  color-scheme: light;

  --bg-primary: #f8f6f0;
  --bg-secondary: #f0ede4;
  --bg-card: #ffffff;
  --text-primary: #1a1d1b;
  --text-secondary: #5a5e5b;
  --text-muted: #8a8e8b;
  --border-color: #d8d5cc;
  --bg-navbar: #f8f6f0;
  --input-bg: #f0ede4;
  --input-border: #ccc9c0;
  --shadow-dropdown: 0 8px 24px rgba(0, 0, 0, 0.08);
  --alert-error-text: #c85a5e;
  --alert-success-text: #3d8b5f;

  --surface-primary: rgba(74, 158, 111, 0.06);
  --surface-success: rgba(90, 173, 122, 0.08);
  --surface-danger: rgba(229, 107, 111, 0.06);
  --surface-warning: rgba(212, 168, 84, 0.08);
}