/* tokens.css — shkalla e përbashkët e dizajnit (auditi 10/2026, F1).
 *
 * Ngjyrat e markës (--ink, --accent, --paper, --blue, --gold…) mbeten te blloku inline i
 * _Layout, sepse vijnë nga konfigurimi i adminit. Këtu jetojnë tokenat statikë që deri tani
 * ishin shkruar me dorë nëpër faqe: hapësirat, rrezet, madhësitë e tekstit, ngjyrat e gjendjeve
 * (sukses/rrezik/paralajmërim), unaza e fokusit. Tema e errët i ripërcakton në një vend.
 *
 * Rregull për CSS të re: përdor var(--…) nga këtu ose nga blloku i markës — jo hex të shkruar
 * me dorë. Testi InlineStyleBudgetTests mban numrin e ngjyrave hex në view-t që të mos rritet.
 */
:root {
    /* Paleta statike e markës (Kryje v1.0) — e njëjtë me bllokun inline të _Layout, këtu që të
       ekzistojë edhe te _FocusLayout/_AdminLayout. --ink/--accent vijnë nga konfigurimi. */
    --blue: #2447A8;
    --blue-tint: #E3E9F8;
    --gold: #F4B63A;
    --accent-deep: #C4501C;
    --accent-soft: #FDE6D6;

    /* hapësirat (shkallë 4 px) */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 24px;
    --space-6: 32px;
    --space-7: 48px;
    --space-8: 64px;

    /* rrezet */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-pill: 999px;

    /* tipografia — Archivo për gjithçka, JetBrains Mono vetëm për çmime/etiketa (udhëzuesi Kryje) */
    --font-sans: 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
    --fs-xs: .75rem;
    --fs-sm: .875rem;
    --fs-md: 1rem;
    --fs-lg: 1.125rem;
    --fs-xl: 1.375rem;
    --fs-2xl: 1.75rem;
    --fs-3xl: 2.25rem;

    /* gjendjet */
    --success: #186A42;
    --success-tint: #E2F3E9;
    --danger: #B42318;
    --danger-tint: #FCE8E6;
    --warn: #9A5B00;
    --warn-tint: #FDF0D8;
    --info: var(--blue, #2447A8);
    --info-tint: var(--blue-tint, #E3E9F8);

    /* hijet */
    --shadow-sm: 0 1px 2px rgba(19, 28, 51, .06), 0 1px 3px rgba(19, 28, 51, .08);
    --shadow-md: 0 8px 24px -12px rgba(19, 28, 51, .25);

    /* Sfondi i theksit kur mbi të ka tekst të bardhë: portokallia e markës (#EC6A2C) me të bardhë
       jep vetëm 3.1:1 — nën AA (4.5:1). 85% në oklab = #BE5421 (4.7:1), praktikisht --accent-deep
       i udhëzuesit Kryje; ndjek ngjyrën e konfiguruar nga admini. Theksi si ngjyrë dekorative
       (ikona, kufij, sfonde pa tekst) mbetet --accent. */
    --accent-fill: color-mix(in oklab, var(--accent, #EC6A2C) 85%, #000);
    --accent-fill-press: color-mix(in oklab, var(--accent, #EC6A2C) 74%, #000);
    /* Teksti me ngjyrën e theksit mbi sfond të çelët (lidhje, etiketa): 78% → ≥ 4.9:1 edhe mbi sfondet e zbehta portokalli. */
    --accent-text: color-mix(in oklab, var(--accent, #EC6A2C) 78%, #000);

    /* fokusi — i dukshëm në të dy temat (WCAG 2.2, 2.4.7 / 2.4.11) */
    --focus-ring: 0 0 0 3px color-mix(in oklab, var(--accent, #EC6A2C) 45%, transparent);
    --focus-outline: 2px solid var(--accent, #EC6A2C);

    /* lartësia minimale e objektivave me prekje */
    --tap: 44px;
}

html[data-theme="dark"] {
    /* Mbi sfond të errët theksi origjinal ka kontrast të mjaftueshëm si tekst. */
    --accent-text: var(--accent, #EC6A2C);
    --success: #5FD394;
    --success-tint: rgba(95, 211, 148, .14);
    --danger: #FF8A7A;
    --danger-tint: rgba(255, 138, 122, .14);
    --warn: #F5B95B;
    --warn-tint: rgba(245, 185, 91, .14);
    --info: #8FB0FF;
    --info-tint: rgba(143, 176, 255, .14);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
    --shadow-md: 0 8px 24px -12px rgba(0, 0, 0, .7);
}

/* Lëvizje e reduktuar: karuseli, skeletonët, tërheqja-për-rifreskim dhe tranzicionet ndalen. */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}
