/* Painel de verdade (painel.js): entrar, vídeos chegando, aulas, usuários e lixeira.
   Usa as cores e peças de ../styles.css e admin.css. */

/* Antes de entrar só aparece a tela de entrar */
body.fora .topbar,body.fora .adm-wrap{display:none}
.entrar{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:24px 16px calc(24px + env(safe-area-inset-bottom))}
.entrar-card{width:100%;max-width:400px;padding:28px 22px;border-radius:18px;background:var(--bg-2);border:1px solid var(--line);box-shadow:0 20px 60px rgba(0,0,0,.45)}
.entrar-marca{display:flex;align-items:center;gap:10px;margin-bottom:22px;font:700 .95rem Sora,sans-serif}
.entrar-card h1{font-size:1.6rem}
.entrar-sub{margin:6px 0 20px;color:var(--muted);font-size:.92rem}
.entrar-card .btn{width:100%;margin:6px 0 14px}
.entrar-erro{margin:0 0 12px;padding:10px 12px;border-radius:10px;background:rgba(255,90,60,.14);color:#ff9d87;font-size:.88rem;font-weight:600}
button.avatar{cursor:pointer;flex:none}

/* Menu: grupo da prévia e contador dos vídeos que chegaram */
.nav-grupo{margin:14px 12px 4px;color:var(--muted);font:500 .64rem/1.3 "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase}
.adm-nav .nav-n{margin-left:auto;min-width:24px;height:24px;padding:0 7px;display:grid;place-items:center;border-radius:999px;background:var(--accent);color:#0a0e13;font:800 .74rem/1 Sora,sans-serif}
.nota-exemplo{margin:0 0 16px;padding:10px 14px;border-radius:12px;border:1px dashed rgba(255,180,84,.45);background:rgba(255,180,84,.07);color:#ffd29a;font-size:.84rem;line-height:1.45}

/* Avisos do topo */
.aviso-drive{margin:0 0 16px;padding:12px 14px;border-radius:12px;background:rgba(255,90,60,.14);border:1px solid rgba(255,90,60,.35);color:#ffb3a3;font-size:.88rem;font-weight:600}
.aviso-prontos{display:flex;align-items:center;gap:12px;margin:0 0 16px;padding:14px 16px;border-radius:14px;background:rgba(255,122,26,.12);border:1px solid rgba(255,122,26,.45)}
.aviso-prontos svg{flex:none;width:26px;height:26px;color:var(--accent)}
.aviso-prontos b{display:block;font-size:.95rem}
.aviso-prontos small{color:var(--accent-2);font-size:.82rem;font-weight:600}
.aviso-prontos:hover{border-color:var(--accent)}

/* Vídeos chegando */
.chegou-lista{display:grid;gap:12px}
.chegou{display:grid;grid-template-columns:150px minmax(0,1fr);gap:14px;align-items:start;margin:0}
.chegou.com-erro{border-color:rgba(255,90,60,.45)}
.chegou-capa{display:grid;place-items:center;aspect-ratio:16/9;border-radius:10px;background:var(--bg-3);overflow:hidden;color:var(--muted)}
.chegou-capa img{width:100%;height:100%;object-fit:cover;display:block}
.chegou-capa svg{width:34px;height:34px}
.chegou-txt{min-width:0}
.chegou-txt > b{display:block;font-family:Sora,sans-serif;font-size:1rem;overflow-wrap:anywhere}
.chegou-txt .mono{display:block;margin:2px 0 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chegou-txt .nota,.chegou-txt .erro-txt{margin:8px 0 0}
.erro-txt{color:#ff9d87;font-size:.86rem;font-weight:600;line-height:1.45}
.mini-prog.largo{display:block;width:100%;max-width:320px;height:6px;margin-top:10px}
.chegou-acoes{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.chegou-acoes:empty{display:none}
@media (max-width:520px){
  .chegou{grid-template-columns:96px minmax(0,1fr);gap:12px}
  .chegou-acoes .btn{flex:1}
}
@media (min-width:900px){.chegou{grid-template-columns:200px minmax(0,1fr) auto}.chegou-acoes{grid-column:auto;align-self:center}}
.vazio-grande{display:grid;justify-items:center;gap:6px;padding:36px 20px;text-align:center}
.vazio-grande svg{width:38px;height:38px;color:var(--accent)}
.vazio-grande b{font-family:Sora,sans-serif;font-size:1.1rem}
.vazio-grande p{max-width:420px;margin:0;color:var(--muted);font-size:.9rem}

/* Aulas: ajuste geral, módulos e linhas */
.card-top small{display:block;margin-top:4px;color:var(--muted);font-size:.8rem}
.ag-campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px;align-items:end}
.ag-campos .campo{margin-bottom:0}
.ag-campos .btn{grid-column:1/-1;margin-top:12px}
@media (min-width:720px){.ag-campos{grid-template-columns:repeat(2,minmax(0,220px)) auto}.ag-campos .btn{grid-column:auto;margin:0}}
@media (max-width:420px){.ag-campos{grid-template-columns:1fr}.ag-campos .campo + .campo{margin-top:12px}}
.arrastar-nota{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.pega-mini svg{width:16px;height:16px;vertical-align:-3px;color:var(--ink)}
.mods-lista{display:grid;align-content:start}
.dif{color:var(--accent-2);font-weight:600}
.capa-vazia{flex:none;display:grid;place-items:center;width:96px;aspect-ratio:16/9;border-radius:8px;background:var(--bg-3);color:var(--muted)}
.capa-vazia svg{width:22px;height:22px}

/* Pontinhos de arrastar: alvo de dedo grande e sem rolar a página */
.pega{flex:none;width:36px;height:40px;display:grid;place-items:center;margin-left:-8px;border-radius:8px;color:var(--muted);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}
.pega:hover{color:var(--ink);background:var(--bg-3)}
.pega:active{cursor:grabbing}
.pega svg{width:18px;height:18px}
.mod-tit .pega{margin-right:-2px}
.arrastando{position:relative;z-index:5;background:var(--bg-3);border-radius:12px;box-shadow:0 14px 34px rgba(0,0,0,.55);outline:1px solid rgba(255,122,26,.55)}
.aula-linha.arrastando{padding-left:8px;padding-right:8px;margin:0 -8px}
.em-ordem{-webkit-user-select:none;user-select:none}
.recolhida .aulas-lista,.recolhida .modulo > .vazio,.recolhida .mod-acoes{display:none}
.recolhida .modulo{padding-top:10px;padding-bottom:10px;margin-bottom:8px}
.recolhida .modulo .card-top{margin:0}
@media (max-width:600px){
  .aula-linha .pega,.mod-tit .pega{display:grid}
  .aula-linha{display:grid;grid-template-columns:auto 84px minmax(0,1fr);gap:6px 10px}
  .aula-linha img,.aula-linha .capa-vazia{width:84px}
  .aula-linha .chip{grid-column:2/3;justify-self:start;white-space:normal}
  .aula-linha .btn{grid-column:3/4;justify-self:end;margin:0}
}

/* Formulário da aula */
/* janela com <form> em volta: o form vira a coluna (senão o miolo não rola e o fim sai da tela no celular) */
.adm-modal > form{flex:1;min-height:0;display:flex;flex-direction:column}
.adm-modal .modal-top h2{flex:1;min-width:0}
.grupo{margin:4px 0 14px;padding:14px 14px 4px;border:1px solid var(--line);border-radius:12px}
.grupo legend{padding:0 6px;color:#cfd6de;font-size:.82rem;font-weight:700}
.grupo legend .chip{margin-left:4px}
.grupo .nota{margin:0 0 10px}
.duas-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}
@media (max-width:420px){.duas-col{grid-template-columns:1fr}}
.opcao{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-top:1px solid var(--line);cursor:pointer}
.grupo legend + .opcao{border-top:0}
.opcao input{flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:var(--accent)}
.opcao b{display:block;font-size:.92rem}
.opcao small{color:var(--muted);font-size:.8rem}
.agenda{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px;padding:6px 0 4px 30px}
.em-breve{opacity:.6}
.em-breve .troca{cursor:not-allowed}
.capa-ed{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:12px;align-items:start}
.capa-ed > img,.capa-ed > .capa-vazia{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;background:var(--bg-3)}
.capa-bts{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.capa-bts label.btn{cursor:pointer}
@media (max-width:560px){.capa-ed{grid-template-columns:1fr}.capa-bts{flex-direction:row;flex-wrap:wrap}}
.momento{margin-top:12px;padding:12px;border-radius:12px;background:var(--bg)}
.momento img{display:block;width:100%;max-width:420px;aspect-ratio:16/9;object-fit:contain;margin:0 auto 10px;border-radius:8px;background:#000}
.momento input[type=range]{width:100%;accent-color:var(--accent);height:32px}
.m-linha{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.m-linha .sp{flex:1}
#m-txt{font:500 .9rem "JetBrains Mono",monospace}
.opcao-video{display:flex;align-items:center;gap:12px;padding:8px 0;border-top:1px solid var(--line);cursor:pointer}
.opcao-video input{flex:none;width:20px;height:20px;accent-color:var(--accent)}
.opcao-video img{width:96px;aspect-ratio:16/9;object-fit:cover;border-radius:6px}
.opcao-video b{display:block;font-size:.9rem}
.opcao-video small{color:var(--muted);font-size:.78rem}
#trocar{margin-top:10px}
#trocar .btn{margin-top:10px}
.adm .btn.perigo{background:#e5484d;color:#fff}
.adm .btn.perigo:hover{background:#f2555a}
.adm .btn.ghost.perigo{background:none;color:#ff9d87;border-color:rgba(255,90,60,.4)}
.adm .btn.ghost.perigo:hover{border-color:#ff8a70}
.apagar-aula{margin-top:6px}
.confirma-txt{margin:0;color:#cfd6de;font-size:.95rem;line-height:1.5}
.adm .btn:disabled{opacity:.5;cursor:default}

/* Lixeira */
.linha-capa{flex:none;width:72px;aspect-ratio:16/9;object-fit:cover;border-radius:6px}
@media (max-width:560px){.card .linha{flex-wrap:wrap}.card .linha .botoes{width:100%}.card .linha .botoes .btn{flex:1}}

/* ---------- Alunos e Dúvidas (de verdade, 26-out) ---------- */
.campo-tit{margin:6px 0 8px;font-size:.86rem;font-weight:600;color:#cfd6de}
.check-linha{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:.92rem;cursor:pointer}
.check-linha input{width:18px;height:18px;accent-color:var(--accent)}
.campo input[readonly]{font-size:.85rem;color:var(--accent-2)}
.tab-alunos td small{display:block;color:var(--muted);font-size:.76rem;margin-top:3px}
.duv{margin-bottom:14px}
.duv-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.duv-top small{color:var(--muted);font-size:.8rem}
.duv-txt{margin:10px 0 0;font-size:.98rem;line-height:1.55;white-space:pre-line;overflow-wrap:anywhere}
.duv-resp{margin-top:12px;padding:12px 14px;border-radius:12px;background:rgba(255,122,26,.08);border-left:3px solid var(--accent)}
.duv-resp small{color:var(--muted);font-size:.78rem}
.duv-resp p{margin:4px 0 0;white-space:pre-line;overflow-wrap:anywhere}
.duv-form{margin-top:12px}
.duv-form textarea{width:100%;min-height:96px;padding:12px 14px;border-radius:12px;background:var(--bg);border:1px solid rgba(255,255,255,.18);color:var(--ink);font:inherit;font-size:16px;resize:vertical}
.duv-form textarea:focus{border-color:var(--accent);outline:none}
.duv .botoes{margin-top:10px;justify-content:flex-end}
.duv .botoes .btn{width:auto;margin:0}
@media (max-width:560px){.duv .botoes .btn{flex:1}}