/* ASNET checkout (Faza F) - linear flow: product context stays visible,
 * progress indicator is a discreet strip (not a dominant wizard), desktop
 * gets a 2-column layout with a sticky order summary, mobile collapses to
 * one column with the summary folded into the flow. No accordion, no
 * dropdown-driven steps - see partial_asnet_order_flow.html.twig. */

.asnet-checkout { display: flex; flex-direction: column; gap: var(--asnet-space-lg); }

/* Progress strip */
.asnet-checkout-progress {
  display: flex;
  align-items: center;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: var(--asnet-fs-xs);
  color: var(--asnet-text-muted);
  overflow-x: auto;
}
.asnet-checkout-progress li {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  font-weight: 600;
}
.asnet-checkout-progress li:not(:last-child)::after {
  content: "";
  width: 24px;
  height: 1px;
  background: var(--asnet-border);
  margin: 0 10px;
}
.asnet-checkout-progress li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1.5px solid var(--asnet-border-strong);
  color: var(--asnet-text-muted);
  font-size: 11px;
}
.asnet-checkout-progress li.is-done span { background: var(--asnet-success); border-color: var(--asnet-success); color: #fff; }
.asnet-checkout-progress li.is-active { color: var(--asnet-ink); }
.asnet-checkout-progress li.is-active span { border-color: var(--asnet-primary); color: var(--asnet-primary); }

/* Product context header - persists through the whole flow */
.asnet-product-context {
  display: flex;
  align-items: center;
  gap: var(--asnet-space-sm);
  padding: var(--asnet-space-sm) var(--asnet-space-md);
  background: var(--asnet-surface-elevated);
  border: 1px solid var(--asnet-border);
  border-radius: var(--asnet-radius-md);
}
.asnet-product-context__icon {
  width: 44px;
  height: 44px;
  border-radius: var(--asnet-radius-sm);
  background: var(--asnet-primary-soft);
  color: var(--asnet-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.asnet-product-context__body { flex: 1; min-width: 0; }
.asnet-product-context__body h1 { font-size: var(--asnet-fs-lg); margin-bottom: 2px; }
.asnet-product-context__price { font-size: var(--asnet-fs-xl); font-weight: 800; color: var(--asnet-ink); white-space: nowrap; }

/* Layout: main + sticky summary */
.asnet-checkout__layout { display: grid; grid-template-columns: 1fr; gap: var(--asnet-space-lg); align-items: start; }
.asnet-checkout__main { display: flex; flex-direction: column; gap: var(--asnet-space-lg); min-width: 0; }
.asnet-checkout__step-title { font-size: var(--asnet-fs-lg); margin-bottom: var(--asnet-space-md); }

@media (min-width: 992px) {
  .asnet-checkout__layout { grid-template-columns: 1fr 340px; }
  .asnet-checkout__summary { position: sticky; top: calc(var(--asnet-header-height) + var(--asnet-space-md)); }
}

/* Order summary */
.asnet-order-summary {
  background: var(--asnet-surface-elevated);
  border: 1px solid var(--asnet-border);
  border-radius: var(--asnet-radius-md);
  box-shadow: var(--asnet-shadow-soft);
  padding: var(--asnet-space-md);
}
.asnet-order-summary__title { font-size: var(--asnet-fs-base); margin-bottom: var(--asnet-space-sm); }
.asnet-order-summary__row {
  display: flex;
  justify-content: space-between;
  gap: var(--asnet-space-sm);
  font-size: var(--asnet-fs-sm);
  padding: 6px 0;
  color: var(--asnet-text-muted);
}
/* ASNET DOMAIN-01J.10.1: an author-stylesheet class rule always wins
   over the browser's own built-in [hidden] { display: none } user-agent
   rule, regardless of selector specificity - so setting the `hidden`
   attribute/property on a row carrying .asnet-order-summary__row never
   actually hid it visually (confirmed root cause of the stale Privacy
   summary row staying visible after being unchecked). This restores the
   standard HTML hidden-attribute contract for every row using this
   class, in both the hosting and standalone domain order summaries. */
.asnet-order-summary__row[hidden] {
  display: none;
}
.asnet-order-summary__row--total {
  border-top: 1px solid var(--asnet-border);
  margin-top: 6px;
  padding-top: 10px;
  font-size: var(--asnet-fs-lg);
  font-weight: 800;
  color: var(--asnet-ink);
}

/* Account login/register toggle */
.asnet-account-tabs__switch { margin-bottom: var(--asnet-space-md); }
.asnet-account-tabs__pane { display: none; }
.asnet-account-tabs__pane.is-active { display: block; }

/* Domain configuration tiles/panes (mod_servicehosting_order_form.asnet) */
.asnet-domain-tabs { margin-bottom: var(--asnet-space-md); }
.asnet-domain-pane { display: none; }
.asnet-domain-pane.is-active { display: block; }

.asnet-select--sm { min-height: 38px; padding: 0 30px 0 10px; font-size: var(--asnet-fs-xs); }

/* Payment result (iframe / redirect link injected by checkout.js) */
.asnet-checkout-payment-result { padding-top: var(--asnet-space-sm); }
.asnet-checkout-payment-result iframe { width: 100%; border: none; min-height: 480px; }

/* Pricing cards (plan picker on /order without a preselected product) */
.asnet-pricing-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  border: 1.5px solid var(--asnet-border);
  border-radius: var(--asnet-radius-lg);
  background: var(--asnet-surface-elevated);
  box-shadow: var(--asnet-shadow-soft);
  padding: var(--asnet-space-md);
}
.asnet-pricing-card--featured { border-color: var(--asnet-primary); box-shadow: var(--asnet-shadow-lifted); }
.asnet-pricing-card__badge {
  align-self: flex-start;
  background: var(--asnet-primary-soft);
  color: var(--asnet-primary-strong);
  border-radius: var(--asnet-radius-full);
  padding: 3px 10px;
  font-size: var(--asnet-fs-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: var(--asnet-space-sm);
}
.asnet-pricing-card__price { font-size: var(--asnet-fs-2xl); font-weight: 800; color: var(--asnet-ink); }
.asnet-pricing-card__period { font-size: var(--asnet-fs-sm); color: var(--asnet-text-muted); margin-bottom: var(--asnet-space-sm); }
.asnet-pricing-card__features { font-size: var(--asnet-fs-sm); color: var(--asnet-text); flex: 1; margin-bottom: var(--asnet-space-md); }
.asnet-pricing-card__features ul { padding-left: 1.1em; margin: 0; }
.asnet-pricing-card__features li { padding: 2px 0; }

/* Mobile checkout: single column, no sticky sidebar tricks, comfortable
   touch targets already come from .asnet-btn (46px) and .asnet-tile. */
@media (max-width: 429.98px) {
  .asnet-product-context { flex-wrap: wrap; }
  .asnet-checkout-progress li span { width: 18px; height: 18px; }
}
