/* ClaraScience live checkout conversion — promoted from HP2 v11 */
/* ========== HP2 premium minimal v10 — conversion polish ========== */
/* Hierarchy / spacing / CTA copy only. No new chrome. */

/* Force-hide retired payment methods (never surface even if config flips) */
#payment-option-paypal,
#payment-option-crypto,
#payment-option-peptidepay,
#payment-option-paypal[style],
#payment-option-crypto[style],
#payment-option-peptidepay[style] {
  display: none !important;
}

/* Checkout: no line-item dump; hide noise rows only */
#checkout-view #checkout-summary,
#checkout-view #checkout-subtotal-row,
#checkout-view #checkout-savings-summary,
#checkout-view #checkout-price-divider,
#checkout-view #checkout-shipping-note {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: none !important;
  visibility: hidden !important;
  position: absolute !important;
  pointer-events: none !important;
}

/* Unified checkout lines: promo / PayID / preorder(OOS only) / shipping — same row style */
#checkout-view .hp2-discount-stack {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 10px 0 8px !important;
}
#checkout-view .hp2-discount-stack > .cs-discount-row,
#checkout-view .hp2-discount-stack > #checkout-shipping {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  min-height: 0 !important;
}
/* hidden attr wins — never show empty preorder/promo rows */
#checkout-view .hp2-discount-stack > [hidden],
#checkout-view .hp2-discount-stack > .cs-discount-row[hidden],
#checkout-view .hp2-discount-stack > #checkout-shipping[hidden],
#checkout-view .hp2-discount-stack > [style*="display:none"],
#checkout-view .hp2-discount-stack > [style*="display: none"] {
  display: none !important;
}
#checkout-view .hp2-discount-stack > .cs-discount-row > span,
#checkout-view .hp2-discount-stack > #checkout-shipping > span {
  color: var(--muted, #9bb0c7) !important;
  font-size: 0.8125rem !important;
  font-weight: 400 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
/* Discount amounts green; shipping value normal (Free stays accent via inline when free) */
#checkout-view .hp2-discount-stack > #checkout-coupon-discount > strong,
#checkout-view .hp2-discount-stack > #checkout-paymethod-discount > strong,
#checkout-view .hp2-discount-stack > #checkout-preorder-discount > strong {
  color: rgba(133, 255, 210, 0.95) !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  font-family: var(--font-body, inherit) !important;
}
#checkout-view .hp2-discount-stack > #checkout-shipping > strong {
  color: var(--text, #e8f1ff) !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
  font-family: var(--font-body, inherit) !important;
}
/* Free shipping — same green as discount amounts (eye-catching savings) */
#checkout-view .hp2-discount-stack > #checkout-shipping > strong[style*="accent"],
#checkout-view .hp2-discount-stack > #checkout-shipping > strong[style*="accent-secondary"],
#cart-footer #cart-shipping strong[style*="accent"],
#cart-footer #cart-shipping strong[style*="accent-secondary"] {
  color: rgba(133, 255, 210, 0.95) !important;
  font-weight: 600 !important;
}

/* Totals block: Regular total (struck) → Total — savings obvious */
#checkout-view .hp2-totals-block {
  margin: 10px 0 4px !important;
  padding: 10px 0 0 !important;
  border-top: 1px solid rgba(157, 196, 255, 0.08) !important;
}
#checkout-view .cart-drawer__compare--inline,
#checkout-view #checkout-compare {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 0 4px !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}
#checkout-view #checkout-compare[style*="display: none"] {
  display: none !important;
}
#checkout-view #checkout-compare span {
  color: var(--muted, #9bb0c7) !important;
  font-size: 0.78rem !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
#checkout-view #checkout-compare strong {
  color: var(--soft, #8aa0b8) !important;
  font-size: 0.95rem !important;
  font-weight: 500 !important;
  font-family: var(--font-body, inherit) !important;
  text-decoration: line-through !important;
  text-decoration-thickness: 1.5px !important;
  text-decoration-color: rgba(255, 255, 255, 0.4) !important;
}
#checkout-view .hp2-totals-block .cart-drawer__total {
  margin: 0 0 12px !important;
  padding-top: 0 !important;
  border-top: none !important;
}

