/* ==========================================================================
   LIQUID GLASS — Já Tô Aqui (camada SÓ VISUAL, carregada por último no <head>)
   Ativada por cookie `jta_lg=1` (prévia do Cadu) ou PONTO_LIQUID_GLASS_TODOS=1.
   Não muda HTML/JS/IDs: só aparência. Paleta da marca (DESIGN.md) mantida.
   Regras Apple: vidro com blur só nas camadas de topo (cartão principal, barra,
   modais); superfícies internas = translúcidas SEM blur (sem vidro sobre vidro);
   fallback opaco p/ reduzir transparência / navegador sem backdrop-filter.
   ========================================================================== */
:root {
  --lg-bg: #f3ebe3;
  --lg-surf: rgba(255,255,255,.58);       /* cartão principal (com blur) */
  --lg-in: rgba(255,255,255,.66);         /* superfícies internas (sem blur) */
  --lg-in-forte: rgba(255,255,255,.82);
  --lg-borda: rgba(255,255,255,.75);
  --lg-borda-suave: rgba(16,63,69,.08);
  --lg-hi: inset 0 1px 0 rgba(255,255,255,.95), inset 0 -1px 0 rgba(16,63,69,.04);
  --lg-sombra: 0 24px 60px -24px rgba(16,63,69,.35), 0 6px 18px -8px rgba(16,63,69,.18);
  --lg-sombra-in: 0 6px 18px -10px rgba(16,63,69,.22);
  --lg-blur: blur(26px) saturate(180%);
  --lg-blur-sm: blur(14px) saturate(170%);
  --lg-r-xl: 28px; --lg-r-lg: 20px; --lg-r-md: 16px; --lg-r-sm: 12px;
  --lg-mola: cubic-bezier(.2,.9,.25,1);
}

