:root{
  --accent:#7e57c2; --accent-contrast:#fff;
  --bg:#f7f7fb; --card:#ffffff; --text:#1f2937; --muted:#6b7280; --line:#e5e7eb;
  --shadow:0 6px 22px rgba(0,0,0,.06);
}
:root.dark{
  --bg:#0f1115; --card:#151922; --text:#e5e7eb; --muted:#9ca3af; --line:#1f2937; --shadow:none;
}
*{box-sizing:border-box}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:inherit}
.container{max-width:1100px;margin:0 auto;padding:0 16px}
.hidden{display:none!important}

/* NAVBAR */
.navbar-wrap{position:sticky;top:12px;z-index:50}
.navbar{height:56px;display:flex;align-items:center;justify-content:space-between;background:var(--card);border:1px solid var(--line);
  border-radius:14px;box-shadow:var(--shadow);padding:0 12px;gap:10px;overflow:hidden}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;white-space:nowrap}
.brand-badge{width:28px;height:28px;border-radius:8px;background:var(--accent);color:var(--accent-contrast);display:grid;place-items:center;font-size:14px}
.menu{display:flex;align-items:center;gap:6px}
.menu>a,.menu .drop-btn{padding:8px 10px;border-radius:10px;border:1px solid transparent;text-decoration:none;color:var(--text);font-weight:600}
.menu>a:hover,.menu .drop-btn:hover{background:rgba(0,0,0,.04)}
.drop{position:relative}
.drop-panel{position:absolute;top:42px;left:0;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);min-width:220px;padding:6px;display:none}
.drop.open .drop-panel{display:block}
.drop-panel a{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;text-decoration:none;color:var(--text)}
.drop-panel a:hover{background:rgba(0,0,0,.04)}
.user{display:flex;align-items:center;gap:8px}
.user .avatar{width:28px;height:28px;border-radius:9999px;background:#eee}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:var(--card);text-decoration:none;cursor:pointer}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-contrast)}
.btn.ghost{background:var(--card);border-color:transparent}

/* Mobile */
.hamburger{display:none}
@media (max-width: 900px){
  .menu{display:none}
  .hamburger{display:inline-flex}
  .mobile-panel{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px;margin-top:8px}
  .mobile-link{display:block;padding:8px 10px;border-radius:8px;text-decoration:none;color:var(--text);font-weight:600}
  .mobile-link:hover{background:rgba(0,0,0,.04)}
  .mobile-group{border-top:1px dashed var(--line);margin-top:6px;padding-top:6px}
  .mobile-group > button{width:100%;text-align:left}
  .mobile-sub{margin-top:6px;padding-left:6px}
  .mobile-sub a{display:block;padding:6px 8px;border-radius:8px}
  .mobile-sub a:hover{background:rgba(0,0,0,.04)}
}

/* PAGE + TABLES + FORMS */
.page{padding:24px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:16px}
.grid{display:grid;gap:12px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.row{display:flex;gap:12px;flex-wrap:wrap}
.table{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.table th,.table td{padding:10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.table thead th{background:rgba(0,0,0,.03);color:var(--muted);font-weight:700}
.form{display:grid;gap:14px}
.form .field{display:flex;flex-direction:column;gap:6px}
label{font-size:12px;color:var(--muted)}
input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="date"],select,textarea{
  width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--text);appearance:none}
.actions{display:flex;gap:10px}
tr.dirty{background:rgba(255,193,7,.12)}
.action-mini{display:inline-flex;align-items:center;gap:6px}
.action-mini .btn{padding:6px 8px}

/* === v5.0.6 additions === */
.btn.small{padding:6px 8px;font-size:12px;line-height:1}
.action-mini .btn{padding:6px 8px;font-size:12px}
.input{width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--text);}
input.input, select.input, textarea.input{appearance:none;-webkit-appearance:none;-moz-appearance:none}
select.input{padding-right:28px;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg, var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) calc(1.1em), calc(100% - 12px) calc(1.1em);background-size:6px 6px,6px 6px;background-repeat:no-repeat}

/* === v5.0.7 navbar dropdown + button sizing === */
.navbar-wrap{z-index:1200}
.navbar{overflow:visible} /* allow dropdowns to escape the navbar */
.drop-panel{z-index:1300}
.action-mini .btn{padding:8px 10px;font-size:13px} /* slightly bigger Edit/Șterge */

/* v5.0.17: bump action buttons ~20% */
.action-mini .btn, .btn.small{ padding: 12px 14px; font-size: 15px; }