/* GovernaMente — camada "humana": fotos de fundo no portal do paciente, na entrada e no painel.
   Fotos do Unsplash (licença Unsplash: uso livre, sem atribuição obrigatória), hospedadas aqui mesmo em assets/fotos/
   para o navegador do paciente não se conectar a nenhum site de terceiros.
   Carregue DEPOIS de app.css. */

:root{
  --foto-paciente:url("fotos/paciente.jpg");
  --foto-capa:url("fotos/capa.jpg");
  --foto-entrada:url("fotos/entrada.jpg");
  --foto-lateral:url("fotos/lateral.jpg");
  --foto-painel:url("fotos/painel.jpg");
}

/* ---------- Marca: perfil humano + onda + norte ---------- */
.brand{font-weight:600;letter-spacing:-.01em}
.brand .mente{font-style:italic;font-weight:500;color:var(--mel)}
.brand svg{width:2rem;height:2rem}
.side .brand svg{width:2.1rem;height:2.1rem}

/* ---------- Espaço do paciente e telas públicas (tema escuro) ---------- */
body:not(.admin){
  background:
    linear-gradient(180deg,rgba(10,18,14,.72) 0%,rgba(10,18,14,.86) 45%,rgba(10,18,14,.95) 100%),
    var(--foto-paciente) center/cover no-repeat fixed,
    var(--papel);
}
/* Tela de entrada / login: foto mais presente, cartão translúcido */
body:not(.admin):has(.narrow){
  background:
    linear-gradient(180deg,rgba(10,18,14,.45) 0%,rgba(10,18,14,.78) 100%),
    var(--foto-entrada) center/cover no-repeat fixed,
    var(--papel);
}
.narrow{
  background:rgba(20,33,26,.78);
  backdrop-filter:blur(14px) saturate(120%);
  -webkit-backdrop-filter:blur(14px) saturate(120%);
  border-color:rgba(255,255,255,.12);
  box-shadow:0 24px 60px rgba(0,0,0,.35);
}
header.top{background:rgba(10,18,14,.62)}
footer{border-top-color:rgba(255,255,255,.08)}

/* Capa principal: montanhas acima das nuvens */
.capa{
  min-height:22rem;
  background:
    linear-gradient(100deg,rgba(9,30,20,.92) 0%,rgba(13,58,36,.72) 45%,rgba(13,58,36,.15) 100%),
    var(--foto-capa) center 35%/cover no-repeat,
    #0d3a24;
}
.capa .deco{opacity:.1}

/* Cartões da área de membros: cada trilha com sua paisagem */
.cartao::before{background-size:cover;background-position:center}
.cartao.c1::before{background:linear-gradient(160deg,rgba(26,107,66,.35),rgba(13,58,36,.55)),url("fotos/c1.jpg") center/cover}
.cartao.c2::before{background:linear-gradient(160deg,rgba(185,121,26,.25),rgba(90,58,10,.5)),url("fotos/c2.jpg") center/cover}
.cartao.c3::before{background:linear-gradient(160deg,rgba(43,111,115,.3),rgba(16,55,59,.55)),url("fotos/c3.jpg") center/cover}
.cartao.c4::before{background:linear-gradient(160deg,rgba(106,90,140,.3),rgba(44,36,66,.55)),url("fotos/c4.jpg") center/cover}
.cartao.c5::before{background:linear-gradient(160deg,rgba(138,75,58,.25),rgba(62,31,23,.5)),url("fotos/c5.jpg") center/cover}
.cartao .marca{opacity:.12}

/* Blocos sobre a foto ganham um véu leve para leitura */
body:not(.admin) .card,
body:not(.admin) .item,
body:not(.admin) .etp,
body:not(.admin) .aqui,
body:not(.admin) .resumo div{
  background:rgba(20,33,26,.82);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

/* ---------- Painel do psicólogo (tema claro) ---------- */
body.admin{
  background:
    linear-gradient(rgba(241,239,233,.9),rgba(241,239,233,.94)),
    var(--foto-painel) center/cover no-repeat fixed,
    var(--papel);
}
.side{
  background:
    linear-gradient(180deg,rgba(10,20,15,.78) 0%,rgba(10,20,15,.9) 60%,rgba(10,20,15,.96) 100%),
    var(--foto-lateral) center/cover no-repeat,
    #0e1712;
}
.side a[aria-current=page]{background:rgba(26,58,40,.9)}
.admin .card,.admin .narrow,.stats div{
  background:rgba(255,255,255,.92);
  box-shadow:0 6px 20px rgba(30,40,30,.06);
}

@media (max-width:820px){
  body:not(.admin),body.admin{background-attachment:scroll}
}
@media (prefers-reduced-transparency:reduce){
  .narrow,body:not(.admin) .card,body:not(.admin) .item{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--areia)}
}
@media print{
  body,body.admin,body:not(.admin){background:#fff!important}
  .side{background:none}
}