/* ==========================================================================
   KSB Planning — Loginpagina (Google-login-sessie, 2026-08-15)
   Zelfde design-tokens als intake.css (docs/KSB_STYLEGIDS.html), bewust een eigen,
   kleine stylesheet i.p.v. de volledige intake.css meeladen op een pagina die verder
   niets van dat formulier gebruikt.
   ========================================================================== */

:root{
  --bg:#14181c;
  --bg-panel:#1c2127;
  --bg-raised:#232931;
  --bg-deep:#0c0f12;
  --line:#333a42;
  --line-soft:#2a3038;
  --text:#f2f1ea;
  --dim:#8b929b;
  --faint:#5a6168;
  --rood:#c0392b;
  --oranje:#e07b1f;
}

*{box-sizing:border-box;margin:0;padding:0;}

body{
  background:var(--bg);
  color:var(--text);
  font-family:'Archivo',sans-serif;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
}

.login-wrap{width:100%;max-width:400px;padding:20px;}

.login-card{
  background:var(--bg-panel);
  border:1px solid var(--line);
  border-top:3px solid var(--rood);
  padding:32px 28px;
  text-align:center;
}

.login-logo{
  display:block;
  width:96px;
  height:96px;
  margin:0 auto 18px;
  border-radius:50%;
}

.login-card h1{
  font-family:'Archivo Black',sans-serif;
  font-size:24px;
  letter-spacing:0.5px;
}
.login-card h1 span{color:var(--oranje);}

.login-card .sub{color:var(--dim);font-size:13px;margin:10px 0 26px;}

.note{padding:12px 16px;font-size:13px;border-left:3px solid;margin-bottom:20px;text-align:left;}
.note-crit{background:rgba(192,57,43,0.12);border-color:var(--rood);color:#ffb3a8;}

.btn-google{
  display:block;
  width:100%;
  padding:13px 16px;
  background:var(--oranje);
  color:#1a1a1a;
  font-family:'Archivo',sans-serif;
  font-weight:600;
  font-size:15px;
  text-decoration:none;
  border:none;
  cursor:pointer;
}
.btn-google:hover{background:#f08a2c;}