/*
 * ALS Project Viewer — Theme System
 * 4 themes matching Ableton Live 11's built-in skins.
 *
 * CDN custom theme format per https://daisyui.com/docs/themes/
 * Uses --color-base-100, --color-primary, etc.
 */

/* ── Mid Dark (Ableton 11 default) ── */
:root:has(input.theme-controller[value=mid-dark]:checked),
[data-theme="mid-dark"] {
  color-scheme: dark;
  --color-base-100: #424242;
  --color-base-200: #333333;
  --color-base-300: #222222;
  --color-base-content: #F5F5F5;
  --color-primary: #FF764D;
  --color-primary-content: #000000;
  --color-secondary: #5A5A5A;
  --color-secondary-content: #FFFFFF;
  --color-accent: #FF764D;
  --color-accent-content: #000000;
  --color-neutral: #333333;
  --color-neutral-content: #F5F5F5;
  --color-info: #3ABFF8;
  --color-info-content: #002B3D;
  --color-success: #36D399;
  --color-success-content: #003320;
  --color-warning: #FBBD23;
  --color-warning-content: #382800;
  --color-error: #F87272;
  --color-error-content: #470000;
  --radius-selector: 0;
  --radius-field: 0;
  --radius-box: 0;
  --depth: 0;
  --noise: 0;
}

/* ── Dark ── */
:root:has(input.theme-controller[value=dark]:checked),
[data-theme="dark"] {
  color-scheme: dark;
  --color-base-100: #202020;
  --color-base-200: #141414;
  --color-base-300: #0A0A0A;
  --color-base-content: #FFFFFF;
  --color-primary: #FF764D;
  --color-primary-content: #000000;
  --color-secondary: #2D2D2D;
  --color-secondary-content: #E0E0E0;
  --color-accent: #FF764D;
  --color-accent-content: #000000;
  --color-neutral: #141414;
  --color-neutral-content: #FFFFFF;
  --color-info: #3ABFF8;
  --color-info-content: #002B3D;
  --color-success: #36D399;
  --color-success-content: #003320;
  --color-warning: #FBBD23;
  --color-warning-content: #382800;
  --color-error: #F87272;
  --color-error-content: #470000;
  --radius-selector: 0;
  --radius-field: 0;
  --radius-box: 0;
  --depth: 0;
  --noise: 0;
}

/* ── Mid Light ── */
:root:has(input.theme-controller[value=mid-light]:checked),
[data-theme="mid-light"] {
  color-scheme: light;
  --color-base-100: #D0D0D0;
  --color-base-200: #B8B8B8;
  --color-base-300: #9E9E9E;
  --color-base-content: #121212;
  --color-primary: #FF764D;
  --color-primary-content: #FFFFFF;
  --color-secondary: #A3A3A3;
  --color-secondary-content: #121212;
  --color-accent: #FF764D;
  --color-accent-content: #FFFFFF;
  --color-neutral: #B8B8B8;
  --color-neutral-content: #121212;
  --color-info: #2563EB;
  --color-info-content: #ffffff;
  --color-success: #16A34A;
  --color-success-content: #ffffff;
  --color-warning: #CA8A04;
  --color-warning-content: #ffffff;
  --color-error: #DC2626;
  --color-error-content: #ffffff;
  --radius-selector: 0;
  --radius-field: 0;
  --radius-box: 0;
  --depth: 0;
  --noise: 0;
}

/* ── Light ── */
:root:has(input.theme-controller[value=light]:checked),
[data-theme="light"] {
  color-scheme: light;
  --color-base-100: #F4F4F4;
  --color-base-200: #E0E0E0;
  --color-base-300: #CCCCCC;
  --color-base-content: #000000;
  --color-primary: #FF764D;
  --color-primary-content: #FFFFFF;
  --color-secondary: #D4D4D4;
  --color-secondary-content: #000000;
  --color-accent: #FF764D;
  --color-accent-content: #FFFFFF;
  --color-neutral: #E0E0E0;
  --color-neutral-content: #000000;
  --color-info: #2563EB;
  --color-info-content: #ffffff;
  --color-success: #16A34A;
  --color-success-content: #ffffff;
  --color-warning: #CA8A04;
  --color-warning-content: #ffffff;
  --color-error: #DC2626;
  --color-error-content: #ffffff;
  --radius-selector: 0;
  --radius-field: 0;
  --radius-box: 0;
  --depth: 0;
  --noise: 0;
}


/* ── Global Overrides ── */

body {
  font-size: 13px;
  line-height: 1.4;
}

.card, .btn, .input, .select, .tab, .badge, .alert, .collapse {
  box-shadow: none !important;
}

/* ── Interactive Elements ── */
.btn:hover {
  filter: brightness(1.1);
}
.btn:active {
  filter: brightness(0.9);
}
.select:focus, .input:focus {
  border-color: var(--color-primary);
  outline: 1px solid var(--color-primary);
  outline-offset: -1px;
}

/* ── Ableton Track Color Swatches ── */

:root {
  --track-color-1: #F95C48;
  --track-color-2: #95D13C;
  --track-color-3: #00D3FA;
  --track-color-4: #A66BFF;
  --track-color-5: #FA8C16;
  --track-color-6: #10C49B;
  --track-color-7: #E856D3;
  --track-color-8: #E0DA2A;
  --track-color-9: #FF4A67;
  --track-color-10: #3B9AFA;
}


/* ── Scrollbar ── */

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--color-base-200, #474747); }
::-webkit-scrollbar-thumb { background: var(--color-base-300, #3E3E3E); }
::-webkit-scrollbar-thumb:hover { background: var(--color-base-content, #E0E0E0); }