/* Promo: optional, low friction — not a bold second CTA */
#checkout-view .coupon-row {
  margin: 6px 0 8px !important;
  opacity: 0.92;
}
#checkout-view .cs-coupon {
  margin: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.015) !important;
}
#checkout-view .cs-coupon__input {
  font-size: 0.78rem !important;
  padding: 8px 12px !important;
  color: var(--soft, #8aa0b8) !important;
}
#checkout-view .cs-coupon__btn {
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  color: var(--soft, #8aa0b8) !important;
  height: 34px !important;
  text-transform: none !important;
}
#checkout-view .cs-coupon__btn:hover { color: var(--accent, #62c9ff) !important; }
#checkout-view .cs-coupon__msg {
  font-size: 0.72rem !important;
  margin: 4px 0 0 !important;
  color: var(--soft, #8aa0b8) !important;
}

/* Fallback discount hide (stack rules above take precedence when visible) */
#checkout-view .cs-discount-row[hidden],
#checkout-view .cs-discount-row[style*="display:none"],
#checkout-view .cs-discount-row[style*="display: none"] {
  display: none !important;
}


#checkout-view .lptest-back-cart {
  width: 100% !important;
  margin-top: 10px !important;
  min-height: 40px !important;
  opacity: 0.72 !important;
  font-weight: 500 !important;
  font-size: 0.82rem !important;
  background: transparent !important;
  border-color: transparent !important;
  color: var(--soft, #7f94ab) !important;
  box-shadow: none !important;
}

/* Cart footer: Regular total → Shipping → ship note → Total → CTA → trust */
.cart-drawer__footer {
  padding: 16px 16px max(12px, env(safe-area-inset-bottom)) !important;
  background: rgba(8, 14, 24, 0.98) !important;
  border-top: 1px solid rgba(157, 196, 255, 0.09) !important;
  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08) !important;
}
/* One quiet ship note; hide noise rows */
#cart-footer #cart-shipping-note,
#cart-footer #cart-paymethod-discount,
#cart-footer #cart-savings-summary,
#cart-footer #cart-subtotal-row { display: none !important; }

/* Crossed-out regular total — discount psychology (like live HP) */
#cart-footer .cart-drawer__compare {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 8px !important;
}
#cart-footer .cart-drawer__compare[style*="display: none"] { display: none !important; }
#cart-footer .cart-drawer__compare span {
  color: var(--muted, #9bb0c7) !important;
  font-size: 0.74rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
#cart-footer .cart-drawer__compare strong {
  color: var(--soft, #8aa0b8) !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
  font-family: var(--font-body, inherit) !important;
  text-decoration: line-through !important;
  text-decoration-thickness: 1.5px !important;
  text-decoration-color: rgba(255, 255, 255, 0.38) !important;
}

#cart-footer .cart-drawer__shipping {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 8px !important;
}
#cart-footer .cart-drawer__shipping[style*="display: none"] { display: none !important; }
#cart-footer .cart-drawer__shipping span {
  color: var(--muted, #9bb0c7) !important;
  font-size: 0.8125rem !important;
  font-weight: 400 !important;
  letter-spacing: 0;
  text-transform: none !important;
}
#cart-footer .cart-drawer__shipping strong {
  color: var(--text, #e8f1ff) !important;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  font-family: var(--font-body, inherit) !important;
}

