/* ============================================================
   navbar-fix.css — Navigation Alignment Fix
   Problem: nav items wrapping to 2 lines at ~1400px viewport
   Solution: tighten spacing, enforce nowrap, scale CTA on mid screens
   ============================================================ */

/* ── Core: prevent ALL nav items from wrapping ──────────────── */
.nav-links a {
  white-space: nowrap;
  padding: 6px 10px;       /* was 6px 14px */
  font-size: 0.84rem;      /* was 0.9rem */
}

/* ── Tighten gap between nav items ─────────────────────────── */
.nav-links {
  gap: 2px;                /* was 4px */
}

/* ── Logo: slightly smaller to free up space ────────────────── */
.logo {
  font-size: 1.1rem;       /* was 1.2rem */
  gap: 8px;
  flex-shrink: 0;
}
.logo-icon {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
}

/* ── CTA button: shorten label on medium screens ────────────── */
@media (max-width: 1280px) {
  .btn-generate-qr .btn-label {
    display: none;          /* icon + arrow only below 1280px */
  }
  .btn-generate-qr .btn-arrow {
    display: none;
  }
  .btn-generate-qr {
    padding: 8px 11px;
  }
}

/* ── Show full CTA label only on wide screens ───────────────── */
@media (min-width: 1281px) {
  .btn-generate-qr .btn-label {
    display: inline;
  }
  .btn-generate-qr .btn-arrow {
    display: inline;
  }
}

/* ── Language switcher: tighter on medium ───────────────────── */
@media (max-width: 1100px) {
  .lang-current span:not(.lang-flag) {
    display: none;
  }
  .lang-chevron {
    display: none !important;
  }
  .lang-current {
    padding: 7px 9px;
  }
}

/* ── Navbar inner: keep it on one line, use flex properly ───── */
.navbar-inner {
  height: 64px;
  gap: 12px;               /* was 24px */
  flex-wrap: nowrap;        /* never wrap */
}

/* ── Hide hamburger until we actually need it ───────────────── */
@media (min-width: 769px) {
  .hamburger {
    display: none;
  }
}

/* ── At 900px: collapse 2 least-used nav links ──────────────── */
@media (max-width: 900px) {
  .nav-links li:nth-child(5),   /* vCard */
  .nav-links li:nth-child(6) {  /* Email QR */
    display: none;
  }
}

/* ── At 768px: hide all nav links, show hamburger ───────────── */
@media (max-width: 768px) {
  .nav-links {
    display: none;
  }
  .hamburger {
    display: flex;
  }
  /* Restore full CTA label hidden earlier */
  .btn-generate-qr .btn-label,
  .btn-generate-qr .btn-arrow {
    display: none;
  }
  .btn-generate-qr {
    padding: 8px 11px;
  }
}