/* ══════════════════════════════════════════════════════════════════════════════
   AUTOFY — Correções do Tema Claro                                  2026-09-08
   ──────────────────────────────────────────────────────────────────────────────
   Por que este arquivo existe, e por que é o ÚLTIMO a carregar:

   O tema claro estava quebrado por um problema de CASCATA, não de cor. A causa
   raiz (corrigida em design-system.css:107) era o bloco de variáveis usar o
   seletor [data-theme="light"], de especificidade (0,1,0) — exatamente a mesma
   de :root — enquanto style.css, modern.css e dashboard-premium.css redeclaram
   :root com a paleta ESCURA e carregam depois. No empate vence a ordem, então o
   tema claro nunca recebia variável nenhuma.

   Resolvida a raiz, sobra o que NÃO usa variável: branco chapado em CSS e em
   style="..." inline dentro do PHP. É o que este arquivo cobre.

   REGRA DO ARQUIVO: todo seletor começa com html[data-theme="light"] e leva
   !important. O `html` soma +1 elemento sobre o que design-system e
   dashboard-premium usam, então estas regras vencem por ESPECIFICIDADE e não
   dependem da ordem de carga — que é justamente a fragilidade que gerou a lista
   toda. O !important é obrigatório para vencer os style="..." inline do PHP.

   Instalado em includes/footer.php, que é o único ponto que carrega depois do
   dashboard-premium.css (dashboard.php:1356) e dos blocos <style> inline.
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Título de página: era um gradiente BRANCO recortado no texto ───────────── */
html[data-theme="light"] .page-header h1 {
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: #0f172a !important;
    color: #0f172a !important;
}

/* ── Modais: ficavam brancos por dentro com todo o conteúdo branco ──────────── */
html[data-theme="light"] .gp-modal {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] .gp-modal-header {
    background: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
}
html[data-theme="light"] .gp-modal-header h2,
html[data-theme="light"] .gp-modal h2,
html[data-theme="light"] .gp-modal p,
html[data-theme="light"] .gp-modal pre,
html[data-theme="light"] .proj-radio strong {
    color: #0f172a !important;
}
html[data-theme="light"] .gp-modal-close {
    background: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    color: #334155 !important;
}
/* Pega os botões Cancelar/Fechar que trazem color:#fff no atributo style */
html[data-theme="light"] .gp-modal button[style*="color:#fff"],
html[data-theme="light"] .gp-modal button[style*="color: #fff"] {
    background: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    color: #334155 !important;
}