.hp2-ship-line {
  display: none;
  margin: 0 0 10px !important;
  font-size: 0.8125rem !important;
  font-weight: 400 !important;
  color: var(--soft, #8a9bb0) !important;
  line-height: 1.4;
}
.cart-drawer__footer .hp2-ship-line:not(:empty) { display: block; }

.cart-drawer__total {
  display: flex !important;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 4px 0 14px !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(157, 196, 255, 0.08) !important;
}
.cart-drawer__total span {
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--text, #e8f1ff) !important;
}
.cart-drawer__total strong {
  font-size: 1.125rem !important;
  font-weight: 600 !important;
  font-family: var(--font-body, inherit) !important;
  letter-spacing: -0.01em;
}

.hp2-cta,
.cart-drawer__checkout.hp2-cta {
  width: 100%;
  min-height: 52px !important;
  padding: 14px 16px !important;
  border-radius: 12px !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  animation: none !important;
  box-shadow: none !important;
  transform: none !important;
  background: linear-gradient(135deg, var(--accent-secondary, #3d95ff), var(--accent, #62c9ff)) !important;
  color: #04111b !important;
}
.hp2-cta:hover,
.cart-drawer__checkout.hp2-cta:hover {
  transform: none !important;
  box-shadow: none !important;
  filter: brightness(1.04);
}
.hp2-cta::before,
.cart-drawer__checkout.hp2-cta::before {
  display: none !important;
  animation: none !important;
}

/* Match live lptest-cart-trust weight/size so cart footer trust reads clean */
body.lptest .lptest-cart-trust.hp2-trust,
#cart-footer .lptest-cart-trust,
#cart-footer .hp2-trust {
  margin: 10px 0 0 !important;
  text-align: center !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  color: var(--soft, #7f94ab) !important;
  line-height: 1.45 !important;
}

/* Payment list — full-card select (no visible radio circles on mobile) */
.payment-methods { display: flex !important; flex-direction: column; gap: 8px !important; }
.payment-option {
  position: relative !important;
  display: block !important;
  margin: 0 !important;
  min-height: 52px;
  padding: 14px 16px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(157, 196, 255, 0.12) !important;
  background: rgba(255, 255, 255, 0.02) !important;
  box-shadow: none !important;
  transform: none !important;
  cursor: pointer !important;
  -webkit-tap-highlight-color: transparent;
}
.payment-option:hover {
  transform: none !important;
  border-color: rgba(157, 196, 255, 0.22) !important;
  background: rgba(255, 255, 255, 0.035) !important;
}
.payment-option.is-selected,
label.payment-option:has(input:checked) {
  border-color: rgba(133, 255, 210, 0.78) !important;
  background: rgba(133, 255, 210, 0.14) !important;
  box-shadow: inset 0 0 0 1px rgba(133, 255, 210, 0.35), 0 0 0 1px rgba(133, 255, 210, 0.18) !important;
}
#payment-option-payid:not(.is-selected):not(:has(input:checked)) {
  border-color: rgba(157, 196, 255, 0.12) !important;
}
/* Visually hide native radios; keep for a11y + form state */
.payment-option input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  overflow: hidden !important;
  pointer-events: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
.payment-option__body {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  min-width: 0 !important;
}
.payment-option__brand-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
  min-width: 0 !important;
}
.payment-option__brand-row strong,
.payment-option__body > strong,
.payment-option strong {
  font-family: var(--font-body, inherit) !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.payment-option__badges {
  display: flex !important;
  flex-shrink: 0 !important;
  gap: 6px !important;
}
/* Secondary line only — never style badges as body text */
.payment-option__desc,
.payment-option__body > .payment-option__desc {
  font-size: 0.75rem !important;
  font-weight: 400 !important;
  color: var(--soft, #8aa0b8) !important;
  line-height: 1.35 !important;
  display: block !important;
}
/* Quiet savings mark */
.payment-badge {
  font-size: 0.62rem !important;
  font-weight: 600 !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  letter-spacing: 0.01em !important;
  border: 1px solid rgba(133, 255, 210, 0.2) !important;
  background: rgba(133, 255, 210, 0.07) !important;
  color: rgba(180, 255, 230, 0.95) !important;
  white-space: nowrap !important;
  min-height: 0 !important;
}
.payment-badge--savings {
  background: rgba(133, 255, 210, 0.07) !important;
  border-color: rgba(133, 255, 210, 0.2) !important;
}

.cart-drawer__header { padding: 16px 16px !important; }
.cart-drawer__header h3 { font-size: 1.05rem !important; font-weight: 600 !important; }
.cart-drawer__items { padding: 12px 16px !important; }
.cart-item { padding: 12px 0 !important; }
.cart-item__name { font-size: 0.9rem !important; font-weight: 500 !important; }
.cart-item__meta,
.cart-item__price { font-size: 0.8125rem !important; font-weight: 400 !important; }

.checkout-form {
  padding: 16px 16px max(16px, env(safe-area-inset-bottom)) !important;
  gap: 14px !important;
}
.checkout-section-title {
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted, #9bb0c7) !important;
  margin: 8px 0 4px !important;
  padding-top: 8px !important;
}
.checkout-form label { font-size: 0.78rem !important; gap: 5px !important; }
.checkout-form input,
.checkout-form select,
.checkout-form textarea {
  padding: 12px 13px !important;
  border-radius: 10px !important;
  border-color: rgba(255,255,255,0.1) !important;
  background: rgba(255,255,255,0.03) !important;
}
.checkout-submit, #checkout-submit, #place-order, button.checkout-submit {
  width: 100% !important;
  min-height: 52px !important;
  margin-top: 8px;
  border-radius: 12px !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  animation: none !important;
  transform: none !important;
}
#checkout-view .cart-drawer__total {
  margin: 6px 0 12px !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(157, 196, 255, 0.08) !important;
}
#checkout-view .cart-drawer__total span {
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  color: var(--text, #e8f1ff) !important;
}
#checkout-view .cart-drawer__total strong {
  font-size: 1.125rem !important;
  font-weight: 600 !important;
  font-family: var(--font-body, inherit) !important;
}
/* Live-style checkout trust row (class is lptest-pay-trust, not luxe) */
#checkout-view .lptest-pay-trust,
body.lptest .lptest-pay-trust {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 8px 12px !important;
  margin: 10px 0 0 !important;
  text-align: center !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  color: var(--soft, #7f94ab) !important;
  line-height: 1.45 !important;
  opacity: 1 !important;
}
#checkout-view .cart-drawer__shipping span,
#checkout-view .cs-discount-row span {
  font-size: 0.8125rem !important;
  font-weight: 400 !important;
}

