/* ═══════════════════════════════════════════════════════════════
   STRUCTON CRM — 10 Themes
   Pro Theme: Override der Brand-Tokens via [data-theme="…"]
   Default-Theme (swiss) ist :root in tokens.css.
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. SWISS (default) — schon in tokens.css ── */
[data-theme="swiss"] {
  /* explizit, falls jemand zurückschaltet */
  --c-ink: #0A0A0A; --c-ink-soft: #1A1A1A;
  --c-surface: #FFFFFF; --c-soft: #F5F5F5;
  --c-line: #D4D4D4; --c-line-soft: #E8E8E8;
  --c-mid: #6E6E6E; --c-mid-soft: #999999;
  --c-accent: #E63946; --c-accent-soft: #FCEAEC;
  --c-sales: #E63946; --c-sales-soft: #FCEAEC;
  --c-kunden: #134E5E; --c-kunden-soft: #E0EAEC;
  --c-tools: #2A8A3F; --c-tools-soft: #E3F1E6;
  --c-comm: #E96B3A; --c-comm-soft: #FCEBE0;
  --c-admin: #6E6E6E; --c-admin-soft: #EEEEEE;
  --f-display: 'Plus Jakarta Sans', system-ui, sans-serif;
  --f-body: 'Plus Jakarta Sans', system-ui, sans-serif;
  --radius-0: 0px;
}

/* ── 2. MIDNIGHT — Dark Mode mit Electric Blue ── */
[data-theme="midnight"] {
  --c-ink: #FAFAFA; --c-ink-soft: #E5E5E5;
  --c-surface: #14161B; --c-soft: #1F2229;
  --c-line: #2D3139; --c-line-soft: #232831;
  --c-mid: #9BA3B0; --c-mid-soft: #6B7280;
  --c-accent: #3B82F6; --c-accent-soft: #1E3A8A33;
  --c-sales: #3B82F6; --c-sales-soft: #1E3A8A33;
  --c-kunden: #38BDF8; --c-kunden-soft: #0C4A6E33;
  --c-tools: #34D399; --c-tools-soft: #065F4633;
  --c-comm: #FBBF24; --c-comm-soft: #78350F33;
  --c-admin: #9CA3AF; --c-admin-soft: #37415133;
  --c-success: #34D399; --c-warning: #FBBF24; --c-danger: #F87171; --c-info: #60A5FA;
}
[data-theme="midnight"] body { background: var(--c-soft); }
[data-theme="midnight"] .login, [data-theme="midnight"] .login-card { background: var(--c-surface); }
[data-theme="midnight"] .card, [data-theme="midnight"] .modal-dialog { background: var(--c-surface); border-color: var(--c-line); }
[data-theme="midnight"] input, [data-theme="midnight"] select, [data-theme="midnight"] textarea {
  background: var(--c-soft); color: var(--c-ink); border-color: var(--c-line);
}
[data-theme="midnight"] .modal-backdrop { background: rgba(0,0,0,0.7); }

/* ── 3. SAND — Erdig: Cremebeige + Cognac + Tiefbraun ── */
[data-theme="sand"] {
  --c-ink: #2C1810; --c-ink-soft: #4A2C20;
  --c-surface: #FAF3E7; --c-soft: #F2E8D5;
  --c-line: #D9C8A8; --c-line-soft: #E8DCC0;
  --c-mid: #8C6E4A; --c-mid-soft: #B8A380;
  --c-accent: #B8632F; --c-accent-soft: #F0DCC8;
  --c-sales: #B8632F; --c-sales-soft: #F0DCC8;
  --c-kunden: #5D4A2E; --c-kunden-soft: #E6DBC6;
  --c-tools: #6B8E4E; --c-tools-soft: #DDE5D0;
  --c-comm: #C28845; --c-comm-soft: #F2E2C8;
  --c-admin: #8C6E4A; --c-admin-soft: #E8DCC0;
  --f-display: 'Cormorant Garamond', 'Playfair Display', Georgia, serif;
  --radius-0: 2px;
}

