/* Sistema 4×4D — Manual da marca Denkmal (carregado por último)
   Cores, logo e fontes seguem o "Manual de uso da marca da DENKMAL". */

/* Amarelo Denke: a variável era usada em vários lugares mas nunca tinha sido definida */
:root{--amarelo:#FFA600;}

/* ── TÍTULOS ──────────────────────────────────────────────
   Títulos em Work Sans caixa alta; a palavra em destaque (em) usa Anton, como os "displays" do manual. */
#splash h1 em,.site-header h1 em,.dash-title em,.pg-titulo em,.mc-hero-tit em,.gram-hero h1 em,.tr-tit em,h2[style*="Work Sans"] em{font-family:'Anton',sans-serif;font-weight:400;font-size:1.14em;letter-spacing:0.01em;line-height:0.9;}

/* ── ELEMENTOS DE APOIO (lápis, losangos, estrelas, linhas de caderno) ──
   Faixa sempre sobre o vermelho Denke, para os elementos creme terem contraste. */
.faixa-base,.faixa-topo{position:relative;}
.faixa-base::after,.faixa-topo::before{content:'';position:absolute;left:0;right:0;width:auto;height:44px;border:0;border-radius:0;
  background:var(--verm-dk) url('../img/padrao-denkmal-1col-h.svg') repeat-x 0 50%/auto 28px;pointer-events:none;}
.faixa-base::after{top:auto;bottom:0;}
.faixa-topo::before{top:0;}
.faixa-base{padding-bottom:calc(2.5rem + 44px) !important;}
.faixa-topo{padding-top:calc(2.5rem + 44px) !important;}

/* Cabeçalhos das áreas: a faixa entra no lugar dos círculos decorativos */
.site-header,.dash-hero,.prova-hero,.mc-hero,.gram-hero{position:relative;padding-bottom:calc(2.2rem + 44px);}
.site-header::before,.dash-hero::before{display:none;}
.site-header::after,.dash-hero::after,.prova-hero::after,.mc-hero::after,.gram-hero::after{content:'';position:absolute;left:0;right:0;top:auto;bottom:0;width:auto;height:44px;border:0;border-radius:0;
  background:var(--verm-dk) url('../img/padrao-denkmal-1col-h.svg') repeat-x 0 50%/auto 28px;pointer-events:none;}

/* Telas de resultado e conquista */
.rev-done{position:relative;border-top:0;padding-top:calc(3rem + 44px);}
.rev-done::before,.dsf-result::before{content:'';position:absolute;left:0;right:0;top:0;height:44px;
  background:var(--verm-dk) url('../img/padrao-denkmal-1col-h.svg') repeat-x 0 50%/auto 28px;pointer-events:none;}
.dsf-result{position:relative;padding-top:calc(1.5rem + 44px) !important;}

/* Escolha da prova: colunas do padrão nas laterais (o login ficou como era, a pedido da Marina) */
#splash::before,#splash::after{content:'';position:fixed;top:0;bottom:0;width:110px;
  background:url('../img/padrao-denkmal-v.svg') repeat-y 0 0/110px auto;pointer-events:none;z-index:0;}
#splash::before{left:32px;}
#splash::after{right:32px;background-position:0 -330px;}
#splash > *{position:relative;z-index:1;}
@media(max-width:960px){
  #splash::before{left:0;right:0;bottom:auto;width:auto;height:44px;
    background:var(--verm-dk) url('../img/padrao-denkmal-1col-h.svg') repeat-x 0 50%/auto 28px;}
  #splash::after{display:none;}
  #splash{padding-top:calc(1rem + 44px);}
}

/* Pflege no celular: as grades de 3–4 colunas passam para 2 (a Work Sans é mais larga que a Anton) */
@media(max-width:600px){
  #pg-sprechen-pflege [style*="repeat(4,1fr)"],#pg-sprechen-pflege [style*="repeat(3,1fr)"],
  #pg-schreiben-pflege [style*="repeat(3,1fr)"]{grid-template-columns:1fr 1fr !important;}
}

