/* ======================================================================
   NORTEVO — Canvas de Mentoria — Estilo compartilhado
   (mesma linguagem visual do Sistema de Gestão Nortevo: dark + dourado)
   ====================================================================== */
:root{
  --bg:#0a0a0c; --surface:#141416; --surface2:#1e1e22; --border:#2e2e34;
  --accent:#c9a84c; --accent2:#f0c040; --green:#22c55e; --red:#ef4444;
  --yellow:#f59e0b; --blue:#3b82f6; --text:#e2e8f0; --muted:#7a8090;
  --radius:12px;
  --t-comum:#c9a84c; --t-lideranca:#3b82f6; --t-gestao:#22c55e; --t-oratoria:#e0665b;
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{background:var(--bg);color:var(--text);}
body{font-family:'Segoe UI',system-ui,sans-serif;font-size:14px;min-height:100vh;}
::selection{background:rgba(201,168,76,.35);}
a{color:inherit;}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:6px;}

.container{max-width:1180px;margin:0 auto;padding:28px 20px 60px;}

/* topbar */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--border);background:var(--surface);}
.brand{display:flex;align-items:center;gap:10px;}
.brand-mark{width:30px;height:30px;border-radius:6px;background:#0a0a0c;display:flex;align-items:center;justify-content:center;color:var(--accent2);font-weight:900;font-size:14px;border:1px solid rgba(201,168,76,.4);}
.brand-text{font-size:15px;font-weight:900;letter-spacing:3px;background:linear-gradient(135deg,#f0c040,#c9a84c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-transform:uppercase;}
.brand-sub{font-size:10px;color:var(--muted);letter-spacing:1px;margin-top:1px;}

/* login screen (aluno / admin) */
#login-screen{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 30%,rgba(201,168,76,.08) 0%,transparent 70%),#0a0a0c;padding:20px;}
.login-box{background:rgba(20,20,22,.95);border:1px solid rgba(201,168,76,.3);border-radius:18px;padding:44px 38px;width:min(420px,94vw);text-align:center;box-shadow:0 0 80px rgba(201,168,76,.08),0 32px 60px rgba(0,0,0,.6);}
.login-brand{font-size:28px;font-weight:900;letter-spacing:5px;background:linear-gradient(135deg,#f0c040 0%,#c9a84c 50%,#8a6820 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:6px;text-transform:uppercase;}
.login-tagline{font-size:11px;letter-spacing:2.5px;color:var(--muted);text-transform:uppercase;margin-bottom:30px;}
.login-label{display:block;text-align:left;font-size:11px;color:var(--accent);margin-bottom:6px;text-transform:uppercase;letter-spacing:1px;}
.login-input{width:100%;padding:13px 16px;font-size:16px;letter-spacing:2px;border-radius:8px;background:#0f0f11;border:1px solid rgba(201,168,76,.25);color:var(--text);margin-bottom:14px;text-align:center;}
.login-input:focus{outline:none;border-color:rgba(201,168,76,.7);box-shadow:0 0 0 3px rgba(201,168,76,.12);}
.btn-login{width:100%;padding:14px;font-size:13px;font-weight:700;border-radius:8px;background:linear-gradient(135deg,#c9a84c,#f0c040,#a8892e);color:#0a0a0c;border:none;cursor:pointer;transition:.2s;letter-spacing:2px;text-transform:uppercase;}
.btn-login:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(201,168,76,.35);}
.btn-login:disabled{opacity:.6;cursor:default;transform:none;}
.login-error{color:var(--red);font-size:12px;margin-top:12px;min-height:16px;}
.login-hint{color:var(--muted);font-size:11px;margin-top:18px;line-height:1.5;}

/* cards / grid geral */
.cards{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px;transition:.15s;}
.card:hover{border-color:rgba(201,168,76,.35);}

button{font-family:inherit;}
input,select,textarea{background:var(--surface2);border:1px solid var(--border);color:var(--text);padding:9px 12px;border-radius:8px;font-size:13px;font-family:inherit;width:100%;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);}
textarea{resize:vertical;}
label{display:block;font-size:11px;color:var(--muted);margin-bottom:5px;text-transform:uppercase;letter-spacing:.6px;}

.btn{display:inline-flex;align-items:center;gap:6px;padding:9px 18px;border:none;border-radius:8px;cursor:pointer;font-size:13px;font-weight:600;transition:.15s;}
.btn-primary{background:var(--accent);color:#0a0a0c;}.btn-primary:hover{background:var(--accent2);}
.btn-ghost{background:var(--surface2);color:var(--text);border:1px solid var(--border);}.btn-ghost:hover{background:var(--border);}
.btn-red{background:rgba(239,68,68,.15);color:#ff8b8b;border:1px solid rgba(239,68,68,.3);}.btn-red:hover{background:rgba(239,68,68,.25);}
.btn-sm{padding:6px 12px;font-size:12px;}
.btn:disabled{opacity:.5;cursor:default;}

.badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;}
.badge-comum{background:rgba(201,168,76,.15);color:#e6c56a;}
.badge-lideranca{background:rgba(59,130,246,.15);color:#7fb0f7;}
.badge-gestao{background:rgba(34,197,94,.15);color:#6fe09b;}
.badge-oratoria{background:rgba(224,102,91,.15);color:#f19a91;}

.muted{color:var(--muted);}
.hidden{display:none !important;}

/* spinner */
.spinner{width:16px;height:16px;border:2px solid rgba(201,168,76,.25);border-top-color:var(--accent2);border-radius:50%;animation:spin .7s linear infinite;display:inline-block;}
@keyframes spin{to{transform:rotate(360deg);}}

/* toast */
#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--surface2);border:1px solid var(--border);color:var(--text);padding:11px 20px;border-radius:8px;font-size:13px;opacity:0;pointer-events:none;transition:.25s;z-index:200;box-shadow:0 10px 30px rgba(0,0,0,.4);}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
#toast.ok{border-color:rgba(34,197,94,.4);}
#toast.err{border-color:rgba(239,68,68,.4);}
