/* ============================================================
Melhor Passagem · Agency OS — Design Tokens (camada ds-)
------------------------------------------------------------
Fase 1: SÓ variáveis — nada aqui altera o visual atual.
Os componentes (ds-components.css) e as telas passam a
consumir estas variáveis nas fases seguintes.
Reversão total: remover a classe "ds-theme" do ou o
deste arquivo no console.html. Nenhum seletor abaixo
estiliza elementos existentes.
Regra de ouro: NENHUM hex fora deste arquivo.
============================================================ */
.ds-theme {
/* ── marca (escala) ─────────────────────────────────────── */
--ds-brand-00: #FAFBFF;
--ds-brand-25: #F7FAFD;
--ds-brand-50: #EFF7FF;
--ds-brand-200: #DAE6FF;
--ds-brand-300: #BDD4FF;
--ds-brand-400: #5C93FE;
--ds-brand-600: #224CF0;
--ds-brand-700: #1836DD;
--ds-brand-800: #1A2DB3;
--ds-brand-900: #1B2D8D;
--ds-brand-950: #151D56;
/* ── ação ───────────────────────────────────────────────── */
--ds-acao: #224CF0;
--ds-acao-hover: #1B3DD0;
--ds-foco: #0B4DF8;
/* ── identidade oficial (cores da logo) ─────────────────── */
--ds-mp-navy: #061944;
--ds-mp-vivo: #1582FF;
--ds-mp-escuro: #0754F2;
--ds-grad-marca: linear-gradient(118deg, var(--ds-acao) 20%, var(--ds-mp-vivo) 100%);
--ds-grad-marca-hover: linear-gradient(118deg, var(--ds-acao-hover) 20%, var(--ds-mp-escuro) 100%);
/* ── texto ──────────────────────────────────────────────── */
--ds-texto: #1F2C7C;
--ds-titulo: #1B2D8D;
--ds-texto-sec: #525252;
--ds-texto-meta: #737373;
--ds-texto-forte: #262626;
/* ── neutros ────────────────────────────────────────────── */
--ds-n-50: #FAFAFA;
--ds-n-100: #F5F5F5;
--ds-n-200: #E5E5E5;
--ds-n-300: #D4D4D4;
--ds-n-400: #A1A1A1;
--ds-n-500: #737373;
--ds-n-600: #525252;
--ds-n-700: #404040;
--ds-n-800: #262626;
/* ── feedback ───────────────────────────────────────────── */
--ds-ok-icone: #007A55;
--ds-ok-texto: #006045;
--ds-ok-fundo: #D0FAE5;
--ds-erro-icone: #EF4444;
--ds-erro-texto: #A21212;
--ds-erro-fundo: #FCE4E4;
--ds-erro-borda-input: #D16670;
--ds-alerta-icone: #EC6623;
--ds-alerta-texto: #894B00;
--ds-alerta-fundo: #FDEAD7;
--ds-kpi-positivo: #10B981;
--ds-kpi-negativo: #EF4444;
/* ── superfícies ────────────────────────────────────────── */
--ds-branco: #FFFFFF;
--ds-painel-frio: #F4F8FC;
--ds-kpi-fundo: #F6FAFE;
--ds-trilho: #F5F5F5;
--ds-menu-hover: #DAEAFB;
--ds-submenu-ativo: #CCDEFF;
/* ── companhias aéreas (avatar) ─────────────────────────── */
--ds-cia-latam: #E0004D;
--ds-cia-gol: #FF7020;
--ds-cia-azul: #00A4E0;
--ds-cia-tap: #00A54F;
--ds-cia-iberia: #D7192D;
--ds-cia-neutra: #1A2DB3;
/* ── tipografia ─────────────────────────────────────────── */
--ds-fonte: 'Be Vietnam Pro', 'Plus Jakarta Sans', 'Hanken Grotesk',
-apple-system, 'Segoe UI', sans-serif;
--ds-peso-corpo: 500; /* padrão do body é 500, não 400 */
--ds-espaco-letras: .05em; /* assinatura visual */
--ds-altura-linha: 1.5;
--ds-tam-h1: 26px; --ds-altura-h1: 31px; --ds-peso-h1: 400;
--ds-tam-h2: 24px; --ds-peso-h2: 500;
--ds-tam-secao: 20px; --ds-peso-secao: 500;
--ds-tam-corpo: 16px;
--ds-tam-sec: 14px;
--ds-tam-meta: 12px;
--ds-tam-kpi: 32px; --ds-peso-kpi: 700;
/* ── raios ──────────────────────────────────────────────── */
--ds-raio-menu: 4px;
--ds-raio-pill-p: 6px;
--ds-raio-input: 8px;
--ds-raio-status: 8px;
--ds-raio-botao: 12px;
--ds-raio-chip: 12px;
--ds-raio-kpi: 12px;
--ds-raio-avatar: 16px;
--ds-raio-modal: 24px;
--ds-raio-secao: 32px;
--ds-raio-pill: 999px;
/* ── espaços (só estes) ─────────────────────────────────── */
--ds-esp-2: 2px; --ds-esp-4: 4px; --ds-esp-6: 6px; --ds-esp-8: 8px;
--ds-esp-10: 10px; --ds-esp-12: 12px; --ds-esp-16: 16px; --ds-esp-20: 20px;
--ds-esp-24: 24px; --ds-esp-28: 28px; --ds-esp-32: 32px; --ds-esp-40: 40px;
/* ── sombras (card de conteúdo = borda, nunca sombra) ───── */
--ds-sombra-dropdown: 0 4px 12px rgba(0, 0, 0, .15);
--ds-sombra-flyout: 0 12px 16px -4px rgba(16, 29, 40, .08);
--ds-sombra-modal: 0 10px 25px rgba(0, 0, 0, .15);
--ds-sombra-drawer: -4px 0 24px rgba(0, 0, 0, .10);
/* ── layout ─────────────────────────────────────────────── */
--ds-conteudo-max: 1208px;
--ds-conteudo-pad: 32px;
--ds-bloco-gap: 16px;
--ds-sidebar-larg: 175px;
/* ── ícones embutidos (data-URI; hex só vive aqui) ─────── */
--ds-icone-busca: url("data:image/svg+xml;utf8,");
--ds-icone-chevron: url("data:image/svg+xml;utf8,");
/* breakpoints de referência (media query não aceita var):
1440 / 1200 / 1024 / 900 / 768 (principal) / 640 / 480 */
}