/**
 * KriptoHukuku.com — Design Token Sistemi (docs/12 CSS kuralları)
 * Kurumsal, sakin, güven veren hukuk bürosu estetiği.
 * WCAG 2.2 AA kontrast: koyu zemin metinleri daima açık token'lardan seçilir.
 */

:root {
    /* ---- Renkler: Primary (lacivert — kurumsal ana renk) ---- */
    --color-primary-900: #0d1b33;
    --color-primary-800: #12264a;
    --color-primary-700: #1a3563;
    --color-primary-600: #234478;
    --color-primary-500: #2f568f;
    --color-primary-100: #dbe4f1;
    --color-primary-050: #eef2f9;

    /* ---- Renkler: Accent (bakır/altın — vurgu, tutumlu kullanım) ---- */
    --color-accent-600: #9a6b1f;
    --color-accent-500: #b8842e;
    --color-accent-100: #f3e8d4;

    /* ---- Renkler: Neutral ---- */
    --color-neutral-900: #171a1f;
    --color-neutral-700: #3d434c;
    --color-neutral-500: #6a7280;
    --color-neutral-300: #c4c9d1;
    --color-neutral-100: #e9ebee;
    --color-neutral-050: #f6f7f9;
    --color-white: #ffffff;

    /* ---- Semantik ---- */
    --color-success: #1d6b3a;
    --color-warning: #8a5a00;
    --color-danger: #9c2121;
    --color-focus: #2f568f;

    /* Koyu zeminde METİN için (kontrast kuralı — asla dark-on-dark) */
    --color-text-on-dark: #f2f5fa;
    --color-text-on-dark-muted: #c7d2e3;
    /* Açık zeminde METİN için (asla light-on-light) */
    --color-text-on-light: var(--color-neutral-900);
    --color-text-on-light-muted: var(--color-neutral-700);

    /* ---- Tipografi ---- */
    --font-sans: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    --font-serif: Georgia, "Times New Roman", serif;
    --font-size-100: 0.8125rem;  /* 13px */
    --font-size-200: 0.9375rem;  /* 15px */
    --font-size-300: 1.0625rem;  /* 17px — gövde */
    --font-size-400: 1.25rem;    /* 20px */
    --font-size-500: 1.5625rem;  /* 25px */
    --font-size-600: 1.9375rem;  /* 31px */
    --font-size-700: 2.4375rem;  /* 39px */
    --font-size-800: 3.0625rem;  /* 49px */
    --line-height-tight: 1.2;
    --line-height-base: 1.6;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;

    /* ---- Aralık ritmi (4px taban) ---- */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;
    --space-9: 6rem;

    /* ---- Border radius ---- */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 14px;

    /* ---- Gölgeler (yumuşak, kurumsal) ---- */
    --shadow-sm: 0 1px 3px rgba(13, 27, 51, 0.10);
    --shadow-md: 0 4px 14px rgba(13, 27, 51, 0.12);
    --shadow-lg: 0 12px 32px rgba(13, 27, 51, 0.16);

    /* ---- Container ---- */
    --container-max: 72rem;      /* 1152px */
    --container-narrow: 46rem;   /* 736px — makale okuma genişliği */
    --container-pad: var(--space-4);

    /* ---- Z-index katmanları ---- */
    --z-base: 0;
    --z-header: 100;
    --z-dropdown: 200;
    --z-modal: 400;
    --z-toast: 500;

    /* ---- Breakpoint referansları (media query'de değişken kullanılamaz;
            kod içinde bu değerlerle tutarlı kalınır)
            sm: 480px, md: 768px, lg: 1024px, xl: 1280px ---- */
}