/* Purchase page - production hardening: semantic states, predictable focus, list/empty/retry states, auth code row, reduced-motion. */

/* Production hardening: semantic states, predictable focus, and flat studio surfaces. */
.purchase-page .purchase-topbar {
  box-shadow: none !important;
}

.purchase-page .purchase-login-btn,
.purchase-page .purchase-back,
.purchase-page .purchase-account-option {
  min-height: 44px;
}

.purchase-page .purchase-required {
  border-color: rgba(155, 108, 255, .34);
  background: rgba(155, 108, 255, .12);
  color: #d8caff;
}

.purchase-page .purchase-team-notice {
  border-color: rgba(155, 108, 255, .24);
  background: rgba(155, 108, 255, .1);
  color: #d7dcd9;
}

.purchase-page .package-card:hover {
  transform: none !important;
}

.purchase-page .package-desc,
.purchase-page .purchase-note {
  color: #a4acaa;
}

.purchase-loading,
.purchase-error,
.purchase-empty {
  grid-column: 1 / -1;
  min-height: 148px;
  display: grid;
  place-items: center;
  gap: 12px;
  padding: 28px 18px;
  border: 1px dashed rgba(255, 255, 255, .13);
  border-radius: 6px;
  color: #a4acaa;
  text-align: center;
}

.purchase-error {
  border-color: rgba(255, 116, 100, .35);
  color: #ffb4ad;
}

.purchase-retry,
.purchase-inline-retry {
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(155, 108, 255, .42);
  border-radius: 5px;
  background: rgba(155, 108, 255, .12);
  color: #f1f3f2;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.purchase-inline-retry {
  min-height: 32px;
  margin-left: 10px;
}

.purchase-retry:hover,
.purchase-inline-retry:hover {
  border-color: rgba(155, 108, 255, .72);
  background: rgba(155, 108, 255, .2);
}

.purchase-page .summary-title {
  margin-top: 0;
}

#formRegister,
#formReset {
  display: none;
}

.auth-code-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.auth-code-row > button {
  min-width: 112px;
  min-height: 46px;
  border: 1px solid rgba(155, 108, 255, .4);
  border-radius: 5px;
  background: rgba(155, 108, 255, .12);
  color: #e2d8ff;
  cursor: pointer;
}

.purchase-page button:focus-visible,
.purchase-page a:focus-visible,
.purchase-page input:focus-visible {
  outline: 3px solid rgba(155, 108, 255, .72) !important;
  outline-offset: 2px !important;
}

@media (max-width: 620px) {
  .purchase-page .purchase-login-btn,
  .purchase-page .purchase-back {
    min-height: 44px;
  }

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

  .auth-code-row > button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .purchase-page .purchase-login-btn,
  .purchase-page .purchase-back,
  .purchase-page .package-card,
  .purchase-page .purchase-submit {
    transition: none !important;
    transform: none !important;
  }
}