/* The desktop app's colour presets (SSD_APP/ssdiff_gui/theme.py, THEME_PRESETS),
   one block per theme, selected by <html data-app-theme="...">. */

:root[data-app-theme="midnight"] {
  --bg-base: #14151f;
  --bg-surface: #1c1d2e;
  --bg-card: #222336;
  --bg-input: #272840;
  --bg-hover: #2f3048;
  --bg-elevated: #2a2b42;
  --border: #353650;
  --border-subtle: #2c2d44;
  --border-focus: #6c9ce6;
  --text-primary: #e4e4f0;
  --text-secondary: #9c9cb4;
  --text-muted: #6e6e88;
  --text-on-accent: #ffffff;
  --accent: #6c9ce6;
  --accent-hover: #5a8ad4;
  --accent-pressed: #4878be;
  --accent-muted: rgba(108,156,230,0.12);
  --success: #5cb85c;
  --success-hover: #4cae4c;
  --success-bg: rgba(92,184,92,0.10);
  --success-border: #3d8b3d;
  --warning: #f0ad4e;
  --warning-hover: #ec971f;
  --warning-bg: rgba(240,173,78,0.10);
  --warning-border: #c49242;
  --error: #e25555;
  --error-hover: #d43f3f;
  --error-bg: rgba(226,85,85,0.10);
  --error-border: #b83a3a;
  --selection: #3d5a8a;
  --disabled-bg: #2a2b3c;
  --disabled-text: #555566;
}

:root[data-app-theme="violet"] {
  --bg-base: #1a0520;
  --bg-surface: #200124;
  --bg-card: #2b0a30;
  --bg-input: #32103a;
  --bg-hover: #3c1a46;
  --bg-elevated: #351440;
  --border: #4a2858;
  --border-subtle: #3a1c48;
  --border-focus: #8f4ce8;
  --text-primary: #e3e3ff;
  --text-secondary: #baa3d4;
  --text-muted: #7e6894;
  --text-on-accent: #ffffff;
  --accent: #8f4ce8;
  --accent-hover: #7c3cd0;
  --accent-pressed: #6a2db8;
  --accent-muted: rgba(143,76,232,0.14);
  --success: #5cb85c;
  --success-hover: #4cae4c;
  --success-bg: rgba(92,184,92,0.10);
  --success-border: #3d8b3d;
  --warning: #f0ad4e;
  --warning-hover: #ec971f;
  --warning-bg: rgba(240,173,78,0.10);
  --warning-border: #c49242;
  --error: #e25555;
  --error-hover: #d43f3f;
  --error-bg: rgba(226,85,85,0.10);
  --error-border: #b83a3a;
  --selection: #4e0b4d;
  --disabled-bg: #2e1836;
  --disabled-text: #5c4668;
}

:root[data-app-theme="emerald"] {
  --bg-base: #0f1714;
  --bg-surface: #141e1a;
  --bg-card: #1a2822;
  --bg-input: #1f2e28;
  --bg-hover: #263830;
  --bg-elevated: #22322c;
  --border: #2e4a3e;
  --border-subtle: #243a32;
  --border-focus: #4ec9a0;
  --text-primary: #e0f0ea;
  --text-secondary: #98b8aa;
  --text-muted: #608878;
  --text-on-accent: #ffffff;
  --accent: #4ec9a0;
  --accent-hover: #3eb88e;
  --accent-pressed: #30a67c;
  --accent-muted: rgba(78,201,160,0.12);
  --success: #5cb85c;
  --success-hover: #4cae4c;
  --success-bg: rgba(92,184,92,0.10);
  --success-border: #3d8b3d;
  --warning: #f0ad4e;
  --warning-hover: #ec971f;
  --warning-bg: rgba(240,173,78,0.10);
  --warning-border: #c49242;
  --error: #e25555;
  --error-hover: #d43f3f;
  --error-bg: rgba(226,85,85,0.10);
  --error-border: #b83a3a;
  --selection: #1e5040;
  --disabled-bg: #1c2c26;
  --disabled-text: #486058;
}

