/**
 * InFront header top strip (under the promo banner): shipping note | USPs | phones, contact, compare.
 * Markup: html blocks 26 (displayNav1), 3 (displayNavCenter), 90 (displayNav2) from tools/topbar/*.html
 * (ea-php82 tools/topbar/apply.php), compare link from modules/iqitcompare display-nav.tpl.
 */

#header nav.header-nav.ift-tb {
  --tb-ink: #1f2328;
  --tb-text: #4b5563;
  --tb-muted: #9aa1ab;
  --tb-line: #d5d9de;
  --tb-brand: #5f9424;
  background: #f4f5f7;
  border-bottom: 1px solid #e6e8eb;
  color: var(--tb-text);
  font-size: 12.5px;
  line-height: 1.2;
  letter-spacing: 0.005em;
}

#header nav.header-nav.ift-tb > .container > .row,
#header nav.header-nav.ift-tb > .row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  min-height: 34px;
}

#header nav.header-nav.ift-tb .left-nav,
#header nav.header-nav.ift-tb .right-nav {
  flex: 1 0 auto;
  max-width: none;
  white-space: nowrap;
}

#header nav.header-nav.ift-tb .center-nav {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
}

#header nav.header-nav.ift-tb .left-nav > div::after,
#header nav.header-nav.ift-tb .right-nav > div::after {
  content: none;
  display: none;
}

#header nav.header-nav.ift-tb .right-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

#header nav.header-nav.ift-tb .d-inline-block,
#header nav.header-nav.ift-tb .rte-content {
  vertical-align: middle;
}

#header nav.header-nav.ift-tb .rte-content p,
#header nav.header-nav.ift-tb .rte-content ul {
  margin: 0;
  padding: 0;
  font-size: inherit;
  line-height: inherit;
}

#header nav.header-nav.ift-tb #iqithtmlandbanners-block-26 {
  display: inline-block !important;
}

#header nav.header-nav.ift-tb .fa {
  color: var(--tb-brand);
  font-size: 13px;
  width: 1em;
  text-align: center;
}

#header nav.header-nav.ift-tb a {
  color: var(--tb-ink) !important;
  text-decoration: none;
}

#header nav.header-nav.ift-tb a:hover,
#header nav.header-nav.ift-tb a:focus-visible {
  color: var(--tb-brand) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---- Left: shipping note ---- */
#header nav.header-nav.ift-tb .ift-tb__item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

#header nav.header-nav.ift-tb .ift-tb__ship strong {
  color: var(--tb-ink);
  font-weight: 700;
}

/* ---- Centre: USPs ---- */
#header nav.header-nav.ift-tb .ift-tb__usps {
  display: inline-flex;
  align-items: center;
  list-style: none;
}

#header nav.header-nav.ift-tb .ift-tb__usp {
  display: inline-flex;
  align-items: center;
  font-weight: 500;
}

#header nav.header-nav.ift-tb .ift-tb__usp + .ift-tb__usp::before {
  content: "";
  width: 3px;
  height: 3px;
  margin: 0 12px;
  border-radius: 50%;
  background: var(--tb-muted);
}

#header nav.header-nav.ift-tb .ift-tb__usp--lead {
  color: var(--tb-ink);
  font-weight: 700;
}

/* ---- Right: phones, contact, compare ---- */
#header nav.header-nav.ift-tb .right-nav > .d-inline-block {
  display: inline-flex !important;
  align-items: center;
}

#header nav.header-nav.ift-tb .right-nav > #iqithtmlandbanners-block-90 {
  order: 1;
}

#header nav.header-nav.ift-tb .right-nav > .d-inline-block:has(.js-iqitcompare-link) {
  order: 2;
}

#header nav.header-nav.ift-tb .ift-tb__contact a {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

#header nav.header-nav.ift-tb .ift-tb__or {
  color: var(--tb-muted);
}

#header nav.header-nav.ift-tb .ift-tb__contact .ift-tb__mail,
#header nav.header-nav.ift-tb .js-iqitcompare-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 13px;
  padding-left: 14px;
  font-weight: 600;
}

#header nav.header-nav.ift-tb .ift-tb__contact .ift-tb__mail::before,
#header nav.header-nav.ift-tb .js-iqitcompare-link::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 1px;
  height: 14px;
  margin-top: -7px;
  background: var(--tb-line);
}

#header nav.header-nav.ift-tb .js-iqitcompare-link .fa {
  color: var(--tb-text);
  font-size: 12px;
}

#header nav.header-nav.ift-tb .js-iqitcompare-link:hover .fa {
  color: var(--tb-brand);
}

#header nav.header-nav.ift-tb .ift-cmp-navcount {
  display: none;
}

#header nav.header-nav.ift-tb .js-iqitcompare-link[data-count]:not([data-count="0"])::after {
  content: attr(data-count);
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  background: var(--tb-ink);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

/* ---- Narrower desktops: drop the least important pieces instead of wrapping ---- */
@media (max-width: 1199.98px) {
  #header nav.header-nav.ift-tb .left-nav { display: none; }
  #header nav.header-nav.ift-tb .center-nav { flex: 1 1 auto; text-align: left !important; }
}

@media (max-width: 991.98px) {
  #header nav.header-nav.ift-tb .ift-tb__usp--ship,
  #header nav.header-nav.ift-tb .ift-tb__usp:not(.ift-tb__usp--lead) { display: none; }
  #header nav.header-nav.ift-tb .ift-tb__or,
  #header nav.header-nav.ift-tb .ift-tb__contact a[href^="tel:02"] { display: none; }
}

/* Phones: the strip only shows when there is something in compare. */
@media (max-width: 767.98px) {
  #header nav.header-nav.ift-tb:not(.ift-tb--cmp) { display: none; }
  #header nav.header-nav.ift-tb .left-nav,
  #header nav.header-nav.ift-tb .center-nav,
  #header nav.header-nav.ift-tb #iqithtmlandbanners-block-90 { display: none !important; }
  #header nav.header-nav.ift-tb > .container > .row,
  #header nav.header-nav.ift-tb > .row { min-height: 30px; }
  #header nav.header-nav.ift-tb .js-iqitcompare-link { margin-left: 0; padding-left: 0; }
  #header nav.header-nav.ift-tb .js-iqitcompare-link::before { display: none; }
}