/* CDBV — refino visual ("Arena refinada"), carregado DEPOIS de styles.css e do <style> de cada tela.
   Só CSS: não muda HTML, funções, permissões nem a cor do mês da Psicologia (a cor do mês entra por --accent no próprio elemento raiz e vence qualquer regra daqui).
   Princípios: números e títulos com voz esportiva; leitura, menus e formulários em fonte sans legível; menos decoração, mais hierarquia. */
:root{
  --radius:10px; --radius-lg:16px;
  --shadow:0 1px 2px rgba(20,27,45,.05),0 10px 26px -16px rgba(20,27,45,.22);
  --shadow-pop:0 28px 70px -24px rgba(5,8,22,.5);
  --tri-grad:linear-gradient(90deg,var(--navy) 0 50%,var(--brand) 50% 75%,var(--gold) 75%);
}
body{font-size:14.5px;}
h1,h2,h3{letter-spacing:-.012em;}

/* ---------- botões, campos, etiquetas ---------- */
.btn{border-radius:10px; min-height:38px; padding:8px 16px; font-weight:600;}
.btn-sm{min-height:32px; padding:5px 12px; border-radius:8px;}
.btn-primary{box-shadow:0 8px 16px -12px var(--accent);}
.field label{font-size:12.5px; text-transform:none; letter-spacing:0; font-weight:600; color:var(--ink);}
.field input,.field select,.field textarea,.mini-input{border-radius:10px;}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--accent); outline-offset:1px; box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent);}
.pill{border-radius:999px; padding:2px 10px; letter-spacing:.01em;}
.check-row,.resumo-fam{border-radius:12px;}
.pse-grid button{border-radius:10px; font-family:var(--f-num); font-size:20px;}

/* ---------- superfícies ---------- */
.panel{border-radius:var(--radius-lg); box-shadow:var(--shadow); border-color:color-mix(in srgb,var(--line) 75%,transparent);}
.panel-head{padding:14px 20px;}
.panel-head h2{font-family:var(--f-ui); font-size:14px; font-weight:650; text-transform:none; letter-spacing:0; color:var(--ink);}
.panel-body{padding:18px 20px;}
.event-item,.record,.produto-card,.price-card,.exercicio{border-radius:12px;}
.table-wrap{border-radius:12px;}
th{font-size:11.5px; letter-spacing:.05em; padding:10px 14px;}
td{padding:11px 14px;}

