/* =========================================================
   WPComfy — WooCommerce templates
   Checkout, order received, login and My Account.

   Selectors target WooCommerce's own markup (classic checkout,
   WooCommerce Subscriptions, My Account) so this file can move into
   the theme almost unchanged. Anything prefixed .wpc- is a theme
   addition that needs a small template override or hook.
   ========================================================= */

:root {
  --shop-bg: #fbfaf3;
  --shop-surface: #ffffff;
  --shop-border: #dedfd3;
  --shop-border-strong: #c9ccbd;
  --shop-muted: #667167;
  --shop-ring: rgba(244, 189, 98, 0.5);
  --shop-radius: 10px;
  --ok: #3f7d3a;
  --ok-bg: #e4f0dc;
  --warn: #8a5a12;
  --warn-bg: #f7ead0;
}

/* ---------- shared form controls (WooCommerce .form-row) ---------- */

.woocommerce form .form-row {
  display: grid;
  gap: 6px;
  margin: 0 0 14px;
  padding: 0;
}

.woocommerce form .form-row label,
.wpc-label {
  color: var(--ink);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
}

.woocommerce form .form-row .required {
  color: #b4442f;
  text-decoration: none;
  border: 0;
}

.woocommerce form .form-row .optional {
  color: var(--shop-muted);
  font-weight: 400;
}

.woocommerce-input-wrapper {
  display: block;
}

.woocommerce form .input-text,
.woocommerce form select,
.woocommerce form textarea {
  width: 100%;
  min-height: 46px;
  padding: 11px 13px;
  border: 1px solid var(--shop-border-strong);
  border-radius: var(--shop-radius);
  background: var(--shop-surface);
  box-shadow: 0 1px 1px rgba(22, 32, 28, 0.04);
  color: var(--ink);
  font: 15.5px/1.4 var(--sans);
  transition:
    border-color 120ms ease,
    box-shadow 120ms ease;
  -webkit-appearance: none;
  appearance: none;
}

.woocommerce form select {
  padding-right: 38px;
  background: var(--shop-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 3' shape-rendering='crispEdges'%3E%3Cpath fill='%2316201c' d='M0 0h5v1H4v1H3v1H2V2H1V1H0z'/%3E%3C/svg%3E") no-repeat right 14px center / 10px 6px;
}

.woocommerce form textarea {
  min-height: 92px;
  resize: vertical;
}

.woocommerce form .input-text::placeholder,
.woocommerce form textarea::placeholder {
  color: #9aa296;
}

.woocommerce form .input-text:focus,
.woocommerce form select:focus,
.woocommerce form textarea:focus {
  border-color: var(--ink);
  outline: none;
  box-shadow: 0 0 0 3px var(--shop-ring);
}

.woocommerce form .form-row.woocommerce-invalid .input-text,
.was-submitted .input-text:invalid {
  border-color: #b4442f;
  box-shadow: 0 0 0 3px rgba(180, 68, 47, 0.18);
}

.woocommerce form .form-row-first,
.woocommerce form .form-row-last {
  min-width: 0;
}

.wpc-row-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 12px;
}

.wpc-hint {
  color: var(--shop-muted);
  font-size: 13px;
  line-height: 1.45;
}

/* pixel checkbox / radio (WooCommerce .input-checkbox, .input-radio) */
.wpc-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--ink);
  font-size: 14.5px;
  font-weight: 500;
  line-height: 1.45;
  cursor: pointer;
}

.wpc-check input {
  flex: none;
  width: 20px;
  height: 20px;
  margin: 1px 0 0;
  border: 0;
  border-radius: 4px;
  background: #fff;
  box-shadow: inset 0 0 0 2px var(--shop-border-strong);
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

.wpc-check input:checked {
  background: var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8' shape-rendering='crispEdges'%3E%3Cpath fill='%23f4bd62' d='M6 1h2v1H6zM5 2h2v1H5zM0 3h2v1H0zM4 3h2v1H4zM1 4h4v1H1zM2 5h2v1H2z'/%3E%3C/svg%3E") center / 12px no-repeat;
  box-shadow: none;
}

.wpc-check input:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--shop-ring);
}

.wpc-check a {
  color: var(--ink);
  text-underline-offset: 3px;
}

/* primary WooCommerce button */
.woocommerce .button.alt,
.woocommerce button.button.alt,
#place_order {
  --shadow: #2a2618;
  display: inline-flex;
  width: 100%;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 0;
  border-radius: 12px;
  background: var(--ink);
  box-shadow: 0 4px 0 0 #000;
  color: #fff;
  font: 700 16px/1.2 var(--sans);
  cursor: pointer;
  transition:
    transform 120ms steps(2),
    box-shadow 120ms steps(2),
    background-color 150ms ease;
}

.woocommerce .button.alt:hover,
#place_order:hover {
  background: #22302a;
  transform: translateY(-2px);
  box-shadow: 0 6px 0 0 #000;
}

.woocommerce .button.alt:active,
#place_order:active {
  transform: translateY(4px);
  box-shadow: 0 0 0 0 #000;
}

#place_order .amount {
  color: var(--amber);
}

#place_order.is-processing {
  pointer-events: none;
  opacity: 0.85;
}

.wpc-spinner {
  display: none;
  width: 8px;
  height: 8px;
  background: var(--amber);
  box-shadow: 12px 0 0 0 var(--amber), 24px 0 0 0 var(--amber);
  animation: wpc-dots 900ms steps(1) infinite;
}

#place_order.is-processing .wpc-spinner {
  display: inline-block;
  margin-right: 24px;
}

@keyframes wpc-dots {
  0% { box-shadow: 12px 0 0 0 rgba(244, 189, 98, 0.25), 24px 0 0 0 rgba(244, 189, 98, 0.25); }
  33% { box-shadow: 12px 0 0 0 var(--amber), 24px 0 0 0 rgba(244, 189, 98, 0.25); }
  66% { box-shadow: 12px 0 0 0 var(--amber), 24px 0 0 0 var(--amber); }
}

/* status pills (subscriptions, orders) */
.wpc-status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 9px;
  border-radius: 6px;
  background: var(--ok-bg);
  color: var(--ok);
  font-family: var(--pixel);
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
}

.wpc-status::before {
  width: 6px;
  height: 6px;
  background: currentColor;
  content: "";
}

.wpc-status--pending {
  background: var(--warn-bg);
  color: var(--warn);
}

.wpc-status--neutral {
  background: #ecece2;
  color: var(--shop-muted);
}

/* template preview marker — never ship this */
.preview-badge {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 60;
  padding: 7px 10px;
  border-radius: 8px;
  background: rgba(8, 16, 15, 0.86);
  box-shadow: inset 0 0 0 1px var(--line-strong);
  color: var(--amber);
  font-family: var(--pixel);
  font-size: 12.5px;
  pointer-events: none;
}

/* =========================================================
   Checkout (Stripe-style split)
   ========================================================= */

.page-checkout {
  background: var(--shop-bg);
  color: var(--ink);
}

.checkout-shell {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
}

.checkout-shell::before {
  /* the dark "brand" half behind the order summary */
  position: absolute;
  inset: 0 50% 0 0;
  background: var(--night);
  content: "";
}

.checkout-scene {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 50%;
  height: 300px;
}

.checkout-scene::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, var(--night) 0%, rgba(10, 21, 20, 0.2) 45%, transparent 100%);
  content: "";
}

.checkout-scene canvas {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
}

.woocommerce-checkout .checkout.woocommerce-checkout {
  position: relative;
  display: grid;
  width: min(1120px, calc(100% - 48px));
  margin-inline: auto;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: clamp(48px, 8vw, 112px);
}

/* left: order summary */
.wpc-summary {
  position: sticky;
  top: 0;
  align-self: start;
  padding: 36px 0 340px;
  color: var(--text);
}

.wpc-checkout-brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 48px;
}

.wpc-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 14px;
  text-decoration: none;
}

.wpc-back svg {
  width: 12px;
  height: 12px;
  fill: currentColor;
  transform: scaleX(-1);
}

.wpc-back:hover {
  color: var(--amber-hi);
}

.wpc-summary-head {
  display: grid;
  align-items: end;
  grid-template-columns: 1fr auto;
  gap: 12px;
}

.wpc-summary-kicker {
  color: var(--muted);
  font-size: 15px;
}

.wpc-summary-price {
  margin-top: 6px;
  font-family: var(--display);
  font-size: clamp(40px, 4.4vw, 52px);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1;
}

.wpc-summary-price small {
  display: inline-block;
  margin-left: 6px;
  color: var(--muted);
  font-family: var(--sans);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.3;
}

