/**
 * Monolox Privacy Suite – Design Tokens
 * Single source of truth für Brand-Farben, Typografie, Spacing, Radien, Schatten.
 * Wird sowohl vom Admin-Dashboard-CSS als auch vom Marketing-Page-CSS geladen.
 *
 * @since 4.19.0
 */

:root {
    /* === Farben === */
    --mlxc-primary:        #0F766E;
    --mlxc-primary-dark:   #115E59;
    --mlxc-primary-light:  #5EEAD4;
    --mlxc-surface:        #F8FAFA;
    --mlxc-ink:            #0F1E1C;
    --mlxc-mid:            #64748B;
    --mlxc-border:         #E2E8F0;

    /* State-Farben */
    --mlxc-success:        #16A34A;
    --mlxc-warning:        #D97706;
    --mlxc-error:          #DC2626;

    /* === Typografie === */
    --mlxc-font-sans:      'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

    /* Marketing-Skala */
    --mlxc-fs-display:     64px;
    --mlxc-fs-h1:          48px;
    --mlxc-fs-h2:          32px;
    --mlxc-fs-h3:          24px;
    --mlxc-fs-lead:        18px;
    --mlxc-fs-body:        16px;
    --mlxc-fs-small:       14px;

    /* Admin-Skala */
    --mlxc-fs-admin-h1:    20px;
    --mlxc-fs-admin-h2:    17px;
    --mlxc-fs-admin-body:  15px;
    --mlxc-fs-admin-small: 13px;

    --mlxc-lh-tight:       1.15;
    --mlxc-lh-snug:        1.35;
    --mlxc-lh-normal:      1.55;

    /* === Spacing === */
    --mlxc-sp-1:           4px;
    --mlxc-sp-2:           8px;
    --mlxc-sp-3:           12px;
    --mlxc-sp-4:           16px;
    --mlxc-sp-6:           24px;
    --mlxc-sp-8:           32px;
    --mlxc-sp-12:          48px;
    --mlxc-sp-16:          64px;
    --mlxc-sp-24:          96px;

    /* === Radien === */
    --mlxc-radius-sm:      6px;
    --mlxc-radius-md:      12px;
    --mlxc-radius-lg:      24px;

    /* === Schatten === */
    --mlxc-shadow-card:    0 1px 2px rgba(15, 30, 28, 0.04), 0 4px 12px rgba(15, 30, 28, 0.06);
    --mlxc-shadow-hover:   0 2px 4px rgba(15, 30, 28, 0.06), 0 8px 24px rgba(15, 30, 28, 0.10);

    /* === Transitions === */
    --mlxc-transition:     150ms ease-out;
}