/* ============================================================================= admin-tema.css — overrides de tema (escuro padrão + claro nativo) para as telas de ADMINISTRAÇÃO DE TABELAS (admin_*.html). Essas páginas são geradas a partir de um mesmo template e compartilham o mesmo vocabulário de classes de conteúdo (.breadcrumb, .subtitulo, .toolbar, .btn*, .table-wrap, table/th/td, .modal*, .pagina, .stat, etc.). Em vez de repetir o bloco de overrides em cada página, centralizamos aqui — incluído APENAS nas telas admin, depois de tema-escuro.css/tema-claro.css. Arquitetura de temas (ver TEMA.md): - data-pb-base="escuro" → estrutura comum aos dois temas (ex.: sem traço no breadcrumb). - data-pb-tema="escuro" → cores do MODO ESCURO (texto/ícone claros sobre o fundo marrom). - data-pb-light="nativo"][data-pb-tema="claro"] → MODO CLARO NATIVO. Diretriz: tabelas/listas/modais ficam em SUPERFÍCIE BRANCA flutuando sobre o fundo escuro (--pb-surface-white). Só o que encosta no fundo (breadcrumb, subtítulo, barra de filtros, paginação) recebe tratamento escuro. ============================================================================= */ /* ---- Estrutural (vale nos dois temas): breadcrumb sem traço inferior ------ */ html[data-pb-base="escuro"] .breadcrumb, html[data-pb-base="escuro"] body.pb-has-sidebar .breadcrumb, html[data-pb-base="escuro"] .pb-breadcrumb, html[data-pb-base="escuro"] body.pb-has-sidebar .pb-breadcrumb{ border-bottom:0; } /* O dessas telas fica sempre escuro (#24282e, injetado por tema.js). No modo claro nativo o body é branco e, com pouco conteúdo, o fundo escuro do apareceria embaixo. Garantir que o body preencha a viewport resolve nos dois temas (no escuro o gradiente cobre; no claro o branco). */ html[data-pb-base="escuro"] body.pb-has-sidebar{ min-height:100vh; } /* O breadcrumb antigo (.breadcrumb) também segue o espaçamento full-bleed do padrão do portal quando há sidebar (mesmo recuo do .pb-breadcrumb). */ @media (min-width:769px){ html[data-pb-base="escuro"] body.pb-has-sidebar .breadcrumb{ margin:0 -32px 18px -32px; padding:10px 32px 10px 37px; } } /* ---- Barra de filtros como "hero" secundário (sem mexer no markup) -------- */ html[data-pb-base="escuro"] .toolbar{ padding:16px 18px; border-radius:var(--pb-hero-radius,6px); margin-bottom:18px; } /* respiro entre a barra de filtros e a tabela logo abaixo */ html[data-pb-base="escuro"] .toolbar + .table-wrap, html[data-pb-base="escuro"] .toolbar + #conteudo, html[data-pb-base="escuro"] .toolbar + .stats{ margin-top:0; } /* ============================================================================= MODO ESCURO ============================================================================= */ /* Breadcrumb antigo */ html[data-pb-tema="escuro"] .breadcrumb, html[data-pb-tema="escuro"] .breadcrumb a, html[data-pb-tema="escuro"] .breadcrumb a:hover, html[data-pb-tema="escuro"] .breadcrumb span{ color:var(--pb-bc,rgba(255,255,255,.72)); } html[data-pb-tema="escuro"] .breadcrumb a:hover{ color:#fff; } /* Título da página: fica no hero (cor branca via tema-escuro .pg-hero .pg-title); o ícone dourado do h1 permanece dourado. */ html[data-pb-tema="escuro"] .pg-hero h1 i, html[data-pb-tema="escuro"] .pg-title i{ color:var(--gold,#957c46); } /* Subtítulo dentro do hero */ html[data-pb-tema="escuro"] .pg-hero .subtitulo{ color:var(--pb-text,rgba(255,255,255,.82)); margin-bottom:0; } html[data-pb-tema="escuro"] .pg-hero .subtitulo code{ background:rgba(255,255,255,.12); color:var(--pb-text-strong,#d2b878); } /* Barra de filtros: mesma "cor de card de login" dos heros */ html[data-pb-tema="escuro"] .toolbar{ background:var(--pb-hero-bg,linear-gradient(160deg,rgba(69,64,51,.5),rgba(51,48,42,.5))); backdrop-filter:var(--pb-hero-blur,blur(16px) saturate(140%)); -webkit-backdrop-filter:var(--pb-hero-blur,blur(16px) saturate(140%)); box-shadow:var(--pb-hero-shadow,0 12px 38px rgba(0,0,0,.55)); } html[data-pb-tema="escuro"] .toolbar .info{ color:rgba(255,255,255,.7); } /* inputs/selects da barra continuam claros e legíveis sobre o hero */ html[data-pb-tema="escuro"] .toolbar input, html[data-pb-tema="escuro"] .toolbar select{ background:rgba(255,255,255,.96); border-color:rgba(0,0,0,.18); color:#1a1816; } /* Paginação (texto solto sobre o fundo escuro) */ html[data-pb-tema="escuro"] .pagina{ color:rgba(255,255,255,.7); } /* Stats/cards soltos sobre o fundo: deixa-os como quadros translúcidos */ html[data-pb-tema="escuro"] .stat{ color:rgba(255,255,255,.82); } html[data-pb-tema="escuro"] .stats{ color:rgba(255,255,255,.82); } /* A tabela, o modal e a paginação interna permanecem em superfície branca (legível) — nada a fazer além de manter o padrão do template. */ /* ============================================================================= MODO CLARO NATIVO (fundo branco do portal) — hero/filtros brancos, borda neutra ============================================================================= */ html[data-pb-light="nativo"][data-pb-tema="claro"] .toolbar{ background:#f1efeb; border:1px solid #e2dfd9; } html[data-pb-light="nativo"][data-pb-tema="claro"] .pg-hero{ border:1px solid #e2dfd9; } html[data-pb-light="nativo"][data-pb-tema="claro"] .pg-hero .subtitulo code{ background:rgba(40,32,24,.07); color:#8a6d12; }