/* ============================================================
   Ferment-Wiki · Design-Tokens
   1:1-Port von app/lib/core/theme/tokens.dart
   (= Ferment Tracker Design Spec §1.1–1.3 / Design System §1, §3, §9).

   Kein Wert ist hier erfunden — jede Zeile entspricht einer Konstante
   aus der App. Wird die App geändert, zieht dieser File nach.
   ============================================================ */

@font-face {
  font-family: "Instrument Serif";
  src: url("../fonts/InstrumentSerif-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Serif";
  src: url("../fonts/InstrumentSerif-Italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/IBMPlexSans-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/IBMPlexSans-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/IBMPlexSans-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/IBMPlexMono-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/IBMPlexMono-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---- §1.1 Farben (FermentColors) ---- */
  --color-bg: #FAF5EA;             /* App-Hintergrund, Sheets          */
  --color-surface: #FFFDFA;        /* Cards, Modals, Nav               */
  --color-text: #2E2A26;           /* Headings, Werte                  */
  --color-text-muted: #6E675F;     /* Labels, Meta, Hinweise           */
  --color-accent: #9A5B2C;         /* Primär-Aktion, aktiver Tab       */
  --color-accent-pressed: #7C4620; /* Button gedrückt                  */
  --color-accent-tint: #F0E2D2;    /* Chips, Sekundär-Fills, Track     */
  --color-secondary: #7A8467;      /* Begleiter, Datenviz, Tags        */
  --color-success: #4F7A52;        /* Ready to harvest                 */
  --color-success-tint: #E4EADC;
  --color-warning: #C88A2E;        /* Überfällig, "feed me"            */
  --color-warning-tint: #F7E9CF;
  --color-danger: #A6412E;         /* Destruktiv, Schimmel-Alarm       */
  --color-hairline: #E8DECB;       /* 1px-Trenner, Disabled-Fill       */
  --color-disabled-text: #A79E92;  /* nie unter 3:1 Kontrast           */
  --color-disabled-fill: #F3EEE3;

  /* ---- §1.3 Abstände (FermentSpace, 8pt-Skala) ---- */
  --space-xs: 4px;   /* Icon ↔ Label              */
  --space-sm: 8px;   /* innerhalb Chips           */
  --space-md: 16px;  /* Card-Padding, Gutter      */
  --space-lg: 24px;  /* Card ↔ Card, Sektionstop  */
  --space-xl: 32px;  /* Header ↔ Content          */
  --space-xxl: 48px; /* Empty-State-Luft          */

  /* ---- §1.3 Layout ---- */
  --screen-h: 20px;          /* horizontaler Seitenabstand */
  --list-gap: 12px;
  --nav-height: 64px;
  --content-max: 720px;      /* Lesespalte (Web-Anpassung von contentMaxWidth 600) */

  /* ---- §Web Fluide Typo-Skala (Wiki-Erweiterung; App-Konstanten oben bleiben unberührt) ----
     clamp(min, bevorzugt, max): wächst mit dem Viewport, bleibt aber in Grenzen.
     Fallbacks (feste px) stehen jeweils vor der var()-Zeile in base.css. */
  --fs-display: clamp(2.5rem, 3.5vw + 1rem, 3.5rem);    /* H1 · 40 → 56 px */
  --fs-h2:      clamp(1.5rem, 0.9vw + 1.05rem, 1.9rem); /* H2 · 24 → 30,4 px */
  --fs-lede:    clamp(1.15rem, 0.8vw + 0.95rem, 1.35rem);/* Intro-Absatz · 18,4 → 21,6 px */
  --fs-body:    clamp(1rem, 0.2vw + 0.95rem, 1.0625rem);/* Fließtext · 16 → 17 px */
  --section-gap: clamp(3rem, 6vw, 5rem);                /* Sektionsrhythmus · 48 → 80 px */

  /* ---- §Web Typ-Farben je Fermentart (Wiki-Erweiterung) ----
     Quelle: Design-Mock Rezept-Detail.dc.html („types“-Palette).
     Die fünf dort definierten Paare sind 1:1 übernommen; ginger_bug
     und jun fehlen im Mock und sind aus bestehenden Token-Paaren
     gemappt (warning/success), damit nichts Neues erfunden wird.
     Genutzt von den Detailseiten (Icon-Kacheln, Crosslink-Karten):
     .type-tile--<typ> in gallery.css. */
  --type-kombucha-fill: #FFF3D6;     --type-kombucha-ink: #9A5B2C;
  --type-water-kefir-fill: #E6EFF0;  --type-water-kefir-ink: #4A6668;
  --type-milk-kefir-fill: #EDEFE8;   --type-milk-kefir-ink: #5D6650;
  --type-vegetable-fill: #FBE3E8;    --type-vegetable-ink: #A6412E;
  --type-sourdough-fill: #F0E2D2;    --type-sourdough-ink: #9A5B2C;
  --type-ginger-bug-fill: #F7E9CF;   /* = --color-warning-tint */
  --type-ginger-bug-ink: #8A6420;
  --type-jun-fill: #E4EADC;          /* = --color-success-tint */
  --type-jun-ink: #4F7A52;           /* = --color-success */

  /* ---- §Web Hinweis-Karten (Wiki-Erweiterung, Mock „notes“) ---- */
  --notice-bg: #FDF0D8;
  --notice-ink: #8A6420;

  /* ---- §1.3 Radien (FermentRadius) ---- */
  --radius-card: 20px;
  --radius-control: 14px;
  --radius-pill: 999px;
  --radius-tile: 16px;

  /* ---- §1.1 Elevation — genau zwei Stufen, sonst nichts ---- */
  --shadow-card: 0 2px 8px rgba(0, 0, 0, .06);   /* ruhende Cards   */
  --shadow-sheet: 0 8px 24px rgba(0, 0, 0, .10); /* Sheets/Dragged  */

  /* ---- §9 Motion ---- */
  --motion-fast: 200ms;
  --motion-base: 280ms;
  --motion-slow: 600ms;
  --ease-emphasized: cubic-bezier(.2, 0, 0, 1);

  /* ---- §1.2 Schriftrollen (FermentText) ---- */
  --font-serif: "Instrument Serif", Georgia, serif;
  --font-sans: "IBM Plex Sans", -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", monospace;
}

/* Reduce motion: Zustandswechsel nur als Cross-Fade, keine Reisen. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-fast: 0ms;
    --motion-base: 0ms;
    --motion-slow: 0ms;
  }
}