/* =========================================================================
   nav-fixes.css
   Shared override stylesheet for the ColdJet_PL Bootstrap navbar.
   Load AFTER style.min.css and inline <style>. Targets every page that
   uses the standard `.navbar.navbar-custom #navbar` markup.
   Fixes:
     - Removes max-width: 130px on nav-items (Polish labels were wrapping
       over 3-4 lines, making the navbar ~250px tall).
     - Switches links from "block + word-break" to "inline + nowrap".
     - Slims navbar to ~70px and gives links premium hover/active states.
     - Anchors logo to the left of a wider container; moves social icons
       cleanly to the right.
   Brand: navy #001D77, lime #aed047. Type: "Inter" (with system fallback).
   ========================================================================= */

/* ── Container: wider, with comfortable side padding ──────────────────── */
#navbar .container {
  max-width: 1360px !important;
  padding-left: 28px !important;
  padding-right: 28px !important;
}

/* ── Navbar shell: glass surface, slim height, hairline border ────────── */
.navbar.navbar-custom,
nav.navbar.navbar-expand-lg.fixed-top {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  background: rgba(255, 255, 255, 0.92);
  -webkit-backdrop-filter: saturate(160%) blur(10px);
  backdrop-filter: saturate(160%) blur(10px);
  border-bottom: 1px solid rgba(24, 24, 27, 0.07);
  box-shadow: 0 1px 3px rgba(24, 24, 27, 0.04);
}

/* ── Logo: anchored left, smaller, no extra padding ───────────────────── */
.navbar .navbar-brand {
  padding: 0 !important;
  margin: 0 24px 0 0 !important;
  display: inline-flex;
  align-items: center;
}

.navbar .logoColdJet,
.navbar .logo-top {
  width: 170px !important;
  height: auto !important;
  display: block;
}

@media (max-width: 991.98px) {
  .navbar .logoColdJet,
  .navbar .logo-top { width: 150px !important; }
}

@media (max-width: 575.98px) {
  .navbar .logoColdJet,
  .navbar .logo-top { width: 130px !important; }
}

/* ── Nav list: items wrap to 2-3 lines per label, single row of items ─── */
#navbar-navlist {
  /* flex: shrink/grow to share space with the icons cluster instead of
     forcing 100% width (which clipped the CTA pill's rounded edge) */
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  flex-wrap: nowrap !important;
  margin: 0 !important;
  padding: 0 8px !important;     /* breathing room so pill rounded edges render fully */
  overflow: visible !important;  /* don't clip the pill */
}

#navbar-navlist .nav-item {
  min-width: 70px !important;
  max-width: 140px !important;     /* per-item cap → labels wrap to 2-3 neat lines */
  flex: 0 1 auto !important;
  text-align: center !important;
  margin: 0 !important;
}

/* ── Link: readable, multi-line wrap allowed ──────────────────────────── */
#navbar-navlist .nav-link {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  padding: 8px 10px !important;
  font-family: "Inter", system-ui, -apple-system, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  white-space: normal !important;        /* allow wrap */
  word-break: normal !important;         /* break BETWEEN words, not inside */
  hyphens: none !important;
  text-align: center !important;
  color: #3f3f46 !important;
  border-radius: 8px !important;
  text-wrap: balance;                    /* even out line lengths in wraps */
  transition: color 0.18s ease, background-color 0.18s ease;
}

#navbar-navlist .nav-link:hover,
#navbar-navlist .nav-link:focus-visible {
  color: #001D77 !important;
  background-color: rgba(0, 29, 119, 0.06) !important;
}

#navbar-navlist .nav-link.active {
  color: #001D77 !important;
  font-weight: 600 !important;
  background-color: rgba(0, 29, 119, 0.06) !important;
}

#navbar-navlist .nav-link:active {
  transform: translateY(1px);
}

/* ── CTA pill button — lime border + lime text (matches original PL inline style) ── */
#navbar-navlist .nav-item:last-child {
  max-width: 170px !important;          /* CTA gets a bit more breathing room */
  margin-left: 14px !important;          /* gap so the CTA pill doesn't crowd "Pourquoi Cold Jet" */
  margin-right: 6px !important;          /* ensures pill's right rounded edge is fully visible */
  flex-shrink: 0;
}

