/* ============================================
   NAV-BARRE.CSS — Burgouzz Factory
   Dark premium burger brand
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Outfit:wght@300;400;500;600&display=swap');

:root {
  --coal:    #0f0f0f;
  --dark:    #181818;
  --panel:   #1e1e1e;
  --orange:  #e8621a;
  --orange2: #ff8c42;
  --gold:    #f0c040;
  --cream:   #fdf4e3;
  --muted:   #888;
  --border:  rgba(255,255,255,.07);
  --radius:  10px;
}

body { margin: 0; }

.navbar {
  background: rgba(15,15,15,.88);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 2rem;
  height: 62px;
  position: sticky;
  top: 0;
  z-index: 1000;
  border-bottom: 1px solid var(--border);
}

.menu-toggle { display: none; }

.menu-icon {
  display: none;
  flex-direction: column;
  cursor: pointer;
  gap: 5px;
}
.menu-icon span {
  width: 26px; height: 2.5px;
  background: var(--cream);
  border-radius: 2px;
}

/* ── Nav links ─────────────────────────────── */
.nav-links {
  display: flex;
  gap: 0.25rem;
  align-items: center;
}

.nav-links a {
  font-family: 'Outfit', sans-serif;
  text-decoration: none;
  color: rgba(255,255,255,.75);
  font-weight: 500;
  font-size: .9rem;
  padding: .45rem .9rem;
  border-radius: 6px;
  letter-spacing: .02em;
  transition: color .2s, background .2s;
}
.nav-links a:hover {
  color: var(--cream);
  background: rgba(255,255,255,.06);
}

/* Lien panier / CTA */
.nav-links a[href*="panier"],
.nav-links a[href*="commander"] {
  background: var(--orange);
  color: #fff;
  font-weight: 600;
  padding: .45rem 1.1rem;
}
.nav-links a[href*="panier"]:hover,
.nav-links a[href*="commander"]:hover {
  background: var(--orange2);
  color: #fff;
}

/* Déconnexion */
.nav-links a[href*="deconnexion"],
.nav-links a[href*="logout"] {
  color: var(--muted);
}
.nav-links a[href*="deconnexion"]:hover,
.nav-links a[href*="logout"]:hover { color: #fff; background: rgba(255,255,255,.06); }

/* navbar-links fallback */
.navbar-links { list-style: none; display: flex; gap: .25rem; margin: 0; padding: 0; }
.navbar-links li a { font-family: 'Outfit', sans-serif; color: rgba(255,255,255,.75); text-decoration: none; font-weight: 500; font-size: .9rem; padding: .45rem .9rem; border-radius: 6px; transition: color .2s, background .2s; }
.navbar-links li a:hover { color: var(--cream); background: rgba(255,255,255,.06); }

/* ── Responsive ────────────────────────────── */
@media (max-width: 768px) {
  .menu-icon { display: flex; }
  .nav-links {
    position: absolute;
    top: 62px; left: 0; right: 0;
    background: var(--dark);
    border-bottom: 1px solid var(--border);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: .5rem 0;
    display: none;
    z-index: 9999;
  }
  .nav-links a { border-radius: 0; padding: .8rem 1.5rem; font-size: 1rem; }
  .menu-toggle:checked + .menu-icon + .nav-links { display: flex; }
}