/* Offers outside the cart: the offer on store product cards and the site offer strip.
   Addon-owned elements only; colours come from the shop's Appearance palette. */

/* Store product card: badge, the price before and after, and a countdown when the offer ends soon */
.dv-product-offer{display:flex;flex-direction:column;align-items:center;gap:4px;max-width:100%;min-width:0;margin:8px 0 6px;font:500 12.5px/1.35 system-ui,-apple-system,"Segoe UI",sans-serif;text-align:center}
.dv-product-offer-badge{display:inline-flex;align-items:center;justify-content:center;gap:5px;max-width:100%;box-sizing:border-box;white-space:normal;text-align:center;padding:4px 10px;border-radius:999px;font-weight:800;font-size:11px;letter-spacing:.02em;color:var(--dv-col-primary_text,#fff);background:linear-gradient(135deg,var(--dv-col-primary,#2c63f6),var(--dv-col-primary_hover,#1e58d8))}
.dv-product-offer-badge svg{width:11px;height:11px;fill:currentColor}
.dv-product-offer-prices{display:flex;align-items:baseline;justify-content:center;gap:7px;flex-wrap:wrap}
.dv-product-offer-was{color:var(--dv-col-text_soft,#6e819d);text-decoration:line-through;text-decoration-thickness:1.5px}
.dv-product-offer-now{color:var(--dv-col-success,#12a37a);font-weight:800;font-size:15px}
.dv-product-offer-note{color:var(--dv-col-text_soft,#6e819d);font-size:11.5px}
.dv-product-offer-renews{color:var(--dv-col-text,#213754);font-size:11.5px;font-weight:600}
.dv-product-offer-lowest{color:var(--dv-col-text_soft,#6e819d);font-size:11px}
.dv-product-offer-rec{color:var(--dv-col-primary,#2c63f6);font-weight:700;font-size:11px;letter-spacing:.04em;text-transform:uppercase}
.dv-countdown{font-variant-numeric:tabular-nums;font-weight:700}

/* The site offer strip */
.dv-offer-strip{position:relative;z-index:30;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;padding:10px 48px 10px 16px;color:var(--dv-safe-strip_text,var(--dv-col-strip_text,#fff));background:var(--dv-paint-strip_bg,linear-gradient(100deg,var(--dv-col-primary,#2c63f6),var(--dv-col-primary_hover,#1e58d8)));font:500 13.5px/1.4 system-ui,-apple-system,"Segoe UI",sans-serif}
.dv-offer-strip *{color:inherit}
.dv-offer-strip-kicker{padding:3px 9px;border-radius:999px;background:color-mix(in srgb,#fff 18%,transparent);font-weight:800;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase}
.dv-offer-strip-text strong{font-weight:800}
.dv-offer-strip-text small{opacity:.88;margin-left:6px}
.dv-offer-strip .dv-countdown{padding:3px 9px;border-radius:8px;background:color-mix(in srgb,#000 16%,transparent)}
.dv-offer-strip-cta{display:inline-flex;align-items:center;padding:6px 14px;border-radius:999px;background:var(--dv-paint-strip_cta_bg,#fff);color:var(--dv-safe-strip_cta_text,var(--dv-col-strip_cta_text,#2c63f6))!important;font-weight:800;font-size:12.5px;text-decoration:none!important;white-space:nowrap}
.dv-offer-strip-cta:hover{filter:brightness(.96)}
.dv-offer-strip-close{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:28px;height:28px;display:grid;place-items:center;border:0;border-radius:999px;background:transparent;color:inherit;cursor:pointer;font-size:18px;line-height:1}
.dv-offer-strip-close:hover{background:color-mix(in srgb,#fff 16%,transparent)}
.dv-offer-strip :is(a,button):focus:not(:focus-visible){outline:0}
/* At the very top of the page, above the site header (as the Toolkit's notices can be). */
.dv-offer-strip.is-top{z-index:1031}
/* The offers: each one is a slide in the same place, so the bar never jumps or disappears between them. */
.dv-offer-strip-stage{display:grid;width:100%;min-width:0;overflow:hidden;padding:2px 0}
.dv-offer-strip-slide{grid-area:1/1;display:flex;align-items:center;align-content:center;justify-content:center;gap:14px;flex-wrap:wrap;min-width:0;
  transition:transform .55s cubic-bezier(.2,.8,.2,1),opacity .45s ease}
.dv-offer-strip[data-motion="slide"] .dv-offer-strip-slide.is-entering{transform:translateY(115%);opacity:0}
.dv-offer-strip[data-motion="slide"] .dv-offer-strip-slide.is-entering.from-top{transform:translateY(-115%)}
.dv-offer-strip[data-motion="slide"] .dv-offer-strip-slide.is-leaving{transform:translateY(-115%);opacity:0;pointer-events:none}
.dv-offer-strip[data-motion="slide"] .dv-offer-strip-slide.is-leaving.to-bottom{transform:translateY(115%)}
.dv-offer-strip[data-motion="fade"] .dv-offer-strip-slide:is(.is-entering,.is-leaving){opacity:0}
.dv-offer-strip[data-motion="fade"] .dv-offer-strip-slide.is-leaving{pointer-events:none}
.dv-offer-strip .dv-offer-strip-slide.is-sizer{visibility:hidden;pointer-events:none;transition:none;transform:none}
/* Several offers: ‹ 2 of 3 › beside ×. */
.dv-offer-strip.is-rotating{padding-right:200px}
.dv-offer-strip-pager{position:absolute;right:46px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:2px}
.dv-offer-strip-pager button{display:grid;place-items:center;width:26px;height:26px;padding:0;border:0;border-radius:999px;background:transparent;color:inherit;cursor:pointer}
.dv-offer-strip-pager button:hover{background:color-mix(in srgb,#fff 16%,transparent)}
.dv-offer-strip-pager svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.dv-offer-strip-count{min-width:46px;text-align:center;font-size:11.5px;font-weight:700;opacity:.88;font-variant-numeric:tabular-nums;white-space:nowrap}
/* Phones: the offer reads top to bottom. The label on the first line, with × at the far end of that line (a 40px
   target); the words below, wrapping between words only; the countdown; then the button across the full width.
   Several offers: ‹ 2 of 3 › under the button, centred, with 40px buttons. */
@media(max-width:620px){
  .dv-offer-strip{display:block;padding:12px 14px;text-align:left;overflow-wrap:break-word;word-break:normal}
  .dv-offer-strip.is-rotating{padding:12px 14px 6px}
  .dv-offer-strip-stage{padding:0}
  .dv-offer-strip-slide{justify-content:flex-start;align-items:center;gap:8px}
  .dv-offer-strip-kicker{order:0;max-width:calc(100% - 44px);margin-bottom:2px}
  .dv-offer-strip-text{order:1;flex:1 1 100%;min-width:0}
  .dv-offer-strip-text small{display:block;margin:2px 0 0}
  .dv-offer-strip .dv-countdown{order:2}
  .dv-offer-strip-cta{order:3;flex:1 1 100%;justify-content:center;box-sizing:border-box;min-height:40px;padding:8px 16px;font-size:13.5px;line-height:1.3;white-space:normal;text-align:center}
  .dv-offer-strip-close{top:4px;right:4px;transform:none;width:40px;height:40px;font-size:22px}
  .dv-offer-strip-pager{position:static;transform:none;justify-content:center;gap:4px;margin:6px 0 0}
  .dv-offer-strip-pager button{width:40px;height:40px}
  .dv-offer-strip-pager svg{width:17px;height:17px}}
/* Touch screens wider than a phone (tablets): the same one-line bar, with buttons big enough to tap. */
@media(min-width:621px) and (pointer:coarse){
  .dv-offer-strip-cta{min-height:40px;padding:8px 16px}
  .dv-offer-strip-close{width:40px;height:40px;right:6px}
  .dv-offer-strip-pager{right:48px}
  .dv-offer-strip-pager button{width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){.dv-offer-strip-slide{transition:none}}