/* Kill leftover loud HP2 chrome if any nodes remain */
.hp2-banner,
.hp2-step,
.hp2-rec,
.hp2-payid-pill,
.hp2-ship-progress,
.hp2-checkout-summary-bar,
.hp2-pay-more { display: none !important; }

@media (pointer: coarse) {
  .cart-item__qty button { width: 40px !important; height: 40px !important; border-radius: 10px !important; }
  .cart-drawer__close { width: 40px !important; height: 40px !important; }
  .checkout-form input, .checkout-form select, .checkout-form textarea {
    font-size: 16px !important; min-height: 48px;
  }
  .payment-option { min-height: 56px; }
}
@media (max-width: 560px) {
  .cart-drawer__header { padding: 14px 16px !important; }
  .cart-drawer__items { padding: 10px 16px !important; }
  .cart-drawer__footer { padding: 16px 16px max(12px, env(safe-area-inset-bottom)) !important; }
  .checkout-form { padding: 14px 16px max(14px, env(safe-area-inset-bottom)) !important; }
  .payment-option__brand-row strong {
    font-size: 0.875rem !important;
  }
}

#checkout-view .hp2-discount-stack > #checkout-shipping > strong.is-free,
#cart-footer #cart-shipping strong.is-free {
  color: rgba(133, 255, 210, 0.95) !important;
  font-weight: 600 !important;
}

/* Cart/checkout shipping label — Express, Priority Delivery */
#cart-footer #cart-shipping span,
#checkout-view #checkout-shipping span {
  max-width: 70%;
  line-height: 1.3;
}
#cart-footer #cart-shipping strong.FREE,
#cart-footer #cart-shipping strong.is-free,
#checkout-view #checkout-shipping strong.is-free {
  color: rgba(133, 255, 210, 0.95) !important;
  font-weight: 600 !important;
}
