/* Theme Variables — LP2 Design Direction */
:root {
  /* === Core tokens === */
  --bg-page: #f5f4f2;
  --bg-card: #ffffff;
  --bg-card-hover: #fafafa;

  --text-heading: #1D1D23;
  --text-body: #6b7280;
  --text-muted: #8b8d98;

  --border-subtle: #DADADA;

  --accent-primary: #FC5D1F;
  --accent-secondary: #e8521a;

  --shadow-sm: 0 1px 3px rgba(0,0,0,0.04);
  --shadow-md: 0 8px 30px rgba(0,0,0,0.08);
  --shadow-lg: 0 4px 16px rgba(0,0,0,0.12);

  --btn-bg: #1a1a1a;
  --btn-text: #ffffff;
  --btn-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 4px 16px rgba(0,0,0,0.08);
  --btn-shadow-hover: 0 2px 8px rgba(0,0,0,0.15), 0 8px 32px rgba(0,0,0,0.12);

  --input-bg: rgba(0, 0, 0, 0.03);
  --input-border: rgba(0, 0, 0, 0.1);
  --input-focus: rgba(252, 93, 31, 0.3);

  /* === Legacy aliases (used across 40+ files) === */
  --bg-primary: #f5f4f2;
  --bg-secondary: #fafafa;
  --bg-tertiary: #e8e8e8;
  --text-primary: #1D1D23;
  --text-secondary: #4b5563;
  --text-tertiary: #8b8d98;
  --border-primary: #DADADA;
  --border-secondary: rgba(0, 0, 0, 0.12);
  --accent-hover: rgba(252, 93, 31, 0.1);
  --shadow-primary: rgba(0, 0, 0, 0.08);
  --shadow-secondary: rgba(0, 0, 0, 0.04);
}

[data-theme="dark"] {
  /* === Core tokens === */
  --bg-page: #141415;
  --bg-card: #1e1e20;
  --bg-card-hover: #252528;

  --text-heading: #f0f0f2;
  --text-body: #9ca3af;
  --text-muted: #6b7280;

  --border-subtle: rgba(255, 255, 255, 0.08);

  --shadow-sm: 0 1px 3px rgba(0,0,0,0.2);
  --shadow-md: 0 8px 30px rgba(0,0,0,0.3);
  --shadow-lg: 0 4px 16px rgba(0,0,0,0.4);

  --btn-bg: #ffffff;
  --btn-text: #1c2024;
  --btn-shadow: 0 1px 3px rgba(0,0,0,0.3), 0 4px 16px rgba(0,0,0,0.2);
  --btn-shadow-hover: 0 2px 8px rgba(255,255,255,0.1), 0 8px 32px rgba(0,0,0,0.3);

  --input-bg: rgba(255, 255, 255, 0.05);
  --input-border: rgba(255, 255, 255, 0.1);
  --input-focus: rgba(252, 93, 31, 0.5);

  /* === Legacy aliases === */
  --bg-primary: #141415;
  --bg-secondary: #1e1e20;
  --bg-tertiary: #252528;
  --bg-card: #1e1e20;
  --text-primary: #f0f0f2;
  --text-secondary: #9ca3af;
  --text-tertiary: #6b7280;
  --border-primary: rgba(255, 255, 255, 0.08);
  --border-secondary: rgba(255, 255, 255, 0.15);
  --accent-hover: rgba(252, 93, 31, 0.15);
  --shadow-primary: rgba(0, 0, 0, 0.3);
  --shadow-secondary: rgba(0, 0, 0, 0.2);
}

/* Also support [data-theme="light"] explicitly */
[data-theme="light"] {
  --bg-page: #f5f4f2;
  --bg-card: #ffffff;
  --bg-card-hover: #fafafa;
  --text-heading: #1D1D23;
  --text-body: #6b7280;
  --text-muted: #8b8d98;
  --border-subtle: #DADADA;
  --accent-primary: #FC5D1F;
  --accent-secondary: #e8521a;
  --bg-primary: #f5f4f2;
  --bg-secondary: #fafafa;
  --bg-tertiary: #e8e8e8;
  --text-primary: #1D1D23;
  --text-secondary: #4b5563;
  --text-tertiary: #8b8d98;
  --border-primary: #DADADA;
  --border-secondary: rgba(0, 0, 0, 0.12);
  --accent-hover: rgba(252, 93, 31, 0.1);
  --shadow-primary: rgba(0, 0, 0, 0.08);
  --shadow-secondary: rgba(0, 0, 0, 0.04);
}

/* Smooth transitions only when manually switching theme (not on page load) */
.theme-switching * {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease !important;
}