#navbar-navlist .nav-link.btn-outline-primary,
#navbar-navlist .nav-link.mobile-only-button {
  border: 1.5px solid #aed047 !important;
  border-radius: 999px !important;
  padding: 8px 16px !important;
  font-weight: 600 !important;
  color: #aed047 !important;
  margin-left: 6px !important;
  background: transparent !important;
  white-space: normal !important;       /* allow "Skontaktuj się / z nami" to wrap inside the pill */
  line-height: 1.25 !important;
}

#navbar-navlist .nav-link.btn-outline-primary:hover,
#navbar-navlist .nav-link.mobile-only-button:hover {
  background: #aed047 !important;
  color: #ffffff !important;
}

/* ── Social icons cluster on the right ────────────────────────────────── */
.navbar .d-flex.align-items-center.ms-3 {
  gap: 8px !important;
  margin-left: 24px !important;     /* breathing room between CTA pill and icons */
  padding-left: 12px !important;
  border-left: 1px solid rgba(24, 24, 27, 0.08);   /* subtle divider */
  flex-shrink: 0;
}

.navbar .d-flex.align-items-center.ms-3 a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  font-size: 1.4rem !important;
  margin: 0 !important;
  transition: background 0.18s ease, transform 0.18s ease;
}

.navbar .d-flex.align-items-center.ms-3 a:hover,
.navbar .d-flex.align-items-center.ms-3 a:focus-visible {
  background: rgba(24, 24, 27, 0.05) !important;
  transform: translateY(-1px);
}

/* Preserve brand colours (LinkedIn blue, YouTube red) — match the original PL design */
.navbar .d-flex.align-items-center.ms-3 a[href*="linkedin"] { color: #0077b5 !important; }
.navbar .d-flex.align-items-center.ms-3 a[href*="youtube"]  { color: #c4302b !important; }
.navbar .d-flex.align-items-center.ms-3 a[href*="linkedin"]:hover { color: #005a8a !important; }
.navbar .d-flex.align-items-center.ms-3 a[href*="youtube"]:hover  { color: #a82724 !important; }

/* ── Toggler (mobile burger) — outline button feel ────────────────────── */
.navbar .navbar-toggler {
  border: 1px solid rgba(24, 24, 27, 0.15) !important;
  padding: 6px 10px !important;
  border-radius: 8px !important;
  font-size: 1.4rem !important;
  color: #001D77 !important;
}

.navbar .navbar-toggler:focus-visible {
  outline: 2px solid #001D77 !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

/* ── Mobile collapse menu: stack items, full-width tappable rows ──────── */
@media (max-width: 991.98px) {
  #navbar-navlist {
    flex-wrap: wrap !important;
    flex-direction: column !important;
    gap: 0 !important;
    justify-content: stretch !important;
    align-items: stretch !important;
    width: 100% !important;
    padding: 8px 0 !important;
  }

  #navbar-navlist .nav-item {
    width: 100% !important;
  }

  #navbar-navlist .nav-link {
    width: 100% !important;
    text-align: left !important;
    justify-content: flex-start !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    border-radius: 0 !important;
    border-bottom: 1px solid rgba(24, 24, 27, 0.05) !important;
  }

  #navbar-navlist .nav-link.btn-outline-primary,
  #navbar-navlist .nav-link.mobile-only-button {
    margin: 12px 16px !important;
    width: calc(100% - 32px) !important;
    text-align: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
  }

  .navbar .d-flex.align-items-center.ms-3 {
    margin-left: 0 !important;
    justify-content: center;
    padding: 8px 0;
    border-top: 1px solid rgba(24, 24, 27, 0.05);
  }
}

/* ── Float button (side "Kontakt" tag) — keep above content, slim ─────── */
.float-button {
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
}

/* ── Footer (.footer-alt) fixes — shared across all pages ──────────────── */
/* style.css/style.min.css pin .footer-alt as position:fixed, which floats it
   over page content (covered the homepage tagline). Reset to normal flow. */
.footer-alt {
  position: relative !important;
  bottom: auto !important;
  left: auto !important;
  width: 100% !important;
}

/* Trim the footer bar height ~20% (smaller logo + tighter vertical padding) */
.footer-alt.pt-4 { padding-top: 14px !important; }
.footer-alt.pb-4 { padding-bottom: 14px !important; }
.footer-alt .logoColdJet { width: 215px !important; height: auto !important; }

/* "Politique de Confidentialitée" link in gray (was default blue) */
.footer-alt .privacy-policy { color: #6c757d !important; }
.footer-alt .privacy-policy:hover { color: #001D77 !important; }