/* ============================================================
   Carregado antes de app.css e auth.css (via base.html).
   Todas as variáveis que devem ser padronizadas no layout
   devem ser definidas neste arquivo.
   ============================================================ */

/* Oswald auto-hospedado (placar "Ao Vivo") - variável 200..700 num arquivo só,
   subset latin (cobre os acentos PT). Sem dependência de CDN externa. */
@font-face {
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 200 700;
    font-display: swap;
    src: url('../fonts/oswald-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    /* Tipografia */
    --font: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
    /* Fonte de display (placar/transmissão "Ao Vivo"); cai pra --font se não carregar */
    --font-display: 'Oswald', var(--font);

    /* Coral */
    --coral: #129666;
    --coral-2: #4da621;
    --coral-bg: #edfae1;
    --grad-coral: linear-gradient(90deg, var(--coral), var(--coral-2));

    /* Texto e cinzas */
    --ink: #0f172a;
    --slate: #334155;
    --muted: #64748b;
    --muted-2: #94a3b8;
    --nav-link: #cbd5e1;

    /* Superfícies */
    --bg: #f1f5f9;
    --surface: #f8fafc;
    --surface-white: #ffffff;
    --mist: #f2faed;
    --line: #e6ede9;

    /* Sidebar */
    --grad-sidebar: linear-gradient(180deg, #0f172a, #111827);

    /* Odds */
    --odd: #2563eb;
    --odd-bg: #d9e5ff;

    /* Avaliação do palpite (exato / saldo / vencedor / erro) */
    --green-strong: #28a745;
    --green-soft: #b6f2b6;
    --green-deep: #204020;
    --yellow-soft: #f2ea91;
    --yellow-strong: #f4c535;
    --brown-deep: #4d3422;
    --red-soft: #fecaca;
    --red-strong: #b32424;
    --red-deep: #661414;

    /* Autenticação (telas de login) */
    --grad-auth: linear-gradient(135deg, #0f2027, #2c5364);
    --error-text: #9b1c1c;
    --success-bg: #f0fff4;
    --success-fg: #144620;

    /* Forma */
    --radius-sm: 4px;
    --radius: 8px;
    --radius-lg: 12px;

    /* Espaçamento (margin / padding / gap). */
    --space-2: 2px;
    --space-4: 4px;
    --space-6: 6px;
    --space-8: 8px;
    --space-10: 10px;
    --space-12: 12px;
    --space-14: 14px;
    --space-16: 16px;
    --space-20: 20px;
    --space-24: 24px;
    --space-28: 28px;
    --space-32: 32px;
}

* {
    box-sizing: border-box;
}

html,
body {
    height: 100%;
    margin: 0;
}

body {
    font-family: var(--font);
}