.wpc-summary-note {
  margin-top: 10px;
  color: var(--muted);
  font-size: 14px;
}

.wpc-summary .comfy {
  --p: 1;
  margin-bottom: -6px;
}

/* plan + billing switchers */
.wpc-switch-label {
  display: block;
  margin: 32px 0 10px;
  color: var(--amber);
  font-family: var(--pixel);
  font-size: 13.5px;
}

.wpc-plan-switch {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin: 0;
  padding: 4px;
  border: 0;
  border-radius: 12px;
  background: rgba(238, 241, 230, 0.06);
  box-shadow: inset 0 0 0 1px var(--line);
}

.wpc-plan-switch label,
.wpc-billing-switch label {
  position: relative;
  cursor: pointer;
}

.wpc-plan-switch input,
.wpc-billing-switch input {
  position: absolute;
  opacity: 0;
}

.wpc-plan-switch span {
  display: grid;
  gap: 2px;
  padding: 9px 6px;
  border-radius: 8px;
  color: #cfd7c9;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  transition: background-color 120ms ease;
}

.wpc-plan-switch small {
  color: var(--faint);
  font-family: var(--pixel);
  font-size: 12px;
  font-weight: 500;
}

.wpc-plan-switch span:hover {
  background: rgba(238, 241, 230, 0.07);
}

.wpc-plan-switch input:checked + span {
  background: var(--amber);
  box-shadow: 0 3px 0 0 var(--amber-deep);
  color: #1d1506;
}

.wpc-plan-switch input:checked + span small {
  color: #6b4a12;
}

.wpc-plan-switch input:focus-visible + span,
.wpc-billing-switch input:focus-visible + span {
  outline: 3px solid var(--amber);
  outline-offset: 2px;
}

.wpc-billing-switch {
  display: inline-flex;
  gap: 4px;
  margin: 12px 0 0;
  padding: 4px;
  border: 0;
  border-radius: 10px;
  background: rgba(238, 241, 230, 0.06);
  box-shadow: inset 0 0 0 1px var(--line);
}

.wpc-billing-switch span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border-radius: 7px;
  color: #cfd7c9;
  font-size: 13.5px;
  font-weight: 600;
}

.wpc-billing-switch em {
  padding: 3px 6px;
  border-radius: 4px;
  background: rgba(127, 169, 99, 0.2);
  color: #b9d49c;
  font-family: var(--pixel);
  font-size: 11.5px;
  font-style: normal;
}

.wpc-billing-switch input:checked + span {
  background: rgba(238, 241, 230, 0.14);
  color: #fff;
}

/* order review table */
.wpc-summary .woocommerce-checkout-review-order-table {
  width: 100%;
  margin-top: 30px;
  border-collapse: collapse;
  font-size: 14.5px;
}

.wpc-summary .woocommerce-checkout-review-order-table thead {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.wpc-summary .woocommerce-checkout-review-order-table th,
.wpc-summary .woocommerce-checkout-review-order-table td {
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
  font-weight: 500;
  text-align: left;
  vertical-align: top;
}

.wpc-summary .woocommerce-checkout-review-order-table td:last-child,
.wpc-summary .woocommerce-checkout-review-order-table tfoot td {
  text-align: right;
  white-space: nowrap;
}

.wpc-summary .cart_item .product-name strong {
  display: block;
  color: var(--text);
  font-weight: 600;
}

.wpc-summary .cart_item .product-name span,
.wpc-summary .subscription-details,
.wpc-summary .wpc-muted {
  color: var(--muted);
  font-size: 13.5px;
}

.wpc-summary .cart_item .product-name .product-quantity {
  display: none;
}

.wpc-summary .wpc-line-note td {
  color: var(--muted);
}

.wpc-summary tfoot th {
  color: var(--muted);
}

.wpc-summary .order-total th,
.wpc-summary .order-total td {
  border-bottom: 0;
  color: var(--text);
  font-size: 17px;
  font-weight: 700;
}

.wpc-summary .recurring-totals th,
.wpc-summary .recurring-total th,
.wpc-summary .recurring-total td {
  border-bottom: 0;
  padding-top: 0;
  color: var(--muted);
  font-size: 13.5px;
  font-weight: 500;
}

.wpc-coupon-toggle {
  display: inline-block;
  margin-top: 6px;
  color: var(--amber-hi);
  font-size: 13.5px;
  font-weight: 600;
  text-decoration: none;
}

.wpc-summary-points {
  display: grid;
  gap: 10px;
  margin-top: 30px;
  padding: 0;
  list-style: none;
  color: #cfd7c9;
  font-size: 14px;
}

.wpc-summary-points li {
  display: flex;
  gap: 10px;
}

.wpc-summary-points svg {
  width: 14px;
  height: 14px;
  flex: none;
  margin-top: 4px;
  fill: var(--leaf);
}

/* right: customer details + payment */
.wpc-details {
  padding: 36px 0 64px;
}

.wpc-details-top {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-height: 36px;
  margin-bottom: 44px;
  color: var(--shop-muted);
  font-size: 13.5px;
}

.wpc-details-top svg {
  width: 14px;
  height: 14px;
  fill: var(--ok);
}

.wpc-details h3,
#order_review_heading {
  margin: 0 0 14px;
  font-family: var(--display);
  font-size: 20px;
  letter-spacing: -0.02em;
}

.woocommerce-checkout .wpc-details .col2-set,
.woocommerce-checkout .wpc-details .col2-set .col-1 {
  float: none;
  width: 100%;
}

.page-checkout .woocommerce-info {
  border: 1px solid #ead7a5;
  border-radius: 10px;
  background: #fff7e4;
  box-shadow: none;
  color: #6c501b;
}

.page-checkout .woocommerce-info::before {
  color: var(--amber-deep);
}

.wpc-section + .wpc-section {
  margin-top: 30px;
}

.wpc-section-sub {
  margin: -8px 0 14px;
  color: var(--shop-muted);
  font-size: 14px;
}

.wpc-row-pair > .form-row {
  float: none;
  width: auto;
  margin: 0 0 14px;
}

.wpc-billing-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 12px;
}

.wpc-billing-grid > .form-row {
  float: none;
  width: auto;
  margin: 0 0 14px;
}

.wpc-billing-grid > .form-row.form-row-wide {
  grid-column: 1 / -1;
}

.wpc-site-grid #wpcomfy_hosting_quote_field input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--violet);
}

.wpc-login-hint {
  margin: 0 0 20px;
  padding: 12px 14px;
  border-radius: var(--shop-radius);
  background: #f0efe4;
  color: var(--shop-muted);
  font-size: 14px;
}

.wpc-login-hint a {
  color: var(--ink);
  font-weight: 600;
  text-underline-offset: 3px;
}

.wpc-notice-inline {
  display: flex;
  gap: 10px;
  margin: 4px 0 14px;
  padding: 12px 14px;
  border-radius: var(--shop-radius);
  background: #eeeaf9;
  color: #3e3470;
  font-size: 13.5px;
  line-height: 1.5;
}

.wpc-notice-inline svg {
  width: 14px;
  height: 14px;
  flex: none;
  margin-top: 3px;
  fill: currentColor;
}

.wpc-notice-inline[hidden] {
  display: none;
}

/* grouped inputs, the Stripe way */
.wpc-group {
  overflow: hidden;
  border: 1px solid var(--shop-border-strong);
  border-radius: var(--shop-radius);
  background: var(--shop-surface);
  box-shadow: 0 1px 1px rgba(22, 32, 28, 0.04);
}

.wpc-group .input-text,
.wpc-group select {
  min-height: 44px;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.wpc-group > * + *,
.wpc-group .wpc-group-row + .wpc-group-row {
  border-top: 1px solid var(--shop-border);
}

.wpc-group-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.wpc-group-row > * + * {
  border-left: 1px solid var(--shop-border);
}

.wpc-group:focus-within {
  border-color: var(--ink);
  box-shadow: 0 0 0 3px var(--shop-ring);
}

.wpc-group-label {
  display: block;
  margin: 0 0 6px;
}

/* payment (#payment) */
#payment {
  margin-top: 30px;
}

#payment .wc_payment_methods {
  display: grid;
  gap: 8px;
  margin: 0 0 18px;
  padding: 0;
  list-style: none;
}

#payment .wc_payment_method {
  border: 1px solid var(--shop-border-strong);
  border-radius: var(--shop-radius);
  background: var(--shop-surface);
}

#payment .wc_payment_method:has(.input-radio:checked) {
  border-color: var(--ink);
  box-shadow: 0 0 0 1px var(--ink);
}

