/* ============================================
   TERAPRINT DESIGN TOKENS v2.0
   Nur Variablen, keine Regeln.
   NUR FRONTEND — Admin hat eigenes Design-System!
   ============================================ */

:root {
    /* === SCHRIFTGROESSEN (7 Stufen, rem-basiert) === */
    --tp-text-xs:   0.625rem;   /* 10px — Badges, Tags, Meta           */
    --tp-text-sm:   0.75rem;    /* 12px — Labels, Beschreibungen       */
    --tp-text-base: 0.875rem;   /* 14px — Fliesstext, Buttons, Standard */
    --tp-text-md:   1rem;       /* 16px — Sub-Headlines, Preise, CTA   */
    --tp-text-lg:   1.125rem;   /* 18px — Section-Ueberschriften       */
    --tp-text-xl:   1.5rem;     /* 24px — Seiten-Headlines             */
    --tp-text-2xl:  1.875rem;   /* 30px — Hero-Headlines               */

    /* === TEXTFARBEN (3 Stufen + Brand) === */
    /* WCAG AA geprueft auf #fff Hintergrund            */
    --tp-text-primary:   #2d2d2d;  /* 13.77:1 AA+AAA — Headlines, Haupttext      */
    --tp-text-secondary: #6b7280;  /*  4.83:1 AA     — Labels, Beschreibungen    */
    --tp-text-decorative: #9ca3af; /* 2.54:1 WCAG-FAIL — NUR Placeholder, Dividers, Icons. NIE fuer lesbaren Text! */

    /* === BRAND FARBEN === */
    --tp-blue:        #337ab7;  /* 4.56:1 AA — Links, aktive Elemente           */
    --tp-orange:      #f36f21;  /* NUR als Fill/Background, NIE als Text auf weiss  */
    --tp-orange-text: #e8650e;  /* 3.13:1 AA-large — NUR mit >=18px bold oder >=24px! */
    --tp-error:       #dc2626;
    --tp-success:     #16a34a;
    --tp-white:       #ffffff;

    /* === FONT WEIGHTS === */
    /* Roboto 400/500/700 geladen via Google Fonts         */
    --tp-font-normal:   400;
    --tp-font-medium:   500;
    --tp-font-bold:     700;

    /* === LINE HEIGHTS === */
    --tp-lh-tight: 1.25;       /* Headlines                     */
    --tp-lh-base:  1.5;        /* Fliesstext                    */
    --tp-lh-loose: 1.75;       /* Lesetexte                     */

    /* === FONT FAMILIES === */
    --tp-font:      'Roboto', -apple-system, BlinkMacSystemFont, sans-serif;
    --tp-font-mono: 'Roboto Mono', 'Courier New', monospace;
}

/* === RESPONSIVE TOKENS (Mobile) === */
@media (max-width: 768px) {
    :root {
        --tp-text-md:  0.9375rem;  /* 15px */
        --tp-text-lg:  1.0625rem;  /* 17px */
        --tp-text-xl:  1.25rem;    /* 20px */
        --tp-text-2xl: 1.5rem;     /* 24px */
    }
}