/* ============================================
   SISTEMA DE TEMAS — tokens portáteis + bridge legado
   ============================================
   Tokens semânticos (fáceis de reutilizar em outro projeto):
   - --color-shell / hover / active / on-shell → topo da app, cabeçalhos de modal
   - --color-nav / hover / active / on-nav → sidebar / navegação lateral
   - --color-brand / hover / active / border / on-brand → ações, links, primária UI
   - --color-emphasis → tom escuro para gradientes e compat com --theme-primary-dark

   Legado (mantido para não quebrar CSS/JS existentes):
   - --theme-primary, --theme-primary-dark
   - --primary-color, --primary-color-dark

   Temas alternativos: cada [data-theme="…"] redefine --theme-primary e sincroniza
   --color-brand e --color-emphasis para que componentes que usem tokens acompanhem.
*/

/* ============================================
   VALORES BASE (:root) — institucional + bridge
   ============================================ */
:root {
    --color-shell: #05245C;
    --color-shell-hover: #041c49;
    --color-shell-active: #031536;
    --on-shell: #ffffff;

    --color-nav: #082F7A;
    --color-nav-hover: #0a3a8f;
    --color-nav-active: #06266a;
    --on-nav: #ffffff;

    --color-brand: #155DFC;
    --color-brand-hover: #0f4ed6;
    --color-brand-active: #0b3fae;
    --color-brand-border: #155DFC;
    --on-brand: #ffffff;

    --color-emphasis: #002a5c;

    --theme-primary: var(--color-brand);
    --theme-primary-dark: var(--color-emphasis);

    /* Bootstrap 5 — primária alinhada à marca */
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 21, 93, 252;
}

/* ============================================
   TEMA PADRÃO (explicita reset ao alternar de outros temas)
   ============================================ */
[data-theme="default"],
[data-theme="red"] {
    --color-shell: #05245C;
    --color-shell-hover: #041c49;
    --color-shell-active: #031536;
    --on-shell: #ffffff;

    --color-nav: #082F7A;
    --color-nav-hover: #0a3a8f;
    --color-nav-active: #06266a;
    --on-nav: #ffffff;

    --color-brand: #155DFC;
    --color-brand-hover: #0f4ed6;
    --color-brand-active: #0b3fae;
    --color-brand-border: #155DFC;
    --on-brand: #ffffff;

    --color-emphasis: #002a5c;

    --theme-primary: var(--color-brand);
    --theme-primary-dark: var(--color-emphasis);

    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 21, 93, 252;
}

/* ============================================
   TEMA AZUL
   ============================================ */
[data-theme="blue"] {
    --theme-primary: #0d6efd;
    --theme-primary-dark: #0a58ca;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 13, 110, 253;
}

/* ============================================
   TEMA VERDE
   ============================================ */
[data-theme="green"] {
    --theme-primary: #198754;
    --theme-primary-dark: #146c43;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 25, 135, 84;
}

/* ============================================
   TEMA ROXO
   ============================================ */
[data-theme="purple"] {
    --theme-primary: #6f42c1;
    --theme-primary-dark: #5a32a3;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 111, 66, 193;
}

/* ============================================
   TEMA LARANJA
   ============================================ */
[data-theme="orange"] {
    --theme-primary: #fd7e14;
    --theme-primary-dark: #dc6502;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 253, 126, 20;
}

/* ============================================
   TEMA CIANO
   ============================================ */
[data-theme="cyan"] {
    --theme-primary: #0dcaf0;
    --theme-primary-dark: #0aa2c0;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 13, 202, 240;
}

/* ============================================
   TEMA ROSA
   ============================================ */
[data-theme="pink"] {
    --theme-primary: #d63384;
    --theme-primary-dark: #b02a5b;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 214, 51, 132;
}

/* ============================================
   TEMA ÍNDIGO
   ============================================ */
[data-theme="indigo"] {
    --theme-primary: #6610f2;
    --theme-primary-dark: #520dc2;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 102, 16, 242;
}

/* ============================================
   TEMA AZURE
   ============================================ */
[data-theme="azure"] {
    --theme-primary: #0B6EFF;
    --theme-primary-dark: #0546a6;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 11, 110, 255;
}

/* ============================================
   TEMA OLIVE
   ============================================ */
[data-theme="olive"] {
    --theme-primary: #606C38;
    --theme-primary-dark: #283618;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 96, 108, 56;
}

/* ============================================
   TEMA HONEY
   ============================================ */
[data-theme="honey"] {
    --theme-primary: #ffb400;
    --theme-primary-dark: #c48b00;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 255, 180, 0;
}

/* ============================================
   TEMA MIDNIGHT
   ============================================ */
[data-theme="midnight"] {
    --theme-primary: #6510EF;
    --theme-primary-dark: #4d00c9;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 101, 16, 239;
}

/* ============================================
   TEMA CITRUS
   ============================================ */
[data-theme="citrus"] {
    --theme-primary: #F6511D;
    --theme-primary-dark: #bf3c13;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 246, 81, 29;
}

/* ============================================
   TEMA ONYX
   ============================================ */
[data-theme="onyx"] {
    --theme-primary: #333333;
    --theme-primary-dark: #000000;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 51, 51, 51;
}

/* ============================================
   TEMA TEAL
   ============================================ */
[data-theme="teal"] {
    --theme-primary: #00BEAC;
    --theme-primary-dark: #006064;
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
    --bs-primary-rgb: 0, 190, 172;
}

/* ============================================
   TEMA CUSTOM (cores via JS: --custom-primary-*)
   ============================================ */
[data-theme="custom"] {
    --theme-primary: var(--custom-primary-color, #155DFC);
    --theme-primary-dark: var(--custom-primary-dark-color, #002a5c);
    --color-brand: var(--theme-primary);
    --color-emphasis: var(--theme-primary-dark);
    --bs-primary: var(--color-brand);
}

/* ============================================
   APLICA AS CORES DO TEMA NAS VARIÁVEIS PRIMÁRIAS (legado)
   ============================================ */
:root,
[data-bs-theme="light"] {
    --primary-color: var(--theme-primary, var(--color-brand, #155DFC));
    --primary-color-dark: var(--theme-primary-dark, var(--color-emphasis, #002a5c));
}

[data-bs-theme="dark"] {
    --primary-color: var(--theme-primary, var(--color-brand, #155DFC));
    --primary-color-dark: var(--theme-primary-dark, var(--color-emphasis, #002a5c));
}