#payment .wc_payment_method > label {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}

#payment .wc_payment_method > .input-radio {
  position: absolute;
  opacity: 0;
}

.wpc-radio-dot {
  width: 18px;
  height: 18px;
  flex: none;
  border-radius: 50%;
  box-shadow: inset 0 0 0 2px var(--shop-border-strong);
}

#payment .input-radio:checked + label .wpc-radio-dot {
  box-shadow: inset 0 0 0 5px var(--ink);
}

#payment .input-radio:focus-visible + label {
  outline: 3px solid var(--amber-deep);
  outline-offset: -3px;
  border-radius: var(--shop-radius);
}

.wpc-card-brands {
  display: flex;
  gap: 5px;
  margin-left: auto;
}

.wpc-card-brands i {
  display: grid;
  height: 20px;
  padding: 0 6px;
  place-items: center;
  border-radius: 4px;
  background: #f0efe4;
  color: var(--shop-muted);
  font-family: var(--pixel);
  font-size: 11px;
  font-style: normal;
}

#payment .payment_box {
  padding: 0 16px 16px;
}

#payment .wc_payment_method:not(:has(.input-radio:checked)) .payment_box {
  display: none;
}

/* Mock of the Stripe Payment Element. The real element renders in an iframe
   and is themed via Stripe's Appearance API (see docs). */
.wpc-stripe-mock .wpc-fake-input {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  padding: 0 13px;
  color: #9aa296;
  font-size: 15px;
}

.wpc-stripe-mock .wpc-fake-input i {
  display: flex;
  gap: 4px;
  font-style: normal;
}

.wpc-stripe-note {
  margin-top: 8px;
  color: var(--shop-muted);
  font-size: 12.5px;
}

.place-order {
  display: grid;
  gap: 16px;
  margin: 0;
}

.woocommerce-terms-and-conditions-wrapper {
  display: grid;
  gap: 10px;
}

.woocommerce-privacy-policy-text p {
  color: var(--shop-muted);
  font-size: 13px;
  line-height: 1.5;
}

.woocommerce-privacy-policy-text a {
  color: var(--ink);
}

.wpc-after-pay {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 6px 14px;
  color: var(--shop-muted);
  font-size: 12.5px;
  text-align: center;
}

.wpc-after-pay span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.wpc-after-pay svg {
  width: 12px;
  height: 12px;
  fill: currentColor;
}

.wpc-checkout-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 40px;
  padding-top: 18px;
  border-top: 1px solid var(--shop-border);
  color: var(--shop-muted);
  font-size: 13px;
}

.wpc-checkout-footer a {
  color: var(--shop-muted);
  text-underline-offset: 3px;
}

/* =========================================================
   Order received (thank you)
   ========================================================= */

.page-order-received {
  background: var(--night);
}

.wpc-thanks-hero {
  position: relative;
  overflow: hidden;
  padding: calc(var(--header-h) + 56px) 0 0;
  background: var(--night-0);
  isolation: isolate;
}

.wpc-thanks-hero .hero-shade {
  background: linear-gradient(180deg, rgba(6, 12, 11, 0.55) 0%, rgba(6, 12, 11, 0.2) 40%, rgba(10, 21, 20, 1) 100%);
}

.wpc-thanks-head {
  display: grid;
  justify-items: center;
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}

.wpc-thanks-head .pose {
  --p: 2;
  margin-bottom: 8px;
}

.woocommerce-thankyou-order-received {
  margin: 0 0 14px;
  font-family: var(--display);
  font-size: clamp(38px, 5vw, 62px);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1;
}

.wpc-thanks-head > p:not(.woocommerce-thankyou-order-received) {
  max-width: 36em;
  color: #cbd4c5;
  font-size: 17.5px;
}

.woocommerce-order-overview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 44px 0 0;
  padding: 0;
  overflow: hidden;
  border-radius: 18px 18px 0 0;
  background: var(--paper);
  list-style: none;
  color: var(--shop-muted);
  font-size: 13px;
}

.woocommerce-order-overview li {
  padding: 22px 24px;
}

.woocommerce-order-overview li + li {
  border-left: 1px dashed rgba(22, 32, 28, 0.16);
}

.woocommerce-order-overview strong {
  display: block;
  margin-top: 4px;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: 16px;
}

.wpc-thanks-body {
  padding: 0 0 110px;
}

.wpc-receipt {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 0;
  overflow: hidden;
  border-radius: 0 0 18px 18px;
  background: var(--paper);
  box-shadow: 12px 12px 0 0 rgba(0, 0, 0, 0.28);
  color: var(--ink);
}

.wpc-receipt > section {
  padding: 30px;
}

.wpc-receipt > section + section {
  border-left: 1px dashed rgba(22, 32, 28, 0.16);
  background: #f5f3e6;
}

.wpc-receipt::before {
  /* perforation between overview and details */
  grid-column: 1 / -1;
  height: 12px;
  background: radial-gradient(circle at 6px 6px, var(--night) 4px, transparent 4.5px) 0 0 / 18px 12px repeat-x;
  content: "";
}

.wpc-receipt h2 {
  margin-bottom: 18px;
  font-family: var(--display);
  font-size: 22px;
  letter-spacing: -0.02em;
}

.woocommerce-table--order-details,
.shop_table.subscription_details,
.woocommerce-orders-table,
.wpc-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14.5px;
}

.woocommerce-table--order-details th,
.woocommerce-table--order-details td,
.shop_table.subscription_details td,
.woocommerce-orders-table th,
.woocommerce-orders-table td,
.wpc-table th,
.wpc-table td {
  padding: 12px 0;
  border-bottom: 1px solid var(--line-paper);
  font-weight: 500;
  text-align: left;
  vertical-align: top;
}

.woocommerce-table--order-details td:last-child,
.woocommerce-table--order-details thead th:last-child,
.woocommerce-table--order-details tfoot td,
.shop_table.subscription_details td:last-child {
  text-align: right;
}

.woocommerce-table--order-details thead th,
.woocommerce-orders-table thead th {
  color: var(--shop-muted);
  font-family: var(--pixel);
  font-size: 13px;
  font-weight: 500;
}

.woocommerce-table--order-details tfoot th {
  color: var(--shop-muted);
}

.woocommerce-table--order-details tfoot tr:last-child th,
.woocommerce-table--order-details tfoot tr:last-child td {
  border-bottom: 0;
  color: var(--ink);
  font-size: 16px;
  font-weight: 700;
}

.wpc-next {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.wpc-next li {
  position: relative;
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 14px;
  padding-bottom: 22px;
}

.wpc-next li:not(:last-child)::after {
  position: absolute;
  top: 42px;
  bottom: 4px;
  left: 17px;
  width: 4px;
  background: repeating-linear-gradient(180deg, rgba(22, 32, 28, 0.2) 0 4px, transparent 4px 10px);
  content: "";
}

.wpc-next b {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 8px;
  background: #fff;
  box-shadow: inset 0 0 0 2px rgba(22, 32, 28, 0.2);
  font-family: var(--pixel);
  font-size: 14px;
}

.wpc-next li.is-current b {
  background: var(--ink);
  box-shadow: 0 3px 0 0 var(--amber-deep);
  color: var(--amber);
}

.wpc-next strong {
  display: block;
  margin-top: 2px;
  font-size: 16px;
}

.wpc-next p {
  color: var(--shop-muted);
  font-size: 14px;
}

.wpc-next .button {
  margin-top: 12px;
}

.wpc-thanks-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 34px;
  color: var(--muted);
  font-size: 14.5px;
}

.wpc-thanks-foot a:not(.button) {
  color: var(--amber-hi);
  text-underline-offset: 3px;
}

/* =========================================================
   Login (my-account, logged out)
   ========================================================= */

.page-login {
  background: var(--shop-bg);
}