:root[data-app-theme="rose"] {
  --bg-base: #181115;
  --bg-surface: #1e171c;
  --bg-card: #281e26;
  --bg-input: #30242e;
  --bg-hover: #3a2c38;
  --bg-elevated: #322834;
  --border: #4e3a4a;
  --border-subtle: #3e2e3c;
  --border-focus: #e06c8a;
  --text-primary: #f0e4ec;
  --text-secondary: #bca4b4;
  --text-muted: #887080;
  --text-on-accent: #ffffff;
  --accent: #e06c8a;
  --accent-hover: #d05878;
  --accent-pressed: #c04668;
  --accent-muted: rgba(224,108,138,0.12);
  --success: #5cb85c;
  --success-hover: #4cae4c;
  --success-bg: rgba(92,184,92,0.10);
  --success-border: #3d8b3d;
  --warning: #f0ad4e;
  --warning-hover: #ec971f;
  --warning-bg: rgba(240,173,78,0.10);
  --warning-border: #c49242;
  --error: #e25555;
  --error-hover: #d43f3f;
  --error-bg: rgba(226,85,85,0.10);
  --error-border: #b83a3a;
  --selection: #5a2840;
  --disabled-bg: #2c2028;
  --disabled-text: #665060;
}

:root[data-app-theme="amber"] {
  --bg-base: #16130e;
  --bg-surface: #1e1a14;
  --bg-card: #28221a;
  --bg-input: #302a20;
  --bg-hover: #3a3228;
  --bg-elevated: #332c24;
  --border: #4e4434;
  --border-subtle: #3e3628;
  --border-focus: #e0a050;
  --text-primary: #f0ece4;
  --text-secondary: #bcb4a0;
  --text-muted: #887e6c;
  --text-on-accent: #1a1408;
  --accent: #e0a050;
  --accent-hover: #d09040;
  --accent-pressed: #c08030;
  --accent-muted: rgba(224,160,80,0.12);
  --success: #5cb85c;
  --success-hover: #4cae4c;
  --success-bg: rgba(92,184,92,0.10);
  --success-border: #3d8b3d;
  --warning: #f0ad4e;
  --warning-hover: #ec971f;
  --warning-bg: rgba(240,173,78,0.10);
  --warning-border: #c49242;
  --error: #e25555;
  --error-hover: #d43f3f;
  --error-bg: rgba(226,85,85,0.10);
  --error-border: #b83a3a;
  --selection: #5a4020;
  --disabled-bg: #2c2820;
  --disabled-text: #665c4c;
}

:root[data-app-theme="slate"] {
  --bg-base: #161819;
  --bg-surface: #1c1f21;
  --bg-card: #232729;
  --bg-input: #292d30;
  --bg-hover: #303538;
  --bg-elevated: #2c3033;
  --border: #424a4e;
  --border-subtle: #363c40;
  --border-focus: #8899aa;
  --text-primary: #e4e8ec;
  --text-secondary: #98a4b0;
  --text-muted: #687480;
  --text-on-accent: #ffffff;
  --accent: #8899aa;
  --accent-hover: #788898;
  --accent-pressed: #687888;
  --accent-muted: rgba(136,153,170,0.12);
  --success: #5cb85c;
  --success-hover: #4cae4c;
  --success-bg: rgba(92,184,92,0.10);
  --success-border: #3d8b3d;
  --warning: #f0ad4e;
  --warning-hover: #ec971f;
  --warning-bg: rgba(240,173,78,0.10);
  --warning-border: #c49242;
  --error: #e25555;
  --error-hover: #d43f3f;
  --error-bg: rgba(226,85,85,0.10);
  --error-border: #b83a3a;
  --selection: #3a4854;
  --disabled-bg: #282c2e;
  --disabled-text: #505860;
}

