/* ============================================================================
   voa-theme.css — Rebrand VOA Esportes (preto + limão) sobre o app de gestão.
   Carregado por ÚLTIMO no base.html: redefine as variáveis --gosh-* para a
   paleta VOA e converte as superfícies para o tema escuro.
   Reversível: basta remover o <link> deste arquivo (volta ao tema índigo).
   Marca: preto #0C0C0C + limão #DDFB05 (deck Estúdio Barra / brandbook VOA).
   ============================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@400;500;600;700;800&family=Space+Mono:wght@400;700&display=swap');

@font-face{ font-family:'Bebas Neue Pro Expanded'; font-weight:700; font-display:swap;
  src:url('fonts/bebas-neue-pro/bebas-neue-pro-expanded-700.woff2') format('woff2'); }
@font-face{ font-family:'Bebas Neue Pro Expanded'; font-weight:800; font-display:swap;
  src:url('fonts/bebas-neue-pro/bebas-neue-pro-expanded-800.woff2') format('woff2'); }

:root{
  /* --- remapeia as variáveis --gosh-* (usadas por todo o app) para VOA --- */
  --gosh-primary:   #DDFB05;   /* acento: CTAs, ativos, destaques */
  --gosh-secondary: #B4CC00;
  /* ATENÇÃO: --gosh-dark era usado como COR DE TEXTO em ~23 lugares (títulos,
     labels). Por isso vira CLARO aqui; os 3 usos como FUNDO (.sidebar,
     .mobile-menu-btn, .chat-sidebar) são reafirmados escuros mais abaixo. */
  --gosh-dark:      #EFEFEA;
  --gosh-cream:     #0C0C0C;   /* fundo do app */
  --gosh-beige:     rgba(239,239,234,.12);  /* linhas/bordas */
  --gosh-gold:      #F5B23D;
  --gosh-green:     #DDFB05;   /* valores positivos = limão */
  --gosh-brown:     #9A9A94;   /* texto secundário */

  /* --- tokens VOA --- */
  --voa-lime:#DDFB05; --voa-lime-deep:#B4CC00;
  --voa-black:#0C0C0C; --voa-black-2:#050505;
  --voa-surface:#151515; --voa-surface-2:#1E1E1E;
  --voa-ink:#EFEFEA; --voa-gray:#C9C9C4; --voa-dim:#8A8A85;
  --voa-line:rgba(239,239,234,.12); --voa-line-2:rgba(239,239,234,.22);
  --voa-neg:#FF6A4D; --voa-warn:#F5B23D;

  --gp-ink:#EFEFEA;
  --gp-soft:rgba(221,251,5,.14);
  --gp-shadow:    0 1px 2px rgba(0,0,0,.5), 0 8px 24px rgba(0,0,0,.45);
  --gp-shadow-lg: 0 2px 4px rgba(0,0,0,.5), 0 18px 48px rgba(0,0,0,.6);
  --gp-ease:cubic-bezier(.16,1,.3,1);

  --font-display:'Bebas Neue Pro Expanded','Figtree',system-ui,sans-serif;
  --font-body:'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-brand:'Bebas Neue Pro Expanded','Figtree',system-ui,sans-serif;

  /* Controles nativos (scrollbar, checkbox, date picker) em modo escuro */
  color-scheme: dark;

  /* Tokens do Bootstrap 5.3 remapeados p/ VOA — pega componentes não
     sobrescritos individualmente (dropdowns, list-group, tabelas, bordas) */
  --bs-body-bg:#0C0C0C; --bs-body-color:#EFEFEA;
  --bs-emphasis-color:#EFEFEA; --bs-secondary-color:rgba(201,201,196,.85); --bs-tertiary-color:rgba(138,138,133,.75);
  --bs-secondary-bg:#1E1E1E; --bs-tertiary-bg:#151515;
  --bs-border-color:rgba(239,239,234,.12); --bs-heading-color:#EFEFEA;
  --bs-link-color:#DDFB05; --bs-link-hover-color:#B4CC00;
  --bs-link-color-rgb:221,251,5;
}

/* ── Base ──────────────────────────────────────────────────────────────── */
body{
  background:var(--voa-black) !important;
  color:var(--voa-ink) !important;
  font-family:var(--font-body) !important;
  -webkit-font-smoothing:antialiased;
}
a{ color:var(--voa-lime); }
.text-muted{ color:var(--voa-dim) !important; }
hr{ border-color:var(--voa-line); }