.wpc-auth {
  display: grid;
  min-height: 100vh;
  min-height: 100svh;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.wpc-auth-art {
  position: relative;
  display: grid;
  overflow: hidden;
  padding: 36px clamp(28px, 5vw, 64px);
  background: var(--night-0);
  isolation: isolate;
  grid-template-rows: auto 1fr auto;
}

.wpc-auth-art .hero-shade {
  background: linear-gradient(180deg, rgba(6, 12, 11, 0.6) 0%, rgba(6, 12, 11, 0.15) 45%, rgba(6, 12, 11, 0.55) 100%);
}

.wpc-auth-art .comfy {
  --p: 3;
  align-self: center;
  justify-self: center;
  animation: hover-bob 1.8s steps(4, jump-none) infinite alternate;
}

.wpc-auth-quote {
  max-width: 26em;
  color: #cbd4c5;
  font-size: 15px;
}

.wpc-auth-quote strong {
  display: block;
  margin-bottom: 4px;
  color: var(--text);
  font-family: var(--display);
  font-size: 22px;
  letter-spacing: -0.02em;
}

.wpc-auth-main {
  display: grid;
  place-items: center;
  padding: 48px 24px;
}

.wpc-auth-card {
  width: min(420px, 100%);
}

.wpc-auth-card h1 {
  margin-bottom: 8px;
  color: var(--ink);
  font-size: clamp(32px, 3.4vw, 42px);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.05;
}

.wpc-auth-main {
  color: var(--ink);
}

.wpc-auth-card h1 + p {
  margin-bottom: 28px;
  color: var(--shop-muted);
}

.woocommerce-form-login .form-row:has(.woocommerce-form-login__rememberme) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.wpc-auth-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 4px 0 20px;
}

.lost_password a,
.wpc-auth-row a,
.wpc-auth-alt a {
  color: var(--ink);
  font-size: 14px;
  font-weight: 600;
  text-underline-offset: 3px;
}

.wpc-password {
  position: relative;
}

.wpc-password .input-text {
  padding-right: 64px;
}

.wpc-show-pass {
  position: absolute;
  top: 50%;
  right: 8px;
  padding: 6px 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--shop-muted);
  font: 600 12.5px/1 var(--pixel);
  cursor: pointer;
  transform: translateY(-50%);
}

.wpc-show-pass:hover {
  background: #f0efe4;
  color: var(--ink);
}

.wpc-auth-alt {
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid var(--shop-border);
  color: var(--shop-muted);
  font-size: 14px;
}

.wpc-auth-panel[hidden] {
  display: none;
}

.woocommerce-message,
.woocommerce-info {
  margin: 0 0 20px;
  padding: 12px 14px;
  border-radius: var(--shop-radius);
  background: var(--ok-bg);
  color: var(--ok);
  font-size: 14px;
  list-style: none;
}

.woocommerce-info {
  background: #f0efe4;
  color: var(--shop-muted);
}

/* =========================================================
   My Account (logged in)
   ========================================================= */

.page-account {
  background: var(--shop-bg);
  color: var(--ink);
}

.page-account .site-header {
  background: rgba(8, 16, 15, 0.94);
  border-bottom-color: var(--line);
}

.wpc-account-hero {
  position: relative;
  overflow: hidden;
  padding: calc(var(--header-h) + 36px) 0 96px;
  background: var(--night-0);
  color: var(--text);
  isolation: isolate;
}

.wpc-account-hero .hero-shade {
  background: linear-gradient(90deg, rgba(6, 12, 11, 0.85) 0%, rgba(6, 12, 11, 0.45) 55%, rgba(6, 12, 11, 0.1) 100%);
}

.wpc-account-hero h1 {
  margin-bottom: 6px;
  font-size: clamp(32px, 3.6vw, 46px);
  font-weight: 800;
  letter-spacing: -0.035em;
}

.wpc-account-hero p {
  color: var(--muted);
}

.wpc-account {
  display: grid;
  align-items: start;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 28px;
  margin-top: -56px;
  padding-bottom: 96px;
}

.wpc-account > * {
  min-width: 0;
}

.woocommerce-MyAccount-navigation {
  position: sticky;
  top: calc(var(--header-h) + 20px);
  padding: 10px;
  border: 1px solid var(--shop-border);
  border-radius: 16px;
  background: var(--shop-surface);
  box-shadow: 0 10px 30px rgba(10, 21, 20, 0.08);
}

.woocommerce-MyAccount-navigation ul {
  display: grid;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.woocommerce-MyAccount-navigation a {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 12px;
  border-radius: 9px;
  color: #3b4840;
  font-size: 14.5px;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 120ms ease;
}

.woocommerce-MyAccount-navigation a svg {
  width: 16px;
  height: 16px;
  flex: none;
  fill: #8a948b;
}

.woocommerce-MyAccount-navigation a:hover {
  background: #f3f2e8;
}

.woocommerce-MyAccount-navigation .is-active a {
  background: var(--ink);
  color: #fff;
}

.woocommerce-MyAccount-navigation .is-active a svg {
  fill: var(--amber);
}

.woocommerce-MyAccount-navigation-link--customer-logout {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--shop-border);
}

.wpc-nav-badge {
  margin-left: auto;
  padding: 2px 6px;
  border-radius: 4px;
  background: var(--warn-bg);
  color: var(--warn);
  font-family: var(--pixel);
  font-size: 11.5px;
}

.wpc-nav-comfy {
  display: grid;
  justify-items: center;
  margin-top: 10px;
  padding: 14px 10px 12px;
  border-radius: 12px;
  background:
    radial-gradient(circle at 50% 40%, rgba(244, 189, 98, 0.16), transparent 65%),
    var(--night);
  color: var(--muted);
  font-family: var(--pixel);
  font-size: 12.5px;
  text-align: center;
}

.wpc-nav-comfy .comfy {
  --p: 1;
}

.woocommerce-MyAccount-content {
  min-width: 0;
}

.wpc-panel[hidden] {
  display: none;
}

.wpc-panel-title {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0 18px;
}

.wpc-panel-title h2 {
  font-family: var(--display);
  font-size: 26px;
  letter-spacing: -0.025em;
}

.wpc-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.wpc-card {
  padding: 22px;
  border: 1px solid var(--shop-border);
  border-radius: 16px;
  background: var(--shop-surface);
  box-shadow: 0 10px 30px rgba(10, 21, 20, 0.06);
}

.wpc-card--wide {
  grid-column: 1 / -1;
}

.wpc-card--dark {
  border-color: #28372f;
  background:
    radial-gradient(ellipse at 100% 0%, rgba(244, 189, 98, 0.16), transparent 55%),
    var(--night-1);
  color: var(--text);
}

.wpc-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.wpc-card-kicker {
  color: var(--shop-muted);
  font-family: var(--pixel);
  font-size: 13.5px;
}

.wpc-card--dark .wpc-card-kicker {
  color: var(--amber);
}

.wpc-plan-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 12px;
}

.wpc-plan-line strong {
  font-family: var(--display);
  font-size: 34px;
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.05;
}

.wpc-plan-line span {
  color: var(--muted);
}

.wpc-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 20px 0 0;
  padding: 16px 0 0;
  border-top: 1px solid var(--line);
}

.wpc-meta dt {
  color: var(--muted);
  font-size: 12.5px;
}

.wpc-meta dd {
  margin: 2px 0 0;
  font-weight: 600;
}

.wpc-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.wpc-link-btn {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
  border: 0;
  border-radius: 9px;
  background: #f0efe4;
  color: var(--ink);
  font: 600 14px/1 var(--sans);
  text-decoration: none;
  cursor: pointer;
}

.wpc-link-btn:hover {
  background: #e6e5d6;
}

.wpc-card--dark .wpc-link-btn {
  background: rgba(238, 241, 230, 0.08);
  color: var(--text);
}

.wpc-card--dark .wpc-link-btn:hover {
  background: rgba(238, 241, 230, 0.14);
}

/* segmented pixel meter */
.wpc-meter {
  display: grid;
  grid-auto-flow: column;
  gap: 3px;
  height: 14px;
  margin: 12px 0 8px;
}

.wpc-meter i {
  background: #e7e6da;
}

.wpc-meter i.on {
  background: var(--amber);
  box-shadow: 0 0 8px rgba(244, 189, 98, 0.4);
}

.wpc-meter-legend {
  display: flex;
  justify-content: space-between;
  color: var(--shop-muted);
  font-size: 13px;
}

.wpc-big-number {
  font-family: var(--display);
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -0.03em;
}

.wpc-big-number small {
  color: var(--shop-muted);
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
}

.wpc-steps {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 14.5px;
}

.wpc-steps li {
  display: flex;
  align-items: center;
  gap: 10px;
}

.wpc-steps b {
  display: grid;
  width: 22px;
  height: 22px;
  flex: none;
  place-items: center;
  border-radius: 5px;
  background: #ecece2;
  color: var(--shop-muted);
  font-family: var(--pixel);
  font-size: 11px;
}

.wpc-steps .done b {
  background: var(--ok-bg);
  color: var(--ok);
}

.wpc-steps .done span {
  color: var(--shop-muted);
  text-decoration: line-through;
  text-decoration-color: rgba(22, 32, 28, 0.3);
}

.wpc-steps .current b {
  background: var(--ink);
  color: var(--amber);
}

.wpc-steps .current span {
  font-weight: 700;
}

