/* Aplicatia ruleaza STRICT pe tema Light, pe orice pagina si orice viewport,
   indiferent de prefers-color-scheme al dispozitivului -- decizie explicita
   a utilizatorului (2026-09-10), care extinde la toata aplicatia fix-ul
   aplicat initial doar pe /dashboard (vezi git log pe acest fisier). Fara
   ramura @media(prefers-color-scheme:dark) aici, deloc -- daca cineva
   adauga una inapoi mai tarziu, o rupe pe toate paginile deodata (BASE_CSS
   e injectat identic in fiecare template de pagina din acest fisier). */
:root{
  --bg:#E7ECEF; --surface:#FFFFFF; --ink:#16232E; --ink-soft:#4E5E68;
  --line:#C3CDD3; --accent:#2B6CB0; --accent-2:#B5651D;
}
*{box-sizing:border-box;}
body{
  margin:0; min-height:100vh; background:var(--bg); color:var(--ink);
  font-family:'IBM Plex Sans',system-ui,sans-serif;
}
a{color:var(--accent);}
.eyebrow{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); font-weight:500;}
.card{background:var(--surface); border:1px solid var(--line); border-radius:14px; border-top:4px solid var(--accent);}
h1{font-size:26px; font-weight:700; margin:6px 0 4px; letter-spacing:-.01em;}
.sub{color:var(--ink-soft); font-size:14px; margin:0 0 22px;}
input{
  width:100%; font-family:'IBM Plex Sans',sans-serif; font-size:14px; padding:10px 12px;
  border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--ink); margin-bottom:12px;
}
button{
  font-family:'IBM Plex Sans',sans-serif; font-weight:600; font-size:14px; padding:10px 16px;
  border:none; border-radius:8px; background:var(--accent); color:var(--surface); cursor:pointer;
}
button:hover{filter:brightness(1.08);}
.err{color:#B23A3A; font-size:13px; min-height:18px; margin:0 0 8px;}

.app-shell{display:flex; min-height:100vh; align-items:stretch;}
.sidebar{
  width:216px; flex-shrink:0; background:var(--surface); border-right:1px solid var(--line);
  padding:20px 0; display:flex; flex-direction:column; gap:1px; overflow-y:auto; overflow-x:hidden;
  position:fixed; top:0; left:0; height:100vh; z-index:100;
  transition:transform .2s ease, width .2s ease;
}
.main{flex:1; min-width:0; margin-left:216px; transition:margin-left .2s ease;}
.collapse-btn{
  display:flex; align-items:center; justify-content:flex-end; gap:6px; width:100%;
  margin:0 0 10px; padding:8px 20px; background:none; border:none; cursor:pointer;
  color:var(--ink-soft); font-family:'IBM Plex Sans',sans-serif; font-size:11px;
}
.collapse-btn:hover{color:var(--ink);}
.collapse-btn svg{flex-shrink:0; transition:transform .2s ease;}
@media(min-width:761px){
  body.sidebar-collapsed .sidebar{width:56px;}
  body.sidebar-collapsed .main{margin-left:56px;}
  body.sidebar-collapsed .sidebar .brand,
  body.sidebar-collapsed .sidebar .navgroup,
  body.sidebar-collapsed .sidebar .nlabel,
  body.sidebar-collapsed .sidebar .soon{display:none;}
  body.sidebar-collapsed .sidebar a.navitem, body.sidebar-collapsed .sidebar span.navitem{
    justify-content:center; padding:8px 0; gap:0;
  }
  body.sidebar-collapsed .collapse-btn{justify-content:center; padding:8px 0;}
  body.sidebar-collapsed .collapse-btn svg{transform:rotate(180deg);}
}
.hamburger{
  display:none; position:fixed; top:14px; left:14px; z-index:101;
  width:38px; height:38px; padding:0; border-radius:8px; border:1px solid var(--line);
  background:var(--surface); align-items:center; justify-content:center; cursor:pointer;
}
.sidebar-overlay{display:none; position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:99;}
@media(max-width:760px){
  .sidebar{transform:translateX(-100%); box-shadow:0 0 28px rgba(0,0,0,.3);}
  .sidebar.open{transform:translateX(0);}
  .main{margin-left:0;}
  .hamburger{display:flex;}
  .sidebar-overlay.show{display:block;}
  .collapse-btn{display:none;}
}
.sidebar .brand{padding:0 20px 14px;}
.sidebar .navgroup{
  font-family:'IBM Plex Mono',monospace; font-size:9.5px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-soft); padding:14px 20px 6px; opacity:.65;
}
.sidebar .navgroup:first-of-type{padding-top:0;}
.sidebar a.navitem, .sidebar span.navitem{
  display:flex; align-items:center; gap:10px; padding:8px 20px; font-size:13px; color:var(--ink);
  text-decoration:none; border-left:3px solid transparent;
}
.sidebar .nicon{flex-shrink:0; opacity:.85;}
.sidebar a.navitem:hover{background:var(--bg);}
.sidebar a.navitem.active{
  background:color-mix(in srgb, var(--accent) 10%, var(--surface));
  border-left-color:var(--accent); color:var(--accent); font-weight:600;
}
.sidebar a.navitem.active .nicon{opacity:1;}
.sidebar span.navitem{color:var(--ink-soft); opacity:.6;}
.sidebar .soon{
  margin-left:auto; font-family:'IBM Plex Mono',monospace; font-size:8.5px; padding:1px 6px;
  border-radius:100px; background:var(--bg); border:1px solid var(--line); white-space:nowrap;
}

/* Butonul „arată parola”, adăugat de JS-ul paginii (login.js, account.js) peste
   orice input[type=password]. Marginea de jos trece de pe input pe wrapper. */
.pw-wrap{position:relative; margin-bottom:12px;}
.pw-wrap input{margin-bottom:0; padding-right:42px;}
.pw-toggle{
  position:absolute; top:50%; right:4px; transform:translateY(-50%);
  background:none; color:var(--ink-soft); padding:6px 8px; line-height:0;
}
.pw-toggle:hover{color:var(--ink); filter:none;}