/* ═══════════════════════════════════════════════════════════
   Nautilus 2.0 — Adaptives Theme-System
   5 Themes: Dark, Light, Outdoor, Future, Auto (zeitbasiert)
   Alle Farben als CSS Custom Properties.
   ═══════════════════════════════════════════════════════════ */

/* ── DARK (Standard-Nachtmodus) ─────────────────────────── */
body.theme-dark {
  --bg-base: #06070A;
  --bg-surface-1: #0C0E14;
  --bg-surface-2: #12151E;
  --bg-surface-3: #181C28;
  --bg-input: #0A0C12;
  --bg-hover: #1A1F35;

  --border-default: #1C2033;
  --border-soft: #14172488;
  --border-accent: #ffffff0A;

  --text-primary: #EDF0F7;
  --text-secondary: #A0A8C4;
  --text-muted: #5C6488;
  --text-ghost: #333A54;

  --accent: #FF6B35;
  --accent-soft: #FF6B3515;
  --accent-mid: #FF6B3530;
  --accent-hover: #E05A28;
  --accent-glow: 0 0 20px rgba(255,107,53,0.12);

  --success: #00E68A;
  --success-soft: #00E68A15;
  --warning: #FFC233;
  --warning-soft: #FFC23315;
  --danger: #FF4757;
  --danger-soft: #FF475715;
  --info: #3B82F6;
  --info-soft: #3B82F615;

  --glass-bg: rgba(12,16,28,0.65);
  --glass-border: rgba(255,255,255,0.06);
  --shadow-card: 0 8px 32px rgba(0,0,0,0.4);
  --shadow-glow: 0 0 40px rgba(255,107,53,0.06);
  --scrollbar-thumb: #1E2030;

  --ambient-a-color: rgba(255,107,53,0.04);
  --ambient-b-color: rgba(0,122,255,0.03);
  --warmth-filter: none;

  color-scheme: dark;
}

/* ── LIGHT (Tagesmodus) ─────────────────────────────────── */
body.theme-light {
  --bg-base: #F5F6FA;
  --bg-surface-1: #FFFFFF;
  --bg-surface-2: #FFFFFF;
  --bg-surface-3: #F0F1F6;
  --bg-input: #F4F5F8;
  --bg-hover: #ECEEF4;

  --border-default: #E0E3ED;
  --border-soft: #E8EAF2;
  --border-accent: #D8DCE8;

  --text-primary: #141824;
  --text-secondary: #4A5068;
  --text-muted: #8990A8;
  --text-ghost: #C0C5D6;

  --accent: #D4520F;
  --accent-soft: #D4520F0A;
  --accent-mid: #D4520F15;
  --accent-hover: #B84509;
  --accent-glow: none;

  --success: #059B5C;
  --success-soft: #059B5C0A;
  --warning: #B58C00;
  --warning-soft: #B58C000A;
  --danger: #D42F1F;
  --danger-soft: #D42F1F0A;
  --info: #2563EB;
  --info-soft: #2563EB0A;

  --glass-bg: rgba(255,255,255,0.7);
  --glass-border: rgba(0,0,0,0.06);
  --shadow-card: 0 4px 20px rgba(20,24,36,0.05);
  --shadow-glow: none;
  --scrollbar-thumb: #D0D3DD;

  --ambient-a-color: rgba(212,82,15,0.03);
  --ambient-b-color: rgba(37,99,235,0.02);
  --warmth-filter: none;

  color-scheme: light;
}

/* ── OUTDOOR (Baustelle / Sonnenlicht) ──────────────────── */
body.theme-outdoor {
  --bg-base: #FEFCF5;
  --bg-surface-1: #FFFFFF;
  --bg-surface-2: #FFFFFF;
  --bg-surface-3: #FBF8EE;
  --bg-input: #FFFCF2;
  --bg-hover: #FFF8EB;

  --border-default: #D8CFB0;
  --border-soft: #E8E0C8;
  --border-accent: #C4B888;

  --text-primary: #1A1600;
  --text-secondary: #524A28;
  --text-muted: #8C8058;
  --text-ghost: #C0B888;

  --accent: #C04400;
  --accent-soft: #C044000A;
  --accent-mid: #C0440015;
  --accent-hover: #A03800;
  --accent-glow: none;

  --success: #006830;
  --success-soft: #0068300A;
  --warning: #9A7500;
  --warning-soft: #9A75000A;
  --danger: #B81000;
  --danger-soft: #B810000A;
  --info: #003E99;
  --info-soft: #003E990A;

  --glass-bg: rgba(255,252,240,0.75);
  --glass-border: rgba(0,0,0,0.08);
  --shadow-card: 0 2px 12px rgba(26,22,0,0.08);
  --shadow-glow: none;
  --scrollbar-thumb: #C4B98A;

  --ambient-a-color: rgba(192,68,0,0.04);
  --ambient-b-color: rgba(0,62,153,0.02);
  --warmth-filter: none;

  color-scheme: light;
}

