/** Shopify CDN: Minification failed

Line 229:7 Unexpected "}"
Line 233:73 Unterminated string token
Line 252:79 Unterminated string token
Line 254:74 Unterminated string token

**/
/* SP: Product-page subscription countdown (snippets/sp-product-countdown.liquid,
   rendered by main-product's `sp-countdown` block). Replaces the paid
   Essential Countdown Timer app block — same visual family as the
   announcement bar's countdown (assets/sp-announcement-timer.css): linen
   card, white bordered digit boxes, colon separators drawn via ::after
   (the vendor snippet's markup has no colon nodes). All rules scoped to
   .sp-pdp-countdown; .countdown__* internals come from the vendor snippet
   and are overridden here under that scope only. Token fallbacks kept
   because the live theme has no sp-tokens.css. */

.sp-pdp-countdown {
  /* Operator pick 2026-08-26 (superseding the same day's #eee9e2 "warmer
     linen"): #f6f3ef — lighter and closer to neutral again, a soft warm
     off-white. Set literally, NOT through --sp-color-linen: that token is
     shared with other surfaces which should stay neutral. */
  --spc-bg: #f6f3ef;
  --spc-ink: var(--sp-color-obsidian, #202223);
  --spc-box-border: #d4cdc2;
  margin: 18px 0;
  /* Top/bottom to Figma `1825:16493`: its 152-tall inner block sits 44.5 from
     the card's top and 43.8 from its bottom. Ours carried 22/24, so the card
     read tight top and bottom while the INNER rhythm was already exact — the
     12px heading-to-sub and 35px sub-to-tiles gaps both measure on the nose,
     which is why only these two numbers moved.
     43.5 / 43 rather than 44.5 / 43.8 because this card has a 1px border the
     comp's frame does not, and the border is inside the measured box: 1 + 43.5
     lands the heading at 44.5 and 1 + 43 puts the tiles 44.0 off the bottom.
     Horizontal padding is unchanged — the comp's inner block is 305 wide in a
     506 card, which is content-driven centring, not a 100px side padding. */
  padding: 43.5px 20px 43px;
  background: var(--spc-bg);
  border: 1px solid #e7e2da;
  /* square outer wrap (operator request 2026-08-25) — radius lives on the
     digit boxes only */
  color: var(--spc-ink);
  font-family: var(--sp-font-family, 'Manrope', sans-serif);
  text-align: center;
}

.sp-pdp-countdown__heading {
  /* Figma 1825:16493 (Frame 2095586005, vertical gap 12). */
  margin: 0 0 12px;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.4;
  text-transform: none;
}

.sp-pdp-countdown__sub {
  /* Figma: 35px from the text block to the timer row (Frame 2095586047 gap). */
  margin: 0 0 35px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--sp-color-graphite, #101010);
}

/* --- digit boxes: same recipe as .sp-ann-timer's, one size up --- */

.sp-pdp-countdown .countdown {
  display: block;
}

.sp-pdp-countdown .countdown__grid {
  display: flex;
  justify-content: center;
  align-items: stretch;
  /* Figma tile-to-tile is 12 + colon(2.58) + 12 = 26.58 -> 26px, and the colon
     is centred in it. The colon here is an ::after that SPANS this gap, so the
     var must equal the REAL gap or the glyph lands off-centre. */
  --spc-cd-gap: 26px;
  gap: var(--spc-cd-gap);
  text-align: center;
}

.sp-pdp-countdown .countdown__item {
  /* Vendor main.css adds `margin-inline-end: calc(var(--countdown-size)/2.5)`
     (16px at the 40px desktop size) to every item but the last. That stacked on
     top of our `gap`, making the true tile-to-tile spacing 38px while the colon
     still spanned only 22px — so each ':' sat ~8px left of its gap's centre and
     the cluster read as shifted left. Spacing is owned by `gap` alone here. */
  margin-inline-end: 0;
  position: relative;
  min-width: 51px;      /* Figma tile 51x67: 8 + inner 35 + 8 */
  padding: 10px 8px;
  border: 1px solid var(--spc-box-border);
  border-radius: 6px;
  background: linear-gradient(180deg, var(--sp-color-paper, #fff) 0%, var(--sp-color-paper, #fff) 91.8%, #e6e0d8 100%);
}

.sp-pdp-countdown .countdown__item:not(:last-child)::after {
  content: ':';
  position: absolute;
  /* centred against the FULL box (digits + label), not just the digit row —
     operator request 2026-08-25; the announcement bar keeps digit-row
     alignment because its boxes are shorter. Slight optical lift so the
     glyph's dots straddle the visual midline. */
  top: 0;
  bottom: 0;
  height: auto;
  padding-bottom: 4px;
  /* +1px: absolutely positioned child lays out against the PADDING box, so a
     bare left:100% starts one border-width short of the visual gap. */
  left: calc(100% + 1px);
  right: auto;
  width: var(--spc-cd-gap);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 500;
  color: var(--spc-ink);
}

.sp-pdp-countdown .countdown__item:last-child .countdown__number {
  /* Vendor main.css sets justify-content:flex-start on the last item's number,
     which pushes the final value off-centre inside its own tile. */
  justify-content: center;
}

.sp-pdp-countdown .countdown__number {
  display: block;
  font-size: 26px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}

.sp-pdp-countdown .countdown__unit {
  margin-top: 6px;      /* Figma inner column gap */
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sp-color-stone, #565656);
}

@media (max-width: 479.98px) {
  .sp-pdp-countdown {
    padding: 18px 14px 20px;
  }

  .sp-pdp-countdown__heading {
    font-size: 16px;
  }

  .sp-pdp-countdown__sub {
    font-size: 13px;
    margin-bottom: 14px;
  }

  .sp-pdp-countdown .countdown__grid {
    --spc-cd-gap: 18px;
  }

  .sp-pdp-countdown .countdown__item:not(:last-child)::after {
    font-size: 15px;
  }

  .sp-pdp-countdown .countdown__item {
    min-width: 46px;
    padding: 9px 7px;
  }

  .sp-pdp-countdown .countdown__number {
    font-size: 22px;
  }
}

/* --- quick buy: the panel is narrow and the app block used to render here
   (quick buy strips .not-in-quickbuy, so this block opts IN via its
   show_in_quickbuy setting) — compact everything one step. --- */
.quickbuy-container .sp-pdp-countdown {
  margin: 14px 0;
  padding: 16px 12px 18px;
}

.quickbuy-container .sp-pdp-countdown__heading {
  font-size: 15px;
}

.quickbuy-container .sp-pdp-countdown__sub {
  font-size: 12.5px;
  margin-bottom: 12px;
}

.quickbuy-container .sp-pdp-countdown .countdown__grid {
  --spc-cd-gap: 12px;
}

.quickbuy-container .sp-pdp-countdown .countdown__item {
  min-width: 44px;
  padding: 7px 7px 6px;
}

.quickbuy-container .sp-pdp-countdown .countdown__number {
  font-size: 20px;
}

.quickbuy-container .sp-pdp-countdown .countdown__item:not(:last-child)::after {
  font-size: 14px;
}

.quickbuy-container .sp-pdp-countdown .countdown__unit {
  font-size: 9px;
}

/* --------------------------------------------------------------------------
   COLON CENTRING — the vendor margin that broke this file's own invariant.

   `--spc-cd-gap` is declared above with the comment "named so the colon spans
   exactly this gap", and the `::after` is `left: calc(100% + 1px);
   width: var(--spc-cd-gap)` on the strength of it. That invariant was not
   true: `main.css:4669` ships

       .countdown__item:not(:last-child) {
         --countdown-divider-width: calc(var(--countdown-size) / 2.5);
         margin-inline-end: var(--countdown-divider-width);   /* = 16px */
       }

   so the real distance between two tile borders is 22 (the flex gap) + 16
   (this margin) = 38, while the colon still centres itself inside a 22px box
   pinned to the left tile's edge. Measured at 1440: tiles at 860-916 and
   954-1010, gap centre 935, colon ink 926.6-928.4 -> centre 927.5, i.e. 7.5px
   left of the midpoint. It reads as the colon hugging the previous number.

   Zeroing the vendor margin is the fix rather than widening the colon to
   `calc(var(--spc-cd-gap) + 16px)`: it restores the invariant the rule above
   already documents and depends on, instead of adding a second number that
   has to be kept in sync with a vendor variable. It also moves the row toward
   the comp — Figma `1825:16497` has 51px tiles on a 77.6px pitch, a 26.6px
   gap, against our 38.

   Scoped to `.sp-pdp-countdown`, so the announcement-bar timer
   (`.sp-ann-timer`, a separate component with its own shorter boxes and its
   own digit-row alignment — see the note on the ::after rule above) is
   untouched.

   VERTICAL ALIGNMENT WAS ALREADY CORRECT and is deliberately not touched. It
   reads as wrong from the box model — the pseudo computes `top: 0` on a 61px
   tile — but a pseudo-element has no getBoundingClientRect, so that number is
   arithmetic, not a measurement. Scanning the rendered pixels puts the colon's
   ink at page y 1761.6-1768.5, centre 1765.1, against a tile centre of 1765.4:
   0.3px out, matching both the comp and the operator's 2026-08-25 call to
   centre against the full box. Do not "fix" it from the computed `top`.
   -------------------------------------------------------------------------- */
.sp-pdp-countdown .countdown__item:not(:last-child) {
  margin-inline-end: 0;
}