/* indicadores: peças separadas; a primeira ganha destaque (o número principal), as demais ficam em segundo plano */
.cards{gap:12px; background:transparent; border:0; border-radius:0; overflow:visible;}
.card{border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow); padding:16px 18px 17px;}
.card .label{font-size:11.5px; letter-spacing:.06em;}
.card .value{font-size:38px; margin-top:8px; font-variant-numeric:tabular-nums;}
html[data-amb="gestao"] .cards .card:first-child,html[data-amb="prep"] .cards .card:first-child{background:linear-gradient(155deg,#16244B,#0D1326); border-color:transparent; color:#fff;}
html[data-amb="prep"] .cards .card:first-child{background:linear-gradient(155deg,#16244B,#2B1318);}
html[data-amb="gestao"] .cards .card:first-child .label,html[data-amb="gestao"] .cards .card:first-child .foot,html[data-amb="prep"] .cards .card:first-child .label,html[data-amb="prep"] .cards .card:first-child .foot{color:#C6CEE4;}
html[data-amb="gestao"] .cards .card:first-child .value,html[data-amb="prep"] .cards .card:first-child .value{color:#fff; font-size:44px;}
html[data-amb="gestao"] .cards .card:first-child .value.ok,html[data-amb="prep"] .cards .card:first-child .value.ok{color:#7CE3B0;}
html[data-amb="gestao"] .cards .card:first-child .value.warn,html[data-amb="prep"] .cards .card:first-child .value.warn{color:#F2C679;}
html[data-amb="gestao"] .cards .card:first-child .value.bad,html[data-amb="prep"] .cards .card:first-child .value.bad{color:#FF9D93;}
html[data-amb="gestao"][data-theme="dark"] .cards .card:first-child,html[data-amb="prep"][data-theme="dark"] .cards .card:first-child{border-color:var(--line);}
.numero{border-radius:14px; box-shadow:var(--shadow); padding:14px 16px;}
.numero b{font-size:32px;}
.numero span{font-size:12.5px;}

/* ---------- navegação ---------- */
.sidebar{background:linear-gradient(180deg,#101A3A,#0A1128);}
.nav{padding:0 12px 14px; gap:2px;}
.nav-group{letter-spacing:.1em; padding:20px 10px 6px;}
.nav-btn{border-radius:10px; padding:9px 12px; min-height:40px;}
.nav-btn.active{background:rgba(255,255,255,.12);}
.nav-btn.active::before{left:-12px; width:4px; background:var(--gold); border-radius:0 3px 3px 0;}
.nav-btn.active .ic{color:#E3CF8E;}
.nav-btn .badge{border-radius:999px; padding:1px 8px;}
.topbar{border-bottom-color:var(--line);}
.tabs{border-radius:14px; padding:4px;}
.tab-btn{border-radius:11px; min-height:44px;}
.tab-btn.active{box-shadow:var(--shadow), inset 0 -2px 0 var(--brand);}
.abas{gap:4px; border-bottom-color:var(--line);}
.aba-btn{padding:11px 16px; border-bottom-width:3px; border-radius:10px 10px 0 0; min-height:44px;}
.aba-btn:hover{background:var(--surface-2);}
.subtabs button{padding:10px 16px; border-bottom-width:3px;}
.site-nav-item{border-radius:10px; padding:12px 12px;}

/* ---------- portal das famílias ---------- */
.atleta-card{border-radius:18px; box-shadow:var(--shadow);}
.atleta-nome{font-size:19px;}
.prog{border-radius:22px;}
.panel h2{font-size:19px;}
.inicio-titulo{font-size:26px;}

/* ---------- janelas, avisos, estados vazios ---------- */
.overlay{backdrop-filter:blur(3px);}
.modal{border:0; border-image:none; border-radius:20px; box-shadow:var(--shadow-pop); background:var(--tri-grad) top left/100% 4px no-repeat var(--surface);}
.modal-head{padding:18px 22px 14px;}
.modal-head h3{font-size:19px;}
.modal-body{padding:18px 22px;}
.modal-foot{padding:14px 22px; border-radius:0 0 20px 20px;}
.toast,#toast{border-radius:14px; padding:12px 20px; font-size:13.5px; border-left:0; box-shadow:var(--shadow-pop); display:flex; align-items:center; gap:10px; max-width:min(92vw,520px);}
.toast:not([hidden])::before,#toast:not([hidden])::before{content:""; flex:none; width:8px; height:8px; border-radius:50%; background:var(--gold);}
.toast[hidden],#toast[hidden]{display:none;}
.empty{padding:36px 20px; border:1px dashed var(--line-strong); border-radius:var(--radius-lg); background:color-mix(in srgb,var(--surface-2) 70%,transparent); color:var(--ink-soft);}
.empty h3{font-size:17px;}
.alerta{border-radius:12px;}
.instalar-banner{border-radius:16px; border-left:0; box-shadow:var(--shadow-pop);}

/* barra de abas do app instalado: flutuante, escura, com o item ativo bem marcado e alvos de toque confortáveis */
html.is-standalone .app-abas{left:10px; right:10px; bottom:calc(8px + var(--safe-bottom)); border:0; border-radius:24px; background:#141C33; padding:6px; box-shadow:0 18px 36px -14px rgba(5,8,24,.6);}
html[data-theme="dark"].is-standalone .app-abas{background:#1B2547;}
@media (prefers-color-scheme:dark){ html:not([data-theme="light"]).is-standalone .app-abas{background:#1B2547;} }
.app-abas .app-aba{color:#B9C2DB; min-height:54px; border-radius:18px; font-size:11px;}
.app-abas .app-aba.active,.app-abas .app-aba.on{color:#fff; background:rgba(255,255,255,.14);}
.app-abas .app-aba.active svg,.app-abas .app-aba.on svg{color:#E3CF8E;}
html.is-standalone .toast{bottom:calc(92px + var(--safe-bottom));}

@media (max-width:820px){
  .nav-btn{min-height:46px;}
  .main .panel{border-radius:14px;}
  html[data-amb="gestao"] .cards .card:first-child,html[data-amb="prep"] .cards .card:first-child{grid-column:1/-1;}
  .card .value{font-size:32px;} html[data-amb="gestao"] .cards .card:first-child .value,html[data-amb="prep"] .cards .card:first-child .value{font-size:40px;}
}

/* ---------- um tom por ambiente (a Psicologia segue a cor do mês e não é alterada) ---------- */
html[data-amb="fisio"]{--accent:#11686B; --accent-ink:#FFFFFF; --accent-soft:#DCF0EF; --bg:#EDF2F4;}
html[data-amb="prep"]{--accent:#B02D23; --accent-ink:#FFFFFF; --accent-soft:#FBE8E5;}
html[data-amb="psico"]{--bg:#F4F1EC;}
html[data-amb="psico"] .panel,html[data-amb="psico"] .numero{box-shadow:none;}
html[data-amb="psico"] h1,html[data-amb="psico"] h2,html[data-amb="psico"] h3{font-weight:550;}
html[data-amb="fisio"] .aba-btn.active{border-bottom-color:var(--accent);}
html[data-amb="fisio"] .numero b{color:var(--accent);}
@media (prefers-color-scheme:dark){
  html[data-amb="fisio"]:not([data-theme="light"]){--accent:#4FC3C2; --accent-ink:#06201F; --accent-soft:#10302F; --bg:#0D1322;}
  html[data-amb="prep"]:not([data-theme="light"]){--accent:#EE6A5E; --accent-ink:#1B0907; --accent-soft:#3A1D22;}
}
html[data-amb="fisio"][data-theme="dark"]{--accent:#4FC3C2; --accent-ink:#06201F; --accent-soft:#10302F; --bg:#0D1322;}
html[data-amb="prep"][data-theme="dark"]{--accent:#EE6A5E; --accent-ink:#1B0907; --accent-soft:#3A1D22;}

/* ---------- segunda rodada (06/11/2026): menos placar, mais clareza; cada ambiente com sua voz ---------- */
/* mensagens de erro de formulário: mesma forma em todo lugar (o texto e a cor vêm da própria tela) */
[id$="Erro"]:not(:empty){padding:8px 12px; border-radius:10px; background:var(--danger-soft);}
[aria-busy="true"]{opacity:.65; transition:opacity .15s;}
/* Gestão: executiva — números tabulares, tabela mais arejada, sem decoração sobre os dados */
html[data-amb="gestao"] td,html[data-amb="gestao"] .card .value,html[data-amb="gestao"] .numero b{font-variant-numeric:tabular-nums;}
html[data-amb="gestao"] tbody tr:hover td{background:var(--surface-2);}
/* Fisioterapia: clínica, leve e calma — bordas finas no lugar de sombras, títulos em peso médio */
html[data-amb="fisio"] .panel,html[data-amb="fisio"] .card,html[data-amb="fisio"] .numero{box-shadow:none; border-color:var(--line);}
html[data-amb="fisio"] h1,html[data-amb="fisio"] h2,html[data-amb="fisio"] h3{font-weight:550;}
html[data-amb="fisio"] .btn-primary{box-shadow:none;}
html[data-amb="fisio"] .pill{font-weight:600;}
html[data-amb="fisio"] body{line-height:1.6;}
/* Psicologia: acolhedora e discreta — sem sombra, sem destaque escuro, cantos suaves (a cor do mês continua vindo da campanha) */
html[data-amb="psico"] .btn-primary{box-shadow:none;}
html[data-amb="psico"] .panel,html[data-amb="psico"] .card,html[data-amb="psico"] .modal{border-radius:18px;}
html[data-amb="psico"] .card .value,html[data-amb="psico"] .numero b{font-weight:600;}
html[data-amb="psico"] body{line-height:1.65;}
/* Preparação Física: a voz esportiva mais forte — números grandes e barra de acento nos indicadores */
html[data-amb="prep"] .numero{border-top:3px solid var(--accent);}
html[data-amb="prep"] .numero b{font-size:38px; color:var(--accent);}
html[data-amb="prep"] .card .value{font-size:42px;}
html[data-amb="prep"] .aba-btn.active,html[data-amb="prep"] .tab-btn.active{border-bottom-color:var(--accent);}
/* Portal do Atleta: mais jovem — títulos de painel na voz condensada, botões de ação largos */
#tab-portalatleta .panel > h2,#tab-portalatleta .panel-head h2{font-family:var(--f-num); font-size:24px; font-weight:700; letter-spacing:.01em; color:var(--ink); text-transform:none;}
#tab-portalatleta .panel{border-radius:18px;}
#tab-portalatleta .btn{min-height:44px;}
/* Portal do Responsável: elegante e simples — painéis sem sombra, mais respiro, títulos serifados */
#tab-portalresp .panel{box-shadow:none; border-radius:16px; padding-block:2px;}
#tab-portalresp .panel > h2{font-family:var(--f-title); font-size:18px; font-weight:600;}
#tab-portalresp .btn{min-height:44px;}
@media (prefers-reduced-motion:reduce){ .overlay{backdrop-filter:none;} [aria-busy="true"]{transition:none;} }