.woocommerce-orders-table td,
.woocommerce-orders-table th {
  padding-right: 12px;
}

.woocommerce-orders-table .woocommerce-orders-table__cell-order-actions {
  padding-right: 0;
  text-align: right;
}

.woocommerce-orders-table a:not(.wpc-link-btn) {
  color: var(--ink);
  font-weight: 700;
  text-underline-offset: 3px;
}

.wpc-empty {
  display: flex;
  align-items: center;
  gap: 14px;
  color: var(--shop-muted);
  font-size: 14.5px;
}

.wpc-report-list {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
}

.wpc-report-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line-paper);
  font-size: 14.5px;
}

.wpc-report-list li:last-child {
  border-bottom: 0;
}

.wpc-form-card {
  max-width: 760px;
}

.wpc-form-card .form-row + h3 {
  margin-top: 26px;
}

.wpc-form-card h3 {
  margin-bottom: 14px;
  font-size: 18px;
}

.wpc-form-card .button.alt {
  width: auto;
  padding: 0 24px;
}

.wpc-inline-note {
  display: flex;
  gap: 10px;
  margin: 6px 0 18px;
  padding: 12px 14px;
  border-radius: var(--shop-radius);
  background: var(--warn-bg);
  color: var(--warn);
  font-size: 13.5px;
  line-height: 1.5;
}

.wpc-inline-note svg {
  width: 14px;
  height: 14px;
  flex: none;
  margin-top: 3px;
  fill: currentColor;
}

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 960px) {
  .checkout-shell::before,
  .checkout-scene {
    display: none;
  }

  .woocommerce-checkout .checkout.woocommerce-checkout {
    width: 100%;
    grid-template-columns: 1fr;
  }

  .wpc-summary {
    position: relative;
    padding: 24px 24px 32px;
    background: var(--night);
  }

  .wpc-checkout-brand {
    margin-bottom: 28px;
  }

  .wpc-details {
    width: min(560px, calc(100% - 40px));
    margin-inline: auto;
    padding-top: 28px;
  }

  .wpc-details-top {
    justify-content: flex-start;
    margin-bottom: 20px;
  }

  .wpc-auth {
    grid-template-columns: 1fr;
  }

  .wpc-auth-art {
    min-height: 360px;
  }

  .wpc-auth-art .comfy {
    --p: 2;
  }

  .wpc-receipt {
    grid-template-columns: 1fr;
  }

  .wpc-receipt > section + section {
    border-top: 1px dashed rgba(22, 32, 28, 0.16);
    border-left: 0;
  }

  .woocommerce-order-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .woocommerce-order-overview li:nth-child(3) {
    border-left: 0;
  }

  .woocommerce-order-overview li:nth-child(n + 3) {
    border-top: 1px dashed rgba(22, 32, 28, 0.16);
  }

  .wpc-account {
    grid-template-columns: minmax(0, 1fr);
  }

  .woocommerce-MyAccount-navigation {
    position: static;
  }

  .woocommerce-MyAccount-navigation ul {
    display: flex;
    overflow-x: auto;
    gap: 4px;
    scrollbar-width: none;
  }

  .woocommerce-MyAccount-navigation li {
    flex: none;
  }

  .woocommerce-MyAccount-navigation-link--customer-logout {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }

  .wpc-nav-comfy {
    display: none;
  }
}

@media (max-width: 540px) {
  .wpc-row-pair,
  .wpc-billing-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .wpc-billing-grid > .form-row.form-row-wide {
    grid-column: auto;
  }
}

@media (max-width: 640px) {
  .wpc-plan-switch {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wpc-row-pair,
  .wpc-cards,
  .wpc-meta {
    grid-template-columns: 1fr;
  }

  .wpc-card--wide {
    grid-column: auto;
  }

  .woocommerce-orders-table thead {
    display: none;
  }

  .woocommerce-orders-table tr {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 10px 0;
    border-bottom: 1px solid var(--line-paper);
  }

  .woocommerce-orders-table td {
    padding: 4px 0;
    border: 0;
  }

  .woocommerce-order-overview {
    grid-template-columns: 1fr;
  }

  .woocommerce-order-overview li + li {
    border-top: 1px dashed rgba(22, 32, 28, 0.16);
    border-left: 0;
  }
}

/* ---------- WooCommerce Checkout block ---------- */

.page-checkout {
  background: var(--shop-bg);
  color: var(--ink);
}

.page-checkout #main {
  background: var(--shop-bg);
}

.page-checkout .wp-block-woocommerce-checkout {
  width: min(1120px, calc(100% - 48px));
  max-width: none;
  margin: 0 auto;
  padding: clamp(28px, 5vw, 56px) 0 88px;
}

.page-checkout .wc-block-components-sidebar-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.72fr);
  align-items: start;
  gap: clamp(28px, 6vw, 72px);
}

.page-checkout .wc-block-components-main,
.page-checkout .wc-block-components-sidebar {
  width: auto;
  min-width: 0;
  margin: 0;
}

.page-checkout .wc-block-components-main {
  padding: clamp(24px, 4vw, 42px);
  border: 1px solid var(--shop-border);
  border-radius: 16px;
  background: var(--shop-surface);
  box-shadow: 0 10px 28px rgba(22, 32, 28, 0.06);
  color: var(--ink);
}

.page-checkout .wc-block-components-sidebar {
  position: sticky;
  top: 24px;
  padding: clamp(22px, 3vw, 32px);
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--night);
  color: var(--text);
}

.page-checkout .wc-block-components-title,
.page-checkout .wc-block-components-checkout-step__title,
.page-checkout .wc-block-components-sidebar h2,
.page-checkout .wc-block-components-sidebar h3 {
  color: inherit;
  font-family: var(--display);
  font-weight: 700;
}

.page-checkout .wc-block-components-main .wc-block-components-title,
.page-checkout .wc-block-components-main .wc-block-components-checkout-step__title {
  color: var(--ink);
}

.page-checkout .wc-block-components-main label,
.page-checkout .wc-block-components-main .wc-block-components-checkbox__label,
.page-checkout .wc-block-components-main .wc-block-components-checkout-step__description {
  color: var(--ink-soft);
}

.page-checkout .wc-block-components-text-input input,
.page-checkout .wc-block-components-combobox-control input,
.page-checkout .wc-block-components-select .wc-block-components-select__container,
.page-checkout .wc-block-components-textarea textarea {
  min-height: 46px;
  border: 1px solid var(--shop-border-strong);
  border-radius: var(--shop-radius);
  background: var(--shop-surface);
  color: var(--ink);
  font: 15.5px/1.4 var(--sans);
  box-shadow: 0 1px 1px rgba(22, 32, 28, 0.04);
}

.page-checkout .wc-block-components-text-input input::placeholder,
.page-checkout .wc-block-components-combobox-control input::placeholder,
.page-checkout .wc-block-components-textarea textarea::placeholder {
  color: #7c877d;
  opacity: 1;
}

.page-checkout .wc-block-components-text-input input:focus,
.page-checkout .wc-block-components-combobox-control input:focus,
.page-checkout .wc-block-components-select .wc-block-components-select__container:focus-within,
.page-checkout .wc-block-components-textarea textarea:focus {
  border-color: var(--ink);
  outline: 0;
  box-shadow: 0 0 0 3px var(--shop-ring);
}

.page-checkout .wc-block-components-button:not(.is-link) {
  min-height: 54px;
  border: 0;
  border-radius: 12px;
  background: var(--ink);
  box-shadow: 0 4px 0 #000;
  color: #fff;
  font: 700 16px/1.2 var(--sans);
}

.page-checkout .wc-block-components-button:not(.is-link):hover {
  background: #22302a;
}

.page-checkout .wc-block-components-sidebar,
.page-checkout .wc-block-components-sidebar :is(p, span, strong, small, a, th, td, h2, h3, button) {
  color: var(--text);
}

.page-checkout .wc-block-components-sidebar a {
  text-decoration-color: var(--muted);
  text-underline-offset: 3px;
}

.page-checkout .wc-block-components-sidebar :is(hr, .wc-block-components-totals-wrapper) {
  border-color: var(--line);
}

.page-checkout .wc-block-components-notice-banner {
  border-radius: 10px;
}

/* ---------- WooCommerce account screens ---------- */

.page-login {
  background: var(--shop-bg);
  color: var(--ink);
}

.page-login .site-header {
  border-bottom-color: var(--line);
  background: rgba(8, 16, 15, 0.94);
  color: var(--text);
}

.page-login #main .prose > .woocommerce {
  width: min(720px, calc(100% - 40px));
  margin: 0 auto;
  padding: 40px 0 96px;
  color: var(--ink);
}