/* ── FUTURE (Sci-Fi Command Center) ─────────────────────── */
body.theme-future {
  --bg-base: #020408;
  --bg-surface-1: #060A14;
  --bg-surface-2: #0A0E1A;
  --bg-surface-3: #0E1220;
  --bg-input: #080C16;
  --bg-hover: #121830;

  --border-default: #ffffff0A;
  --border-soft: #ffffff06;
  --border-accent: #ffffff12;

  --text-primary: #E0E8F0;
  --text-secondary: #ffffff50;
  --text-muted: #ffffff30;
  --text-ghost: #ffffff15;

  --accent: #FF6B35;
  --accent-soft: #FF6B3510;
  --accent-mid: #FF6B3520;
  --accent-hover: #E05A28;
  --accent-glow: 0 0 30px rgba(255,107,53,0.15);

  --success: #00FFB2;
  --success-soft: #00FFB210;
  --warning: #FFC233;
  --warning-soft: #FFC23310;
  --danger: #FF4757;
  --danger-soft: #FF475710;
  --info: #3B82F6;
  --info-soft: #3B82F610;

  --glass-bg: rgba(6,10,20,0.8);
  --glass-border: #ffffff08;
  --shadow-card: 0 4px 30px rgba(0,0,0,0.6);
  --shadow-glow: 0 0 60px rgba(0,255,178,0.04);
  --scrollbar-thumb: #ffffff15;

  --ambient-a-color: rgba(0,255,178,0.05);
  --ambient-b-color: rgba(255,107,53,0.03);
  --warmth-filter: none;

  --future-grid-color: #ffffff03;
  --future-grid-size: 60px;
  --future-scanline-color: #00FFB220;
  --future-scanline-speed: 4s;
  --future-glow-primary: #00FFB2;
  --future-glow-secondary: #FF6B35;
  --future-corner-bracket-color: #ffffff15;
  --future-font-display: 'Orbitron', monospace;
  --future-font-data: 'Share Tech Mono', monospace;

  color-scheme: dark;
}

/* ═══════════════════════════════════════════════════════════
   Brücke: Bestehende --nautilus-* Variablen → Theme-System
   Damit ALLE bestehenden Komponenten sofort funktionieren.
   ═══════════════════════════════════════════════════════════ */
body.theme-dark,
body.theme-light,
body.theme-outdoor,
body.theme-future {
  --nautilus-accent: var(--accent);
  --nautilus-accent-hover: var(--accent-hover);
  --nautilus-surface: var(--bg-surface-1);
  --nautilus-surface-2: var(--bg-surface-3);
  --nautilus-border: var(--border-default);
  --nautilus-text: var(--text-primary);
  --nautilus-text-muted: var(--text-muted);
  --nautilus-danger: var(--danger);
  --nautilus-warn: var(--warning);
  --nautilus-ok: var(--success);
}

/* ═══════════════════════════════════════════════════════════
   Globale Overrides wenn ein Theme aktiv ist
   (html/body vollflächig — kein heller Rand in Nachtansicht)
   ═══════════════════════════════════════════════════════════ */
html {
  background-color: #06070A; /* Default dunkel bis Theme greift */
  min-height: 100%;
}
html[data-color-scheme='light'],
html.theme-light,
html.theme-outdoor {
  background-color: #F5F6FA;
}
html[data-color-scheme='dark'],
html.theme-dark,
html.theme-future {
  background-color: #06070A;
}

html,
body.theme-dark,
body.theme-future,
body.theme-light,
body.theme-outdoor {
  min-height: 100%;
}