/* Títulos de página e números grandes em Bebas (moderado — corpo fica Figtree) */
.page-header h1, .page-title, .gp-tb-t, .brand-title,
.stat-card .stat-value, .stat-value, .gp-donut .gp-hole b{
  font-family:var(--font-display) !important; letter-spacing:.01em !important; font-weight:800 !important;
}

/* ── Sidebar (preto VOA, ativo limão) ─────────────────────────────────── */
.sidebar{ background:var(--voa-black-2) !important; border-right:1px solid var(--voa-line) !important; }
.sidebar-logo svg{ height:26px; width:auto; color:var(--voa-lime); display:block; }
.sidebar-logo img{ filter:none; }
.sidebar-logo .brand-tagline{ color:var(--voa-dim) !important; font-family:var(--font-mono,'Space Mono',monospace); letter-spacing:.16em; text-transform:uppercase; font-size:9.5px !important; }
.sidebar-nav .nav-item{ color:var(--voa-gray) !important; border-radius:6px !important; }
.sidebar-nav .nav-item:hover{ background:var(--voa-surface) !important; color:var(--voa-ink) !important; }
.sidebar-nav .nav-item.active{
  background:var(--voa-lime) !important; color:#000 !important; font-weight:700 !important;
  box-shadow:0 6px 18px rgba(221,251,5,.22) !important;
}
.sidebar-nav .nav-item.active i{ color:#000 !important; }
.sidebar-nav .nav-section{ color:var(--voa-dim) !important; }
.sidebar-footer{ border-top:1px solid var(--voa-line) !important; }
.sidebar-footer .user-info{ background:var(--voa-surface) !important; }

/* ── Cards ─────────────────────────────────────────────────────────────── */
.card{ background:var(--voa-surface) !important; border:1px solid var(--voa-line) !important; border-radius:8px !important; color:var(--voa-ink); box-shadow:var(--gp-shadow) !important; }
.card-header{ background:var(--voa-surface) !important; border-bottom:1px solid var(--voa-line) !important; color:var(--voa-ink) !important; border-radius:8px 8px 0 0 !important; }
.stat-card, .project-card{ background:var(--voa-surface) !important; border:1px solid var(--voa-line) !important; border-radius:8px !important; }

/* ── Botões ────────────────────────────────────────────────────────────── */
.btn{ border-radius:6px !important; }
.btn-gosh, .btn-primary{
  background:var(--voa-lime) !important; border-color:var(--voa-lime) !important; color:#000 !important; font-weight:700 !important;
  box-shadow:0 6px 16px rgba(221,251,5,.20) !important;
}
.btn-gosh:hover, .btn-primary:hover{ background:var(--voa-lime-deep) !important; border-color:var(--voa-lime-deep) !important; color:#000 !important; filter:none; }
.btn-outline-gosh, .btn-outline-primary{ color:var(--voa-lime) !important; border-color:rgba(221,251,5,.4) !important; background:transparent !important; }
.btn-outline-gosh:hover, .btn-outline-primary:hover{ background:rgba(221,251,5,.12) !important; color:var(--voa-lime) !important; }
.btn-outline-secondary{ color:var(--voa-gray) !important; border-color:var(--voa-line-2) !important; }
.btn-outline-secondary:hover{ background:var(--voa-surface-2) !important; color:var(--voa-ink) !important; border-color:var(--voa-line-2) !important; }
/* Botões de ação positiva verdes → limão VOA (OK Final, Aprovar, Lançado…) */
.btn-success{ background:var(--voa-lime) !important; border-color:var(--voa-lime) !important; color:#000 !important; }
.btn-success:hover{ background:var(--voa-lime-deep) !important; border-color:var(--voa-lime-deep) !important; color:#000 !important; }
.btn-outline-success{ color:var(--voa-lime) !important; border-color:rgba(221,251,5,.4) !important; background:transparent !important; }
.btn-outline-success:hover{ background:rgba(221,251,5,.12) !important; color:var(--voa-lime) !important; }
/* btn-outline-dark (ex.: "Cancelar") era invisível no fundo preto → cinza legível */
.btn-outline-dark{ color:var(--voa-gray) !important; border-color:var(--voa-line-2) !important; background:transparent !important; }
.btn-outline-dark:hover{ background:var(--voa-surface-2) !important; color:var(--voa-ink) !important; border-color:var(--voa-line-2) !important; }
.btn-outline-warning{ color:#F5B23D !important; border-color:rgba(245,178,61,.4) !important; }
.btn-outline-warning:hover{ background:rgba(245,178,61,.12) !important; color:#F5B23D !important; }
.btn-light, .btn-outline-light{ background:var(--voa-surface-2) !important; color:var(--voa-ink) !important; border-color:var(--voa-line) !important; }
.text-gosh{ color:var(--voa-lime) !important; }
.bg-gosh{ background:var(--voa-lime) !important; color:#000 !important; }

/* ── Tabelas ───────────────────────────────────────────────────────────── */
.table{ --bs-table-bg:transparent; color:var(--voa-ink) !important; }
.table > thead th{ background:var(--voa-surface-2) !important; color:var(--voa-dim) !important; border-bottom:1px solid var(--voa-line) !important; }
.table > tbody td{ border-color:var(--voa-line) !important; color:var(--voa-ink) !important; }
.table-hover > tbody > tr:hover > *{ background:var(--voa-surface-2) !important; color:var(--voa-ink) !important; }

/* ── Forms ─────────────────────────────────────────────────────────────── */
/* background-COLOR (não o atalho 'background') p/ não resetar a seta do select */
.form-control, .form-select{
  background-color:var(--voa-surface-2) !important; color:var(--voa-ink) !important;
  border-color:var(--voa-line-2) !important; border-radius:6px !important;
}
.form-control::placeholder{ color:var(--voa-dim) !important; }
.form-control:focus, .form-select:focus{ background-color:var(--voa-surface-2) !important; color:var(--voa-ink) !important; border-color:var(--voa-lime) !important; box-shadow:0 0 0 3px rgba(221,251,5,.18) !important; }
.form-select{
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%238A8A85' stroke-width='2'%3e%3cpath d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
  background-repeat:no-repeat !important; background-position:right 12px center !important; background-size:14px 14px !important;
}
.form-label{ color:var(--voa-gray) !important; }
.input-group-text{ background:var(--voa-surface-2) !important; border-color:var(--voa-line-2) !important; color:var(--voa-dim) !important; }

/* ── Abas ──────────────────────────────────────────────────────────────── */
.nav-tabs{ border-bottom:1px solid var(--voa-line) !important; }
.nav-tabs .nav-link{ color:var(--voa-dim) !important; }
.nav-tabs .nav-link:hover{ background:var(--voa-surface-2) !important; color:var(--voa-ink) !important; }
.nav-tabs .nav-link.active{ color:var(--voa-lime) !important; background:transparent !important; border-bottom:2.5px solid var(--voa-lime) !important; }

/* ── Modais / dropdowns ────────────────────────────────────────────────── */
.modal-content{ background:var(--voa-surface) !important; color:var(--voa-ink) !important; border:1px solid var(--voa-line) !important; border-radius:10px !important; }
.modal-header, .modal-footer{ border-color:var(--voa-line) !important; }
.btn-close{ filter:invert(1) grayscale(1) brightness(1.6); }
.dropdown-menu{ background:var(--voa-surface) !important; border:1px solid var(--voa-line) !important; }
.dropdown-item{ color:var(--voa-ink) !important; }
.dropdown-item:hover{ background:var(--voa-surface-2) !important; color:var(--voa-lime) !important; }
.dropdown-item:active{ background:var(--voa-lime) !important; color:#000 !important; }

/* ── Badges / progress / alerts ────────────────────────────────────────── */
.badge.bg-secondary{ background:var(--voa-surface-2) !important; color:var(--voa-gray) !important; }
.progress{ background:var(--voa-surface-2) !important; }
.progress-bar{ background:var(--voa-lime) !important; color:#000; }
.alert{ background:var(--voa-surface) !important; color:var(--voa-ink) !important; border:1px solid var(--voa-line) !important; }
.alert-success{ border-left:3px solid var(--voa-lime) !important; }
.alert-danger{ border-left:3px solid var(--voa-neg) !important; }
.alert-warning{ border-left:3px solid var(--voa-warn) !important; }

/* ── Topbar premium (gp-*) ─────────────────────────────────────────────── */
.gp-topbar{ background:rgba(12,12,12,.82) !important; border-bottom:1px solid var(--voa-line) !important; }
.gp-search, .gp-iconbtn, .gp-avatar{ background:var(--voa-surface) !important; border:1px solid var(--voa-line) !important; color:var(--voa-gray) !important; }
.gp-search input{ color:var(--voa-ink) !important; }
.gp-iconbtn:hover{ color:var(--voa-lime) !important; }
.gp-cta{ background:var(--voa-lime) !important; color:#000 !important; box-shadow:0 8px 20px rgba(221,251,5,.22) !important; }
.gp-avatar{ color:var(--voa-lime) !important; }
.gp-tb-s{ color:var(--voa-dim) !important; }
.gp-kbd{ border-color:var(--voa-line-2) !important; color:var(--voa-gray) !important; }
.gp-nb{ border-color:var(--voa-black) !important; }
.stat-icon.primary{ background:var(--gp-soft) !important; color:var(--voa-lime) !important; }

/* ── Cards de projeto com capa (gp-pcard) — capas escuras ──────────────── */
.gp-pcard{ background:var(--voa-surface) !important; border:1px solid var(--voa-line) !important; }
/* SEM !important: quando o card tem foto de capa (background-image inline),
   a foto precisa ganhar. Estes gradientes valem só quando NÃO há capa. */
.gp-pcover{ background:linear-gradient(135deg,#1e2200,#3a4400); border-bottom:1px solid var(--voa-line); }
.gp-pcard.status-briefing .gp-pcover{ background:linear-gradient(135deg,#22242a,#33363e); }
.gp-pcard.status-em_criacao .gp-pcover{ background:linear-gradient(135deg,#132a1a,#1f4a30); }
.gp-pcard.status-proposta_enviada .gp-pcover{ background:linear-gradient(135deg,#2a2810,#4a4410); }
.gp-pcard.status-aprovado .gp-pcover{ background:linear-gradient(135deg,#2b3a00,#556e00); }
.gp-pcard.status-em_producao .gp-pcover{ background:linear-gradient(135deg,#1a2a12,#2f5a1e); }
.gp-pcard.status-realizado .gp-pcover{ background:linear-gradient(135deg,#233a00,#4a6e10); }
.gp-pcard.status-cancelado .gp-pcover{ background:linear-gradient(135deg,#242424,#333); }
.gp-pcover .badge{ background:rgba(0,0,0,.45) !important; color:var(--voa-ink) !important; }
.gp-cover-btn{ background:rgba(0,0,0,.45) !important; color:var(--voa-ink) !important; }
.gp-donut .gp-hole{ background:var(--voa-surface) !important; }
.gp-donut .gp-hole span, .gp-leg{ color:var(--voa-gray) !important; }

/* ── Componentes específicos com fundo branco fixo (por classe) ────────── */
.achado-card{ background:var(--voa-surface) !important; border-color:var(--voa-line) !important; color:var(--voa-ink); }
.supplier-base-results{ background:var(--voa-surface) !important; border-color:var(--voa-line-2) !important; color:var(--voa-ink); }
.quill-wrapper{ background:var(--voa-surface-2) !important; }
.ql-toolbar.ql-snow, .ql-container.ql-snow{ border-color:var(--voa-line-2) !important; }
.ql-editor{ color:var(--voa-ink); }
.ql-editor.ql-blank::before{ color:var(--voa-dim); }

/* mention chip */
.mention{ background:rgba(221,251,5,.14) !important; color:var(--voa-lime) !important; }

/* ── Correções de contraste (texto escuro em fundo preto) ──────────────── */
/* Fundos que usavam --gosh-dark (agora claro) reafirmados escuros */
.sidebar, .mobile-menu-btn, .chat-sidebar{ background:var(--voa-black-2) !important; }
.chat-sidebar{ border-right:1px solid var(--voa-line) !important; }
/* Classes utilitárias de texto escuro do Bootstrap */
.text-dark, .text-black{ color:var(--voa-ink) !important; }
.text-secondary{ color:var(--voa-gray) !important; }
/* Badges de status escuras → legíveis */
.badge.bg-light{ background:var(--voa-surface-2) !important; color:var(--voa-ink) !important; }
.badge.text-dark{ color:var(--voa-ink) !important; }
/* Chips de ícone com texto escuro sobre tinta clara (stat-icon) */
.stat-icon.success{ color:#6FD98A !important; } .stat-icon.warning{ color:#F5B23D !important; } .stat-icon.info{ color:#5AA2E0 !important; }
/* list-group (menus/listas) para dark */
.list-group-item{ background:var(--voa-surface) !important; color:var(--voa-ink) !important; border-color:var(--voa-line) !important; }
/* Cards custom (fora do Bootstrap) que tinham background:#fff → dark */
.task-card{ background:var(--voa-surface) !important; color:var(--voa-ink); box-shadow:none !important; }
.task-card:hover{ background:var(--voa-surface-2) !important; }
.task-card.overdue{ background:rgba(255,106,77,.10) !important; }
.task-title{ color:var(--voa-ink) !important; }
.supplier-card{ background:var(--voa-surface) !important; color:var(--voa-ink); box-shadow:none !important; }
.supplier-name{ color:var(--voa-ink) !important; }
/* Boards Kanban (bc-*) de Criação/Produção — eram brancos */
.bc-view-btn, .bc-group-header, .bc-list, .bc-todo{ background:var(--voa-surface) !important; color:var(--voa-ink) !important; }
.bc-view-btn:hover, .bc-todo:hover{ background:var(--voa-surface-2) !important; }
.bc-todo.bc-overdue{ background:rgba(255,106,77,.10) !important; }
.bc-todo.bc-overdue:hover{ background:rgba(255,106,77,.16) !important; }
.bc-todo-title, .bc-group-header{ color:var(--voa-ink) !important; }
/* Chat — era todo branco */
.chat-container, .chat-header, .chat-input-area{ background:var(--voa-surface) !important; color:var(--voa-ink) !important; border-color:var(--voa-line) !important; }
.chat-main{ background:var(--voa-black) !important; }
.chat-bubble{ background:var(--voa-surface-2) !important; color:var(--voa-ink) !important; border:1px solid var(--voa-line); }
/* topbar alternativa (style_v2) */
.topbar{ background:var(--voa-black-2) !important; color:var(--voa-ink) !important; }
/* modal scrim mais forte p/ legibilidade */
.modal-backdrop.show{ opacity:.6 !important; }

/* Badges "soft" (status) — texto escuro sobre tinta clara → clareia p/ dark */
.badge-soft-success{ background:rgba(111,217,138,.14) !important; color:#6FD98A !important; border-color:rgba(111,217,138,.35) !important; }
.badge-soft-warning{ background:rgba(245,178,61,.16) !important; color:#F5B23D !important; border-color:rgba(245,178,61,.38) !important; }
.badge-soft-danger{ background:rgba(255,106,77,.14) !important; color:#FF8A72 !important; border-color:rgba(255,106,77,.34) !important; }
.badge-soft-info{ background:rgba(90,162,224,.14) !important; color:#7FB6E8 !important; border-color:rgba(90,162,224,.34) !important; }
.badge-soft-primary{ background:rgba(221,251,5,.12) !important; color:var(--voa-lime) !important; border-color:rgba(221,251,5,.3) !important; }
.badge-soft-secondary{ background:var(--voa-surface-2) !important; color:var(--voa-gray) !important; border-color:var(--voa-line) !important; }
/* estado :active do botão primário permanece na marca (limão) */
.btn-gosh:active, .btn-primary:active{ background:var(--voa-lime-deep) !important; border-color:var(--voa-lime-deep) !important; color:#000 !important; }
/* bootstrap text-success/danger/warning/info em fundo escuro */
.text-success{ color:#6FD98A !important; } .text-danger{ color:#FF8A72 !important; }
.text-warning{ color:#F5B23D !important; } .text-info{ color:#7FB6E8 !important; } .text-primary{ color:var(--voa-lime) !important; }

/* ── Melhorias UI/UX (auditoria skill: acessibilidade + interação) ──────── */
/* P1 Acessibilidade — foco visível por teclado (limão) em tudo interativo */
a:focus-visible, button:focus-visible, .btn:focus-visible, .nav-item:focus-visible,
.form-control:focus-visible, .form-select:focus-visible, .dropdown-item:focus-visible,
[tabindex]:focus-visible, .nav-link:focus-visible{
  outline:2px solid var(--voa-lime) !important; outline-offset:2px !important; border-radius:4px;
}
/* Autofill do Chrome não pinta o input de branco no dark */
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, textarea:-webkit-autofill, select:-webkit-autofill{
  -webkit-box-shadow:0 0 0 1000px var(--voa-surface-2) inset !important;
  -webkit-text-fill-color:var(--voa-ink) !important;
  caret-color:var(--voa-ink); transition:background-color 9999s ease-out 0s;
}
/* Seleção de texto na marca */
::selection{ background:var(--voa-lime); color:#000; }
/* Checkbox / radio / switch acento limão */
.form-check-input:checked{ background-color:var(--voa-lime) !important; border-color:var(--voa-lime) !important; }
.form-check-input:focus{ border-color:var(--voa-lime) !important; box-shadow:0 0 0 3px rgba(221,251,5,.18) !important; }
.form-check-input{ background-color:var(--voa-surface-2); border-color:var(--voa-line-2); }
/* Números tabulares em dados/valores (evita "dança" de colunas) */
.table td, .table th, .stat-value, .money, [class*="moeda"]{ font-variant-numeric:tabular-nums; }
/* Scrollbar dark discreta */
*{ scrollbar-color:var(--voa-line-2) transparent; }
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-thumb{ background:var(--voa-line-2); border-radius:8px; border:3px solid transparent; background-clip:content-box; }
::-webkit-scrollbar-thumb:hover{ background:rgba(239,239,234,.34); background-clip:content-box; }
/* P7 — respeitar redução de movimento */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* ── Cobertura completa de variantes Bootstrap (complementa data-bs-theme=dark) ── */
/* Botões sólidos/cinza que ficariam invisíveis ou fora da marca */
.btn-dark{ background:var(--voa-surface-2) !important; border-color:var(--voa-line-2) !important; color:var(--voa-ink) !important; }
.btn-dark:hover{ background:#282828 !important; color:var(--voa-ink) !important; }
.btn-secondary{ background:var(--voa-surface-2) !important; border-color:var(--voa-line-2) !important; color:var(--voa-ink) !important; }
.btn-secondary:hover{ background:#282828 !important; color:var(--voa-ink) !important; }
.btn-outline-info{ color:#7FB6E8 !important; border-color:rgba(127,182,232,.4) !important; background:transparent !important; }
.btn-outline-info:hover{ background:rgba(127,182,232,.12) !important; color:#7FB6E8 !important; }
.btn-link{ color:var(--voa-lime) !important; }
/* Badges / fundos */
.badge.bg-dark, .text-bg-dark{ background:var(--voa-surface-2) !important; color:var(--voa-ink) !important; }
.bg-white{ background:var(--voa-surface) !important; }
.bg-purple{ background:#3a2a5a !important; color:#C4A9F0 !important; }
.bg-info-subtle{ background:rgba(127,182,232,.14) !important; }
.bg-warning-subtle{ background:rgba(245,178,61,.16) !important; }
.bg-success-subtle{ background:rgba(111,217,138,.14) !important; }
.bg-danger-subtle{ background:rgba(255,138,114,.14) !important; }
.text-warning-emphasis{ color:#F5B23D !important; } .text-info-emphasis{ color:#7FB6E8 !important; }
.text-white{ color:#fff !important; }
/* Alerts / tabelas coloridas (light tints → dark) */
.alert-light{ background:var(--voa-surface) !important; color:var(--voa-ink) !important; border-color:var(--voa-line) !important; }
.table-light > *, .table-light{ --bs-table-bg:var(--voa-surface-2); --bs-table-color:var(--voa-ink); }
.table-danger{ --bs-table-bg:rgba(255,106,77,.12) !important; --bs-table-color:var(--voa-ink) !important; }
.table-success{ --bs-table-bg:rgba(111,217,138,.12) !important; --bs-table-color:var(--voa-ink) !important; }
.table-warning{ --bs-table-bg:rgba(245,178,61,.12) !important; --bs-table-color:var(--voa-ink) !important; }
.table-info{ --bs-table-bg:rgba(127,182,232,.12) !important; --bs-table-color:var(--voa-ink) !important; }
/* Bordas coloridas custom */
.border-gosh{ border-color:var(--voa-lime) !important; }
.border-info{ border-color:rgba(127,182,232,.4) !important; }
.form-text{ color:var(--voa-dim) !important; }