/* ── 4. EDITORIAL — Magazin: Cremeweiß + Schwarz + große Display-Serif ── */
[data-theme="editorial"] {
  --c-ink: #1A1A1A; --c-ink-soft: #2D2D2D;
  --c-surface: #FBF8F3; --c-soft: #F2EEE5;
  --c-line: #1A1A1A; --c-line-soft: #C5BDA8;
  --c-mid: #5C544A; --c-mid-soft: #8A8478;
  --c-accent: #B91C1C; --c-accent-soft: #F5E0E0;
  --c-sales: #B91C1C; --c-sales-soft: #F5E0E0;
  --c-kunden: #1F2937; --c-kunden-soft: #E5E7EB;
  --c-tools: #166534; --c-tools-soft: #DCE8DC;
  --c-comm: #C2410C; --c-comm-soft: #FAE5D5;
  --c-admin: #5C544A; --c-admin-soft: #E8E3D8;
  --f-display: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  --f-body: 'Source Sans 3', 'Inter', system-ui, sans-serif;
  --radius-0: 0px;
}
[data-theme="editorial"] h1 { font-family: var(--f-display); font-weight: 700; letter-spacing: -0.02em; }
[data-theme="editorial"] .card { border-width: 1px 0; border-style: solid; border-color: var(--c-line-soft); border-radius: 0; }

/* ── 5. FOREST — Tannengrün dark + Salbei + Naturweiss ── */
[data-theme="forest"] {
  --c-ink: #E8EDE5; --c-ink-soft: #C8D2C2;
  --c-surface: #1F2D1F; --c-soft: #2A3D2A;
  --c-line: #3D513D; --c-line-soft: #344733;
  --c-mid: #98A892; --c-mid-soft: #788A72;
  --c-accent: #A8C794; --c-accent-soft: #2D4A1F33;
  --c-sales: #A8C794; --c-sales-soft: #2D4A1F33;
  --c-kunden: #7FA88B; --c-kunden-soft: #1E3E2F33;
  --c-tools: #C2A865; --c-tools-soft: #4A3D1F33;
  --c-comm: #D2A375; --c-comm-soft: #4A311E33;
  --c-admin: #98A892; --c-admin-soft: #3D513D;
}
[data-theme="forest"] body { background: var(--c-soft); }
[data-theme="forest"] .login, [data-theme="forest"] .login-card,
[data-theme="forest"] .card, [data-theme="forest"] .modal-dialog { background: var(--c-surface); }
[data-theme="forest"] input, [data-theme="forest"] select, [data-theme="forest"] textarea {
  background: var(--c-soft); color: var(--c-ink); border-color: var(--c-line);
}

/* ── 6. MARINA — Maritim/Bankhaus: Navy + Hellblau + Gold ── */
[data-theme="marina"] {
  --c-ink: #0B1F3A; --c-ink-soft: #1E3A5F;
  --c-surface: #FFFFFF; --c-soft: #EDF2F8;
  --c-line: #C5D2E0; --c-line-soft: #DCE4ED;
  --c-mid: #4A6B8C; --c-mid-soft: #7090B0;
  --c-accent: #C8A96E; --c-accent-soft: #F3EBDB;
  --c-sales: #1E3A8A; --c-sales-soft: #DCE5F2;
  --c-kunden: #0E7490; --c-kunden-soft: #D4ECF1;
  --c-tools: #C8A96E; --c-tools-soft: #F3EBDB;
  --c-comm: #B45309; --c-comm-soft: #F5E4CC;
  --c-admin: #4A6B8C; --c-admin-soft: #E0E6ED;
  --f-display: 'Crimson Pro', 'Playfair Display', Georgia, serif;
  --radius-0: 1px;
}

