/* Mietwalter Design Tokens — Brand DNA v2.0 (Walter)
 * Kanonische Quelle: 12 Company DNA – Mietwalter
 * Präfix --mw-* (löst --in-* / nexus vollständig ab)
 */

:root,
[data-theme="light"] {
  /* Flächen — Hemd, nicht Papier */
  --mw-bg:            #F4F6F8;
  --mw-surface:       #FFFFFF;
  --mw-surface-2:     #EAEFF3;
  --mw-border:        #D3DCE4;
  --mw-border-strong: #B7C4D0;

  /* Text — Tinte aus der Wortmarke */
  --mw-text:          #1A2430;
  --mw-text-muted:    #5C6B7A;
  --mw-text-subtle:   #7E8C99; /* Icons/Placeholder only, kein Body-Text */
  --mw-text-on-brand: #FFFFFF;
  --mw-text-on-accent:#1A2430; /* Honig trägt dunklen Text */

  /* Marke */
  --mw-brand:         #4E6F8E; /* Walter-Blau / Stahlblau */
  --mw-brand-hover:   #3D5F7A;
  --mw-brand-active:  #2A4458;
  --mw-brand-subtle:  #E6EDF2;
  --mw-accent:        #E8A56B; /* Honig — Daumen/Haut */
  --mw-accent-hover:  #D8885C;
  --mw-accent-subtle: #FDF6EE;
  --mw-character:     #5C3A22; /* Kastanie — Haar */

  /* Logo-Kreis (direkt aus der Bildmarke) */
  --mw-logo-inner:    #7698B6;
  --mw-logo-badge:    #5A7E9D;
  --mw-logo-outer:    #456B8B;
  --mw-navy:          #152032;

  /* Semantik */
  --mw-success:       #2F7D5B;
  --mw-success-bg:    #E8F6F0;
  --mw-success-text:  #21664A;
  --mw-warning:       #E3B23C;
  --mw-warning-bg:    #FBF4E0;
  --mw-warning-text:  #8A5A16;
  --mw-error:         #C04540;
  --mw-error-bg:      #FBECEC;
  --mw-error-text:    #8F2C2A;
  --mw-info:          #5A8FB0;
  --mw-info-bg:       #E7EFF3;
  --mw-info-text:     #2C5D7C;

  --mw-focus-ring:    #7698B6;
}

[data-theme="dark"] {
  --mw-bg:            #152032;
  --mw-surface:       #1E2C3E;
  --mw-surface-2:     #26364A;
  --mw-border:        #31465C;
  --mw-border-strong: #3E5870;

  --mw-text:          #F4F6F8;
  --mw-text-muted:    #B7C4D0;
  --mw-text-subtle:   #8A9AAB;
  --mw-text-on-brand: #FFFFFF;
  --mw-text-on-accent:#1A2430;

  --mw-brand:         #6E9BB8;
  --mw-brand-hover:   #8DB2C9;
  --mw-brand-active:  #AEC6D5;
  --mw-brand-subtle:  #1A3044;
  --mw-accent:        #F0B484;
  --mw-accent-hover:  #E8A56B;
  --mw-accent-subtle: #3A2A18;
  --mw-character:     #E8C4A8;

  --mw-logo-inner:    #7698B6;
  --mw-logo-badge:    #5A7E9D;
  --mw-logo-outer:    #456B8B;
  --mw-navy:          #152032;

  --mw-success:       #6FBF9A;
  --mw-success-bg:    #17392C;
  --mw-success-text:  #A9D6C3;
  --mw-warning:       #ECC072;
  --mw-warning-bg:    #3A2A0E;
  --mw-warning-text:  #F0D4A0;
  --mw-error:         #E07A72;
  --mw-error-bg:      #3A1714;
  --mw-error-text:    #F0B3AE;
  --mw-info:          #7FA9C6;
  --mw-info-bg:       #142838;
  --mw-info-text:     #B3CEE0;

  --mw-focus-ring:    #7698B6;
}