.page-login .woocommerce h2,
.page-login .woocommerce h3,
.page-account .woocommerce h2,
.page-account .woocommerce h3 {
  color: var(--ink);
  font-family: var(--display);
}

.page-login .woocommerce .u-columns.col2-set {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
}

.page-login .woocommerce .u-column1,
.page-login .woocommerce .u-column2 {
  float: none;
  width: 100%;
  padding: clamp(22px, 4vw, 34px);
  border: 1px solid var(--shop-border);
  border-radius: 16px;
  background: var(--shop-surface);
  box-shadow: 0 10px 28px rgba(22, 32, 28, 0.06);
}

.page-login .woocommerce .woocommerce-form-login,
.page-login .woocommerce .woocommerce-form-register,
.page-login .woocommerce .woocommerce-ResetPassword {
  border: 0;
  padding: 0;
}

.page-login .woocommerce .woocommerce-privacy-policy-text,
.page-login .woocommerce .woocommerce-form-login__rememberme {
  color: var(--shop-muted);
  font-size: 14px;
}

.page-login .woocommerce .woocommerce-LostPassword a {
  color: var(--ink);
  text-underline-offset: 3px;
}

.page-account #main .prose > .woocommerce {
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
  padding: 40px 0 96px;
  color: var(--ink);
}

.page-account .woocommerce-MyAccount-content > p:first-child {
  padding: 18px 20px;
  border: 1px solid var(--shop-border);
  border-radius: 12px;
  background: var(--shop-surface);
  color: var(--ink-soft);
}

@media (max-width: 960px) {
  .page-checkout .wp-block-woocommerce-checkout {
    width: min(680px, calc(100% - 32px));
    padding-block: 24px 56px;
  }

  .page-checkout .wc-block-components-sidebar-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
  }

  .page-checkout .wc-block-components-sidebar {
    position: static;
    order: -1;
  }

  .page-account #main .prose > .woocommerce {
    width: min(680px, calc(100% - 32px));
    padding-block: 28px 64px;
  }
}

@media (max-width: 640px) {
  .page-checkout .wp-block-woocommerce-checkout {
    width: calc(100% - 24px);
    padding-block: 16px 40px;
  }

  .page-checkout .wc-block-components-main,
  .page-checkout .wc-block-components-sidebar {
    padding: 20px;
    border-radius: 12px;
  }

  .page-login #main .prose > .woocommerce {
    width: calc(100% - 24px);
    padding-block: 24px 56px;
  }

  .page-account #main .prose > .woocommerce {
    width: calc(100% - 24px);
    padding-block: 24px 56px;
  }
}

/* Account routes use WooCommerce data inside the prepared WPComfy layouts. */
.page-login .site-header,
.page-login .site-footer {
  display: none;
}

.page-login #main {
  min-height: 100vh;
  min-height: 100svh;
  background: var(--shop-bg);
}

.page-login .wpc-auth {
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
}

.page-login .wpc-auth-main > .wpc-auth-card,
.page-login .wpc-auth-card > .woocommerce {
  width: min(420px, 100%);
  margin-inline: auto;
}

.page-login .wpc-auth-card .wpc-auth-panel {
  color: var(--ink);
}

.page-login .wpc-auth-card .wpc-auth-panel h1 {
  margin: 0 0 8px;
  color: var(--ink);
  font-family: var(--display);
  font-size: clamp(32px, 3.4vw, 42px);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.05;
}

.page-login .wpc-auth-card .wpc-auth-panel > p:first-of-type {
  margin: 0 0 28px;
  color: var(--shop-muted);
}

.page-login .wpc-auth-card .woocommerce-form-login,
.page-login .wpc-auth-card .woocommerce-ResetPassword {
  margin: 0;
  padding: 0;
  border: 0;
}

.page-login .wpc-auth-card .form-row {
  float: none;
  width: 100%;
  margin: 0 0 18px;
}

.page-login .wpc-auth-card .form-row label {
  display: block;
  margin-bottom: 7px;
  color: var(--ink);
  font-size: 14px;
  font-weight: 600;
}

.page-login .wpc-auth-card .input-text {
  width: 100%;
}

.page-login .wpc-auth-card .woocommerce-form-login__submit,
.page-login .wpc-auth-card .woocommerce-Button {
  width: 100%;
  margin: 4px 0 0;
}

.page-login .wpc-auth-card .woocommerce-notices-wrapper {
  margin-bottom: 18px;
}

.page-login .wpc-auth-card .wpc-auth-alt {
  margin: 28px 0 0;
  padding-top: 22px;
  border-top: 1px solid var(--shop-border);
  color: var(--shop-muted);
  font-size: 14px;
}

.page-login .wpc-auth-card .wpc-auth-alt a {
  color: var(--ink);
  font-weight: 600;
  text-underline-offset: 3px;
}

.page-login .site-header + #main,
.page-login #main > .wpc-auth {
  margin-top: 0;
}

.page-account .wpc-account-eyebrow {
  margin: 0 0 8px;
  color: var(--amber-hi);
  font-family: var(--pixel);
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.page-account .wpc-account-hero h1 {
  overflow-wrap: anywhere;
}

.page-account #main > .woocommerce {
  width: 100%;
  max-width: none;
  margin: 0;
  padding-bottom: 1px;
}

.page-account .wpc-account {
	position: relative;
	z-index: 2;
	width: min(var(--measure), calc(100% - var(--gutter) * 2));
	margin-inline: auto;
}

.page-account .wpc-account > .woocommerce-MyAccount-navigation,
.page-account .wpc-account > .woocommerce-MyAccount-content {
  float: none;
  width: auto;
}

@media (min-width: 761px) {
  .page-account .wpc-account > .woocommerce-MyAccount-content {
    padding-top: 56px;
  }
}

.page-account .wpc-account .wpc-panel-title > div > p {
  margin: 6px 0 0;
  color: var(--shop-muted);
  font-size: 14px;
}

.page-account .wpc-account .wpc-hint {
  margin-bottom: 0;
  color: var(--shop-muted);
  font-size: 14px;
  line-height: 1.55;
}

.page-account .wpc-account .wpc-card--dark .wpc-hint {
  color: var(--muted);
}

.page-account .wpc-account .wpc-empty-card {
  display: grid;
  justify-items: start;
  gap: 12px;
}

.page-account .wpc-account .wpc-empty-card h3,
.page-account .wpc-account .wpc-empty-card p {
  margin: 0;
}

.page-account .wpc-account .wpc-empty-card p {
  color: var(--shop-muted);
}

.page-account .wpc-account .wpc-site-selector {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 16px;
}

