/* =====================================================================
   TAAVA Design-Tokens – gemeinsam für Partner-Portal und Admin-Panel
   Dunkel (Standard) = Partner-Theme der Flutter-App, Hell = warmes Off-White
   ===================================================================== */

/* Schrift liegt auf unserem eigenen Server (kein Google-Fonts-Aufruf beim Laden).
   Erzeugt aus der variablen Google-Fonts-Datei, Lizenz SIL OFL. */
@font-face { font-family: 'Urbanist'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/urbanist-400.woff2') format('woff2'); }
@font-face { font-family: 'Urbanist'; font-style: normal; font-weight: 500; font-display: swap; src: url('/assets/fonts/urbanist-500.woff2') format('woff2'); }
@font-face { font-family: 'Urbanist'; font-style: normal; font-weight: 600; font-display: swap; src: url('/assets/fonts/urbanist-600.woff2') format('woff2'); }
@font-face { font-family: 'Urbanist'; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/urbanist-700.woff2') format('woff2'); }
@font-face { font-family: 'Urbanist'; font-style: normal; font-weight: 800; font-display: swap; src: url('/assets/fonts/urbanist-800.woff2') format('woff2'); }
@font-face { font-family: 'Urbanist'; font-style: normal; font-weight: 900; font-display: swap; src: url('/assets/fonts/urbanist-900.woff2') format('woff2'); }

:root,
[data-theme="dark"] {
  color-scheme: dark;

  --bg: #050B17;
  --bg-glow: radial-gradient(900px 520px at 88% -10%, rgba(212, 168, 87, 0.10), transparent 60%),
             radial-gradient(760px 460px at -12% 8%, rgba(27, 42, 71, 0.55), transparent 62%);
  --card: #0F1828;
  --card-2: #1A2438;
  --card-hover: #13203A;
  --fg: #F5F2EA;
  --muted: #94A3B8;
  --border: #1F2A40;
  --border-strong: #2B3955;

  --gold: #D4A857;
  --gold-light: #E8C684;
  --gold-dark: #B08A3E;

  --primary: #E8C684;               /* Akzent-Text: Werte, Links, aktive Elemente */
  --primary-fg: #0A1628;            /* Text auf primären Buttons */
  --primary-gradient: linear-gradient(135deg, #E8C684 0%, #D4A857 55%, #B08A3E 100%);
  --accent: #D4A857;
  --accent-weak: rgba(212, 168, 87, 0.13);

  --ok: #34D399;    --ok-weak: rgba(52, 211, 153, 0.14);
  --warn: #FBBF24;  --warn-weak: rgba(251, 191, 36, 0.14);
  --err: #F87171;   --err-weak: rgba(248, 113, 113, 0.14);
  --info: #60A5FA;  --info-weak: rgba(96, 165, 250, 0.14);
  --violet: #A78BFA; --violet-weak: rgba(167, 139, 250, 0.15);
  --silver: #1A2438;

  --hero-bg: linear-gradient(140deg, #1B2A47 0%, #0F1828 55%, #0A1628 100%);
  --hero-fg: #F5F2EA;
  --hero-muted: rgba(245, 242, 234, 0.68);
  --hero-border: rgba(212, 168, 87, 0.38);
  --hero-chip: rgba(212, 168, 87, 0.15);

  --surface-glass: rgba(10, 18, 33, 0.84);
  --input-bg: #1A2438;
  --scrim: rgba(2, 6, 14, 0.72);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 18px 42px -20px rgba(0, 0, 0, 0.75);
  --grid: rgba(148, 163, 184, 0.12);
  --focus-ring: 0 0 0 3px rgba(212, 168, 87, 0.45);
}

[data-theme="light"] {
  color-scheme: light;

  --bg: #F7F4EE;
  --bg-glow: radial-gradient(900px 520px at 88% -10%, rgba(212, 168, 87, 0.16), transparent 60%);
  --card: #FFFFFF;
  --card-2: #F3EEE4;
  --card-hover: #FBF8F2;
  --fg: #0A1628;
  --muted: #5B6475;
  --border: #E8E1D3;
  --border-strong: #D6CBB6;

  --primary: #8A6628;
  --primary-fg: #F5F2EA;
  --primary-gradient: linear-gradient(135deg, #1B2A47 0%, #0A1628 100%);
  --accent: #9A742F;
  --accent-weak: rgba(176, 138, 62, 0.13);

  --ok: #047857;    --ok-weak: rgba(16, 185, 129, 0.12);
  --warn: #B45309;  --warn-weak: rgba(245, 158, 11, 0.14);
  --err: #DC2626;   --err-weak: rgba(239, 68, 68, 0.10);
  --info: #1D4ED8;  --info-weak: rgba(59, 130, 246, 0.10);
  --violet: #6D28D9; --violet-weak: rgba(139, 92, 246, 0.12);
  --silver: #EDE7DB;

  /* Rang-Karte bleibt dunkel wie eine „Black Card“ */
  --hero-bg: linear-gradient(140deg, #1B2A47 0%, #0A1628 100%);
  --hero-fg: #F5F2EA;
  --hero-muted: rgba(245, 242, 234, 0.7);
  --hero-border: rgba(212, 168, 87, 0.45);
  --hero-chip: rgba(212, 168, 87, 0.18);

  --surface-glass: rgba(255, 255, 255, 0.88);
  --input-bg: #FBF9F5;
  --scrim: rgba(10, 22, 40, 0.5);
  --shadow-sm: 0 1px 2px rgba(10, 22, 40, 0.06);
  --shadow-md: 0 14px 34px -18px rgba(10, 22, 40, 0.22);
  --grid: rgba(10, 22, 40, 0.07);
  --focus-ring: 0 0 0 3px rgba(176, 138, 62, 0.35);
}

/* Logo-Varianten: helles Logo auf dunklem Theme, dunkles Logo auf hellem Theme */
[data-theme="light"] .logo-on-dark { display: none !important; }
:root:not([data-theme="light"]) .logo-on-light { display: none !important; }

/* Hell/Dunkel-Schalter: zeigt das Symbol des Modus, zu dem gewechselt wird */
.theme-toggle .icon-sun { display: none; }
.theme-toggle .icon-moon { display: block; }
[data-theme="dark"] .theme-toggle .icon-sun,
:root:not([data-theme="light"]) .theme-toggle .icon-sun { display: block; }
:root:not([data-theme="light"]) .theme-toggle .icon-moon { display: none; }

:focus-visible { outline: none; box-shadow: var(--focus-ring); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}