:root {
  /* Radien — Kreis ist die Signatur, UI bleibt mittelweich */
  --mw-radius-xs:   4px;
  --mw-radius-sm:   8px;
  --mw-radius-md:   12px;
  --mw-radius-lg:   16px;
  --mw-radius-xl:   24px;
  --mw-radius-full: 9999px;

  /* Schatten — navy-getönt, kein Warm-Schwarz, kein Glow */
  --mw-shadow-xs: 0 1px 2px rgba(21, 32, 50, 0.06);
  --mw-shadow-sm: 0 2px 6px rgba(21, 32, 50, 0.08);
  --mw-shadow-md: 0 6px 16px rgba(21, 32, 50, 0.10);
  --mw-shadow-lg: 0 16px 40px rgba(21, 32, 50, 0.14);
  --mw-focus-shadow: 0 0 0 2px var(--mw-bg), 0 0 0 4px var(--mw-focus-ring);

  /* Spacing — 4-px-Raster */
  --mw-space-1: 4px;
  --mw-space-2: 8px;
  --mw-space-3: 12px;
  --mw-space-4: 16px;
  --mw-space-5: 24px;
  --mw-space-6: 32px;
  --mw-space-7: 48px;
  --mw-space-8: 64px;

  /* Type */
  --mw-font-display: "Nunito", "Arial Rounded MT Bold", Arial, Helvetica, sans-serif;
  --mw-font-sans:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mw-font-mono:    "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --mw-font-wordmark:"Arial Rounded MT Bold", "Nunito", Arial, Helvetica, sans-serif;

  --mw-text-display: 3.05rem;
  --mw-text-h1:      2.44rem;
  --mw-text-h2:      1.95rem;
  --mw-text-h3:      1.56rem;
  --mw-text-h4:      1.25rem;
  --mw-text-body-lg: 1.125rem;
  --mw-text-body:    1rem;
  --mw-text-body-sm: 0.875rem;
  --mw-text-caption: 0.75rem;
  --mw-text-mono:    0.9375rem;

  /* Motion */
  --mw-duration-fast:  120ms;
  --mw-duration-base:  200ms;
  --mw-duration-slow:  320ms;
  --mw-ease-standard:  cubic-bezier(0.2, 0, 0, 1);
  --mw-ease-emphasis:  cubic-bezier(0.3, 0, 0, 1);
}

/* ── Ergänzungen aus der App-Implementierung ──────────────────────────
 * frontend-v2/src/brand/tokens.css führt zu jedem Type-Token eine
 * Zeilenhöhe und ein drittes Easing. Beides gehört zur DNA (12.5/12.6),
 * fehlt aber im Kit-Export — hier mit den Werten aus dem Prod-Build.
 */
:root {
  --mw-text-display-line-height: 1.1;
  --mw-text-h1-line-height:      1.15;
  --mw-text-h2-line-height:      1.2;
  --mw-text-h3-line-height:      1.25;
  --mw-text-h4-line-height:      1.3;
  --mw-text-body-lg-line-height: 1.6;
  --mw-text-body-line-height:    1.6;
  --mw-text-body-sm-line-height: 1.55;
  --mw-text-caption-line-height: 1.4;
  --mw-text-mono-line-height:    1.5;

  --mw-ease-rise: cubic-bezier(0.2, 0.7, 0.3, 1);
}

/* Dataviz-Rollen (Finanzen-Konzept) — getrennte Werte je Theme, CVD-sicher. */
:root,
[data-theme="light"] {
  --mw-dv-series-1: #2A78D6;
  --mw-dv-series-2: #EB6834;
  --mw-dv-pos:      #2F9E63;
  --mw-dv-neg:      #E34948;
  --mw-dv-warn:     #9C7410;
  --mw-dv-neutral:  #F0EFEC;
  --mw-dv-grid:     #E1E0D9;
  --mw-dv-axis:     #C3C2B7;
}

[data-theme="dark"] {
  --mw-dv-series-1: #3987E5;
  --mw-dv-series-2: #D95926;
  --mw-dv-pos:      #46B27B;
  --mw-dv-neg:      #E66767;
  --mw-dv-warn:     #E8BD4A;
  --mw-dv-neutral:  #383835;
  --mw-dv-grid:     #2C2C2A;
  --mw-dv-axis:     #383835;
}
