:root {
}

:root {

    /* =====================================
        IDENTIDADE VISUAL
    ===================================== */

    --cor-vermelho: #970000;
    --cor-vermelho-hover: #7a0000;

    --cor-laranja: #e67e22;
    --cor-laranja-hover: #d35400;

    /* =====================================
        SEMÂNTICAS
    ===================================== */

    --cor-success: #16a34a;
    --cor-success-bg: #dcfce7;
    --cor-success-text: #166534;

    --cor-warning: #facc15;
    --cor-warning-bg: #fef3c7;
    --cor-warning-text: #92400e;

    --cor-danger: #dc2626;

    --cor-info: #2563eb;
    --cor-info-hover: #1d4ed8;

    /* =====================================
        BACKGROUNDS
    ===================================== */

    --bg-body: #f5f7fa;
    --bg-card: #ffffff;
    --bg-hover: #f9fafb;
    --bg-hover-blue: #eff6ff;
    --cor-fundo: #f9fafb;

    /* =====================================
        TEXTO
    ===================================== */

    --text-primary: #111827;
    --text-secondary: #6b7280;
    --text-white: #ffffff;

    /* =====================================
        CINZAS
    ===================================== */

    --gray-100: #f3f4f6;
    --gray-200: #e5e7eb;
    --gray-300: #d1d5db;
    --gray-400: #9ca3af;
    --gray-500: #6b7280;
    --gray-600: #4b5563;
    --gray-700: #374151;
    --gray-800: #1f2937;
    --gray-900: #111827;

    /* =====================================
        BORDAS
    ===================================== */

    --border-cor: #e5e7eb;

    /* =====================================
        SOMBRAS
    ===================================== */

    --shadow-sm: 0 1px 2px rgba(0,0,0,.05);
    --shadow-md: 0 4px 12px rgba(0,0,0,.08);
    --shadow-lg: 0 10px 30px rgba(0,0,0,.12);

    /* =====================================
        RADIUS
    ===================================== */

    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;

    --borda-radius: 8px;

    /* =====================================
        BUTTONS
    ===================================== */

    --btn-height-sm: 36px;
    --btn-height-md: 44px;
    --btn-height-lg: 52px;

    --btn-padding-x: 18px;

    --btn-font-size: 14px;
    --btn-font-weight: 600;

    --btn-gap: 8px;

    --btn-radius: var(--radius-md);

    --btn-transition:
        background .2s,
        border-color .2s,
        color .2s,
        transform .15s;
}