/* ============================================================
   AutoTasker – Theme tokens (Green / Amber / Paper / Arctic)
   Re-declares the same variable names style.css already uses,
   so pages switch palettes without structural changes.
   ============================================================ */

:root, [data-theme="green"] {
  --bg:           #0D1210;
  --bg-card:      #142019;
  --bg-elevated:  #142019;
  --bg-hover:     rgba(143,227,136,0.08);
  --border:       #344B3B;
  --border-light: #26382C;
  --text:         #E5EEE6;
  --text-muted:   #A8B9AB;
  --text-dim:     #6F8273;
  --primary:      #8FE388;
  --primary-d:    #6FC268;
  --primary-dim:  rgba(143,227,136,0.14);
  --accent:       #344B3B;
  --success:      #8FE388;
  --success-dim:  rgba(143,227,136,0.12);
  --danger:       #E08B7B;
  --danger-dim:   rgba(224,139,123,0.12);
  --warning:      #E3C77B;
  --warning-dim:  rgba(227,199,123,0.12);
  --info:         #8FC9E3;
  --info-dim:     rgba(143,201,227,0.12);
  --on-accent:    #0D1210;
  --radius: 0; --radius-lg: 0; --radius-xl: 0;
  --shadow: none;
  --font-mono: Consolas, "Courier New", "Malgun Gothic", monospace;
}

[data-theme="amber"] {
  --bg:           #17130E;
  --bg-card:      #211B13;
  --bg-elevated:  #211B13;
  --bg-hover:     rgba(242,188,99,0.08);
  --border:       #4A3D28;
  --border-light: #362C1D;
  --text:         #F4E9D8;
  --text-muted:   #C5B397;
  --text-dim:     #8A7C63;
  --primary:      #F2BC63;
  --primary-d:    #D9A24B;
  --primary-dim:  rgba(242,188,99,0.14);
  --accent:       #4A3D28;
  --success:      #A9C97E;
  --success-dim:  rgba(169,201,126,0.12);
  --danger:       #E08B7B;
  --danger-dim:   rgba(224,139,123,0.12);
  --warning:      #F2BC63;
  --warning-dim:  rgba(242,188,99,0.12);
  --info:         #8FC9E3;
  --info-dim:     rgba(143,201,227,0.12);
  --on-accent:    #17130E;
}

[data-theme="paper"] {
  --bg:           #F3F1E9;
  --bg-card:      #FCFBF6;
  --bg-elevated:  #FCFBF6;
  --bg-hover:     rgba(35,75,196,0.06);
  --border:       #C9C6B8;
  --border-light: #DBD8CB;
  --text:         #202B36;
  --text-muted:   #566372;
  --text-dim:     #7A8493;
  --primary:      #234BC4;
  --primary-d:    #1B3B9C;
  --primary-dim:  rgba(35,75,196,0.10);
  --accent:       #C9C6B8;
  --success:      #2E7D4F;
  --success-dim:  rgba(46,125,79,0.10);
  --danger:       #B3382C;
  --danger-dim:   rgba(179,56,44,0.10);
  --warning:      #9A6B10;
  --warning-dim:  rgba(154,107,16,0.10);
  --info:         #1E6E9E;
  --info-dim:     rgba(30,110,158,0.10);
  --on-accent:    #FCFBF6;
}

[data-theme="arctic"] {
  --bg:           #0D1724;
  --bg-card:      #152335;
  --bg-elevated:  #152335;
  --bg-hover:     rgba(104,217,234,0.08);
  --border:       #2C4258;
  --border-light: #20303F;
  --text:         #ECF3FA;
  --text-muted:   #A8B9CF;
  --text-dim:     #6E8095;
  --primary:      #68D9EA;
  --primary-d:    #4CBBD0;
  --primary-dim:  rgba(104,217,234,0.14);
  --accent:       #2C4258;
  --success:      #8FE388;
  --success-dim:  rgba(143,227,136,0.12);
  --danger:       #E08B7B;
  --danger-dim:   rgba(224,139,123,0.12);
  --warning:      #E3C77B;
  --warning-dim:  rgba(227,199,123,0.12);
  --info:         #68D9EA;
  --info-dim:     rgba(104,217,234,0.12);
  --on-accent:    #0D1724;
}

/* Theme-aware overrides for legacy style.css decorations */
[data-theme] .sidebar { background: var(--bg); }
[data-theme] .sidebar-brand-mark { background: var(--primary); color: var(--on-accent); }
[data-theme] .login-page { background: var(--bg); }
[data-theme] .auth-story::after { display: none; }
[data-theme] .mono { font-family: var(--font-mono); }

/* Theme switch (settings) */
.theme-switch { display: flex; gap: 8px; flex-wrap: wrap; }
.theme-switch button {
  padding: 8px 14px;
  background: var(--bg-card);
  color: var(--text-muted);
  border: 1px solid var(--border);
  cursor: pointer;
  font-size: 0.85rem;
}
.theme-switch button:hover { color: var(--text); border-color: var(--primary); }
.theme-switch button.active {
  background: var(--primary);
  color: var(--on-accent);
  border-color: var(--primary);
  font-weight: 700;
}