/* ---------- Fundo: luz ambiente da marca (petróleo + laranja) ---------- */
html body {
  background-color: var(--lg-bg);
  background-image:
    radial-gradient(70vw 70vw at 105% -10%, rgba(233,126,42,.30), transparent 60%),
    radial-gradient(80vw 80vw at -20% 30%, rgba(16,63,69,.22), transparent 62%),
    radial-gradient(60vw 60vw at 90% 110%, rgba(233,126,42,.18), transparent 60%),
    linear-gradient(180deg, #f7efe7 0%, #efe4da 100%);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
}
html body.parc-body {
  background-color: #0d3439;
  background-image:
    radial-gradient(70vw 70vw at 105% -10%, rgba(233,126,42,.38), transparent 60%),
    radial-gradient(80vw 80vw at -20% 40%, rgba(46,120,128,.45), transparent 62%),
    linear-gradient(180deg, #123f45 0%, #0a2a2e 100%);
}

/* ---------- Cartão principal = vidro (blur real) ---------- */
html .card, html .parc-form-card {
  background: var(--lg-surf);
  -webkit-backdrop-filter: var(--lg-blur); backdrop-filter: var(--lg-blur);
  border: 1px solid var(--lg-borda);
  border-radius: var(--lg-r-xl);
  box-shadow: var(--lg-hi), var(--lg-sombra);
}
@media (max-width: 480px) { html .card { border-radius: 24px; } }

/* Faixa do topo: vidro petróleo com aresta de luz */
html .cabecalho-verde {
  background: linear-gradient(160deg, rgba(16,60,65,.96) 0%, rgba(11,46,51,.95) 55%, rgba(6,31,35,.96) 100%);
  border-radius: calc(var(--lg-r-xl) - 1px) calc(var(--lg-r-xl) - 1px) 0 0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(255,255,255,.06);
  position: relative; overflow: hidden;
}
html .cabecalho-verde::after {
  content: ""; position: absolute; right: -60px; top: -70px; width: 220px; height: 220px; border-radius: 50%;
  background: radial-gradient(circle, rgba(233,126,42,.30), transparent 68%); pointer-events: none;
}
html .cabecalho-verde > * { position: relative; z-index: 1; }
@media (max-width: 480px) { html .cabecalho-verde { border-radius: 23px 23px 0 0; } }

/* Topos próprios (financeiro / parceiro) */
html .pp-topo, html .fin-topo {
  background: linear-gradient(160deg, #103c41 0%, #0b2e33 55%, #061f23 100%);
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.08);
}

/* ---------- Navegação: segmentos de vidro ---------- */
html .nav a {
  background: var(--lg-in); color: var(--petroleo); border: 1px solid var(--lg-borda); border-radius: 999px;
  box-shadow: var(--lg-hi); transition: background .25s var(--lg-mola), transform .2s var(--lg-mola);
}
html .cabecalho-verde .nav a {
  background: rgba(255,255,255,.14); color: var(--creme);
  border-color: rgba(255,255,255,.16); box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
}
html .cabecalho-verde .nav a:hover { background: rgba(255,255,255,.26); }
html .nav a.ativo, html .cabecalho-verde .nav a.ativo {
  background: rgba(255,255,255,.94); color: var(--petroleo); font-weight: 700;
  box-shadow: inset 0 1px 0 #fff, 0 6px 16px -6px rgba(0,0,0,.35), inset 0 0 0 1.5px var(--laranja);
}
html .nav a:active { transform: scale(.96); }

/* Abas da funcionária: barra de vidro em pílula */
html .tabbar {
  background: var(--lg-in); border: 1px solid var(--lg-borda); border-radius: 22px;
  padding: 4px; gap: 4px; box-shadow: var(--lg-hi), var(--lg-sombra-in);
}
html .tabbar .tab { border-bottom: none; border-radius: 18px; padding: 7px 2px 8px;
  transition: background .25s var(--lg-mola); }
html .tabbar .tab.ativo { background: rgba(255,255,255,.95);
  box-shadow: inset 0 1px 0 #fff, 0 4px 12px -6px rgba(16,63,69,.35), inset 0 -2px 0 var(--laranja); }

/* ---------- Superfícies internas: translúcidas, SEM blur ---------- */
html .bt-recurso, html .marca-card, html .cfg-card, html .card-acao, html .folha-item,
html .com-card, html .hist-card, html .diaria-item, html .diaria-lista li, html .historico-vales li,
html .lista-vales li, html .lista-comunicados li, html .diarista-card, html .dias-grid li,
html .form-vale, html .revisao-vale, html .mc-acc, html .mc-bloco, html .mc-cobr-wrap,
html .faq details, html .sel-func, html .decisao-conferir, html .afast-card,
html .fin-card:not(.destaque), html .pp-kpi, html .pp-secao, html .fin-tabela-box {
  background: var(--lg-in);
  border-color: var(--lg-borda);
  box-shadow: var(--lg-hi), var(--lg-sombra-in);
}
html .bt-recurso, html .marca-card, html .cfg-card, html .card-acao, html .folha-item,
html .com-card, html .hist-card, html .mc-acc, html .mc-bloco, html .mc-cobr-wrap,
html .diarista-card, html .form-vale, html .revisao-vale, html .pp-kpi, html .pp-secao {
  border-radius: var(--lg-r-lg);
}
/* mantém as bordas laterais de status (verde/laranja/amarelo/cinza) */
html .bt-recurso { border-left-width: 4px; }
html .folha-item.st-validada, html .diaria-item.pago { background: rgba(236,248,238,.78); }
html .bt-recurso:hover, html .bt-recurso:focus-visible,
html .diarista-card:hover, html .diarista-card:focus-visible {
  background: var(--lg-in-forte); transform: translateY(-1px);
  box-shadow: var(--lg-hi), 0 12px 26px -12px rgba(16,63,69,.35);
}
html .bt-recurso .selo, html .mc-acc > summary .si, html .mc-cobr .ic {
  background: linear-gradient(160deg, rgba(251,234,217,.95), rgba(251,234,217,.6));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 2px 6px -2px rgba(233,126,42,.35);
  border-radius: 13px;
}

/* Blocos creme/realce: viram vidro tingido */
html .kpi, html .kpis-diaria .kpi, html .pend-item, html .bt-ponto, html .bt-escolha,
html .trial-box, html .ficha dl, html .aviso-leigo, html .voltar-relatorio {
  background: var(--lg-in); border-color: var(--lg-borda);
  box-shadow: var(--lg-hi), var(--lg-sombra-in);
}
html .kpi, html .pend-item, html .bt-ponto, html .bt-escolha, html .trial-box { border-radius: var(--lg-r-md); }
html a.kpi:hover { background: var(--lg-in-forte); }
html .bt-ponto.sugerido, html .bt-escolha:hover, html .bt-escolha:focus-visible {
  background: linear-gradient(160deg, rgba(251,234,217,.95), rgba(251,234,217,.7));
  border-color: var(--laranja);
}
html .casa-atual, html .saldo-topo, html .extrato-saldo, html .resumo-diaria, html .func-banner,
html .faixa-update, html .card-confira, html .campos-diarista, html .pin-novo {
  background: linear-gradient(160deg, rgba(251,234,217,.92), rgba(251,234,217,.62));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), var(--lg-sombra-in);
  border-radius: var(--lg-r-md);
}
html .func-dia[open] > .func-banner { border-radius: var(--lg-r-md) var(--lg-r-md) 0 0; }
html .func-dia > .lista-marcas { background: rgba(255,250,244,.6); border-color: rgba(243,216,189,.8);
  border-radius: 0 0 var(--lg-r-md) var(--lg-r-md); }
html .aviso-validar { background: linear-gradient(160deg, rgba(255,246,230,.95), rgba(255,246,230,.7));
  border-radius: var(--lg-r-md); box-shadow: inset 0 1px 0 #fff, 0 10px 24px -12px rgba(233,126,42,.45); }
html .ajuda-envio, html .afast-periodo { background: rgba(243,248,248,.72); border-color: var(--lg-borda);
  border-radius: var(--lg-r-md); box-shadow: var(--lg-hi); }
html .zona-risco { background: rgba(253,247,246,.75); border-radius: var(--lg-r-md); }
html .ficha-reativar { background: rgba(244,250,245,.75); border-radius: var(--lg-r-md); }
html .msg-ok, html .msg-erro, html .aviso { border-radius: var(--lg-r-sm); box-shadow: inset 0 1px 0 rgba(255,255,255,.7); }

/* Cartões escuros premium (plano / histórico / destaque financeiro): aresta de luz */
html .mc-plano, html .hist-banner, html .fin-card.destaque {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 22px 44px -20px rgba(16,63,69,.6);
  border: 1px solid rgba(255,255,255,.10);
}
html .mc-plano { border-radius: 24px; }

/* ---------- Botões: pílulas com brilho de vidro ---------- */
html .bt-acao, html .bt-largo, html .sair-bt, html .bt-add-vale, html .form-vale button[type=submit],
html .acao-inline button, html .faixa-update-bt, html .tecla-acao.ok {
  border-radius: 999px;
  background-image: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,0) 55%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 8px 18px -8px rgba(233,126,42,.65);
  transition: transform .18s var(--lg-mola), box-shadow .2s, filter .2s;
}
html .bt-acao:active, html .bt-largo:active, html .sair-bt:active, html .acao-inline button:active { transform: scale(.97); }
html .bt-largo.bt-secundario {
  background: rgba(255,255,255,.55); color: var(--laranja); border: 1.5px solid rgba(233,126,42,.7);
  box-shadow: var(--lg-hi);
}
html .acao-inline .btn-secundario { background-color: var(--cinza); box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 6px 14px -8px rgba(16,63,69,.5); }
html .acao-inline .btn-perigo { background-color: var(--erro); box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 6px 14px -8px rgba(192,57,43,.6); }
html .acao-inline .btn-enviar { background-color: #1e7a1e; box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 6px 14px -8px rgba(30,122,30,.6); }
html .bt-perigo { border-radius: 999px; background: rgba(251,234,234,.75); box-shadow: inset 0 1px 0 rgba(255,255,255,.8); }
html .bt-mini, html .bt-mini.cinza, html .mes-nav-bt, html .chip, html .tag, html .badge, html .folha-tipo, html .hist-tag {
  background-color: rgba(255,255,255,.62); border-color: var(--lg-borda);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 2px 6px -3px rgba(16,63,69,.25);
}
html .bt-mini:hover, html .mes-nav-bt:hover { background-color: rgba(251,234,217,.9); }
html .mes-nav-bt { border-radius: 999px; }
html .bt-faceid { background: rgba(255,255,255,.6); box-shadow: var(--lg-hi); border-radius: 999px; }
html .bt-social { border-radius: 999px; }
html .teclado button {
  background: rgba(255,255,255,.62); border-radius: 18px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 4px 12px -6px rgba(16,63,69,.3);
  transition: transform .12s var(--lg-mola), background .15s;
}
html .teclado button:active { transform: scale(.94); background: rgba(251,234,217,.95); }
html .teclado .tecla-acao.ok { background-color: var(--laranja); }
/* tags de status mantêm a cor */
html .tag-rascunho { background-color: rgba(251,234,217,.9); }
html .tag-aguardando, html .badge.alerta { background-color: rgba(253,236,210,.9); }
html .tag-validado { background-color: rgba(232,246,232,.9); }
html .tag-contestado, html .tag-estornado { background-color: rgba(253,236,234,.9); }
html .badge.agora { background-color: var(--laranja); }

/* ---------- Campos ---------- */
html input:not([type=checkbox]):not([type=radio]):not([type=range]), html select, html textarea {
  background: rgba(255,255,255,.72); border: 1px solid rgba(16,63,69,.12); border-radius: 14px;
  box-shadow: inset 0 1px 2px rgba(16,63,69,.06);
  transition: border-color .15s, box-shadow .2s, background .15s;
}
html input:not([type=checkbox]):not([type=radio]):focus, html select:focus, html textarea:focus {
  outline: none; background: #fff; border-color: var(--laranja);
  box-shadow: 0 0 0 4px rgba(233,126,42,.18);
}

/* ---------- Tabelas ---------- */
html th, html td { border-bottom-color: rgba(16,63,69,.08); }
@media (max-width: 480px) {
  html table.lista-cards tr { background: var(--lg-in); border-color: var(--lg-borda);
    border-radius: var(--lg-r-md); box-shadow: var(--lg-hi), var(--lg-sombra-in); }
  html table.lista-cards td { border-bottom-color: rgba(16,63,69,.06); }
}

/* ---------- Modais: véu desfocado + folha de vidro ---------- */
html .modal-overlay, html .modal-ov, html .modal-convite {
  background: rgba(16,63,69,.32);
  -webkit-backdrop-filter: blur(8px) saturate(140%); backdrop-filter: blur(8px) saturate(140%);
}
html .modal-card, html .modal-cx, html .modal-convite .caixa {
  background: rgba(255,255,255,.80);
  -webkit-backdrop-filter: var(--lg-blur); backdrop-filter: var(--lg-blur);
  border: 1px solid var(--lg-borda); border-radius: 26px;
  box-shadow: var(--lg-hi), 0 30px 70px -20px rgba(16,63,69,.55);
  animation: lg-materializa .32s var(--lg-mola) both;
}
@keyframes lg-materializa {
  from { opacity: 0; transform: scale(.94); filter: blur(6px); }
  to   { opacity: 1; transform: none; filter: none; }
}

/* ---------- Imagens de marca ---------- */
html .logo-login { border-radius: 28px; box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 14px 30px -12px rgba(16,63,69,.45); }
html .hero-escolha { border-radius: 24px; box-shadow: 0 18px 40px -18px rgba(16,63,69,.5); }
html .pdf-viewer, html .pdf-render { border-radius: var(--lg-r-md); border-color: var(--lg-borda); }

/* ---------- Acessibilidade e fallback ---------- */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html .card, html .parc-form-card { background: rgba(255,255,255,.94); }
  html .modal-card, html .modal-cx, html .modal-convite .caixa { background: #fff; }
}
@media (prefers-reduced-transparency: reduce) {
  html .card, html .parc-form-card, html .modal-card, html .modal-cx, html .modal-convite .caixa {
    background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
  html .bt-recurso, html .marca-card, html .cfg-card, html .card-acao, html .folha-item, html .com-card,
  html .kpi, html .tabbar, html .mc-acc, html .mc-bloco, html .faq details { background: #fff; }
}
@media (prefers-contrast: more) {
  html .card, html .bt-recurso, html .marca-card, html .cfg-card, html .card-acao, html .kpi {
    background: #fff; border-color: rgba(16,63,69,.35); }
}
@media (prefers-reduced-motion: reduce) {
  html .modal-card, html .modal-cx, html .modal-convite .caixa { animation: none; }
  html .bt-recurso:hover, html .diarista-card:hover { transform: none; }
}

/* Parceiro: cartão claro sobre fundo petróleo — vidro mais denso p/ legibilidade */
html .parc-form-card { background: rgba(255,255,255,.90); }

/* Sair: discreto no verde (sem brilho laranja) */
html .sair-bt {
  background: rgba(233,126,42,.22); color: #fff; border: 1px solid rgba(233,126,42,.45);
  background-image: none; box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
}
html .sair-bt:hover { background: rgba(233,126,42,.34); filter: none; }
