/* ==========================================================================
   Smart LeadLock Theme — Checkout & Resend License Styles
   Loaded only on page-checkout.php and referenced for resend-license too.
   ========================================================================== */

.checkout-layout {
  display: grid; gap: var(--space-6); grid-template-columns: 1fr;
  padding: var(--space-6) 0 var(--space-8);
}
.checkout-title { margin-bottom: var(--space-5); font-size: 22px; }

@media (min-width: 600px) {
  .checkout-layout { padding: var(--space-7) 0 var(--space-9); }
  .checkout-title { font-size: 28px; margin-bottom: var(--space-6); }
}

.checkout-step {
  border: 0; padding: 0; margin: 0 0 var(--space-7);
}
.checkout-step legend {
  display: flex; align-items: center; gap: var(--space-3);
  font-size: 16px; font-weight: 700; color: var(--color-navy);
  padding: 0; margin-bottom: var(--space-5); width: 100%;
}
.checkout-step-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--color-navy); color: #fff; font-size: 13px; font-weight: 700;
  flex-shrink: 0;
}

.coupon-toggle { font-size: 13px; margin-bottom: var(--space-3); }
.coupon-field { background: var(--color-gray-50); padding: var(--space-4); border-radius: var(--radius-card); margin-bottom: var(--space-2); }
.coupon-status { font-size: 13px; margin: var(--space-2) 0 0; }
.coupon-status.is-valid { color: var(--color-green); }
.coupon-status.is-invalid { color: var(--color-red); }

.gateway-tabs { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.gateway-tab {
  flex: 1; min-width: 100px; padding: 12px 8px; border: 2px solid var(--color-gray-200);
  border-radius: var(--radius-btn); background: #fff; font-weight: 700; font-size: 13.5px;
  color: var(--color-gray-600); transition: border-color .15s, color .15s, background .15s;
}
.gateway-tab:hover { border-color: var(--color-navy); }
.gateway-tab.is-active { border-color: var(--color-orange); background: rgba(249,115,22,.06); color: var(--color-orange-dk); }

@media (max-width: 420px) {
  .gateway-tabs { gap: var(--space-2); }
  .gateway-tab { min-width: 0; padding: 12px 4px; font-size: 12.5px; }
}

.checkout-form-error {
  background: rgba(220,38,38,.08); border: 1px solid rgba(220,38,38,.25); color: var(--color-red);
  padding: var(--space-3) var(--space-4); border-radius: var(--radius-btn); font-size: 14px;
  margin-bottom: var(--space-4);
}

.checkout-notice {
  display: flex; align-items: flex-start; gap: var(--space-2);
  padding: var(--space-3) var(--space-4); border-radius: var(--radius-btn); font-size: 14px;
  margin-bottom: var(--space-5);
}
.checkout-notice--warning {
  background: rgba(217,119,6,.08); border: 1px solid rgba(217,119,6,.25); color: #92400e;
}
.checkout-notice svg { flex-shrink: 0; width: 18px; height: 18px; margin-top: 1px; }

.checkout-submit { width: 100%; position: relative; margin-bottom: var(--space-5); }
.checkout-submit-spinner {
  width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff;
  border-radius: 50%; animation: slt-spin .7s linear infinite; margin-left: var(--space-2);
}
.checkout-submit[aria-busy="true"] .checkout-submit-label { opacity: .6; }
@keyframes slt-spin { to { transform: rotate(360deg); } }

.trust-signals { display: flex; flex-direction: column; gap: var(--space-2); }
.trust-signals p { display: flex; align-items: center; gap: var(--space-2); font-size: 13px; color: var(--color-gray-400); margin: 0; }
.trust-signals .icon { color: var(--color-green); }

.order-summary-panel {
  background: #fff; border: 1px solid var(--color-gray-100); border-radius: var(--radius-lg);
  padding: var(--space-5);
}
.order-summary-panel h2 { font-size: 17px; margin-bottom: var(--space-4); }
.order-summary-row { display: flex; justify-content: space-between; font-size: 14px; margin-bottom: var(--space-3); flex-wrap: wrap; gap: var(--space-1); }
.order-summary-price-was { color: var(--color-gray-400); font-weight: 400; margin-right: 4px; }
.order-summary-features { display: flex; flex-direction: column; gap: var(--space-2); margin: var(--space-4) 0; padding-top: var(--space-4); border-top: 1px solid var(--color-gray-100); }
.order-summary-features li { display: flex; align-items: flex-start; gap: var(--space-2); font-size: 13px; }
.order-summary-total { display: flex; justify-content: space-between; align-items: center; padding-top: var(--space-4); border-top: 1px solid var(--color-gray-100); font-size: 15px; flex-wrap: wrap; gap: var(--space-2); }
.order-summary-total strong { font-size: 20px; color: var(--color-navy); }

@media (min-width: 960px) {
  .checkout-layout { grid-template-columns: 1.3fr 1fr; align-items: start; }
  .checkout-summary-col { order: 2; }
  .order-summary-panel { padding: var(--space-6); position: sticky; top: var(--space-6); }
  .order-summary-panel h2 { font-size: 18px; margin-bottom: var(--space-5); }
  .order-summary-features { margin: var(--space-5) 0; padding-top: var(--space-5); }
  .order-summary-total { padding-top: var(--space-5); }
}

/* ---- Checkout success state ---- */
.checkout-success { padding: var(--space-9) 0; display: flex; justify-content: center; }
.checkout-success-card {
  max-width: 520px; text-align: center; background: #fff; border-radius: var(--radius-lg);
  border: 1px solid var(--color-gray-100); box-shadow: var(--shadow-md); padding: var(--space-8) var(--space-6);
}
.checkout-success-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; border-radius: 50%; background: rgba(22,163,74,.1); color: var(--color-green);
  margin-bottom: var(--space-5);
}
.checkout-success-icon .icon svg { width: 26px; height: 26px; }
.checkout-success-sub { font-size: 16px; margin-bottom: var(--space-6); }
.checkout-success-steps { text-align: left; background: var(--color-gray-50); border-radius: var(--radius-card); padding: var(--space-5); margin-bottom: var(--space-6); }
.checkout-success-steps h2 { font-size: 15px; margin-bottom: var(--space-3); }
.checkout-success-steps ol { list-style: decimal; padding-left: 1.3em; display: flex; flex-direction: column; gap: var(--space-2); }
.checkout-success-steps li { font-size: 14px; }
.checkout-success-ctas { display: flex; flex-wrap: wrap; gap: var(--space-3); justify-content: center; margin-bottom: var(--space-5); }
.checkout-order-ref { font-size: 12px; color: var(--color-gray-400); margin: 0; }