.page-account .wpc-account .wpc-site-selector a {
  padding: 8px 12px;
  border: 1px solid var(--shop-border);
  border-radius: 999px;
  background: var(--shop-surface);
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

.page-account .wpc-account .wpc-site-selector a.is-active,
.page-account .wpc-account .wpc-site-selector a:hover {
  border-color: var(--ink);
  background: var(--ink);
  color: #fff;
}

.page-account .wpc-account .wpc-form-card textarea {
  min-height: 116px;
}

.page-account .wpc-account .wpc-inline-note {
  padding: 12px 14px;
  border: 1px solid #ead7a5;
  border-radius: 10px;
  background: #fff7e4;
  color: #6c501b;
  font-size: 13.5px;
  line-height: 1.5;
}

.page-account .wpc-account .woocommerce-MyAccount-content .woocommerce-message,
.page-account .wpc-account .woocommerce-MyAccount-content .woocommerce-error,
.page-account .wpc-account .woocommerce-MyAccount-content .woocommerce-info {
  margin: 0 0 16px;
}

.post-faq-list {
  margin-top: 12px;
}

.post-faq-list details {
  margin: 0;
}

.post-faq-list .rank-math-answer {
  color: var(--ink-soft);
}

@media (max-width: 960px) {
	.page-account .wpc-account {
		width: min(var(--measure), calc(100% - var(--gutter) * 2));
	}
}

@media (max-width: 760px) {
  .page-account .wpc-account {
    margin-top: 0;
  }

  .page-login .wpc-auth {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-login .wpc-auth-art {
    min-height: 240px;
    padding: 24px;
    grid-template-rows: auto 1fr auto;
  }

  .page-login .wpc-auth-art .comfy {
    --p: 2;
    align-self: end;
    margin: 12px 0 -12px;
    transform: scale(0.78);
    transform-origin: bottom center;
  }

  .page-login .wpc-auth-quote {
    font-size: 13.5px;
  }

  .page-login .wpc-auth-quote strong {
    font-size: 19px;
  }

  .page-login .wpc-auth-main {
    padding: 34px 24px 48px;
  }
}

@media (max-width: 640px) {
	.page-account .wpc-account {
		width: min(var(--measure), calc(100% - var(--gutter) * 2));
	}

  .page-account .wpc-account .wpc-card {
    padding: 18px;
  }

  .page-login .wpc-auth-art {
    min-height: 210px;
  }

  .page-login .wpc-auth-main {
    padding-inline: 18px;
  }
}

/* Keep the classic checkout independent from WooCommerce's block-theme width. */
.page-checkout #main {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

.page-checkout #main > .woocommerce {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

.page-checkout .checkout-shell.woocommerce {
	width: 100%;
	max-width: none;
	margin: 0;
isolation: isolate;
}

.page-checkout .checkout-shell::before {
	z-index: 0;
}

.page-checkout .checkout-shell > .woocommerce-form-coupon-toggle,
.page-checkout .checkout-shell > .checkout.woocommerce-checkout {
	position: relative;
	z-index: 1;
}

.page-checkout .checkout-shell > .woocommerce-form-coupon-toggle {
	width: min(1120px, calc(100% - 48px));
	max-width: none;
	margin: 0 auto 20px;
	padding-top: 16px;
}

.page-checkout .checkout-shell > .woocommerce-form-coupon-toggle .woocommerce-info {
	margin: 0;
}

/* Match the account grid to the hero's .wrap and neutralize prose list spacing. */
.page-account .wpc-account > .woocommerce-MyAccount-navigation ul {
	gap: 3px;
	margin: 0;
	padding: 0;
}

.page-account .wpc-account > .woocommerce-MyAccount-navigation li {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
}

.page-account .wpc-account > .woocommerce-MyAccount-navigation li::before {
	display: none;
}

.page-account .wpc-account > .woocommerce-MyAccount-navigation a {
	min-height: 42px;
	padding-block: 9px;
	line-height: 1.25;
}

@media (min-width: 761px) {
	.page-account .wpc-account > .woocommerce-MyAccount-content {
		padding-top: 72px;
	}
}

@media (max-width: 760px) {
	.page-account .wpc-account > .woocommerce-MyAccount-content {
		padding-top: 20px;
	}
}

/* =========================================================
   Checkout — WordPress/WooCommerce overrides
   WooCommerce's own CSS (`.woocommerce table.shop_table` etc.) is more
   specific than the design rules above; these bring the live checkout
   back in line with the design.
   ========================================================= */

.woocommerce-checkout .wpc-summary .wpc-summary-note {
	margin-top: 10px;
	margin-bottom: 0;
}

.woocommerce-checkout .wpc-summary #order_review {
	margin-top: 26px;
}

.woocommerce-checkout .wpc-summary table.shop_table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	border-radius: 0;
}

.woocommerce-checkout .wpc-summary table.shop_table thead {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

.woocommerce-checkout .wpc-summary table.shop_table th,
.woocommerce-checkout .wpc-summary table.shop_table td {
	padding: 13px 0;
	border: 0;
	border-bottom: 1px solid var(--line);
	background: transparent;
	color: var(--text);
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.45;
	vertical-align: top;
}

.woocommerce-checkout .wpc-summary table.shop_table tfoot th {
	color: var(--muted);
}

.woocommerce-checkout .wpc-summary table.shop_table td:last-child {
	text-align: right;
}

.woocommerce-checkout .wpc-summary .cart_item .product-quantity {
	display: none;
}

.woocommerce-checkout .wpc-summary .order-total th,
.woocommerce-checkout .wpc-summary .order-total td {
	border-bottom: 0;
	color: var(--text);
	font-size: 17px;
	font-weight: 700;
}

.woocommerce-checkout .wpc-summary .recurring-total th,
.woocommerce-checkout .wpc-summary .recurring-total td {
	padding-top: 0;
	border-bottom: 0;
	color: var(--muted);
	font-size: 13.5px;
}

.woocommerce-checkout .wpc-summary .recurring-total p {
	margin: 0;
}

.woocommerce-checkout .wpc-summary .recurring-total br {
	display: none;
}

.woocommerce-checkout .wpc-summary .recurring-total small {
	display: block;
	margin-top: 2px;
	color: var(--faint);
	font-size: 12.5px;
}

/* WooCommerce's loading overlay is white; keep it dark on the summary. */
.woocommerce-checkout .wpc-summary .blockUI.blockOverlay {
	background: rgba(10, 21, 20, 0.65) !important;
}

.wpc-plan-switch.is-busy {
	opacity: 0.6;
	pointer-events: none;
}

.woocommerce-checkout .wpc-plan-switch {
	margin-bottom: 4px;
}

/* Field groups that WooCommerce must not re-sort (contact, website). */
.woocommerce form .wpc-field-group .form-row {
	margin-bottom: 14px;
}

.wpc-field-group > .wpc-hint {
	margin: -8px 0 16px;
}

#wpcomfy_hosting_quote_field .optional {
	display: none;
}

/* WooCommerce floats .form-row-first/.form-row-last at 47%; inside our grid pairs they should fill their cell. */
.woocommerce form .wpc-row-pair .form-row,
.woocommerce form .wpc-row-pair .form-row-first,
.woocommerce form .wpc-row-pair .form-row-last {
	width: auto;
	float: none;
}

/* Align the inputs of a pair even when one label wraps to two lines. */
.woocommerce form .wpc-row-pair {
	align-items: end;
}

/* =========================================================
   Cart (classic shortcode) — rarely used, but on-brand
   ========================================================= */

.page-cart {
	background: var(--night);
}

.page-hero--cart .page-hero-grid {
	min-height: 320px;
}

.section--cart {
	padding-top: 48px;
}

.section--cart .woocommerce {
	display: grid;
	align-items: start;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.9fr);
	gap: 28px;
}

.section--cart .woocommerce-notices-wrapper,
.section--cart .wpc-cart-empty {
	grid-column: 1 / -1;
}

.section--cart .woocommerce-cart-form,
.section--cart .cart_totals {
	padding: 26px;
	border-radius: 20px;
	background: var(--paper);
	box-shadow: 12px 12px 0 0 rgba(0, 0, 0, 0.28);
	color: var(--ink);
}

.section--cart .cart-collaterals {
	width: auto;
}

.section--cart .cart-collaterals .cart_totals {
	float: none;
	width: auto;
}

.section--cart table.shop_table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	border-radius: 0;
	font-size: 15px;
}

.section--cart table.shop_table th,
.section--cart table.shop_table td {
	padding: 14px 0;
	border: 0;
	border-bottom: 1px solid var(--line-paper);
	background: transparent;
	color: var(--ink);
	text-align: left;
	vertical-align: middle;
}

.section--cart table.shop_table thead th {
	color: var(--ink-soft);
	font-family: var(--pixel);
	font-size: 13px;
	font-weight: 500;
}

.section--cart .product-thumbnail,
.section--cart .product-quantity,
.section--cart .product-price {
	display: none;
}

.section--cart td.product-name a {
	color: var(--ink);
	font-family: var(--display);
	font-size: 19px;
	font-weight: 700;
	text-decoration: none;
}

.section--cart .product-subtotal,
.section--cart .cart_totals td {
	text-align: right !important;
	white-space: nowrap;
}

.section--cart a.remove {
	display: grid;
	width: 28px;
	height: 28px;
	place-items: center;
	border-radius: 6px;
	background: #f0efe4;
	color: var(--ink) !important;
	font-size: 18px;
	line-height: 1;
	text-decoration: none;
}

.section--cart a.remove:hover {
	background: #b4442f;
	color: #fff !important;
}

.section--cart td.actions {
	padding-top: 18px;
	border-bottom: 0;
}

.section--cart td.actions button[name="update_cart"] {
	display: none;
}