body.theme-dark,
body.theme-future {
  background: var(--bg-base, #06070A);
  background-color: var(--bg-base, #06070A);
  color: var(--text-primary);
}
body.theme-light,
body.theme-outdoor {
  background: var(--bg-base, #F5F6FA);
  background-color: var(--bg-base, #F5F6FA);
  color: var(--text-primary);
}

/* Layout-Chrome mitziehen (kein heller Streifen an den Seiten) */
html[data-color-scheme='dark'] body,
html.theme-dark body,
body.theme-dark,
body.theme-future {
  background-color: var(--bg-base, #06070A);
}
html[data-color-scheme='dark'] .nautilus-body,
html.theme-dark .nautilus-body,
body.theme-dark .nautilus-body,
body.theme-future .nautilus-body {
  background: transparent;
}
html[data-color-scheme='light'] .nautilus-body,
html.theme-light .nautilus-body,
body.theme-light .nautilus-body,
body.theme-outdoor .nautilus-body {
  background: transparent;
}

body.theme-dark .nautilus-ribbon,
body.theme-future .nautilus-ribbon {
  background: var(--bg-surface-1);
  border-bottom-color: var(--border-default);
}
body.theme-light .nautilus-ribbon,
body.theme-outdoor .nautilus-ribbon {
  background: var(--bg-surface-1);
  border-bottom-color: var(--border-default);
}

body.theme-dark .ribbon-tab,
body.theme-future .ribbon-tab {
  color: var(--text-secondary);
}
body.theme-dark .ribbon-tab:hover,
body.theme-future .ribbon-tab:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
}
body.theme-dark .ribbon-tab.active,
body.theme-future .ribbon-tab.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}

body.theme-light .ribbon-tab,
body.theme-outdoor .ribbon-tab {
  color: var(--text-secondary);
}
body.theme-light .ribbon-tab.active,
body.theme-outdoor .ribbon-tab.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}

body.theme-dark .nautilus-footer,
body.theme-future .nautilus-footer {
  background: var(--bg-surface-1);
  color: var(--text-muted);
  border-top-color: var(--border-default);
}
body.theme-light .nautilus-footer,
body.theme-outdoor .nautilus-footer {
  background: var(--bg-surface-3);
  color: var(--text-muted);
  border-top-color: var(--border-default);
}

/* Inputs */
body[class*="theme-"] .login-input,
body[class*="theme-"] .form-control,
body[class*="theme-"] .tk-input,
body[class*="theme-"] .tk-select,
body[class*="theme-"] .tk-textarea {
  background: var(--bg-input);
  border-color: var(--border-default);
  color: var(--text-primary);
}
body[class*="theme-"] .login-input:focus,
body[class*="theme-"] .form-control:focus,
body[class*="theme-"] .tk-input:focus,
body[class*="theme-"] .tk-select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}

/* Cards / Tiles */
body[class*="theme-"] .nbl-tile,
body[class*="theme-"] .nbl-card,
body[class*="theme-"] .login-card,
body[class*="theme-"] .tk-card,
body[class*="theme-"] .tk-item,
body[class*="theme-"] .tk-stat,
body[class*="theme-"] .proj-card,
body[class*="theme-"] .dashboard-widget {
  background: var(--bg-surface-1);
  border-color: var(--border-default);
  color: var(--text-primary);
  box-shadow: var(--shadow-card);
}
body[class*="theme-"] .nbl-tile:hover,
body[class*="theme-"] .tk-item:hover {
  border-color: var(--accent);
}

/* Buttons */
body[class*="theme-"] .nbe-btn-primary,
body[class*="theme-"] .nbl-btn--primary,
body[class*="theme-"] .tk-btn--primary,
body[class*="theme-"] .login-submit {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
body[class*="theme-"] .nbe-btn-primary:hover,
body[class*="theme-"] .nbl-btn--primary:hover,
body[class*="theme-"] .tk-btn--primary:hover,
body[class*="theme-"] .login-submit:hover {
  background: var(--accent-hover);
}

/* Links */
body[class*="theme-"] a { color: var(--accent); }
body[class*="theme-"] a:hover { color: var(--accent-hover); }
body[class*="theme-"] .ribbon-tab { color: var(--text-secondary); text-decoration: none; }

/* Notification Panel */
body.theme-dark .notif-panel,
body.theme-future .notif-panel {
  background: var(--bg-surface-2);
  border-left-color: var(--border-default);
}
body.theme-dark .notif-item:hover,
body.theme-future .notif-item:hover {
  background: var(--bg-hover);
}
body.theme-dark .notif-item,
body.theme-future .notif-item {
  border-bottom-color: var(--border-soft);
  color: var(--text-primary);
}

/* Scrollbar */
body[class*="theme-"]::-webkit-scrollbar { width: 8px; }
body[class*="theme-"]::-webkit-scrollbar-track { background: transparent; }
body[class*="theme-"]::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: 4px; }

/* Toast */
body.theme-dark .n-toast,
body.theme-future .n-toast {
  background: var(--bg-surface-2);
  color: var(--text-primary);
  border: 1px solid var(--border-default);
}

/* Selection */
body.theme-dark ::selection,
body.theme-future ::selection {
  background: var(--accent-mid);
  color: var(--text-primary);
}

/* Autofill */
body.theme-dark input:-webkit-autofill,
body.theme-future input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px var(--bg-input) inset;
  -webkit-text-fill-color: var(--text-primary);
}
body.theme-light input:-webkit-autofill,
body.theme-outdoor input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px var(--bg-input) inset;
  -webkit-text-fill-color: var(--text-primary);
}

/* Outdoor: Größere Touch-Targets */
body.theme-outdoor .ribbon-tab { padding: 14px 18px; font-size: 14px; }
body.theme-outdoor .nbe-btn,
body.theme-outdoor .nbl-btn,
body.theme-outdoor .tk-btn { min-height: 48px; font-size: 15px; }
body.theme-outdoor .tk-input,
body.theme-outdoor .tk-select,
body.theme-outdoor .tk-textarea { font-size: 16px; padding: .7rem .85rem; }
