/* POOQ free-delivery bar - fixed strip directly above the Impreza header.
   Managed as a file: wp-content/mu-plugins/pooq-ship-bar/pooq-ship-bar.css

   Every rule is gated on body.pooq-shipbar, which the server adds only when the bar actually
   renders. Without that class nothing here applies, so turning the bar off restores the stock
   layout with no leftover offsets.

   The --header-height fallbacks are deliberate: if that custom property is ever renamed by an
   Impreza update, calc() would otherwise resolve to an invalid value and the under-header
   clearance would collapse to zero, sliding the whole page under the fixed header. */

:root {
  --pooq-shipbar-h: 36px;
}

@media (max-width: 600px) {
  /* The mobile header is already 120px of fixed chrome. Keep the bar tight. */
  :root { --pooq-shipbar-h: 30px; }
}

body.pooq-shipbar #pooq-ship-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--pooq-shipbar-h);
  z-index: 112; /* header is 111, left rail 110 */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  /* The copper accent, NOT the header's brown (#876333). With the same brown the bar and the
     header read as one continuous block and the announcement disappears into the chrome. */
  background: #B66C40;
  color: #fff;
  font-family: Play, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1;
  text-align: center;
  box-sizing: border-box;
}

body.pooq-shipbar .pooq-shipbar-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 600px) {
  body.pooq-shipbar #pooq-ship-bar { font-size: 12px; padding: 0 10px; }
}

/* ---------------------------------------------------------------- layout compensation */

/* 1. Push the fixed header down by exactly the bar's height. */
body.pooq-shipbar .l-header.pos_fixed {
  top: var(--pooq-shipbar-h);
}

/* 2. Extend the theme's own under-header clearance by the same amount. This mirrors Impreza's
      rule in css/style.min.css; it must stay a padding on .l-section-h, not a margin anywhere
      else, or the first section overlaps the header. */
body.pooq-shipbar.header_hor .l-header.pos_fixed ~ .l-main > .l-section:first-of-type > .l-section-h {
  padding-top: calc(var(--header-height, 80px) + var(--pooq-shipbar-h));
}

/* 3. Drop the left category rail by the same amount. pooq-nav.css hardcodes these offsets
      (top:80px, and 112px with the admin bar) rather than deriving them, so they are restated
      here. This file is enqueued with pooq-nav as a dependency, so it always wins on order. */
body.pooq-shipbar.pooq-nh .pooq-leftnav {
  top: calc(80px + var(--pooq-shipbar-h));
}

/* ---------------------------------------------------------------- admin bar */

body.pooq-shipbar.admin-bar #pooq-ship-bar { top: 32px; }
body.pooq-shipbar.admin-bar .l-header.pos_fixed { top: calc(var(--pooq-shipbar-h) + 32px); }
body.pooq-shipbar.admin-bar.pooq-nh .pooq-leftnav { top: calc(112px + var(--pooq-shipbar-h)); }

@media screen and (max-width: 782px) {
  /* WordPress makes the admin bar 46px tall below this width. */
  body.pooq-shipbar.admin-bar #pooq-ship-bar { top: 46px; }
  body.pooq-shipbar.admin-bar .l-header.pos_fixed { top: calc(var(--pooq-shipbar-h) + 46px); }
}