/* ── Barra de projeto ──────────────────────────────────────────────────────── */
html[data-theme="light"] .proj-atual strong { color: #0f172a !important; }
html[data-theme="light"] .proj-btn {
    background: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    color: #334155 !important;
}
html[data-theme="light"] .proj-btn:hover { background: #e2e8f0 !important; }
/* este tem fundo em gradiente escuro — o texto CONTINUA branco de propósito */
html[data-theme="light"] .proj-btn--novo { color: #ffffff !important; }

/* ── Card de meta: seguia preto e com texto branco ──────────────────────────── */
html[data-theme="light"] .goal-card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.05), 0 1px 3px rgba(15, 23, 42, 0.04) !important;
}
/* moldura animada: em fundo branco fica berrante na opacidade original */
html[data-theme="light"] .goal-card::after { opacity: .35 !important; }
html[data-theme="light"] .goal-amount,
html[data-theme="light"] .goal-name,
html[data-theme="light"] .goal-falta b { color: #0f172a !important; }
html[data-theme="light"] .goal-pct {
    background: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    color: #0f172a !important;
}
html[data-theme="light"] .goal-bar { background: #e2e8f0 !important; }

/* ── Feed "Atividade recente" ───────────────────────────────────────────────── */
html[data-theme="light"] .act-title,
html[data-theme="light"] .act-ago { color: #0f172a !important; }
html[data-theme="light"] .act-item {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
}
html[data-theme="light"] .act-item:hover {
    background: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
}

/* ── Histórico de vendas, perfis e insights ─────────────────────────────────── */
html[data-theme="light"] .sales-metric-val,
html[data-theme="light"] .profile-name,
html[data-theme="light"] .ai-insight-text strong { color: #0f172a !important; }
html[data-theme="light"] .glass-card h3,
html[data-theme="light"] .kpi-card h3 { color: #0f172a !important; }

/* Lista "Perfis Viralizando" — @ do perfil e views vêm com color:#fff inline */
html[data-theme="light"] a[href*="instagram.com"] span[style*="color:#fff"] {
    color: #0f172a !important;
}

/* ── Placeholders de formulário ─────────────────────────────────────────────── */
html[data-theme="light"] .form-control::placeholder,
html[data-theme="light"] .proj-input::placeholder,
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder {
    color: #94a3b8 !important;
    opacity: 1 !important;
}

/* ── Calendário e folha "Mais" do mobile, que seguiam pretos ────────────────── */
html[data-theme="light"] .flatpickr-calendar {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] .flatpickr-day { color: #334155 !important; }
html[data-theme="light"] .flatpickr-month,
html[data-theme="light"] .flatpickr-weekday { color: #64748b !important; }
html[data-theme="light"] .flatpickr-current-month,
html[data-theme="light"] .numInputWrapper,
html[data-theme="light"] .flatpickr-monthDropdown-months,
html[data-theme="light"] .flatpickr-time input,
html[data-theme="light"] .flatpickr-time .flatpickr-time-separator,
html[data-theme="light"] .flatpickr-time .flatpickr-am-pm { color: #0f172a !important; }
html[data-theme="light"] .flatpickr-prev-month,
html[data-theme="light"] .flatpickr-next-month { fill: #64748b !important; }
html[data-theme="light"] .mn-sheet {
    background: rgba(255, 255, 255, 0.98) !important;
    border-color: #e2e8f0 !important;
}
html[data-theme="light"] .mn-sheet-item {
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
    color: #334155 !important;
}

/* ── Mobile: a tabela de métricas por conta perdia todas as divisórias ──────── */
@media (max-width: 768px) {
    html[data-theme="light"] .pm-table tr {
        background: #ffffff !important;
        border: 1px solid #e2e8f0 !important;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05) !important;
    }
    html[data-theme="light"] .pm-table td {
        border-bottom: 1px solid #f1f5f9 !important;
    }
    html[data-theme="light"] .thumb,
    html[data-theme="light"] .video-thumb,
    html[data-theme="light"] .post-thumb,
    html[data-theme="light"] .acc-avatar,
    html[data-theme="light"] .avatar {
        background: #e2e8f0 !important;
    }
}

/* ══════════════════════════════════════════════════════════════════════════════
   Animação de troca de tema
   ──────────────────────────────────────────────────────────────────────────────
   As transições ficam TRANCADAS atrás de .theme-switching de propósito: se
   valessem sempre, toda navegação abriria a página com um fade de cor. O JS
   (autofyTrocarTema, em includes/header.php) liga a classe, troca o tema e
   desliga a classe depois da animação.
   ══════════════════════════════════════════════════════════════════════════════ */
html.theme-switching,
html.theme-switching body,
html.theme-switching .glass-card,
html.theme-switching .kpi-card,
html.theme-switching .goal-card,
html.theme-switching .sidebar,
html.theme-switching .main-content,
html.theme-switching .act-item,
html.theme-switching .gp-modal,
html.theme-switching .kpi-value,
html.theme-switching .page-header h1 {
    transition: background-color .45s ease, color .45s ease,
                border-color .45s ease, box-shadow .45s ease !important;
}

@keyframes autofyThemeWipe {
    from { opacity: .9; transform: scale(.15); }
    to   { opacity: 0;  transform: scale(2.6); }
}
.autofy-theme-wipe {
    position: fixed;
    left: 50%;
    top: 50%;
    width: 120vmax;
    height: 120vmax;
    margin: -60vmax 0 0 -60vmax;
    border-radius: 50%;
    pointer-events: none;
    z-index: 999998;
    will-change: transform, opacity;
    animation: autofyThemeWipe .6s cubic-bezier(.22, .61, .36, 1) forwards;
}

/* Respeita quem pediu menos movimento no sistema. */
@media (prefers-reduced-motion: reduce) {
    .autofy-theme-wipe { display: none !important; }
    html.theme-switching,
    html.theme-switching * { transition: none !important; }
}

/* Estado neutro da pílula de tendência no tema claro (o cinza escuro do tema
   escuro fica ilegível sobre card branco). */
html[data-theme="light"] .trend-pill.neutral,
html[data-theme="light"] .trend-badge.neutral {
    background: rgba(100, 116, 139, 0.10) !important;
    border: 1px solid rgba(100, 116, 139, 0.25) !important;
    color: #475569 !important;
}


/* ══════════════════════════════════════════════════════════════════════════════
   CONTRASTE MEDIDO — tema claro                                     2026-09-08
   ──────────────────────────────────────────────────────────────────────────────
   Não são escolhas de gosto: cada regra abaixo saiu de uma medição real no
   navegador, com o CSS de produção, calculando o contraste WCAG de cada texto
   contra o fundo que de fato o pinta. Foram 676 elementos medidos em 6 páginas
   (dashboard, operations, accounts, campaigns, library, profile) e 246
   reprovações — daí o tema claro continuar ruim depois das primeiras correções,
   que cobriram só 13 componentes.

   Princípio aplicado: onde o texto branco está sobre fundo de MARCA colorido, o
   branco está certo e quem foi corrigido é o FUNDO (que havia clareado no tema
   claro). Onde o fundo é claro, quem muda é o texto.
   ══════════════════════════════════════════════════════════════════════════════ */


/* ═══ dashboard.php ═══ */
/* ══════════════════════════════════════════════════════════════════════════
   DASHBOARD.PHP — correções de contraste MEDIDAS no tema claro (2026-09-08)
   ══════════════════════════════════════════════════════════════════════════ */

/* Data do cabeçalho — #64748b sobre #f5f8fb, 4.45:1 */
html[data-theme="light"] .dashboard-greeting__date { color: #475569 !important; }

/* Chip de período ativo (4.28:1) e pill 7D/30D (3.98:1). O branco está CERTO —
   é fundo de marca; o que reprovava era o vermelho claro demais. */
html[data-theme="light"] .dashboard-preset-bar .filter-chip.active {
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important;
    border-color: #b91c1c !important;
    color: #ffffff !important;
}
html[data-theme="light"] .sales-pill.active {
    background: #dc2626 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 10px rgba(220, 38, 38, 0.35) !important;
}

/* Botão "Parar Operação" — 3.95:1 */
html[data-theme="light"] #stopOperationBtn { color: #b91c1c !important; }

/* Pills de tendência dos KPIs — 3.43:1 (up) / 4.24:1 (down) */
html[data-theme="light"] .trend-pill.up   { color: #047857 !important; }
html[data-theme="light"] .trend-pill.down { color: #b91c1c !important; }

/* Badges de status da Fila de Postagens — 2.20:1 (won) / 3.97:1 (lost) */
html[data-theme="light"] .badge.status-won  { color: #047857 !important; }
html[data-theme="light"] .badge.status-lost { color: #b91c1c !important; }

/* Ícone de "cancelar pendente" na Fila de Postagens — laranja #f59e0b sobre
   rgba(245,158,11,.12) = 1.96:1 */
html[data-theme="light"] .premium-table button[style*="var(--accent-orange)"] { color: #b45309 !important; }

/* Selo "TEMPO REAL" do Log de Atividades — #22c55e sobre branco, 2.28:1 */
html[data-theme="light"] .section-title-main span[style*="color:#22c55e"] { color: #15803d !important; }

/* Funil de Conversão: o painel inteiro continuou PRETO no tema claro
   (linear-gradient(145deg, rgba(10,8,22,.95), rgba(5,5,14,.98))) dentro do
   .glass-card branco — o título media 2.50:1 */
html[data-theme="light"] .dashboard-side-card--funnel {
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
    box-shadow: none !important;
}
html[data-theme="light"] .dashboard-side-card--funnel h4 { color: #475569 !important; }

/* Estágios do funil: mantêm fundo de MARCA (branco por cima está certo), mas
   no claro o gradiente virou lilás claro (#c084fc → #a855f7) — 3.24:1 no valor,
   2.48:1 no rótulo e 1.23:1 na taxa (lilás sobre lilás). */
html[data-theme="light"] .new-funnel-stage {
    background: linear-gradient(100deg, #9b1c1c 0%, #6d28d9 100%) !important;
    color: #ffffff !important;
}
html[data-theme="light"] .new-funnel-stage-value,
html[data-theme="light"] .new-funnel-rate-pct {
    color: #ffffff !important;
    opacity: 1 !important;
}
html[data-theme="light"] .new-funnel-stage-name,
html[data-theme="light"] .new-funnel-rate-label {
    color: rgba(255, 255, 255, 0.92) !important;
    opacity: 1 !important;
}

/* Toast de venda — o card continuou preto (rgba(5,5,5,.96)); detalhe em 2.54:1 */
html[data-theme="light"] .sales-toast {
    background: #ffffff !important;
    border-color: rgba(220, 38, 38, 0.35) !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12) !important;
}
html[data-theme="light"] .sales-toast__title { color: #0f172a !important; }
html[data-theme="light"] .sales-toast__meta  { color: #475569 !important; }

/* Tooltip do gráfico de vendas — caixa preta (rgba(12,11,18,.96)) dentro do
   card branco; a data media 3.82:1 */
html[data-theme="light"] #salesChartTooltip {
    background: #ffffff !important;
    border-color: #e2e8f0 !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] #salesChartTooltip > div:first-child { color: #475569 !important; }
html[data-theme="light"] #salesChartTooltip > div:last-child  { color: #0f172a !important; }

/* Rótulo do eixo X destacado no hover — o JS pinta fill="#ffffff": 1:1 */
html[data-theme="light"] #salesXLabels text[fill="#ffffff"] { fill: #0f172a !important; }

/* Anel "Taxa de Conversão" — textos SVG com fill branco sobre card branco: 1:1 */
html[data-theme="light"] #convRatePctText { fill: #0f172a !important; }
html[data-theme="light"] #convRateCard .conv-rate-wrap svg text:not(#convRatePctText) { fill: #64748b !important; }

/* Ranking "Perfis Viralizando": o nº 1 fica sobre um badge de MARCA, mas a
   regra existente de a[href*="instagram.com"] escurecia esse texto junto —
   3.18:1. Aqui o branco é o certo. */
html[data-theme="light"] a[href*="instagram.com"] .viral-avatar-wrap.is-top1 span[style*="color:#fff"] {
    color: #ffffff !important;
}
/* ...e do 2º ao 5º o badge era rgba(255,255,255,.1) com texto #fff: branco no
   branco (1:1) no tema claro. */
html[data-theme="light"] a[href*="instagram.com"] .viral-avatar-wrap:not(.is-top1) span[style*="color:#fff"] {
    background: #64748b !important;
    color: #ffffff !important;
    border-color: #ffffff !important;
}

/* ═══ operations.php ═══ */
/* ══════════════════════════════════════════════════════════════════════════════
   operations.php — Pastas / Operações (tema claro)                    2026-09-08
   Medido no navegador com data-theme="light" e a ordem real de carga
   (design-system → style → modern → mobile → <style> inline → este arquivo).
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Barra de projeto ───────────────────────────────────────────────────────────
   O .proj-btn logo acima (linha 67) matava o fundo de marca do "Novo projeto",
   porque .proj-btn--novo (style.css:277) usa var(--btn-primario) SEM !important.
   Sobrava texto branco sobre #f1f5f9 → 1.10:1. O texto continua branco de
   propósito: quem volta aqui é o FUNDO. */
html[data-theme="light"] .proj-btn.proj-btn--novo {
    background: linear-gradient(180deg, #dc2626 0%, #b91c1c 100%) !important;
    border: 1px solid #b91c1c !important;
    color: #ffffff !important;
}
html[data-theme="light"] .proj-btn.proj-btn--novo:hover {
    background: linear-gradient(180deg, #b91c1c 0%, #991b1b 100%) !important;
    opacity: 1 !important;
}

/* Flash da barra de projeto: âmbar de fundo preto (#fbbf24) sobre tint claro → 1.45:1 */
html[data-theme="light"] .proj-flash {
    background: #fffbeb !important;
    border: 1px solid #fcd34d !important;
    color: #92400e !important;
}

/* ── Cards de pasta ─────────────────────────────────────────────────────────────
   O <style> inline de operations.php deixa o card com fundo e borda BRANCOS
   translúcidos e color:#fff. No claro o card some e o nome fica branco no
   branco (1.07:1). */
html[data-theme="light"] .folder-card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    color: #0f172a !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06) !important;
}
html[data-theme="light"] .folder-card:hover {
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
}
html[data-theme="light"] .folder-card .folder-title,
html[data-theme="light"] .folder-card .folder-title > span {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
}
html[data-theme="light"] .folder-card .folder-stats,
html[data-theme="light"] .folder-card .folder-stats div {
    color: #475569 !important;
}

/* ── Cabeçalho da página: subtítulo em var(--text-muted) sobre o gradiente do body */
html[data-theme="light"] .page-header p {
    color: #475569 !important;
}

/* ── Alertas de pasta criada / excluída ─────────────────────────────────────── */
html[data-theme="light"] .alert.success {
    background: #ecfdf5 !important;
    border-color: #6ee7b7 !important;
    color: #065f46 !important;
}
html[data-theme="light"] .alert.danger {
    background: #fef2f2 !important;
    border-color: #fca5a5 !important;
    color: #991b1b !important;
}

/* ── Placeholders: o #94a3b8 fixado acima (linha 123) dá 2.56:1 no input branco */
html[data-theme="light"] input.form-control::placeholder,
html[data-theme="light"] input.proj-input::placeholder,
html[data-theme="light"] textarea.form-control::placeholder {
    color: #64748b !important;
    opacity: 1 !important;
}

/* ── Menu de idioma do topo: item ativo em #ef4444 sobre tint #fff5f5 ───────── */
html[data-theme="light"] .lang-item.active {
    color: #b91c1c !important;
}


/* ═══ accounts.php ═══ */
/* ══════════════════════════════════════════════════════════════════════════
   accounts.php — TEMA CLARO: correções medidas (2026-09-08)
   Contraste WCAG medido no navegador com os 7 CSS na ordem real de carga.
   ══════════════════════════════════════════════════════════════════════════ */

/* — Token --warning: o hero e o botão "Reconectar" o usam em style inline com
     !important, então só dá pra corrigir pelo token. #d97706 dava 3.04:1.
     ":root" no seletor não é enfeite: o design-system declara o token em
     "html[data-theme='light'], :root[data-theme='light']" (0,2,0) e um
     "html[data-theme='light']" sozinho (0,1,1) perde o desempate. — */
html[data-theme="light"]:root {
    --warning: #92400e;
}

/* — Barra de ações em lote: continuava um painel PRETO (#292037, lum .018)
     dentro da página clara; o texto secundário caía pra 2.04:1. — */
html[data-theme="light"] .acc-bulk {
    background: #ffffff !important;
    border-color: #cbd5e1 !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .12) !important;
}
html[data-theme="light"] .acc-bulk-info   { color: #475569 !important; }
html[data-theme="light"] .acc-bulk-info b { color: #0f172a !important; }
html[data-theme="light"] .acc-bulk select {
    background: #ffffff !important;
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
}
html[data-theme="light"] .acc-bulk-btn.ghost {
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
    color: #475569 !important;
}
html[data-theme="light"] .acc-bulk-btn.danger {
    background: #fef2f2 !important;
    border-color: rgba(185, 28, 28, .45) !important;
    color: #b91c1c !important;
}
/* .acc-bulk-btn "Aplicar" fica como está: degradê de marca + texto branco. */

/* — Botões secundários do hero: .accounts-copy-btn força fundo branco
     translúcido e .btn-ig força color:#fff — branco sobre branco (1.04:1). — */
html[data-theme="light"] .btn-ig.accounts-copy-btn {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    color: #0f172a !important;
}
html[data-theme="light"] .btn-ig.accounts-copy-btn:hover { background: #f1f5f9 !important; }

/* — Ícones-botão desenhados com rgba branca: sumiam por completo (1.00:1) — */
html[data-theme="light"] .edit-username {
    color: #475569 !important;
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
}
html[data-theme="light"] .edit-username:hover {
    color: #0f172a !important;
    background: #ede9fe !important;
    border-color: #c4b5fd !important;
}
html[data-theme="light"] .pass-eye        { color: #475569 !important; }
html[data-theme="light"] .pass-eye:hover  { color: #0f172a !important; background: #f1f5f9 !important; }

/* — Caixas de seleção da tabela: borda #cbd5e1 sobre branco = 1.48:1 — */
html[data-theme="light"] .acc-sel-col input[type="checkbox"] {
    border-color: #64748b !important;
    background: #ffffff !important;
}

/* — Botões de ação da linha — */
html[data-theme="light"] .acc-acao          { border-color: #cbd5e1 !important; color: #475569 !important; }
html[data-theme="light"] .acc-acao:hover    { background: #f1f5f9 !important; }
html[data-theme="light"] .acc-acao--parar   { color:#92400e !important; background:rgba(146,64,14,.08) !important;  border-color:rgba(146,64,14,.35) !important; }
html[data-theme="light"] .acc-acao--parar:hover   { background:rgba(146,64,14,.16) !important; }
html[data-theme="light"] .acc-acao--foto    { color:#6d28d9 !important; background:rgba(109,40,217,.08) !important; border-color:rgba(109,40,217,.35) !important; }
html[data-theme="light"] .acc-acao--foto:hover    { background:rgba(109,40,217,.16) !important; }
html[data-theme="light"] .acc-acao--excluir { color:#b91c1c !important; background:rgba(185,28,28,.08) !important;  border-color:rgba(185,28,28,.35) !important; }
html[data-theme="light"] .acc-acao--excluir:hover { background:rgba(185,28,28,.16) !important; }

/* — Badges de ciclo de vida — */
html[data-theme="light"] .lifecycle-badge.warmup  { color:#92400e !important; background:rgba(146,64,14,.10) !important;  border-color:rgba(146,64,14,.30) !important; }
html[data-theme="light"] .lifecycle-badge.ready   { color:#065f46 !important; background:rgba(6,95,70,.10) !important;    border-color:rgba(6,95,70,.30) !important; }
html[data-theme="light"] .lifecycle-badge.ban     { color:#b91c1c !important; background:rgba(185,28,28,.10) !important;  border-color:rgba(185,28,28,.30) !important; }
html[data-theme="light"] .lifecycle-badge.editing { color:#7e22ce !important; background:rgba(126,34,206,.10) !important; border-color:rgba(126,34,206,.30) !important; }

/* — Badges de veiculação — */
html[data-theme="light"] .veiculacao-badge.running  { color:#065f46 !important; background:rgba(6,95,70,.10) !important;   border-color:rgba(6,95,70,.30) !important; }
html[data-theme="light"] .veiculacao-badge.running .veic-dot { background:#065f46 !important; }
html[data-theme="light"] .veiculacao-badge.finished { color:#1d4ed8 !important; background:rgba(29,78,216,.10) !important; border-color:rgba(29,78,216,.30) !important; }
html[data-theme="light"] .veiculacao-badge.idle     { color:#475569 !important; background:rgba(71,85,105,.08) !important; border-color:rgba(71,85,105,.28) !important; }
html[data-theme="light"] .veiculacao-badge.stalled  { color:#92400e !important; background:rgba(146,64,14,.10) !important; border-color:rgba(146,64,14,.35) !important; }

/* — Selo de marca d'água e contagem regressiva — */
html[data-theme="light"] .wm-active-badge { color:#7e22ce !important; background:rgba(126,34,206,.10) !important; border-color:rgba(126,34,206,.30) !important; }
html[data-theme="light"] .veic-countdown  { color:#92400e !important; opacity:1 !important; }

/* — "Ir para email" (o :hover com color:#fff também reprovava) — */
html[data-theme="light"] .email-go       { color:#1d4ed8 !important; background:rgba(29,78,216,.08) !important; border-color:rgba(29,78,216,.30) !important; }
html[data-theme="light"] .email-go:hover { color:#ffffff !important; background:#1d4ed8 !important; border-color:#1d4ed8 !important; }

/* — Avisos da célula de status / proxy — */
html[data-theme="light"] .acc-status-warning { color:#b91c1c !important; }
html[data-theme="light"] .pass-field small[style*="--accent-orange"] { color:#92400e !important; }

/* — Alertas do topo da página — */
html[data-theme="light"] .alert.success { color:#065f46 !important; background:rgba(6,95,70,.08) !important;    border-color:rgba(6,95,70,.40) !important; }
html[data-theme="light"] .alert.danger  { color:#b91c1c !important; background:rgba(185,28,28,.08) !important;  border-color:rgba(185,28,28,.40) !important; }
html[data-theme="light"] .alert.warning { color:#92400e !important; background:rgba(146,64,14,.08) !important;  border-color:rgba(146,64,14,.45) !important; }

/* — Modais "Conectar" / "Indisponível" (.conn-*) — */
html[data-theme="light"] .conn-box {
    background:#ffffff !important;
    border-color:#e2e8f0 !important;
    box-shadow:0 24px 70px rgba(15,23,42,.18) !important;
}
html[data-theme="light"] .conn-title { color:#0f172a !important; }
html[data-theme="light"] .conn-sub,
html[data-theme="light"] .conn-hint  { color:#475569 !important; }
html[data-theme="light"] .conn-step  { background:#f8fafc !important; border-color:#e2e8f0 !important; }
html[data-theme="light"] .conn-step strong { color:#0f172a !important; }
html[data-theme="light"] .conn-step p      { color:#475569 !important; }
html[data-theme="light"] .conn-step.active    { background:#fef2f2 !important; border-color:rgba(185,28,28,.30) !important; }
html[data-theme="light"] .conn-step.completed { background:#ecfdf5 !important; border-color:rgba(6,95,70,.30) !important; }
html[data-theme="light"] .conn-num { background:#e2e8f0 !important; color:#0f172a !important; }
html[data-theme="light"] .conn-step.active .conn-num    { background:#b91c1c !important; color:#ffffff !important; }
html[data-theme="light"] .conn-step.completed .conn-num { background:#065f46 !important; color:#ffffff !important; }
html[data-theme="light"] .conn-btn--step1 {
    color:#0f172a !important;
    background:#f1f5f9 !important;
    border:1px solid #cbd5e1 !important;
}
html[data-theme="light"] .conn-btn--step1:hover { background:#e2e8f0 !important; border-color:#94a3b8 !important; }
html[data-theme="light"] .conn-btn--ghost {
    color:#b91c1c !important;
    background:rgba(185,28,28,.08) !important;
    border:1px solid rgba(185,28,28,.35) !important;
}
html[data-theme="light"] .conn-btn--ghost:hover { background:rgba(185,28,28,.16) !important; }
html[data-theme="light"] .conn-x { color:#475569 !important; }
html[data-theme="light"] .conn-x:hover { color:#0f172a !important; background:#f1f5f9 !important; }
/* .conn-btn--primary fica como está: degradê vermelho de marca + texto branco. */

/* — Textos brancos escritos em style inline dentro dos modais .gp-modal — */
html[data-theme="light"] #deleteAccountUsername { color:#0f172a !important; }
html[data-theme="light"] .gp-modal summary[style*="color:#fff"],
html[data-theme="light"] .gp-modal b[style*="color:#fff"],
html[data-theme="light"] .gp-modal strong[style*="color:#fff"],
html[data-theme="light"] .gp-modal span[style*="color:#fff"] { color:#0f172a !important; }
html[data-theme="light"] #manualLoginModal div[style*="#fca5a5"] {
    color:#b91c1c !important;
    background:rgba(185,28,28,.06) !important;
    border-color:rgba(185,28,28,.28) !important;
}
html[data-theme="light"] #manualLoginModal div[style*="#fca5a5"] b { color:#b91c1c !important; }

/* — Caixas de resultado pintadas pelo JS (cor inline sem !important) — */
html[data-theme="light"] #avatarModalAlert,
html[data-theme="light"] #loginResult { color:#0f172a !important; }

/* — Placeholders: #94a3b8 sobre branco dava 2.56:1 — */
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder { color:#64748b !important; opacity:1 !important; }


/* ═══ campaigns.php ═══ */
/* ══════════════════════════════════════════════════════════════════════════════
   campaigns.php — correções do tema claro (medidas no harness, 2026-09-08)
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Avisos do topo (.alert-box) ─────────────────────────────────────────────── */
html[data-theme="light"] .alert-box { border-color: #e2e8f0 !important; }
html[data-theme="light"] .alert-box.success { color: #166534 !important; border-color: rgba(22,101,52,.28) !important; }
html[data-theme="light"] .alert-box.danger  { color: #b91c1c !important; border-color: rgba(185,28,28,.28) !important; }
html[data-theme="light"] .alert-box.warning { color: #92400e !important; border-color: rgba(146,64,14,.28) !important; }

/* ── Card "Saúde das Contas": números grandes em color:#fff inline ──────────── */
html[data-theme="light"] .status-card-grid .modern-card div[style*="color:#fff"] { color: #0f172a !important; }

/* ── Card "Contas Mortas Recentes" ──────────────────────────────────────────── */
html[data-theme="light"] .dead-row-title { color: #0f172a !important; }
html[data-theme="light"] .dead-row .badge.danger {
    color: #b91c1c !important;
    background: #fee2e2 !important;
    border: 1px solid rgba(185,28,28,.25) !important;
}
html[data-theme="light"] .dead-row-del-btn {
    color: #b91c1c !important;
    background: #fee2e2 !important;
    border-color: rgba(185,28,28,.35) !important;
}
html[data-theme="light"] .dead-row-del-btn:hover { background: #fecaca !important; border-color: rgba(185,28,28,.6) !important; }

/* ── "Onde Publicar?": nota do TikTok ───────────────────────────────────────── */
html[data-theme="light"] #tiktokDraftNote,
html[data-theme="light"] #tiktokDraftNote b { color: #92400e !important; }

/* ── Pílulas (.sched-pill): ativa e hover ───────────────────────────────────── */
html[data-theme="light"] .sched-pill.active {
    background: linear-gradient(135deg, #7c3aed, #6d28d9) !important;
    border-color: #6d28d9 !important;
    color: #ffffff !important;
}
html[data-theme="light"] .sched-pill:not(.active):hover {
    background: #f5f3ff !important;
    border-color: #7c3aed !important;
    color: #5b21b6 !important;
}

/* ── "Fonte da Mídia" ───────────────────────────────────────────────────────── */
html[data-theme="light"] #sourceClonedArea small[style*="--warning"] { color: #92400e !important; }
html[data-theme="light"] #sourceGridCount { color: #0f172a !important; }
html[data-theme="light"] .opt-title { color: #0f172a !important; }
html[data-theme="light"] label.opt-card:has(.opt-check:checked) .opt-title { color: #5b21b6 !important; }

/* ── Miniaturas da pasta (.src-item ficava preto dentro do card branco) ─────── */
html[data-theme="light"] .src-item { background: #e2e8f0 !important; border-color: #cbd5e1 !important; }
html[data-theme="light"] .src-thumb {
    background: linear-gradient(135deg, rgba(124,58,237,.12), rgba(15,23,42,.04)) !important;
}
html[data-theme="light"] .src-thumb span { color: #475569 !important; }
html[data-theme="light"] .src-name {
    background: rgba(248,250,252,.92) !important;
    color: #0f172a !important;
}
html[data-theme="light"] .src-remove { background: rgba(15,23,42,.75) !important; color: #ffffff !important; }
html[data-theme="light"] .src-remove:hover { background: #b91c1c !important; }
html[data-theme="light"] .src-item.removed .src-remove { background: #047857 !important; }

/* ── Fila de Postagem ───────────────────────────────────────────────────────── */
html[data-theme="light"] #queueBox .badge.pending {
    color: #92400e !important;
    background: #fef3c7 !important;
    border: 1px solid rgba(146,64,14,.25) !important;
}
html[data-theme="light"] #queueList button[style*="var(--danger)"] {
    color: #b91c1c !important;
    background: #fee2e2 !important;
    border-color: rgba(185,28,28,.35) !important;
}

/* ── Card de aquecimento ────────────────────────────────────────────────────── */
html[data-theme="light"] .warmup-title { color: #0f172a !important; }
html[data-theme="light"] .warmup-card.on .warmup-title { color: #92400e !important; }

/* ── Aviso de ritmo (cor vem inline pelo JS, nos 3 estados) ─────────────────── */
html[data-theme="light"] #ritmoAviso,
html[data-theme="light"] #ritmoAviso b { color: #0f172a !important; }

/* ── Público-alvo ───────────────────────────────────────────────────────────── */
html[data-theme="light"] #geoDetailsSummary { color: #0f172a !important; }

/* ── Barra de "Contas de Destino" ───────────────────────────────────────────── */
html[data-theme="light"] .acc-toolbar-btn--select-all {
    background: #f5f3ff !important;
    border-color: #c4b5fd !important;
    color: #5b21b6 !important;
}
html[data-theme="light"] .acc-toolbar-btn--select-all:hover {
    background: #ede9fe !important; border-color: #7c3aed !important; color: #4c1d95 !important;
}
html[data-theme="light"] .acc-toolbar-btn--none {
    background: #f8fafc !important; border-color: #e2e8f0 !important; color: #475569 !important;
}
html[data-theme="light"] .acc-toolbar-btn--none:hover {
    background: #f1f5f9 !important; border-color: #cbd5e1 !important; color: #0f172a !important;
}
html[data-theme="light"] .acc-selected-count {
    background: #f1f5f9 !important; border-color: #e2e8f0 !important; color: #475569 !important;
}

/* ── Grade de contas: cores de status vindas inline do PHP ──────────────────── */
html[data-theme="light"] .acc-grid [style*="#94a3b8"] { color: #475569 !important; }
html[data-theme="light"] .acc-grid [style*="#60a5fa"] { color: #1d4ed8 !important; }
html[data-theme="light"] .acc-grid [style*="#fbbf24"] { color: #92400e !important; }
html[data-theme="light"] .acc-grid [style*="#a78bfa"] { color: #6d28d9 !important; }
html[data-theme="light"] .acc-grid [style*="#34d399"] { color: #047857 !important; }
html[data-theme="light"] .acc-grid [style*="#c084fc"] { color: #7c3aed !important; }
html[data-theme="light"] .acc-group-title span[style*="opacity"] { opacity: 1 !important; color: #475569 !important; }
html[data-theme="light"] .acc-subgroup-title span[style*="opacity"] { opacity: 1 !important; color: #475569 !important; }
html[data-theme="light"] .acc-grid div[style*="opacity:.85"] { opacity: 1 !important; }
html[data-theme="light"] .acc-subgroup-btn:hover { color: #0f172a !important; border-color: #cbd5e1 !important; }

/* ── Chip de conta selecionada: mantém o fundo de MARCA, texto branco ───────── */
html[data-theme="light"] .acc-toggle:checked + .acc-label,
html[data-theme="light"] .tiktok-acc-toggle:checked + .acc-label {
    background: linear-gradient(135deg, #7c3aed, #6d28d9) !important;
    border-color: #6d28d9 !important;
    color: #ffffff !important;
}
html[data-theme="light"] .acc-toggle:checked + .acc-label::before,
html[data-theme="light"] .tiktok-acc-toggle:checked + .acc-label::before {
    background: #ffffff !important;
    border-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(255,255,255,.28) !important;
}
html[data-theme="light"] .acc-toggle:checked + .acc-label span[style*="color"],
html[data-theme="light"] .tiktok-acc-toggle:checked + .acc-label span[style*="color"] { color: #ffffff !important; }

/* ── Modal de marca d'água ──────────────────────────────────────────────────── */
html[data-theme="light"] #watermarkBulkCount { color: #6d28d9 !important; }
html[data-theme="light"] .wm-toggle-row span:first-child { color: #0f172a !important; }
html[data-theme="light"] .wm-field-label span:last-child { color: #6d28d9 !important; }
html[data-theme="light"] .wm-pill.active {
    background: linear-gradient(135deg, #7c3aed, #6d28d9) !important;
    border-color: #6d28d9 !important;
    color: #ffffff !important;
}
html[data-theme="light"] .wm-pill:not(.active):hover {
    background: #f5f3ff !important; border-color: #7c3aed !important; color: #5b21b6 !important;
}
html[data-theme="light"] #watermarkBulkResult[style*="var(--success)"] { color: #166534 !important; }
html[data-theme="light"] #watermarkBulkResult[style*="rgb(239, 68, 68)"] { color: #b91c1c !important; }


/* ═══ library.php ═══ */
/* ══════════════════════════════════════════════════════════════════════════════
   library.php (Mídias) — tema claro                                  2026-09-08
   ──────────────────────────────────────────────────────────────────────────────
   Medido num harness com a ordem real de carga (design-system → style → modern →
   mobile → <style> inline da página → este arquivo), html[data-theme="light"].
   70 elementos de texto medidos: 22 reprovaram no WCAG, mais o ::after do alvo
   de arrasto (23 no total) e 10 caixas que continuavam escuras dentro do claro.

   NÃO É BUG, medido e confirmado — nenhuma regra abaixo mexe neles:
     .lib-cat-chip.on  → gradiente de marca #980406→#9034e8, texto #fff a 8.9:1
                         na ponta escura e 5.5:1 na clara. O gradiente sobrevive
                         no tema claro; o branco está certo.
     .modern-btn       → style.css:533 aplica o gradiente da marca com !important,
                         inclusive no <label class="modern-btn"> de "Subir
                         Arquivos Aqui", cujo style="background:rgba(255,255,255,
                         .05); color:#fff" inline PERDE para o !important. Renderiza
                         vermelho de marca com texto branco a ~8.9:1. Correto.
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Alertas de criar/duplicar pasta: verde e âmbar de tema escuro ─────────── */
html[data-theme="light"] .alert-box.success {
    background: #ecfdf5 !important;
    border-color: #a7f3d0 !important;
    color: #065f46 !important;
}
html[data-theme="light"] .alert-box.warning {
    background: #fffbeb !important;
    border-color: #fde68a !important;
    color: #92400e !important;
}

/* ── Cabeçalho de cada grupo de categoria: color:#fff chapado no <style> ───── */
html[data-theme="light"] .lib-grupo-head h3 { color: #0f172a !important; }

/* ── Etiqueta de categoria no card ────────────────────────────────────────── */
html[data-theme="light"] .lib-cat-tag {
    background: #f3e8ff !important;
    border: 1px solid #d8b4fe !important;
    color: #6b21a8 !important;
}

/* ── Lista de arquivos do card: rgba(0,0,0,.2) virava um bloco cinza #ccc ──── */
html[data-theme="light"] .lib-files {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
}
html[data-theme="light"] .lib-files > div { border-bottom-color: #e2e8f0 !important; }
html[data-theme="light"] .lib-files a { color: #b91c1c !important; }

/* ── Alvo do arrastar-e-soltar: texto branco sobre roxo a 16% ─────────────── */
html[data-theme="light"] .lib-folder.lib-alvo::after {
    background: rgba(124, 58, 237, 0.12) !important;
    color: #5b21b6 !important;
}

/* ── Estado vazio: o ícone ficava em 4.35:1 ───────────────────────────────── */
html[data-theme="light"] .autofy-empty-icon { color: #b91c1c !important; }

/* ══ Modais da biblioteca — o painel seguia #0e0b16 no tema claro ═══════════ */
html[data-theme="light"] .lib-modal-overlay { background: rgba(15, 23, 42, 0.45) !important; }
html[data-theme="light"] .lib-modal {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] .lib-modal-head { border-bottom: 1px solid #e2e8f0 !important; }
html[data-theme="light"] .lib-modal-head h3 { color: #0f172a !important; }
html[data-theme="light"] .lib-modal-head .count { color: #64748b !important; }
html[data-theme="light"] .lib-modal-close {
    background: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    color: #334155 !important;
}
html[data-theme="light"] .lib-modal-close:hover {
    background: #fee2e2 !important;
    border-color: #fca5a5 !important;
    color: #b91c1c !important;
}
html[data-theme="light"] .lib-modal p,
html[data-theme="light"] .lib-modal p b,
html[data-theme="light"] #libModalEmpty,
html[data-theme="light"] .lib-mover-lista > div { color: #475569 !important; }

/* Itens do modal "mover para" */
html[data-theme="light"] .lib-mover-item {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    color: #0f172a !important;
}
html[data-theme="light"] .lib-mover-item small { color: #64748b !important; }
html[data-theme="light"] .lib-mover-item:hover {
    background: #f3e8ff !important;
    border-color: #7c3aed !important;
}

/* Grade de vídeos da prévia da pasta */
html[data-theme="light"] .lib-preview-item {
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
}
html[data-theme="light"] .lib-preview-item video,
html[data-theme="light"] .lib-preview-item img { background: #e2e8f0 !important; }
html[data-theme="light"] .lib-preview-item .fname { color: #475569 !important; }
html[data-theme="light"] .lib-preview-item .del-file {
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1px solid #fca5a5 !important;
    color: #b91c1c !important;
}
html[data-theme="light"] .lib-preview-item .del-file:hover {
    background: #fee2e2 !important;
    border-color: #ef4444 !important;
}

/* ═══ profile.php ═══ */
/* ── profile.php — tema claro ─────────────────────────────────────────── */

/* Hero: fundo escuro-tintado virava lavanda clara e o H1 branco sumia (1.43) */
html[data-theme="light"] .pf-hero {
    background:
        radial-gradient(circle at 15% -20%, rgba(152,4,6,0.07), transparent 55%),
        radial-gradient(circle at 90% 120%, rgba(144,52,232,0.07), transparent 55%),
        #ffffff !important;
    border-color: #e2e8f0 !important;
}
html[data-theme="light"] .pf-hero h1 { color: #0f172a !important; }
html[data-theme="light"] .pf-hero p  { color: #475569 !important; }

/* Badge do plano: #c9a3ff sobre tinta roxa clara (1.19) */
html[data-theme="light"] .pf-plan-badge {
    background: #f3e8ff !important;
    border-color: #d8b4fe !important;
    color: #6b21a8 !important;
}

/* Títulos dos cards: #fff sobre card branco (1.00) — sumiam por completo */
html[data-theme="light"] .pf-card h3 { color: #0f172a !important; }

/* Ícone do título: gradiente a 35% de alfa vira rosa pálido e o glifo branco
   fica em 1.90 — mantém a cor de marca, só deixa o fundo sólido */
html[data-theme="light"] .pf-card-icon {
    background: linear-gradient(135deg, #980406, #9034e8) !important;
    color: #ffffff !important;
}

/* Alertas de flash */
html[data-theme="light"] .pf-alert.success {
    color: #047857 !important;
    background: #ecfdf5 !important;
    border-color: #a7f3d0 !important;
}
html[data-theme="light"] .pf-alert.danger {
    color: #b91c1c !important;
    background: #fef2f2 !important;
    border-color: #fecaca !important;
}

/* Botões "fantasma" (.pf-btn-ghost e o inline do #posForm): o
   background:rgba(255,255,255,.06) vira branco e o texto branco some (1.00) */
html[data-theme="light"] .pf-btn.pf-btn-ghost,
html[data-theme="light"] #posForm button.pf-btn {
    background: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    color: #0f172a !important;
}

/* Linhas de notificação: label branco sobre card branco (1.00) */
html[data-theme="light"] .pf-toggle-row {
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
}
html[data-theme="light"] .pf-toggle-row span { color: #0f172a !important; }

/* Switch desligado: trilho rgba(255,255,255,.12) + botão branco = invisível
   (trilho vs linha 1.00, botão vs trilho 1.00) */
html[data-theme="light"] .pf-switch input:not(:checked) + .pf-switch-track { background: #64748b !important; }
html[data-theme="light"] .pf-switch-track::before { background: #ffffff !important; }

/* Toast de preferência salva: #34d399 sobre verde pálido (1.72) */
html[data-theme="light"] #prefToastNotice {
    color: #047857 !important;
    background: #ecfdf5 !important;
    border-color: #a7f3d0 !important;
}

/* Chips de marca: o branco está certo, o vermelho é que estava claro demais
   (#ef4444 dá 3.76 com branco) — escurece só o FUNDO, mantendo a marca */
html[data-theme="light"] .switch-opt.active,
html[data-theme="light"] .pref-choice-card.active::after {
    background: #dc2626 !important;
    color: #ffffff !important;
}
html[data-theme="light"] .switch-opt { color: #475569 !important; }

/* Item ativo do seletor de idioma no topo: #ef4444 sobre #fff5f5 (3.52) */
html[data-theme="light"] .lang-item.active { color: #b91c1c !important; }