:root{
  --bg:#0b0f14;
  --border:#1e2a36;
  --text:#e6eef7;
  --muted:#b7c6d9;
  --accent:#2a74ff;
  --accent2:#7aa4ff;
  --danger:#ff6b6b;
  --radius:14px;
}

/* NAVBAR */
.navx{
  position:sticky; top:0; z-index:60;
  backdrop-filter:saturate(160%) blur(10px);
  background:
    radial-gradient(900px 250px at 10% -30%, rgba(42,116,255,.12), transparent 60%),
    linear-gradient(180deg, rgba(12,16,24,.94) 0%, rgba(12,16,24,.78) 100%);
  border-bottom:1px solid var(--border);
}
.navx .wrap{max-width:1100px;margin:0 auto;padding:0 18px}
.navx__inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:18px; padding:14px 0;
}

/* Brand left */
.navx__brand{display:flex;align-items:center;gap:12px;color:var(--text);text-decoration:none}
.navx__logo{height:34px;width:auto;object-fit:contain; filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}
.navx__logo--fallback{
  height:34px; width:34px; border-radius:10px; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff; font-weight:800; box-shadow:0 6px 18px rgba(42,116,255,.45);
}
.navx__title{font-weight:800; font-size:17px; letter-spacing:.2px}

/* Identity center */
.navx__id{display:flex;align-items:center;gap:10px;color:var(--text)}
.navx__company{font-weight:700}
.navx__dealer{color:#cfe3ff}
.navx__dot{opacity:.5}
.navx__role{
  padding:4px 8px; border-radius:999px; font-size:12px; font-weight:700;
  background:#132033; color:#9fd1ff; border:1px solid #274166;
}

/* Actions right (buttons) */
.navx__actions{display:flex;align-items:center;gap:10px}

.btnx{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 16px; border-radius:12px; font-weight:700; font-size:14px;
  background:linear-gradient(135deg,var(--accent) 0%, var(--accent2) 100%);
  color:#fff; border:1px solid rgba(255,255,255,.06);
  box-shadow:0 6px 18px rgba(42,116,255,.35), inset 0 1px 0 rgba(255,255,255,.06);
  text-decoration:none; transition:transform .18s, box-shadow .18s, background .18s;
}
.btnx:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(42,116,255,.45), inset 0 1px 0 rgba(255,255,255,.08);
  background:linear-gradient(135deg,var(--accent2) 0%, var(--accent) 100%);
}

.btnx--ghost{
  background:transparent; color:var(--text);
  border:1px solid var(--border);
  box-shadow:none;
}
.btnx--ghost:hover{
  color:#fff; border-color:var(--accent);
  box-shadow:0 0 0 2px rgba(42,116,255,.22);
}

.btnx--danger{
  background:linear-gradient(135deg,#ff6b6b 0%, #ff8b8b 100%);
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 6px 18px rgba(255,107,107,.35);
}
.btnx--danger:hover{
  background:linear-gradient(135deg,#ff8b8b 0%, #ff6b6b 100%);
  box-shadow:0 10px 24px rgba(255,107,107,.45);
}

/* ===== NAVX USER ===== */
.navx__user {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, #101725 0%, #0b111a 100%);
  border: 1px solid rgba(255,255,255,0.06);
  box-shadow: 0 4px 14px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.05);
  font-size: 14px;
  color: var(--text);
  font-weight: 500;
}

.navx__user .muted {
  color: #9fd1ff;
  font-weight: 600;
}

.navx__user a {
  margin-left: 8px;
  font-weight: 600;
  text-decoration: none;
  color: #ff6b6b;
  padding: 4px 10px;
  border-radius: 8px;
  background: linear-gradient(135deg, #ff6b6b 0%, #ff8b8b 100%);
  border: 1px solid rgba(255,255,255,0.06);
  box-shadow: 0 3px 10px rgba(255,107,107,.4);
  transition: all .2s ease;
}

.navx__user a:hover {
  background: linear-gradient(135deg, #ff8b8b 0%, #ff6b6b 100%);
  box-shadow: 0 5px 14px rgba(255,107,107,.55);
  color: #fff;
}


/* Responsivnost */
@media(max-width:920px){
  .navx__inner{flex-wrap:wrap}
  .navx__id{order:3; width:100%; justify-content:center}
}