.section--cart .coupon {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.section--cart .coupon label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

.section--cart .coupon .input-text {
	width: auto;
	min-width: 180px;
	min-height: 42px;
	padding: 0 12px;
	border: 1px solid var(--shop-border-strong);
	border-radius: 10px;
	background: #fff;
	font: 15px/1 var(--sans);
}

.section--cart .coupon .button {
	min-height: 42px;
	padding: 0 14px;
	border: 0;
	border-radius: 10px;
	background: #f0efe4;
	color: var(--ink);
	font: 600 14px/1 var(--sans);
	box-shadow: none;
}

.section--cart .cart_totals h2 {
	margin-bottom: 8px;
	font-family: var(--display);
	font-size: 22px;
	letter-spacing: -0.02em;
}

.section--cart .cart_totals .order-total th,
.section--cart .cart_totals .order-total td {
	border-bottom: 0;
	font-size: 17px;
	font-weight: 700;
}

.section--cart .cart_totals .recurring-total p,
.section--cart .cart_totals .recurring-totals p {
	margin: 0;
}

.section--cart .wc-proceed-to-checkout {
	padding: 18px 0 0;
}

.section--cart .wc-proceed-to-checkout .checkout-button {
	display: flex;
	width: 100%;
	min-height: 52px;
	align-items: center;
	justify-content: center;
	margin: 0;
	border-radius: 12px;
	background: var(--ink);
	box-shadow: 0 4px 0 0 #000;
	color: #fff;
	font: 700 16px/1.2 var(--sans);
	text-decoration: none;
}

.section--cart .wc-proceed-to-checkout .checkout-button:hover {
	background: #22302a;
}

.wpc-cart-empty {
	display: grid;
	align-items: center;
	grid-template-columns: auto 1fr;
	gap: 32px;
	padding: 32px;
	border-radius: 22px;
	background: var(--night-1);
	box-shadow: inset 0 0 0 1px var(--line);
	color: var(--text);
}

.wpc-cart-empty .pixel-img {
	width: 230px;
	height: auto;
}

.wpc-cart-empty h2 {
	margin-bottom: 8px;
	font-family: var(--display);
	font-size: clamp(26px, 3vw, 34px);
	letter-spacing: -0.03em;
}

.wpc-cart-empty p {
	color: var(--muted);
}

.wpc-cart-empty-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 22px;
}

@media (max-width: 860px) {
	.section--cart .woocommerce,
	.wpc-cart-empty {
		grid-template-columns: 1fr;
	}

	.wpc-cart-empty .pixel-img {
		width: 150px;
	}
}

/* Plan switch: labels are inline by default and add a line-box gap under each option. */
.wpc-plan-switch label {
	display: block;
}

.wpc-plan-switch span {
	height: 100%;
	align-content: center;
}

.page-hero--cart .page-hero-grid {
	padding-block: 72px 56px;
}

/* Coupons are off, and "Update cart" is hidden — drop the empty actions row. */
.section--cart tr:has(> td.actions):not(:has(.coupon)) {
	display: none;
}

/* Managed hosting add-on toggle in the checkout summary */
.wpc-hosting-toggle {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 12px 0 0;
	padding: 12px 14px;
	border-radius: 12px;
	background: rgba(238, 241, 230, 0.06);
	box-shadow: inset 0 0 0 1px var(--line);
	color: var(--text);
	cursor: pointer;
}

.wpc-hosting-toggle input {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
}

.wpc-hosting-toggle .switch-track {
	position: relative;
	width: 44px;
	height: 24px;
	flex: none;
	border-radius: 6px;
	background: rgba(238, 241, 230, 0.14);
	box-shadow: inset 0 0 0 2px rgba(238, 241, 230, 0.2);
}

.wpc-hosting-toggle .switch-track::after {
	position: absolute;
	top: 4px;
	left: 4px;
	width: 16px;
	height: 16px;
	border-radius: 3px;
	background: #fff;
	content: "";
	transition: transform 150ms steps(3);
}

.wpc-hosting-toggle input:checked + .switch-track {
	background: var(--amber);
	box-shadow: inset 0 0 0 2px var(--amber-deep);
}

.wpc-hosting-toggle input:checked + .switch-track::after {
	transform: translateX(20px);
}

.wpc-hosting-toggle input:focus-visible + .switch-track {
	outline: 3px solid var(--amber);
	outline-offset: 3px;
}

.wpc-hosting-copy {
	display: grid;
	gap: 2px;
}

.wpc-hosting-copy strong {
	font-size: 14.5px;
}

.wpc-hosting-copy small {
	color: var(--muted);
	font-size: 12.5px;
}

.wpc-hosting-toggle.is-busy {
	opacity: 0.6;
	pointer-events: none;
}

/* Readability: prices and small numbers use the text font, not Pixelify (5/S, 0/O, 8/B look alike at small sizes). */
.hero-price strong,
.switch-note,
.wpc-plan-switch small,
.plan-option small,
.plan-list b,
.chip-count,
.log-count,
.toc a::before,
.next-steps b,
.wpc-steps b,
.wpc-billing-switch em {
	font-family: var(--sans);
	font-variant-numeric: tabular-nums;
	letter-spacing: 0;
}

.wpc-plan-switch small,
.plan-option small {
	font-size: 13px;
	font-weight: 600;
}

/* WooCommerce's block-theme CSS adds `.woocommerce-page label { margin-bottom: .7em }`.
   Our forms space labels with grid gaps, and the plan/hosting switches are labels too. */
body.woocommerce-page label {
	margin-bottom: 0;
}

body.woocommerce-page .woocommerce form .form-row label {
	margin-bottom: 0;
}

/* Payment block: drop WooCommerce's grey panel; the section is already framed by the form. */
.woocommerce-checkout #payment {
	margin: 0;
	background: transparent;
	border-radius: 0;
}

.woocommerce-checkout #payment div.form-row,
.woocommerce-checkout #payment ul.payment_methods {
	padding: 0;
	border: 0;
}

.woocommerce-checkout #payment .woocommerce-privacy-policy-text p,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper .woocommerce-form__label-for-checkbox {
	color: var(--shop-muted);
	font-size: 13.5px;
	line-height: 1.5;
}

/* Terms checkbox, same pixel style as the rest of the checkout. */
.woocommerce-checkout .woocommerce-form__label-for-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	cursor: pointer;
}

.woocommerce-checkout .woocommerce-form__label-for-checkbox .woocommerce-form__input-checkbox {
	flex: none;
	width: 20px;
	height: 20px;
	margin: 1px 0 0;
	border: 0;
	border-radius: 4px;
	background: #fff;
	box-shadow: inset 0 0 0 2px var(--shop-border-strong);
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}

.woocommerce-checkout .woocommerce-form__label-for-checkbox .woocommerce-form__input-checkbox:checked {
	background: var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8' shape-rendering='crispEdges'%3E%3Cpath fill='%23f4bd62' d='M6 1h2v1H6zM5 2h2v1H5zM0 3h2v1H0zM4 3h2v1H4zM1 4h4v1H1zM2 5h2v1H2z'/%3E%3C/svg%3E") center / 12px no-repeat;
	box-shadow: none;
}

.woocommerce-checkout .woocommerce-form__label-for-checkbox .woocommerce-form__input-checkbox:focus-visible {
	outline: 3px solid var(--amber-deep);
	outline-offset: 2px;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a {
	color: var(--ink);
	font-weight: 600;
	text-underline-offset: 3px;
}

/* Terms checkbox: WooCommerce's `form .form-row label.checkbox { display: inline }` wins over the
   flex label above, and an inline checkbox without native appearance collapses to 0 width. */
.woocommerce-checkout form .form-row label.woocommerce-form__label-for-checkbox {
	display: flex;
}

.woocommerce-checkout form .form-row label.woocommerce-form__label-for-checkbox .woocommerce-form__input-checkbox {
	display: block;
	margin: 1px 0 0;
}

/* Stripe: one gateway, so no gateway row — the card form sits right under "Payment".
   The card fields themselves are themed via wc_stripe_upe_params (wpcomfy-core/includes/stripe-checkout.php). */
.woocommerce-checkout #payment .wc_payment_methods:has(> .wc_payment_method:only-child) > .wc_payment_method {
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.woocommerce-checkout #payment .wc_payment_methods:has(> .wc_payment_method:only-child) > .wc_payment_method > label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.woocommerce-checkout #payment div.payment_box {
	margin: 0;
	padding: 0;
	border-radius: 0;
	background: transparent;
	color: var(--ink);
}

.woocommerce-checkout #payment div.payment_box::before {
	display: none;
}

.woocommerce-checkout #payment div.payment_box fieldset {
	padding: 0;
	border: 0;
}

.woocommerce-checkout #payment .wc_payment_methods:not(:has(> .wc_payment_method:only-child)) div.payment_box {
	padding: 0 16px 16px;
}

.woocommerce-checkout #payment .wc-saved-payment-methods[data-count="0"] {
	display: none;
}

.woocommerce-checkout #payment .wc-stripe-upe-element {
	min-height: 150px;
}

#wc-stripe-upe-errors:not(:empty) {
	margin-top: 10px;
	color: #b4442f;
	font-size: 13.5px;
}

/* The asterisk would sit alone at the far right of the flex label; WooCommerce still requires the box. */
.woocommerce-checkout form .form-row label.woocommerce-form__label-for-checkbox > .required {
	display: none;
}
