/* Controlled offer content is neutral until a server state is known. */
[data-offer-campaign][data-offer-show][hidden],
[data-offer-campaign][data-offer-fallback][hidden],
[data-offer-campaign][data-offer-price-output][hidden],
[data-offer-campaign][data-offer-countdown][hidden] {
  display: none !important;
}
[data-offer-countdown][data-offer-pending="1"] { visibility: hidden; }

/* Timer presets. Put the timer class on a dedicated Text/Div element. */
.offerflow-timer--plain { font-variant-numeric: tabular-nums; font-size: var(--offerflow-timer-size, 1em); }
.offerflow-timer--compact { font-variant-numeric: tabular-nums; white-space: nowrap; font-size: var(--offerflow-timer-size, 1em); }
.offerflow-timer--pill {
  display: inline-flex !important;
  align-items: center;
  width: auto;
  padding: .45em .75em;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  font-size: var(--offerflow-timer-size, 1em);
}
.offerflow-timer__cards { display: inline-flex; align-items: center; gap: .28em; font-variant-numeric: tabular-nums; }
.offerflow-timer__cell { display: inline-flex; min-width: var(--offerflow-card-width, 72px); flex-direction: column; align-items: center; justify-content: center; padding: .5em .55em; border: 1px solid currentColor; border-radius: .55em; line-height: 1; }
.offerflow-timer__cell strong { font-size: var(--offerflow-timer-size, 1.15em); line-height: 1; }
.offerflow-timer__cell small { margin-top: .35em; font-size: var(--offerflow-unit-size, .62em); opacity: .72; text-transform: uppercase; letter-spacing: .04em; }
.offerflow-timer__sep { opacity: .65; font-weight: 700; font-size: var(--offerflow-timer-size, 1em); }

.offerflow-preview-badge {
  position: fixed;
  z-index: 2147483646;
  right: 12px;
  bottom: 12px;
  max-width: min(520px, calc(100vw - 24px));
  padding: 8px 11px;
  border-radius: 7px;
  background: #111;
  color: #fff;
  font: 600 12px/1.35 system-ui, sans-serif;
  box-shadow: 0 4px 20px rgba(0,0,0,.25);
}

/* Keep timers visually native to the host site unless a preset overrides layout. */
[data-offer-countdown],
.offerflow-timer--plain,
.offerflow-timer--compact,
.offerflow-timer--pill,
.offerflow-timer--cards,
.offerflow-timer__cards,
.offerflow-timer__cell,
.offerflow-timer__cell strong,
.offerflow-timer__cell small {
  font-family: inherit;
  color: inherit;
}

.offerflow-checkout-savings {
  display: block;
  margin-top: .28em;
  font-size: .86em;
  line-height: 1.3;
  font-weight: 600;
}

/* Whole timer component: optional label + countdown. It disappears as one unit. */
[data-offer-timer-wrapper][hidden] { display: none !important; }
.offerflow-timer-component {
  font-family: inherit;
  color: inherit;
}
.offerflow-timer-component--stack {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: .45em;
}
.offerflow-timer-component--inline {
  display: flex;
  width: 100%;
  align-items: center;
  flex-wrap: wrap;
  gap: .65em;
}
.offerflow-timer-component--align-left { align-items: flex-start; text-align: left; }
.offerflow-timer-component--align-center { align-items: center; text-align: center; }
.offerflow-timer-component--align-right { align-items: flex-end; text-align: right; }
.offerflow-timer-component--inline.offerflow-timer-component--align-left { justify-content: flex-start; }
.offerflow-timer-component--inline.offerflow-timer-component--align-center { justify-content: center; }
.offerflow-timer-component--inline.offerflow-timer-component--align-right { justify-content: flex-end; }

.offerflow-timer-label {
  display: block;
  font: inherit;
  color: inherit;
  line-height: 1.35;
  font-size: var(--offerflow-label-size, inherit);
}

/* Keep all offer information grouped with the native order total. */
.offerflow-checkout-price-stack {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: .16em;
  line-height: 1.12;
}
.offerflow-checkout-reference {
  display: block;
  font-size: .62em;
  line-height: 1.1;
  opacity: .58;
  font-weight: 500;
}
.offerflow-checkout-reference del {
  text-decoration-thickness: 1px;
}
.offerflow-checkout-current {
  display: block;
  line-height: 1;
}
.offerflow-checkout-savings {
  display: block;
  margin-top: .08em;
  font-size: .52em;
  line-height: 1.15;
  font-weight: 650;
  letter-spacing: 0;
}

/* Page-builder mode: OfferFlow must never hide the content the editor is trying to edit. */
html.offerflow-editor [data-offer-campaign] {
  visibility: visible !important;
}
html.offerflow-editor [data-offer-campaign][hidden],
html.offerflow-editor [data-offer-timer-wrapper][hidden],
html.offerflow-editor [data-offer-countdown][hidden] {
  display: revert !important;
}
html.offerflow-editor [data-offer-show],
html.offerflow-editor [data-offer-timer-wrapper] {
  outline: 1px dashed rgba(34, 113, 177, .28);
  outline-offset: 2px;
}
html.offerflow-editor [data-offer-countdown][data-offer-pending="1"] {
  visibility: visible !important;
}

/* Checkout offer context belongs with the product price, not in the final total. */
.offerflow-line-price {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: .2em;
  max-width: 100%;
  font-family: inherit;
  color: inherit;
}
.offerflow-line-price__prices {
  display: inline-flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: .42em;
  white-space: nowrap;
}
.offerflow-line-price__reference {
  font-size: 1em !important;
  opacity: .80;
  font-weight: 500;
  line-height: inherit;
}
.offerflow-line-price__reference del,
.offerflow-line-price__reference .woocommerce-Price-amount,
.offerflow-line-price__reference .woocommerce-Price-currencySymbol {
  font-size: 1em !important;
  color: inherit !important;
  opacity: 1 !important;
}
.offerflow-line-price__reference del {
  text-decoration-thickness: 1.1px;
  text-decoration-color: currentColor;
}
.offerflow-line-price__current {
  white-space: nowrap;
}
.offerflow-line-price__meta {
  display: inline-flex;
  align-items: baseline;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .14em .32em;
  max-width: 100%;
  font-size: .72em;
  line-height: 1.2;
  text-align: right;
}
.offerflow-line-price__savings {
  display: inline-block;
  font-size: 1em;
  line-height: inherit;
  font-weight: 600;
  white-space: nowrap;
}
.offerflow-line-price__sep {
  display: inline-block;
  opacity: .45;
  line-height: inherit;
}

/* Exact, server-synchronized deadline text under a timer. */
.offerflow-timer-exact {
  display: block;
  font: inherit;
  font-size: var(--offerflow-exact-size, .78em);
  line-height: 1.35;
  opacity: .78;
}

/* Checkout price lock: reassurance next to the actual product price. */
.offerflow-line-price__lock {
  display: inline-block;
  margin: 0;
  font-size: 1em;
  line-height: inherit;
  font-weight: 550;
  white-space: nowrap;
  text-align: right;
}
.offerflow-checkout-update-notice {
  margin: 0 0 12px;
  padding: 9px 11px;
  border: 1px solid color-mix(in srgb, currentColor 24%, transparent);
  border-radius: 7px;
  background: color-mix(in srgb, currentColor 5%, transparent);
  font: inherit;
  font-size: .9em;
  line-height: 1.35;
}
