/*
 * Tema 2026 (minimalist, bară de navigare sus). Se încarcă DUPĂ CSS-urile vechi și
 * le suprascrie; markup-ul paginilor vechi rămâne neschimbat.
 */
:root {
  --bg: #f5f6f8;
  --surface: #ffffff;
  --surface-2: #f9fafb;
  --border: #e4e7ec;
  --border-strong: #d0d5dd;
  --text: #1d2939;
  --muted: #667085;
  --accent: #2563eb;
  --accent-hover: #1d4ed8;
  --accent-weak: #eef4ff;
  --danger: #d92d20;
  --danger-weak: #fef3f2;
  --success: #079455;
  --success-weak: #ecfdf3;
  --radius: 8px;
  --radius-sm: 6px;
  --shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .08);
  --font: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
}

/* ---------- bază ---------- */
html { background: var(--bg); }
body {
  background: var(--bg) !important;
  color: var(--text) !important;
  font-family: var(--font) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  margin: 0 !important;
  -webkit-font-smoothing: antialiased;
}
body, td, th, input, select, textarea, button { font-family: var(--font) !important; }
td, th { font-size: 13px; }
a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--accent-hover); text-decoration: underline; }
b, strong { font-weight: 600; }
hr { border: 0; border-top: 1px solid var(--border); height: 0; }

/* ---------- bara de sus ---------- */
.topbar {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; gap: 24px;
  height: 56px; padding: 0 24px;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.topbar .brand {
  display: block;
  font-weight: 700; font-size: 16px; letter-spacing: -.01em;
  color: var(--text); white-space: nowrap;
}
.topbar .brand:hover { text-decoration: none; }
.topbar .brand .dot { color: var(--accent); }
.topbar .brand small { margin-left: 4px; font-weight: 500; font-size: 12px; color: var(--muted); }
.topbar nav { display: flex; align-items: stretch; height: 100%; gap: 2px; overflow: hidden; }
.topbar nav a {
  display: flex; align-items: center; padding: 0 12px;
  color: var(--muted); font-weight: 500; white-space: nowrap;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.topbar nav a:hover { color: var(--text); text-decoration: none; background: var(--surface-2); }
.topbar nav a.active { color: var(--accent); border-bottom-color: var(--accent); }
.topbar nav a .badge {
  margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  background: var(--danger); color: #fff; font-size: 11px; font-weight: 600;
}
.topbar .user { margin-left: auto; display: flex; align-items: center; gap: 12px; white-space: nowrap; }
.topbar .user .name { color: var(--text); font-weight: 500; }
.topbar .user .avatar {
  width: 28px; height: 28px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--accent-weak); color: var(--accent); font-weight: 700; font-size: 12px;
}
.topbar .user a.logout {
  color: var(--muted); border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 5px 10px; font-weight: 500;
}
.topbar .user a.logout:hover { color: var(--danger); border-color: var(--danger); text-decoration: none; }

/* ---------- bara de căutare ---------- */
.toolbar {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 16px;
  padding: 14px 24px; background: var(--surface); border-bottom: 1px solid var(--border);
}
.toolbar .field { display: flex; flex-direction: column; gap: 4px; width: auto !important; margin: 0 !important; float: none !important; }
.toolbar label { font-size: 11px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.toolbar input, .toolbar select { width: 200px !important; }
.toolbar form { margin: 0; }

/* ---------- conținut ---------- */
#main { padding: 0 0 32px; }
#searchResult, .page { padding: 20px 24px 0; overflow-x: auto; }
#searchResult > br:first-child { display: none; }

/* ---------- formulare ---------- */
input[type=text], input[type=password], input[type=email], input[type=number], input[type=date],
input[type=search], input:not([type]), select, textarea {
  font-size: 13px !important;
  color: var(--text) !important;
  background: var(--surface) !important;
  border: 1px solid var(--border-strong) !important;
  border-radius: var(--radius-sm) !important;
  padding: 6px 9px !important;
  height: auto !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
select { padding-right: 24px !important; }
input:focus, select:focus, textarea:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .15) !important;
}
input[type=submit], input[type=button], button, .btn, .btn-default {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px !important; font-weight: 500 !important;
  color: var(--text) !important; background: var(--surface) !important; background-image: none !important;
  border: 1px solid var(--border-strong) !important; border-radius: var(--radius-sm) !important;
  padding: 6px 12px !important; cursor: pointer; height: auto !important; width: auto;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05) !important;
}
input[type=submit]:hover, input[type=button]:hover, button:hover, .btn:hover, .btn-default:hover {
  background: var(--surface-2) !important; border-color: var(--muted) !important;
}
input[type=submit], .btn-primary {
  color: #fff !important; background: var(--accent) !important; border-color: var(--accent) !important;
}
input[type=submit]:hover, .btn-primary:hover { background: var(--accent-hover) !important; border-color: var(--accent-hover) !important; }
input[type=checkbox], input[type=radio] { accent-color: var(--accent); width: auto !important; }

#form td.label, .table-add tr td.label, td.label { color: var(--muted) !important; font-weight: 500 !important; }
#form .form-part-title {
  background: var(--surface-2) !important; background-image: none !important;
  color: var(--text) !important; border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) var(--radius-sm) 0 0; font-weight: 600 !important;
  text-transform: none !important; letter-spacing: 0 !important; padding: 8px 12px !important;
}
#form .form-part-content { border: 1px solid var(--border) !important; border-top: 0 !important; padding: 12px !important; }
#form td.problem input, #form td.problem select, #form td.problem textarea {
  border-color: var(--danger) !important; background: var(--danger-weak) !important;
}
.alert-success, #form .alert-success {
  background: var(--success-weak) !important; color: var(--success) !important;
  border: 1px solid #abefc6 !important; border-radius: var(--radius-sm); padding: 10px 12px !important;
}
.alert-danger, #form .alert-danger, #form #errors {
  background: var(--danger-weak) !important; color: var(--danger) !important;
  border: 1px solid #fecdca !important; border-radius: var(--radius-sm); padding: 10px 12px !important;
}