/* ── 7. BRUTALIST — Schwarz/Säuregelb, klobige Borders, Anti-Polish ── */
[data-theme="brutalist"] {
  --c-ink: #000000; --c-ink-soft: #1A1A1A;
  --c-surface: #FFFFFF; --c-soft: #F0F0F0;
  --c-line: #000000; --c-line-soft: #1A1A1A;
  --c-mid: #525252; --c-mid-soft: #737373;
  --c-accent: #FFFD00; --c-accent-soft: #FFFD0033;
  --c-sales: #FFFD00; --c-sales-soft: #FFFD0033;
  --c-kunden: #000000; --c-kunden-soft: #00000022;
  --c-tools: #00C853; --c-tools-soft: #00C85322;
  --c-comm: #FF3B30; --c-comm-soft: #FF3B3022;
  --c-admin: #000000; --c-admin-soft: #00000011;
  --f-display: 'Archivo Black', 'Inter', system-ui, sans-serif;
  --f-body: 'Inter', system-ui, sans-serif;
  --radius-0: 0px;
}
[data-theme="brutalist"] .card { border-width: 3px; border-color: #000; box-shadow: 6px 6px 0 #000; }
[data-theme="brutalist"] .btn { border-width: 2px; border-color: #000; box-shadow: 3px 3px 0 #000; font-weight: 700; text-transform: uppercase; }
[data-theme="brutalist"] .btn:hover { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #000; }
[data-theme="brutalist"] h1, [data-theme="brutalist"] h2, [data-theme="brutalist"] h3 { font-family: var(--f-display); text-transform: uppercase; letter-spacing: -0.02em; }

/* ── 8. BAUHAUS — Primärfarben Rot/Gelb/Blau, geometrisch ── */
[data-theme="bauhaus"] {
  --c-ink: #1A1A1A; --c-ink-soft: #2A2A2A;
  --c-surface: #FFFFFF; --c-soft: #F0EDE5;
  --c-line: #1A1A1A; --c-line-soft: #C8C2B0;
  --c-mid: #707070; --c-mid-soft: #989386;
  --c-accent: #E63946; --c-accent-soft: #F5CCD0;
  --c-sales: #E63946; --c-sales-soft: #F5CCD0;
  --c-kunden: #005FFF; --c-kunden-soft: #CCDFFF;
  --c-tools: #FFD60A; --c-tools-soft: #FFF4B8;
  --c-comm: #E63946; --c-comm-soft: #F5CCD0;
  --c-admin: #1A1A1A; --c-admin-soft: #D8D4C8;
  --f-display: 'Bebas Neue', 'Oswald', Impact, sans-serif;
  --f-body: 'Inter', system-ui, sans-serif;
}
[data-theme="bauhaus"] h1, [data-theme="bauhaus"] h2 { font-family: var(--f-display); letter-spacing: 0.04em; text-transform: uppercase; }
[data-theme="bauhaus"] .card { border-width: 2px; border-color: #1A1A1A; }

/* ── 9. CARBON — IBM-inspiriert: tiefes Schwarz + Electric Blue ── */
[data-theme="carbon"] {
  --c-ink: #F4F4F4; --c-ink-soft: #C6C6C6;
  --c-surface: #161616; --c-soft: #262626;
  --c-line: #393939; --c-line-soft: #2D2D2D;
  --c-mid: #8D8D8D; --c-mid-soft: #6F6F6F;
  --c-accent: #0F62FE; --c-accent-soft: #002D9C33;
  --c-sales: #0F62FE; --c-sales-soft: #002D9C33;
  --c-kunden: #33B1FF; --c-kunden-soft: #003A6D33;
  --c-tools: #42BE65; --c-tools-soft: #04451833;
  --c-comm: #FF832B; --c-comm-soft: #67280033;
  --c-admin: #8D8D8D; --c-admin-soft: #39393933;
  --f-display: 'IBM Plex Sans', 'Inter', system-ui, sans-serif;
  --f-body: 'IBM Plex Sans', 'Inter', system-ui, sans-serif;
  --f-mono: 'IBM Plex Mono', 'JetBrains Mono', monospace;
}
[data-theme="carbon"] body { background: #000; }
[data-theme="carbon"] .login, [data-theme="carbon"] .login-card,
[data-theme="carbon"] .card, [data-theme="carbon"] .modal-dialog { background: var(--c-surface); border-color: var(--c-line); }
[data-theme="carbon"] input, [data-theme="carbon"] select, [data-theme="carbon"] textarea {
  background: var(--c-soft); color: var(--c-ink); border-color: var(--c-line);
}
[data-theme="carbon"] .btn { font-weight: 500; }

/* ── 10. TERMINAL — Monochrome Konsole, alles Mono, Phosphor-Grün ── */
[data-theme="terminal"] {
  --c-ink: #00FF87; --c-ink-soft: #00CC6B;
  --c-surface: #0A0E0A; --c-soft: #131913;
  --c-line: #1F2C1F; --c-line-soft: #182218;
  --c-mid: #4A8060; --c-mid-soft: #336047;
  --c-accent: #00FF87; --c-accent-soft: #00FF8722;
  --c-sales: #00E5FF; --c-sales-soft: #00E5FF22;
  --c-kunden: #FFD93D; --c-kunden-soft: #FFD93D22;
  --c-tools: #6BCB77; --c-tools-soft: #6BCB7722;
  --c-comm: #FF6B6B; --c-comm-soft: #FF6B6B22;
  --c-admin: #4A8060; --c-admin-soft: #1F2C1F;
  --f-display: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  --f-body: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  --f-mono: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
}
[data-theme="terminal"] body { background: #000; }
[data-theme="terminal"] .login, [data-theme="terminal"] .login-card,
[data-theme="terminal"] .card, [data-theme="terminal"] .modal-dialog { background: var(--c-surface); border-color: var(--c-line); }
[data-theme="terminal"] input, [data-theme="terminal"] select, [data-theme="terminal"] textarea {
  background: var(--c-surface); color: var(--c-ink); border-color: var(--c-line); font-family: var(--f-mono);
}
[data-theme="terminal"] h1::before { content: "> "; opacity: 0.6; }
[data-theme="terminal"] .btn { font-family: var(--f-mono); text-transform: uppercase; letter-spacing: 0.04em; }

/* ── Theme-Picker Cards ────────────────────────────────────── */
.theme-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--s-4);
}
.theme-card {
  cursor: pointer;
  padding: 0;
  overflow: hidden;
  border: 2px solid var(--c-line);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.theme-card:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.08); }
.theme-card.is-active { border-color: var(--c-accent); box-shadow: 0 0 0 3px var(--c-accent-soft); }
.theme-preview {
  height: 130px;
  display: grid;
  grid-template-columns: 60px 1fr;
  position: relative;
}
.theme-preview-sidebar { padding: var(--s-2); border-right: 1px solid; }
.theme-preview-main { padding: var(--s-2); display: flex; flex-direction: column; gap: 4px; }
.theme-preview-bar { height: 6px; border-radius: 2px; }
.theme-preview-bar.b1 { width: 60%; }
.theme-preview-bar.b2 { width: 80%; }
.theme-preview-bar.b3 { width: 40%; }
.theme-preview-dot { width: 8px; height: 8px; border-radius: 50%; margin-bottom: 4px; }
.theme-card-meta {
  padding: var(--s-3);
  border-top: 1px solid var(--c-line-soft);
}
.theme-name {
  font: 700 13px/1.2 var(--f-display, var(--f-body));
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 2px;
}
.theme-desc {
  font-size: 11px;
  color: var(--c-mid);
  line-height: 1.4;
}
.theme-card.is-active .theme-name::after {
  content: " ✓";
  color: var(--c-accent);
}