/* Busca de alunos (área Alunos da professora) */
.alunos-busca{position:relative;max-width:460px;margin-bottom:1rem;}
.alunos-busca input{width:100%;padding:0.75rem 1rem;border:1.5px solid rgba(89,2,2,0.25);background:#fff;color:var(--cinza);font-family:'Work Sans',sans-serif;font-size:0.85rem;outline:none;}
.alunos-busca input:focus{border-color:var(--verm);}
.alunos-sugestoes{position:absolute;left:0;right:0;top:100%;z-index:20;background:#fff;border:1.5px solid var(--verm);border-top:0;box-shadow:0 8px 20px rgba(36,36,36,0.12);}
.alunos-sugestao{display:flex;flex-direction:column;align-items:flex-start;gap:0.1rem;width:100%;padding:0.6rem 1rem;background:transparent;border:0;border-bottom:1px solid rgba(89,2,2,0.08);cursor:pointer;text-align:left;font-family:'Work Sans',sans-serif;}
.alunos-sugestao strong{font-size:0.82rem;color:var(--cinza);}
.alunos-sugestao span{font-size:0.7rem;color:var(--muted);}
.alunos-sugestao:hover,.alunos-sugestao.ativa{background:#FFF4E9;}
.alunos-sugestao:hover strong,.alunos-sugestao.ativa strong{color:var(--verm);}

/* Títulos de seção (sec-label) em fundo claro: a regra antiga deixava creme sobre creme, invisível */
.wrap .sec-label-title{color:var(--muted) !important;}
.dark-band .sec-label-title,.dark-band .wrap .sec-label-title{color:rgba(255,244,233,0.55) !important;}

/* Texto de exemplo (placeholder) legível nos campos de fundo claro — a regra geral é creme, para fundo escuro */
#quiz-nome::placeholder,[id^="add-"]::placeholder,#alunos-busca-input::placeholder{color:var(--muted-dim) !important;opacity:1;}

/* ── AJUSTES PARA CELULAR ─────────────────────────────── */
@media(max-width:680px){
  /* blocos com margem lateral fixa de 6rem (Pflege, ferramentas, cabeçalhos antigos) */
  .page [style*="padding:"][style*="6rem"]{padding-left:1.2rem !important;padding-right:1.2rem !important;}
  /* A Prova: descrição de cada parte pode quebrar linha; números do resumo menores */
  .parte-card{padding:1.4rem 1.2rem;}
  .parte-task span{white-space:normal;}
  .prova-stat{padding:1rem;}
  .prova-stat-val{font-size:1.35rem;line-height:1.1;overflow-wrap:anywhere;}
  /* tabelas largas (Guia Goethe × TELC e outras): rolam dentro de si, sem empurrar a página */
  .g-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .g-table th,.g-table td{padding:0.6rem 0.6rem;font-size:0.72rem;}
  .g-table th.col-criterio,.g-table td.col-criterio{width:88px;min-width:88px;}
}
@media(max-width:680px){
  /* Alunos (professora): cada aluno vira um cartão, sem cortar colunas */
  #alunos-lista table,#alunos-lista tbody,#alunos-lista tr,#alunos-lista td{display:block;width:100%;}
  #alunos-lista thead{display:none;}
  #alunos-lista tr{border:1px solid rgba(89,2,2,0.15) !important;margin-bottom:0.8rem;padding:0.6rem 0;}
  #alunos-lista td{padding:0.25rem 1rem !important;text-align:left !important;border:0 !important;}
  #alunos-lista td[style*="display:flex"]{justify-content:flex-start !important;flex-wrap:wrap;padding-top:0.6rem !important;}
}
@media(max-width:480px){
  /* Pflege: grades de duas colunas viram uma */
  #pg-sprechen-pflege [style*="grid-template-columns:1fr 1fr"],#pg-schreiben-pflege [style*="grid-template-columns:1fr 1fr"],
  #pg-sprechen-pflege [style*="grid-template-columns:1fr 1.2fr"],#pg-schreiben-pflege [style*="repeat(3,1fr)"]{grid-template-columns:1fr !important;}
}