/* =========================================
   Admin WebPlatform — style.css (layout nou)
   Sidebar stânga • Conținut dreapta
   ========================================= */

:root{
  --bg:#0b0f1a;
  --surface:#111827;
  --surface-2:#0f1525;
  --border:#25314a;
  --ring:#6ea8fe;
  --text:#e8eefc;
  --muted:#a1b0cc;
  --primary:#5d9dfd;
  --primary-700:#3d78e6;
  --danger:#ff6b6b;

  --r-xs:8px; --r-sm:10px; --r-md:14px; --r-lg:18px;
  --sp-1:6px; --sp-2:10px; --sp-3:14px; --sp-4:18px; --sp-5:24px; --sp-6:32px;
}

*{box-sizing:border-box}
html,body{height:100%}
html{overflow-x:hidden}
body{
  margin:0; color:var(--text);
  background:
    radial-gradient(900px 500px at -15% -15%, #14203b 0%, transparent 60%),
    radial-gradient(900px 500px at 115% 15%, #101a33 0%, transparent 60%),
    var(--bg);
  font:14px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;
  letter-spacing:.2px;
}
a{color:#9ec1ff;text-decoration:none}
a:hover{text-decoration:underline}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.muted{color:var(--muted)}

/* ---- Topbar ---- */
.topbar{
  position:sticky; top:0; z-index:10;
  display:flex; align-items:center; justify-content:space-between;
  padding:var(--sp-3) var(--sp-5);
  background:rgba(10,14,28,.85); backdrop-filter:blur(6px);
  border-bottom:1px solid var(--border);
}
.brand{font-weight:700}

/* ---- Layout ---- */
.layout{
  max-width:1600px; margin:0 auto; padding:var(--sp-5);
  display:grid; grid-template-columns:260px minmax(0,1fr);
  gap:18px;
}
@media (min-width:1800px){ .layout{ max-width:1760px; } }
.sidebar{align-self:start}
.content{min-height:70vh}
@media (max-width:900px){
  .layout{grid-template-columns:1fr}
  .content{order:2}
  .sidebar{order:1}
}

/* ---- Card ---- */
.card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  padding:var(--sp-5);
  box-shadow:0 10px 40px rgba(0,0,0,.25);
}
.card h2{margin:0 0 var(--sp-4); font-size:22px; font-weight:800}

/* ---- Butoane ---- */
.btn{
  display:inline-flex; align-items:center; justify-content:flex-start; gap:10px;
  padding:12px 14px;
  background:#1a233b; color:var(--text);
  border:1px solid var(--border); border-radius:var(--r-sm);
  cursor:pointer; transition:border-color .15s ease, transform .05s ease, background .15s;
  text-align:left; white-space:nowrap;
  width:auto; /* <<<<< implicit butoanele NU mai sunt full-width */
}
.menu .btn{ width:100%; } /* doar în sidebar, rămân full-width */
.btn:hover{border-color:#335186; background:#1d2947}
.btn:active{transform:translateY(1px)}
.btn-primary{
  background:linear-gradient(180deg,var(--primary),var(--primary-700));
  border-color:#4e86ef; color:#071120; font-weight:600;
}
.menu{display:grid; gap:10px}
.hint{color:var(--muted); font-size:12px}

/* ---- Tabele ---- */
.table{width:100%; border-collapse:collapse; border:1px solid var(--border)}
.table th,.table td{padding:10px 12px; border-bottom:1px solid var(--border); text-align:left}
.table th{background:#0f1527; color:#c4d0ea; font-size:12px}
.table tr:last-child td{border-bottom:0}

/* ---- Formulare ---- */
.form label{display:block; margin:10px 0 6px; color:#cbd5e1; font-size:13px}
.form input,.form select,.form textarea{
  width:100%; padding:10px 12px; border:1px solid var(--border);
  border-radius:10px; background:var(--surface-2); color:var(--text);
}
.form input:focus,.form select:focus,.form textarea:focus{
  outline:2px solid var(--ring); border-color:var(--ring);
}
.form .actions{display:flex; gap:10px; margin-top:14px}

/* câmp IP din „Adăugare Stație” */
.ip-display{ flex:1; min-width:220px; }

/* ---- SELECT styling ---- */
select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background: var(--surface-2);
  border:1px solid var(--border);
  color: var(--text);
  border-radius: 10px;
  padding: 8px 32px 8px 12px;
  font-size: 13px;
  line-height: 1.2;
  cursor: pointer;
  background-image:
    linear-gradient(180deg,transparent 0%,transparent 100%),
    url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23a1b0cc'><path d='M5.23 7.21a.75.75 0 011.06.02L10 10.17l3.71-2.94a.75.75 0 11.94 1.16l-4.24 3.36a.75.75 0 01-.94 0L5.21 8.39a.75.75 0 01.02-1.18z'/></svg>");
  background-repeat: no-repeat, no-repeat;
  background-position: right 10px center, right 10px center;
  background-size: 0 100%, 16px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
select:hover{ border-color:#335186; }
select:focus{ outline:2px solid var(--ring); border-color: var(--ring); }
.table select{ min-width: 90px; }

/* ---- Iframe panel ---- */
.panel{
  background:transparent; width:100%; height:78vh; min-height:520px; border:0;
  border-radius:var(--r-md);
}

/* ---- Mesaje ---- */
.error{
  border:1px solid #6b1f1f; background:#1b0f12;
  color:#ffb4b4; border-radius:10px; padding:10px 12px; margin-bottom:10px;
}

/* ---- Utilitare ---- */
.center{display:flex; align-items:center; gap:10px}
.badge{display:inline-block; padding:2px 8px; border-radius:999px; background:#0f2b4a; color:#a6d8ff; font-size:12px}