/* =====================================================================
   Home-OS · Theme-System (gemeinsam für alle Module)
   Jede Person wählt ihr Design im Profil ("Ich"). Es wird in der Datenbank
   gespeichert (users.theme) und als <html data-theme="..."> gesetzt.
   Spätere Module binden diese Datei ein und nutzen nur die Variablen unten.
   Themes: ghibli-valley (Standard) · neo-tokyo · lofi-cafe · shadow-dojo
   ===================================================================== */

/* 1 · Ghibli Valley (Standard) – Wiesen-Grün, Himmelblau, warmes Cremeweiß */
:root, [data-theme="ghibli-valley"] {
  color-scheme: light;
  --color-canvas: #FBFAF5;
  --color-surface: #FFFFFF;
  --color-soft: #F3F0E6;
  --color-text: #243D32;
  --color-text-muted: #535B55;
  --color-primary: #2F5B4B;
  --color-primary-hover: #244A3C;
  --color-on-primary: #FFFFFF;
  --color-secondary: #E6F0E5;
  --color-secondary-hover: #D9E8D7;
  --color-secondary-border: #B9CDB6;
  --color-meadow-600: #477A5D;
  --color-link: #245B78;
  --color-focus: #245B78;
  --color-sky-200: #CDE7F3;
  --color-wood-200: #E6D1B8;
  --color-wood-700: #79553B;
  --color-sun-200: #F6D987;
  --color-sun-700: #805500;
  --color-reward-bg: #FBF0CC;
  --color-border: #D8D8CC;
  --color-danger: #A63F37;
  --color-danger-hover: #8E342D;
  --color-on-danger: #FFFFFF;
  --color-danger-bg: #FBE7E3;
  --color-success: #245B3A;
  --color-success-bg: #E2F2E4;
  --color-info-bg: #E9F4FA;
  --color-input-bg: #FFFFFF;
  --color-input-border: #8E9488;
  --color-glass: rgba(255, 255, 255, .85);
  --color-pending-bg: #FFFBEF;
  --color-pending-border: #EBD9A6;
  --radius-control: 12px;
  --radius-button: 14px;
  --radius-card: 1.25rem;
  --radius-panel: 1.5rem;
  --shadow-soft: 0 4px 16px rgba(36, 61, 50, .08);
  --shadow-lift: 0 8px 24px rgba(36, 61, 50, .12);
  --font-display: "Nunito", "Trebuchet MS", sans-serif;
  --font-body: "Atkinson Hyperlegible", Arial, sans-serif;
  --display-weight: 800;
  --heading-glow: none;
  /* Landschaft */
  --bg-top: #CDE7F3;
  --bg-mid: #E4F1F6;
  --sun-glow: radial-gradient(circle, #FFF4CF 0%, #F6D987 45%, rgba(246, 217, 135, 0) 70%);
  --cloud: #FFFFFF;
  --cloud-opacity: .9;
  --hill-far: #CFE3C8;
  --hill-mid: #A9C9A0;
  --hill-near: #7FA889;
  --hill-blur: 0px;
  --tree-trunk: #79553B;
  --tree-crown: #5F8F6A;
  --house-roof: #B5574E;
  --house-wall: #F3F0E6;
  --house-light: #F6D987;
  --seed: #FFFFFF;
  --seed-glow: rgba(246, 217, 135, .8);
  --theme-color: #CDE7F3;
}

/* 2 · Neo Tokyo – Dark-Mode mit Neon-Cyan und Magenta (für Jugendliche) */
[data-theme="neo-tokyo"] {
  color-scheme: dark;
  --color-canvas: #0B0E17;
  --color-surface: #131A2A;
  --color-soft: #1A2236;
  --color-text: #E8F1FF;
  --color-text-muted: #A9B4CF;
  --color-primary: #00E5FF;
  --color-primary-hover: #66F0FF;
  --color-on-primary: #00141A;
  --color-secondary: #1D2943;
  --color-secondary-hover: #26365A;
  --color-secondary-border: #3A5A92;
  --color-meadow-600: #00E5FF;
  --color-link: #5CE1FF;
  --color-focus: #FF4FB8;
  --color-sky-200: #10324A;
  --color-wood-200: #3A1438;
  --color-wood-700: #FF6AD0;
  --color-sun-200: #33300E;
  --color-sun-700: #FFE45C;
  --color-reward-bg: #2B2A10;
  --color-border: #2A3757;
  --color-danger: #FF7A93;
  --color-danger-hover: #FF9EB0;
  --color-on-danger: #1A0008;
  --color-danger-bg: #3A1020;
  --color-success: #5CFFB0;
  --color-success-bg: #0E3326;
  --color-info-bg: #0E2436;
  --color-input-bg: #0E1320;
  --color-input-border: #4A5F8C;
  --color-glass: rgba(19, 26, 42, .88);
  --color-pending-bg: #221F0E;
  --color-pending-border: #6B5E1A;
  --radius-control: 8px;
  --radius-button: 10px;
  --radius-card: 12px;
  --radius-panel: 16px;
  --shadow-soft: 0 0 0 1px rgba(0, 229, 255, .12), 0 6px 22px rgba(0, 0, 0, .45);
  --shadow-lift: 0 0 24px rgba(255, 62, 165, .25), 0 10px 30px rgba(0, 0, 0, .55);
  --font-display: "Nunito", "Trebuchet MS", sans-serif;
  --font-body: "Atkinson Hyperlegible", Arial, sans-serif;
  --display-weight: 800;
  --heading-glow: 0 0 14px rgba(0, 229, 255, .55), 0 0 2px rgba(255, 79, 184, .6);
  --bg-top: #07080F;
  --bg-mid: #1A0F33;
  --sun-glow: radial-gradient(circle, rgba(255, 79, 184, .95) 0%, rgba(255, 62, 165, .45) 40%, rgba(255, 62, 165, 0) 70%);
  --cloud: #00E5FF;
  --cloud-opacity: .10;
  --hill-far: #1C1745;
  --hill-mid: #141133;
  --hill-near: #0C0B1E;
  --hill-blur: 0px;
  --tree-trunk: #2B2160;
  --tree-crown: #241C55;
  --house-roof: #FF3EA5;
  --house-wall: #1A1440;
  --house-light: #00E5FF;
  --seed: #00E5FF;
  --seed-glow: rgba(255, 62, 165, .9);
  --theme-color: #07080F;
}

/* 3 · Lofi Cafe – dezent, Kaffee- und Herbsttöne, dünne klare Schrift (Erwachsene) */
[data-theme="lofi-cafe"] {
  color-scheme: light;
  --color-canvas: #F7F1EA;
  --color-surface: #FFFCF8;
  --color-soft: #F1E8DD;
  --color-text: #3B2A20;
  --color-text-muted: #6B5547;
  --color-primary: #6F4E37;
  --color-primary-hover: #5A3E2B;
  --color-on-primary: #FFFFFF;
  --color-secondary: #EFE4D6;
  --color-secondary-hover: #E6D6C2;
  --color-secondary-border: #CDB79E;
  --color-meadow-600: #8A6A4F;
  --color-link: #7A4528;
  --color-focus: #7A4528;
  --color-sky-200: #E7DED3;
  --color-wood-200: #EBD5C0;
  --color-wood-700: #7A4528;
  --color-sun-200: #F3DFC6;
  --color-sun-700: #85541A;
  --color-reward-bg: #F5E8D5;
  --color-border: #E1D3C3;
  --color-danger: #A4442F;
  --color-danger-hover: #873624;
  --color-on-danger: #FFFFFF;
  --color-danger-bg: #F8E3DC;
  --color-success: #3F5E3A;
  --color-success-bg: #E7EEDF;
  --color-info-bg: #F4EBE0;
  --color-input-bg: #FFFCF8;
  --color-input-border: #A8907A;
  --color-glass: rgba(255, 252, 248, .9);
  --color-pending-bg: #FBF4EA;
  --color-pending-border: #E2CBA8;
  --radius-control: 8px;
  --radius-button: 8px;
  --radius-card: 10px;
  --radius-panel: 14px;
  --shadow-soft: 0 1px 3px rgba(59, 42, 32, .06), 0 6px 18px rgba(59, 42, 32, .05);
  --shadow-lift: 0 10px 30px rgba(59, 42, 32, .10);
  --font-display: "Helvetica Neue", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-body: "Helvetica Neue", "Segoe UI", system-ui, -apple-system, sans-serif;
  --display-weight: 300;
  --heading-glow: none;
  --bg-top: #EADCCB;
  --bg-mid: #F2E8DC;
  --sun-glow: radial-gradient(circle, #FFF3E2 0%, #F2D2B0 45%, rgba(242, 210, 176, 0) 70%);
  --cloud: #FFF8F0;
  --cloud-opacity: .8;
  --hill-far: #E6CFB2;
  --hill-mid: #D4A373;
  --hill-near: #B5835A;
  --hill-blur: 0px;
  --tree-trunk: #6F4E37;
  --tree-crown: #C46A3A;
  --house-roof: #8A5A44;
  --house-wall: #F7F1EA;
  --house-light: #F2C98A;
  --seed: #FFF3E2;
  --seed-glow: rgba(196, 106, 58, .5);
  --theme-color: #EADCCB;
}

/* 4 · Shadow Dojo – Dark Fantasy, Tuschmalerei, tiefes Violett und Rot */
[data-theme="shadow-dojo"] {
  color-scheme: dark;
  --color-canvas: #120C16;
  --color-surface: #1C1420;
  --color-soft: #261B2C;
  --color-text: #F2E8EF;
  --color-text-muted: #C0B0BE;
  --color-primary: #7B2FA0;
  --color-primary-hover: #8F3DB8;
  --color-on-primary: #FFFFFF;
  --color-secondary: #2B1E34;
  --color-secondary-hover: #362744;
  --color-secondary-border: #5A3C6E;
  --color-meadow-600: #D3A6EB;
  --color-link: #DDB2F5;
  --color-focus: #FF8A80;
  --color-sky-200: #2E2042;
  --color-wood-200: #3D181D;
  --color-wood-700: #FF8F85;
  --color-sun-200: #3A2A12;
  --color-sun-700: #F2C66D;
  --color-reward-bg: #2E2210;
  --color-border: #3D2D48;
  --color-danger: #FF8A80;
  --color-danger-hover: #FFA79F;
  --color-on-danger: #1A0606;
  --color-danger-bg: #3A1418;
  --color-success: #8FE3B0;
  --color-success-bg: #13301F;
  --color-info-bg: #1F1631;
  --color-input-bg: #160F1A;
  --color-input-border: #6E5280;
  --color-glass: rgba(28, 20, 32, .9);
  --color-pending-bg: #24180F;
  --color-pending-border: #6B4A1F;
  --radius-control: 6px;
  --radius-button: 6px;
  --radius-card: 10px;
  --radius-panel: 12px;
  --shadow-soft: 0 6px 22px rgba(0, 0, 0, .5);
  --shadow-lift: 0 0 30px rgba(192, 57, 43, .25), 0 12px 32px rgba(0, 0, 0, .6);
  --font-display: "Nunito", "Trebuchet MS", sans-serif;
  --font-body: "Atkinson Hyperlegible", Arial, sans-serif;
  --display-weight: 800;
  --heading-glow: 0 2px 12px rgba(192, 57, 43, .45);
  --bg-top: #0B070E;
  --bg-mid: #2A0E1C;
  --sun-glow: radial-gradient(circle, #E04A3A 0%, rgba(192, 57, 43, .55) 42%, rgba(192, 57, 43, 0) 70%);
  --cloud: #E9DDE6;
  --cloud-opacity: .07;
  --hill-far: #3A2F44;
  --hill-mid: #251D2D;
  --hill-near: #120D16;
  --hill-blur: 2px;
  --tree-trunk: #2A1E2E;
  --tree-crown: #221827;
  --house-roof: #9E2B22;
  --house-wall: #2A1F30;
  --house-light: #F2C66D;
  --seed: #FFB3A8;
  --seed-glow: rgba(192, 57, 43, .9);
  --theme-color: #0B070E;
}

/* Theme-Eigenheiten, die mehr als Farben brauchen */
[data-theme="lofi-cafe"] .welcome .ch { animation-duration: .8s; }
[data-theme="neo-tokyo"] .btn-primary:hover { box-shadow: 0 0 18px rgba(0, 229, 255, .6); }
[data-theme="neo-tokyo"] .card, [data-theme="neo-tokyo"] .module { border-color: rgba(0, 229, 255, .22); }
[data-theme="shadow-dojo"] .card, [data-theme="shadow-dojo"] .module {
  background-image: radial-gradient(120% 60% at 100% 0%, rgba(192, 57, 43, .10), transparent 60%);
}