/* ---------- tabele ---------- */
#main table { border-collapse: collapse; }
#searchtable, .table-content, .table-add, .table-invoice, .table-order, #main table[border="1"] {
  background: var(--surface);
  border: 1px solid var(--border) !important;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
#main th, #searchtable th, .table-content tr th, .table-add tr th, .table-invoice tr th, .table-order tr th {
  background: var(--surface-2) none !important;
  background-image: none !important;
  color: var(--muted) !important;
  font-size: 11px !important; font-weight: 600 !important;
  text-transform: uppercase; letter-spacing: .04em;
  padding: 9px 10px !important;
  border: 0 !important; border-bottom: 1px solid var(--border) !important;
  white-space: nowrap;
}
#main td, #searchtable td, .table-content tr td {
  border: 0 !important; border-bottom: 1px solid var(--border) !important;
  padding: 8px 10px !important;
  color: var(--text);
}
#searchtable tr:hover td, .table-content tr:hover td { background: var(--accent-weak) !important; }
#searchtable tr:last-child td { border-bottom: 0 !important; }
#searchtable a, #searchtable tr td a { color: var(--accent) !important; font-weight: 500; }
#searchtable a.person { color: var(--text) !important; }
#searchtable em { font-style: normal; background: #fef08a; border-radius: 3px; padding: 0 2px; }
tr.odd td { background: var(--surface) !important; }
tr.even td { background: var(--surface-2) !important; }

/* paginare */
#list_pages ul { display: flex; flex-wrap: wrap; gap: 4px; padding: 0; list-style: none; }
#list_pages ul li { float: none !important; margin: 0 !important; }
#list_pages ul li a {
  display: inline-block; min-width: 30px; text-align: center;
  padding: 5px 9px !important; border: 1px solid var(--border) !important; border-radius: var(--radius-sm);
  background: var(--surface) !important; background-image: none !important; color: var(--text) !important;
}
#list_pages ul li a:hover { border-color: var(--accent) !important; color: var(--accent) !important; text-decoration: none; }
#list_pages ul li a.selected { background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important; }

/* ---------- admin ---------- */
#menu {
  float: left; width: 200px !important;
  background: var(--surface) !important; border: 1px solid var(--border) !important;
  border-radius: var(--radius); padding: 8px !important; box-shadow: var(--shadow);
}
#menu div { margin: 0 !important; }
#menu a { display: block; padding: 6px 10px; border-radius: var(--radius-sm); color: var(--text) !important; }
#menu a:hover { background: var(--accent-weak); color: var(--accent) !important; text-decoration: none; }
#menu div.submenu { margin-left: 0 !important; font-weight: 600; color: var(--muted); padding: 6px 10px; }
#menu div.logout { display: none; }
#container a, #list a { color: var(--accent); }
#list div.list div.links { color: var(--border-strong); }
#container {
  margin-left: 16px !important; border: 1px solid var(--border) !important; border-radius: var(--radius);
  background: var(--surface) !important; padding: 12px !important; box-shadow: var(--shadow);
}
div#list { border: 0 !important; }
#list div.list { border-bottom: 1px solid var(--border) !important; padding: 8px 10px !important; overflow: hidden; }
#list div.list:hover { background: var(--surface-2); }
#list div.list div.titlu { width: auto !important; }
#list div.list div.links a { margin-left: 6px; }

/* ---------- login ---------- */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; box-sizing: border-box; }
.login-card {
  width: 100%; max-width: 380px; background: var(--surface);
  border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow); padding: 32px;
  box-sizing: border-box;
}
.login-card .brand { font-weight: 700; font-size: 20px; letter-spacing: -.01em; margin-bottom: 4px; }
.login-card .brand .dot { color: var(--accent); }
.login-card p.sub { color: var(--muted); margin: 0 0 24px; }
.login-card label { display: block; font-weight: 500; margin: 0 0 6px; }
.login-card input[type=text], .login-card input[type=password] { width: 100% !important; box-sizing: border-box; padding: 9px 11px !important; margin-bottom: 16px; }
.login-card input[type=submit] { width: 100% !important; justify-content: center; padding: 9px 12px !important; }
.login-card .error {
  background: var(--danger-weak); color: var(--danger); border: 1px solid #fecdca;
  border-radius: var(--radius-sm); padding: 9px 11px; margin-bottom: 16px;
}

/* ---------- subsol (doar admin) ---------- */
.footer-debug { padding: 16px 24px; color: var(--muted); font-size: 11px; }

/* utilitare vechi */
.d-none { display: none !important; }

@media (max-width: 900px) {
  .topbar { gap: 12px; padding: 0 12px; }
  .topbar .brand small, .topbar .user .name { display: none; }
  .toolbar { padding: 12px; }
  .toolbar input, .toolbar select { width: 100% !important; }
  .toolbar .field { flex: 1 1 160px; }
  #searchResult, .page { padding: 12px 12px 0; overflow-x: auto; }
  #menu { float: none; width: auto !important; margin-bottom: 12px; }
  #container { margin-left: 0 !important; }
  #main td:has(> #menu) { display: block; width: auto; }
}