/* ---- Resend license page ---- */
.resend-license-layout { padding: var(--space-6) 0 var(--space-9); }
.resend-license-wrap { display: grid; gap: var(--space-6); grid-template-columns: 1fr; max-width: 920px; margin: 0 auto; align-items: start; }
.resend-license-card {
  background: #fff; border-radius: var(--radius-lg);
  border: 1px solid var(--color-gray-100); box-shadow: var(--shadow-md); padding: var(--space-7) var(--space-6);
}
.resend-submit { width: 100%; position: relative; }
.resend-submit-spinner {
  width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff;
  border-radius: 50%; animation: slt-spin .7s linear infinite; display: inline-block; margin-left: var(--space-2);
}
.resend-message { display: flex; align-items: flex-start; gap: var(--space-2); font-size: 14px; padding: var(--space-4); border-radius: var(--radius-btn); margin-top: var(--space-4); }
.resend-message--success { background: rgba(22,163,74,.08); color: #14532d; border: 1px solid rgba(22,163,74,.25); }
.resend-message--error { background: rgba(220,38,38,.08); color: #7f1d1d; border: 1px solid rgba(220,38,38,.25); }
.resend-trust-signals { display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid var(--color-gray-100); }
.resend-trust-signals p { display: flex; align-items: center; gap: var(--space-2); font-size: 13px; color: var(--color-gray-400); margin: 0; }
.resend-trust-signals .icon { color: var(--color-green); }

.resend-license-help { background: var(--color-gray-50); border-radius: var(--radius-lg); padding: var(--space-6); }
.resend-license-help h2 { font-size: 16px; margin-bottom: var(--space-5); }
.resend-license-help ul { display: flex; flex-direction: column; gap: var(--space-4); margin-bottom: var(--space-5); }
.resend-license-help li { font-size: 14px; line-height: 1.6; }
.resend-license-help li strong { display: block; color: var(--color-navy); margin-bottom: 2px; }
.resend-license-help a { color: var(--color-orange-dk); font-weight: 600; }
.resend-license-help-contact { border-top: 1px solid var(--color-gray-200); padding-top: var(--space-4); font-size: 14px; margin: 0; }
.resend-license-help-contact a { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; color: var(--color-navy); margin-left: var(--space-2); }
.resend-license-help-contact a:hover { color: var(--color-orange); }

@media (min-width: 860px) {
  .resend-license-wrap { grid-template-columns: 1fr 320px; }
}