/* ================================================
   MINALOVE FONTS
   Geist — gesamte UI + Display (von Google Fonts).
   Lowvetica entfernt (2026-06-03), nicht mehr verwendet.
================================================ */
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@200;300;400;500;600;700&display=swap');

:root {
  /* ================================================
     MINALOVE DESIGN TOKENS v2.1
     Fixe Tokens — werden nie durch Branding ueberschrieben.
     Branding-Tokens (interaktiv, bg, border, text) werden
     ausschliesslich von lbl-core.js gesetzt.
  ================================================ */

  /* Primaerfarbe: Teal Navy — fix, kein Branding */
  --ml-primary-900:  #0D2F42;
  --ml-primary-800:  #133D56;
  --ml-primary-700:  #1A4F6E;
  --ml-primary-600:  #236B8E;
  --ml-primary-400:  #5B9AB5;
  --ml-primary-200:  #C2DCE8;
  --ml-primary-50:   #EAF4F9;

  /* Akzent: Coral Red — fix */
  --ml-accent-900: #991825;
  --ml-accent-700: #C42035;
  --ml-accent-600: #E8455A;
  --ml-accent-400: #F07585;
  --ml-accent-200: #F7AABA;
  --ml-accent-100: #FBD0D8;
  --ml-accent-50:  #FEF0F2;
  --ml-accent:     #E8455A;

  /* Neutral: fix (nur statische Werte) */
  --ml-neutral-700: #334155;
  --ml-neutral-400: #94A3B8;
  --ml-neutral-300: #CBD5E1;
  --ml-neutral-100: #E2E8F0;

  /* Semantische Farben — fix */
  --ml-color-success:     #10B981;
  --ml-color-success-bg:  #D1FAE5;
  --ml-color-warning:     #F59E0B;
  --ml-color-warning-bg:  #FEF3C7;
  --ml-color-danger:      #E8455A;
  --ml-color-danger-bg:   #FEF0F2;
  --ml-color-info:        #2563EB;
  --ml-color-info-bg:     #DBEAFE;

  /* Typografie — fix (nicht durch Branding aenderbar) */
  --ml-font-display: 'Geist', system-ui, sans-serif;  /* Logo, Ueberschriften, Namen */
  --ml-font-ui:      'Geist', system-ui, sans-serif;  /* gesamte UI */

  /* Schriftgroessen — fix */
  --ml-text-xs:   11px;
  --ml-text-sm:   12px;
  --ml-text-base: 13px;
  --ml-text-md:   14px;
  --ml-text-lg:   16px;
  --ml-text-xl:   20px;
  --ml-text-2xl:  24px;
  --ml-text-3xl:  30px;

  /* Abstande — fix */
  --ml-space-1:  4px;
  --ml-space-2:  8px;
  --ml-space-3:  12px;
  --ml-space-4:  16px;
  --ml-space-5:  20px;
  --ml-space-6:  24px;
  --ml-space-8:  32px;
  --ml-space-10: 40px;

  /* Border Radius — fix */
  --ml-radius-sm:   6px;
  --ml-radius-md:   8px;
  --ml-radius-lg:   12px;
  --ml-radius-xl:   16px;
  --ml-radius-full: 9999px;

  /* Shadows — fix */
  --ml-shadow-sm: 0 1px 2px rgba(26, 79, 110, 0.06);
  --ml-shadow-md: 0 4px 12px rgba(26, 79, 110, 0.10);
  --ml-shadow-lg: 0 8px 24px rgba(26, 79, 110, 0.14);

  /* Z-Index — fix */
  --ml-z-dropdown: 100;
  --ml-z-sticky:   200;
  --ml-z-modal:    300;
  --ml-z-toast:    400;

  /* ── Branding-Tokens: Defaults ──
     Diese werden von lbl-core.js zur Laufzeit ueberschrieben.
     Hier stehen nur die Teal-Navy Fallbacks fuer den Fall
     dass lbl-core.js noch nicht geladen hat. */
  --ml-interactive-600: #2563EB;
  --ml-interactive-700: #1A52D0;
  --ml-interactive-400: #4F83F5;
  --ml-interactive-200: #93B4F5;
  --ml-interactive-100: #BFCFFA;
  --ml-interactive-50:  #DBEAFE;
  --ml-interactive-900: #1040B0;

  --ml-neutral-900: #1E293B;
  --ml-neutral-500: #64748B;
  --ml-neutral-200: #CBD5E1;
  --ml-neutral-50:  #F4F8FA;

  --ml-brand:         #1A4F6E;
  --ml-brand-dark:    #133D56;
  --ml-btn-primary:   #2563EB;
  --ml-btn-primary-hover: #1A52D0;
  --ml-text:          #1E293B;
  --ml-text-muted:    #64748B;
  --ml-border:        #CBD5E1;
  --ml-bg:            #F4F8FA;
  --ml-bg-card:       #ffffff;
}