:root, :root[data-app-theme="crisp"] {
  --bg-base: #F0F0F0;
  --bg-surface: #E8E8E8;
  --bg-card: #FFFFFF;
  --bg-input: #FFFFFF;
  --bg-hover: #E0E0E0;
  --bg-elevated: #ECECEC;
  --border: #C0C0C0;
  --border-subtle: #D4D4D4;
  --border-focus: #163060;
  --text-primary: #0A0A0A;
  --text-secondary: #3A3A3A;
  --text-muted: #686868;
  --text-on-accent: #FFFFFF;
  --accent: #163060;
  --accent-hover: #0E2248;
  --accent-pressed: #081830;
  --accent-muted: rgba(22,48,96,0.10);
  --success: #1A5C2A;
  --success-hover: #144A22;
  --success-bg: rgba(26,92,42,0.10);
  --success-border: #144A22;
  --warning: #7A5800;
  --warning-hover: #624600;
  --warning-bg: rgba(122,88,0,0.10);
  --warning-border: #624600;
  --error: #8C2020;
  --error-hover: #701818;
  --error-bg: rgba(140,32,32,0.10);
  --error-border: #701818;
  --selection: #B8CCE8;
  --disabled-bg: #E0E0E0;
  --disabled-text: #A0A0A0;
}

:root[data-app-theme="warm"] {
  --bg-base: #EEEBE4;
  --bg-surface: #E6E2DA;
  --bg-card: #F4F1EC;
  --bg-input: #FDFAF6;
  --bg-hover: #DED9D0;
  --bg-elevated: #EAE6DF;
  --border: #C4BAB0;
  --border-subtle: #D4CEC6;
  --border-focus: #1A2E52;
  --text-primary: #141010;
  --text-secondary: #3A3230;
  --text-muted: #6A6260;
  --text-on-accent: #FFFFFF;
  --accent: #1A2E52;
  --accent-hover: #142444;
  --accent-pressed: #0E1A34;
  --accent-muted: rgba(26,46,82,0.10);
  --success: #1E5230;
  --success-hover: #184228;
  --success-bg: rgba(30,82,48,0.10);
  --success-border: #184228;
  --warning: #7A5000;
  --warning-hover: #603E00;
  --warning-bg: rgba(122,80,0,0.10);
  --warning-border: #603E00;
  --error: #882020;
  --error-hover: #6C1818;
  --error-bg: rgba(136,32,32,0.10);
  --error-border: #6C1818;
  --selection: #B8C8DC;
  --disabled-bg: #E2DED6;
  --disabled-text: #ACA89E;
}

:root {
  --font-family: "Segoe UI", "SF Pro Display", "Helvetica Neue", Arial, sans-serif, system-ui, sans-serif;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;
}

/* Font sizes: _FONT_SCALE in theme.py, base size -> sm, md, lg, xl, xxl, hero. */
:root[data-font-size="12"] {
  --font-size-base: 12px;
  --font-size-sm: 10px;
  --font-size-md: 13px;
  --font-size-lg: 15px;
  --font-size-xl: 18px;
  --font-size-xxl: 22px;
  --font-size-hero: 38px;
}

:root[data-font-size="13"] {
  --font-size-base: 13px;
  --font-size-sm: 11px;
  --font-size-md: 14px;
  --font-size-lg: 16px;
  --font-size-xl: 20px;
  --font-size-xxl: 24px;
  --font-size-hero: 42px;
}

:root, :root[data-font-size="15"] {
  --font-size-base: 15px;
  --font-size-sm: 12px;
  --font-size-md: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 22px;
  --font-size-xxl: 27px;
  --font-size-hero: 46px;
}

:root[data-font-size="17"] {
  --font-size-base: 17px;
  --font-size-sm: 14px;
  --font-size-md: 18px;
  --font-size-lg: 20px;
  --font-size-xl: 25px;
  --font-size-xxl: 30px;
  --font-size-hero: 50px;
}