/* ========================================================================
   WSLA Order Form Theme - clean production CSS
   Scope: templates/orderforms/wslatheme_cart only
   Notes: no manual pricing logic, no payment-field restrictions, light shadow only
   ======================================================================== */

:root {
  --wsla-primary: #f66257;
  --wsla-primary-dark: #ef5053;
  --wsla-dark: #262a33;
  --wsla-text: #464747;
  --wsla-muted: #6b788b;
  --wsla-soft: #f6f6f6;
  --wsla-soft-red: #ffeded;
  --wsla-line: #dee3e8;
  --wsla-line-soft: #f1f1f1;
  --wsla-success: #01aa5d;
  --wsla-danger: #ef5053;
  --wsla-warning: #ffa800;
  --wsla-radius: 3px;
  --wsla-radius-lg: 18px;
  --wsla-shadow: 0 1px 1.5px rgba(42, 46, 54, 0.09);
  --wsla-focus: 0 0 0 3px rgba(255, 66, 66, 0.08);
}

#order-wslatheme_cart,
.wsla-cart {
  font-family: "Almarai", Arial, sans-serif;
}

.wsla-cart,
.wsla-order-clean-page,
.wsla-domain-page,
.wsla-confdomains-page,
.wsla-viewcart-page,
.wsla-checkout-page {
  background: var(--wsla-soft);
  color: var(--wsla-text);
}

.wsla-cart {
  padding: 0 0 48px;
}

.wsla-container,
.wsla-cart .wsla-container,
.wsla-cart .wsla-container.wsla-container-fluid {
  width: 100%;
  /* max-width: 1320px; */
  margin-inline: auto;
  /* padding-inline: 15px; */
}

.wsla-order-clean-card,
.wsla-panel,
.wsla-summary,
.wsla-domain-search-card,
.wsla-domain-result-item,
.wsla-suggestion-card,
.wsla-tld-spotlight-card,
.wsla-tld-table,
.wsla-confdomain-card,
.wsla-confdomains-nameservers,
.wsla-confdomains-actions,
.wsla-cart-review-card,
.wsla-promo-card,
.wsla-tax-estimate-card,
.wsla-checkout-section,
.wsla-order-summary-card {
  background: #fff;
  border: 1px solid var(--wsla-line-soft);
  border-radius: var(--wsla-radius-lg);
  box-shadow: none !important;
}

.wsla-order-clean-card {
  padding: 28px;
}

.wsla-hero,
.wsla-domain-hero {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
  min-height: 210px;
  margin-bottom: 24px;
  padding: 42px 44px;
  border-radius: 22px;
  color: #fff;
  background: linear-gradient(135deg, #262a33 0%, #16181d 58%, #ff4242 100%);
  box-shadow: none !important;
}

.wsla-hero h1,
.wsla-domain-hero h1 {
  margin: 0;
  color: #fff;
  font-size: clamp(30px, 5vw, 54px);
  line-height: 1.05;
  font-weight: 900;
  letter-spacing: -1px;
}

.wsla-hero p,
.wsla-domain-hero p {
  max-width: 720px;
  margin: 14px 0 0;
  color: rgba(255, 255, 255, 0.82);
  font-size: 15px;
  line-height: 26px;
  font-weight: 400;
}

.wsla-kicker,
.wsla-confdomains-kicker,
.wsla-checkout-kicker,
.wsla-domain-mini-label,
.wsla-domain-secure,
.wsla-order-summary-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  padding: 6px 10px;
  border: 1px solid var(--wsla-soft-red);
  border-radius: 20px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 12px;
  line-height: 18px;
  font-weight: 800;
}

.wsla-hero .wsla-kicker,
.wsla-domain-hero .wsla-kicker {
  border-color: rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}

.wsla-title,
.wsla-domain-search-head h2,
.wsla-domain-block-head h3,
.wsla-confdomains-header h1,
.wsla-checkout-header h1,
.wsla-viewcart-header h1,
.wsla-section-title-row h2,
.wsla-order-summary-header h3 {
  margin: 0;
  color: var(--wsla-dark);
  font-weight: 900;
  letter-spacing: 0;
}

.wsla-subtitle,
.wsla-domain-search-head p,
.wsla-domain-block-head p,
.wsla-confdomains-header p,
.wsla-checkout-header p,
.wsla-viewcart-header p,
.wsla-section-title-row p,
.wsla-order-summary-header p,
.wsla-domain-message {
  margin: 6px 0 0;
  color: var(--wsla-muted);
  font-size: 14px;
  line-height: 23px;
  font-weight: 400;
}

.wsla-btn,
.wsla-cart .btn-primary,
.wsla-summary-checkout,
.wsla-checkout-submit,
.wsla-confdomains-continue {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 10px 20px;
  border: 1px solid var(--wsla-primary);
  border-radius: var(--wsla-radius);
  background: var(--wsla-primary);
  color: #fff !important;
  text-decoration: none !important;
  font-size: 13px;
  line-height: 20px;
  font-weight: 800;
  letter-spacing: 0.2px;
  box-shadow: none !important;
  cursor: pointer;
  transition:
    background-color 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease,
    transform 0.16s ease;
}

.wsla-btn:hover,
.wsla-btn:focus,
.wsla-cart .btn-primary:hover,
.wsla-cart .btn-primary:focus,
.wsla-summary-checkout:hover,
.wsla-checkout-submit:hover,
.wsla-confdomains-continue:hover {
  background: var(--wsla-primary-dark);
  border-color: var(--wsla-primary-dark);
  color: #fff !important;
  transform: none;
}

.wsla-btn-light,
.wsla-inline-edit-link,

.wsla-confdomains-add-cart {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 12px 30px;
  border: 0 !important;
  border-radius: 50px;
  background: var(--wsla-soft-red) !important;
  color: var(--wsla-primary) !important;
  font-weight: 500;
  line-height: 1;
  text-decoration: none !important;
  box-shadow: none !important;
  outline: none !important;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  transition: 0.25s ease;
}

.wsla-confdomains-add-cart:hover,
.wsla-confdomains-add-cart:focus {
  background: var(--wsla-primary) !important;
  color: #fff !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

.wsla-confdomains-add-cart.wsla-btn-busy,
.wsla-confdomains-add-cart[disabled] {
  box-shadow: none !important;
  transform: none !important;
}

.wsla-confdomains-back,
.wsla-checkout-back {
  background: var(--wsla-soft-red) !important;
  border-color: var(--wsla-soft-red) !important;
  color: var(--wsla-primary) !important;
  box-shadow: none !important;
  backdrop-filter: blur(10px);
  padding: 12px 30px;
  border-radius: 50px;
  font-weight: 500;
  cursor: pointer;
  transition: 0.4s;
}

.wsla-btn-light:hover,
.wsla-inline-edit-link:hover,
.wsla-confdomains-back:hover,
.wsla-checkout-back:hover {
  background: var(--wsla-primary) !important;
  border-color: var(--wsla-primary) !important;
  color: #fff !important;
}

.wsla-btn-disabled,
.wsla-btn-disabled:hover,
button[disabled].wsla-btn {
  background: #ebedf2 !important;
  border-color: #ebedf2 !important;
  color: #6f7997 !important;
  box-shadow: none !important;
  pointer-events: none;
  cursor: not-allowed;
}

/* Domain registration/search */
.wsla-domain-page {
  padding-top: 16px;
}
.wsla-domain-shell {
  background: transparent;
  border: 0;
  box-shadow: none !important;
  padding: 0;
}
.wsla-domain-search-card {
  padding: 26px;
  margin-bottom: 18px;
}
.wsla-domain-search-head,
.wsla-domain-block-head,
.wsla-confdomains-header,
.wsla-checkout-header,
.wsla-viewcart-header,
.wsla-section-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
}

.wsla-domain-input-wrap {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  min-height: 72px;
  padding: 7px 7px 7px 12px;
  border: 1px solid #dfe5ec;
  border-radius: 20px;
  background: #fff;
  box-shadow: none !important;
  transition:
    border-color 0.16s ease;
}
html[dir="rtl"] .wsla-domain-input-wrap {
  padding: 7px 12px 7px 7px;
}
.wsla-domain-input-wrap:hover {
  border-color: #cdd5df;
}
.wsla-domain-input-wrap:focus-within {
  border-color: var(--wsla-primary);
  box-shadow: none !important;
}
.wsla-domain-input-icon,
.wsla-domain-input-wrap > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #637083;
  font-size: 20px;
}
.wsla-domain-input-wrap .form-control {
  min-height: 56px;
  padding: 0 12px;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #2e3442;
  font-size: 16px;
  font-weight: 700;
}
.wsla-domain-input-wrap .form-control::placeholder {
  color: #a7afbc;
  opacity: 1;
  font-weight: 600;
}
.wsla-domain-input-wrap .wsla-btn {
  min-width: 136px;
  min-height: 56px;
  border-radius: 12px;
  padding-inline: 24px;
}

.wsla-domain-results {
  margin-top: 18px;
}
.wsla-domain-result-list {
  display: grid;
  gap: 16px;
}
.wsla-domain-result-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 22px 24px;
}
.wsla-domain-result-main {
  min-width: 0;
}
.wsla-domain-result-main h3,
.wsla-suggestion-card h4 {
  margin: 8px 0 6px;
  color: var(--wsla-dark);
  font-size: 26px;
  line-height: 1.15;
  font-weight: 900;
  overflow-wrap: anywhere;
}
.wsla-domain-result-side,
.wsla-suggestion-foot {
  display: flex;
  align-items: center;
  gap: 14px;
}
.wsla-domain-price {
  min-width: 130px;
  text-align: end;
}
.wsla-domain-price span {
  display: block;
  color: var(--wsla-muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}
.wsla-domain-price strong,
.wsla-suggestion-foot strong {
  display: block;
  color: #111;
  font-size: 24px;
  font-weight: 900;
  white-space: nowrap;
}
.wsla-domain-status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 900;
}
.wsla-domain-status.available {
  background: #e3f9f2;
  color: var(--wsla-success);
}
.wsla-domain-status.unavailable,
.wsla-domain-status.invalid {
  background: var(--wsla-soft-red);
  color: var(--wsla-danger);
}
.wsla-domain-status.premium {
  background: #fff4de;
  color: #b97a00;
}
.wsla-domain-status.checking {
  background: #f3f6f9;
  color: #6f7997;
}
.wsla-domain-result-item.is-available,
.wsla-suggestion-card.is-available {
  border-color: rgba(1, 170, 93, 0.24);
}
.wsla-domain-result-item.is-unavailable,
.wsla-suggestion-card.is-unavailable {
  border-color: rgba(235, 36, 59, 0.14);
}
.wsla-domain-meta-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.wsla-domain-meta-badges span {
  padding: 5px 9px;
  border: 1px solid var(--wsla-line);
  border-radius: 20px;
  background: #f3f6f9;
  color: var(--wsla-muted);
  font-size: 12px;
  font-weight: 700;
}
.wsla-domain-loading,
.wsla-domain-empty {
  padding: 34px 20px;
  text-align: center;
  border: 2px dashed #dae1e8;
}
.wsla-domain-loading strong,
.wsla-domain-empty h3 {
  display: block;
  margin: 12px 0 6px;
  color: var(--wsla-dark);
  font-size: 20px;
  font-weight: 900;
}
.wsla-domain-empty i {
  width: 58px;
  height: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 25px;
}

.wsla-domain-continue-bar {
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 18px 0 0;
  padding: 18px 20px;
  /* border: 1px solid #e0f2e8; */
  border-left: 4px solid var(--wsla-success);
  border-radius: 12px;
  background: var(--wsla-soft);
  box-shadow: none !important;
}
html[dir="rtl"] .wsla-domain-continue-bar {
  border-left: 1px solid #e0f2e8;
  border-right: 4px solid var(--wsla-success);
}
.wsla-domain-continue-bar.is-visible {
  display: flex;
}
.wsla-domain-continue-bar strong {
  display: block;
  color: var(--wsla-dark);
  font-size: 16px;
  line-height: 24px;
  font-weight: 900;
}
.wsla-domain-continue-bar span {
  display: block;
  font-size: 13px;
  line-height: 21px;
  font-weight: 600;
}
.wsla-domain-continue-bar .wsla-btn {
  min-width: 142px;
  background: var(--wsla-dark);
  border-color: var(--wsla-dark);
}
.wsla-domain-continue-bar .wsla-btn:hover {
  background: #16181d;
  border-color: #16181d;
}

/* TLD sections */
.wsla-tld-spotlight,
.wsla-tld-pricing,
.wsla-domain-suggestions {
  margin-top: 60px;
}
.wsla-tld-spotlight-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.wsla-tld-spotlight-card {
  overflow: hidden;
  min-height: 186px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition:
    border-color 0.16s ease,
    transform 0.16s ease;
}
.wsla-tld-spotlight-card:hover {
  border-color: rgba(60, 226, 157, 0.28);
  transform: translateY(-2px);
}
.wsla-tld-logo-wrap {
  min-height: 130px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: linear-gradient(180deg, #fff, #f8fafc);
}
.wsla-tld-logo-wrap img {
  max-width: 180px;
  max-height: 76px;
  object-fit: contain;
}
.wsla-tld-text-logo {
  font-size: 42px;
  font-weight: 900;
  color: var(--wsla-dark);
}

.wsla-tld-spotlight-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border-top: 1px solid #eef2f7;
}
.wsla-tld-spotlight-footer strong {
  color: var(--wsla-dark);
  font-size: 18px;
  font-weight: 900;
}
.wsla-tld-card-price {
  color: var(--wsla-dark);
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
}
.wsla-tld-tag {
  margin-inline-start: 6px;
  padding: 4px 8px;
  border-radius: 8px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 11px;
  font-weight: 400;
}
.wsla-tld-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
  padding: 10px;
  border: 1px solid var(--wsla-line);
  border-radius: 16px;
  background: #fff;
}
.wsla-tld-filter {
  border: 0;
  border-radius: 10px;
  padding: 9px 12px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 400;
}
.wsla-tld-filter:hover,
.wsla-tld-filter.is-active {
  background: #0f172a;
  color: #fff;
}
.wsla-tld-search-wrap {
  position: relative;
  min-width: 280px;
}
.wsla-tld-search-wrap i {
  position: absolute;
  top: 50%;
  inset-inline-start: 15px;
  transform: translateY(-50%);
  color: #94a3b8;
  pointer-events: none;
}
.wsla-tld-search-wrap .form-control {
  min-height: 48px;
  border-radius: 12px;
  border: 1px solid var(--wsla-line);
  padding-inline-start: 44px;
  box-shadow: none !important;
}
.wsla-tld-table {
  overflow: hidden;
}
.wsla-tld-table-head,
.wsla-tld-row {
  display: grid;
  grid-template-columns: minmax(180px, 1.15fr) repeat(
      3,
      minmax(130px, 0.7fr)
    ) minmax(110px, 0.45fr);
  align-items: center;
}
.wsla-tld-table-head {
  background: #f3f6f9;
  color: var(--wsla-muted);
  font-size: 13px;
  font-weight: 900;
}
.wsla-tld-table-head span,
.wsla-tld-row > div {
  padding: 10px 18px;
}
.wsla-tld-row {
  border-bottom: 1px solid #eef2f7;
}
.wsla-tld-row:last-child {
  border-bottom: 0;
}
.wsla-tld-name strong {
  color: var(--wsla-dark);
  font-size: 18px;
  font-weight: 900;
}
.wsla-tld-price-cell strong {
  display: block;
  color: var(--wsla-dark);
  font-size: 15px;
  font-weight: 400;
}
.wsla-tld-price-cell small {
  display: block;
  margin-top: 4px;
  color: var(--wsla-muted);
  font-size: 12px;
  font-weight: 700;
}
.wsla-tld-action {
  text-align: end;
}
.wsla-suggestion-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.wsla-suggestion-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px;
}

/* Configure domains */
.wsla-confdomains-page .wsla-order-clean-card {
  padding: 28px 26px 32px;
}
.wsla-confdomains-list {
  display: grid;
  gap: 22px;
}
.wsla-confdomain-card {
  padding: 24px;
}
.wsla-confdomain-top,
.wsla-confdomain-identity {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.wsla-confdomain-top {
  justify-content: space-between;
  gap: 20px;
}
.wsla-confdomain-icon,
.wsla-cart-item-icon,
.wsla-review-icon {
  width: 46px;
  height: 46px;
  min-width: 46px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 22px;
}
.wsla-confdomain-icon {
  width: 58px;
  height: 58px;
  min-width: 58px;
  font-size: 27px;
}
.wsla-confdomain-identity h2 {
  margin: 0 0 9px;
  color: #111;
  font-size: 24px;
  line-height: 32px;
  font-weight: 900;
  overflow-wrap: anywhere;
}
.wsla-confdomain-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
}
.wsla-confdomain-meta span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--wsla-muted);
  font-size: 13px;
  line-height: 21px;
  font-weight: 600;
}
.wsla-confdomain-remove {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 13px;
  border: 1px solid var(--wsla-line);
  border-radius: var(--wsla-radius);
  color: var(--wsla-text);
  background: #fff;
  text-decoration: none;
  font-size: 13px;
  font-weight: 800;
}
.wsla-confdomain-remove:hover {
  color: var(--wsla-danger);
  background: var(--wsla-soft-red);
  border-color: var(--wsla-soft-red);
}
.wsla-confdomain-body {
  margin-top: 22px;
  display: grid;
  gap: 20px;
}
.wsla-confdomain-section,
.wsla-confdomains-nameservers {
  border-top: 1px solid var(--wsla-line-soft);
  padding-top: 20px;
}
.wsla-confdomain-section-title {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
}
.wsla-confdomain-section-title > i {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: var(--wsla-radius);
  background: #f3f6f9;
  color: var(--wsla-primary);
}
.wsla-confdomain-section-title h2,
.wsla-confdomain-section-title h3 {
  margin: 0 0 4px;
  color: var(--wsla-dark);
  font-size: 20px;
  line-height: 28px;
  font-weight: 900;
}
.wsla-confdomain-section-title p {
  margin: 0;
  color: var(--wsla-muted);
  font-size: 14px;
  line-height: 22px;
  font-weight: 400;
}
.wsla-domain-addon-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
}
.wsla-domain-addon-card {
  position: relative;
  display: flex;
  gap: 12px;
  min-height: auto;
  padding: 14px 38px 14px 14px;
  border: 1px solid #e5eaf1;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition:
    border-color 0.16s ease,
    background-color 0.16s ease;
}
html[dir="rtl"] .wsla-domain-addon-card {
  padding: 14px 14px 14px 38px;
}
.wsla-domain-addon-card:hover,
.wsla-domain-addon-card.is-selected {
  border-color: #f99f1c;
  background: #fff7eb;
}
.wsla-domain-addon-card input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.wsla-addon-check,
.wsla-checkbox-ui {
  width: 18px;
  height: 18px;
  min-width: 18px;
  margin-top: 2px;
  border: 2px solid #d7dde7;
  border-radius: var(--wsla-radius);
  background: #fff;
}
.wsla-domain-addon-card input:checked + .wsla-addon-check,
.wsla-domain-addon-card.is-selected .wsla-addon-check,
.wsla-tos-check input:checked + .wsla-checkbox-ui {
  border-color: var(--wsla-primary);
  background: var(--wsla-primary);
  box-shadow: none !important;
}
.wsla-addon-content {
  display: grid;
  gap: 4px;
}
.wsla-addon-content strong {
  color: var(--wsla-dark);
  font-size: 14px;
  line-height: 20px;
  font-weight: 900;
}
.wsla-addon-content small,
.wsla-addon-content em {
  color: var(--wsla-muted);
  font-size: 12px;
  line-height: 18px;
  font-weight: 500;
  font-style: normal;
}
.wsla-addon-content em {
  color: #111;
  font-weight: 600;
}
.wsla-domain-addon-card > i {
  position: absolute;
  top: 14px;
  inset-inline-end: 14px;
  color: #7c8088;
  font-size: 15px;
}

.wsla-confdomains-nameservers {
  margin-top: 24px;
  padding: 24px;
  border-radius: 14px;
}
.wsla-nameserver-grid,
.wsla-domain-fields-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px 24px;
  margin-top: 30px;
}
.wsla-nameserver-field,
.wsla-domain-field-item,
.wsla-field {
  position: relative;
}
.wsla-nameserver-field label,
.wsla-domain-field-item > label,
.wsla-field > label {
  position: absolute;
  top: 17px;
  inset-inline-start: 14px;
  z-index: 3;
  max-width: calc(100% - 28px);
  margin: 0;
  padding: 0 6px;
  border-radius: 4px;
  background: #fff;
  color: var(--wsla-muted);
  font-size: 14px;
  line-height: 20px;
  font-weight: 800;
  pointer-events: none;
  transition:
    top 0.16s ease,
    font-size 0.16s ease,
    color 0.16s ease;
}
.wsla-nameserver-field.is-focused label,
.wsla-nameserver-field.is-filled label,
.wsla-domain-field-item.is-focused > label,
.wsla-domain-field-item.is-filled > label,
.wsla-field.is-focused > label,
.wsla-field.is-filled > label,
.wsla-field:focus-within > label {
  top: -8px;
  color: var(--wsla-primary);
  font-size: 12px;
}
.wsla-nameserver-field .form-control,
.wsla-domain-field-control input,
.wsla-domain-field-control select,
.wsla-domain-field-control textarea,
.wsla-field .form-control,
.wsla-checkout-page .form-control,
.wsla-form-card .form-control,
.wsla-form-card .form-select,
.wsla-cart-item-qty .form-control,
.wsla-tax-grid .form-control {
  width: 100%;
  min-height: 56px;
  /* padding: 20px 15px 7px; */
  border: 1px solid var(--wsla-line);
  border-radius: 12px;
  background: #fff;
  color: #2e3442;
  font-size: 14px;
  font-weight: 700;
  box-shadow: none !important;
  outline: 0;
  transition:
    border-color 0.16s ease;
}
.wsla-nameserver-field .form-control::placeholder {
  opacity: 0;
}
.wsla-domain-field-control textarea,
.wsla-notes-field {
  min-height: 118px;
  padding-top: 22px;
  resize: vertical;
}
.wsla-nameserver-field .form-control:focus,
.wsla-domain-field-control input:focus,
.wsla-domain-field-control select:focus,
.wsla-domain-field-control textarea:focus,
.wsla-field .form-control:focus,
.wsla-checkout-page .form-control:focus,
.wsla-form-card .form-control:focus,
.wsla-form-card .form-select:focus,
.wsla-cart-item-qty .form-control:focus,
.wsla-tax-grid .form-control:focus {
  border-color: var(--wsla-primary);
  box-shadow: none !important;
}
.wsla-confdomains-actions {
  margin-top: 24px;
  padding: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.wsla-confdomains-actions .wsla-btn,
.wsla-confdomains-actions .btn {
  min-width: 150px;
  backdrop-filter: blur(10px);
  padding: 12px 30px;
  border-radius: 50px;
  font-weight: 500;
  cursor: pointer;
  transition: 0.4s;
}

/* View cart and checkout shared */
.wsla-viewcart-layout,
.wsla-checkout-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 28px;
  align-items: flex-start;
}
.wsla-viewcart-main,
.wsla-checkout-main {
  display: grid;
  gap: 28px;
  min-width: 0;
}
.wsla-viewcart-summary,
.wsla-checkout-sidebar {
  position: sticky;
  top: 110px;
  min-width: 0;
  display: grid;
  gap: 18px;
}
.wsla-cart-table-head,
.wsla-cart-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px 110px;
  gap: 18px;
  align-items: center;
}
.wsla-cart-item.has-qty {
  grid-template-columns: minmax(0, 1fr) 110px 220px 110px;
}
.wsla-cart-table-head {
  padding: 18px 24px;
  border-bottom: 1px solid var(--wsla-line-soft);
  color: #334155;
  font-size: 13px;
  font-weight: 800;
}
.wsla-cart-items-list {
  display: grid;
}
.wsla-cart-item {
  padding: 15px 24px;
  border-bottom: 1px solid var(--wsla-line-soft);
}
.wsla-cart-item:last-child {
  border-bottom: 0;
}
.wsla-cart-item-main,
.wsla-review-item-main {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  min-width: 0;
}
.wsla-cart-item h3,
.wsla-checkout-review-item h3 {
  margin: 0 0 4px;
  color: #111827;
  font-size: 16px;
  line-height: 15px;
  font-weight: 600;
  overflow-wrap: anywhere;
}
.wsla-cart-item p,
.wsla-checkout-review-item p {
  margin: 0;
  color: #64748b;
  font-size: 13px;
  line-height: 20px;
  font-weight: 400;
}
.wsla-cart-subitems,
.wsla-checkout-review-subitems {
  margin-top: 12px;
  display: grid;
  gap: 6px;
  padding: 5px 12px;
  border: 1px solid #eef2f7;
  border-radius: 10px;
  background: #fbfcfe;
  color: #475569;
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
}
.wsla-cart-item-price,
.wsla-review-price strong {
  color: #111827;
  font-size: 15px;
  line-height: 22px;
  font-weight: 900;
}
.wsla-cart-item-price small,
.wsla-review-price small {
  display: block;
  margin-top: 3px;
  color: #e4682c;
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
}
.wsla-cart-item-actions {
  display: inline-flex;
  justify-content: flex-end;
  gap: 10px;
}
.wsla-cart-icon-btn,
.wsla-review-action {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: #64748b;
  text-decoration: none;
}
.wsla-cart-icon-btn:hover,
.wsla-review-action:hover {
  color: var(--wsla-primary);
  background: var(--wsla-soft-red);
  border-color: var(--wsla-soft-red);
}
.wsla-cart-review-actions {
  padding: 18px 24px;
  border-top: 1px solid var(--wsla-line-soft);
  display: flex;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.wsla-promo-card {
  overflow: hidden;
}
.wsla-promo-card h2 {
  margin: 0;
  padding: 18px 22px 12px;
  color: var(--wsla-dark);
  background: #fff;
  font-size: 24px;
  line-height: 32px;
  font-weight: 900;
}
.wsla-promo-form {
  padding: 18px 22px 22px;
  border-top: 1px solid #ffe1e1;
  background: #fff5f5;
}
.wsla-promo-input-wrap {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  min-height: 58px;
  padding: 6px;
  border: 1px solid #ffd8d8;
  border-radius: 14px;
  background: #fff;
  box-shadow: none !important;
}
.wsla-promo-input-wrap i {
  color: var(--wsla-primary);
  text-align: center;
  font-size: 20px;
}
.wsla-promo-input-wrap .form-control {
  min-height: 44px;
  border: 0;
  box-shadow: none !important;
  font-size: 14px;
  font-weight: 700;
}
.wsla-promo-input-wrap .wsla-btn {
  min-height: 44px;
  border-radius: 10px;
}
.wsla-tax-estimate-card {
  padding: 22px 24px;
}
.wsla-tax-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
  gap: 16px;
  align-items: end;
}

/* Order summary */
.wsla-order-summary-card {
  overflow: hidden;
}
.wsla-order-summary-header {
  padding: 20px 22px 16px;
  border-bottom: 1px solid var(--wsla-line-soft);
  background: var(--wsla-soft);
}
.wsla-order-summary-body {
  padding: 18px 22px 22px;
}
.wsla-summary-section,
.wsla-summary-totals,
.wsla-summary-recurring {
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--wsla-line-soft);
}
.wsla-summary-section h4,
.wsla-summary-recurring h4 {
  margin: 0 0 10px;
  color: var(--wsla-dark);
  font-size: 14px;
  font-weight: 900;
}
.wsla-summary-row {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 7px 0;
  color: #64748b;
  font-size: 14px;
  line-height: 22px;
  font-weight: 600;
}
.wsla-summary-row strong {
  color: var(--wsla-dark);
  font-weight: 900;
  white-space: nowrap;
}
.wsla-summary-row small {
  display: block;
  color: #94a3b8;
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
}
.wsla-summary-subrow {
  padding-inline-start: 12px;
  font-size: 13px;
}
.wsla-summary-discount strong {
  color: var(--wsla-success);
}
.wsla-summary-total-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 14px;
  margin-top: 10px;
}
.wsla-summary-total-row span {
  color: #64748b;
  font-size: 13px;
  font-weight: 800;
}
.wsla-summary-total-row strong {
  color: var(--wsla-dark);
  font-size: 34px;
  line-height: 40px;
  font-weight: 900;
}
.wsla-summary-checkout,
.wsla-checkout-submit {
  width: 100%;
  min-height: 52px;
  margin-top: 20px;
}

/* Checkout */
.wsla-checkout-section {
  padding: 24px;
}
.wsla-checkout-grid {
  display: grid;
  gap: 16px;
}
.wsla-checkout-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.wsla-field.full {
  grid-column: 1 / -1;
}
.wsla-field-help,
.wsla-field small {
  display: block;
  margin-top: 6px;
  color: #7c8798;
  font-size: 12px;
  line-height: 18px;
}
.wsla-account-choice,
.wsla-customer-type-tab,
.wsla-payment-method {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px;
  border: 1px solid var(--wsla-line);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition:
    border-color 0.16s ease,
    background-color 0.16s ease;
}
.wsla-account-choice.is-selected,
.wsla-customer-type-tab.is-selected,
.wsla-payment-method.is-selected {
  border-color: var(--wsla-primary);
  background: #fff8f8;
  box-shadow: none !important;
  margin-bottom: 10px;
}
.wsla-account-choice input,
.wsla-customer-type-tab input,
.wsla-payment-method input,
.wsla-payment-radio input,
.wsla-tos-check input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.wsla-radio-dot {
  width: 18px;
  height: 18px;
  min-width: 18px;
  margin-top: 3px;
  border: 2px solid #d7dde7;
  border-radius: 50%;
  background: #fff;
  box-shadow: none !important;
}
input:checked + .wsla-radio-dot {
  border-color: var(--wsla-primary);
  background: var(--wsla-primary);
}
.wsla-account-choice-content {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.wsla-account-choice-content strong,
.wsla-payment-name {
  color: var(--wsla-dark);
  font-size: 15px;
  line-height: 23px;
  font-weight: 900;
  min-width: 0;
}
.wsla-account-choice-content small {
  color: #5f6b7a;
  font-size: 14px;
  line-height: 24px;
  font-weight: 600;
}
.wsla-customer-type-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.wsla-credit-box {
  margin-bottom: 16px;
  padding: 18px;
  border: 1px solid var(--wsla-line);
  border-radius: 12px;
}
.wsla-credit-box small {
  display: block;
  color: #64748b;
  font-weight: 600;
  margin-bottom: 8px;
}
.wsla-credit-box strong {
  color: #111827;
  font-size: 30px;
  line-height: 36px;
  font-weight: 900;
}
.wsla-credit-options {
  display: grid;
  gap: 10px;
  margin-bottom: 18px;
}
.wsla-payment-radio,
.wsla-tos-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--wsla-dark);
  font-size: 14px;
  line-height: 23px;
  font-weight: 600;
  cursor: pointer;
}
.wsla-payment-methods {
  display: grid;
  gap: 10px;
  border: 0;
  background: transparent;
  overflow: visible;
}
.wsla-payment-method:hover {
  border-color: rgba(255, 66, 66, 0.35);
  background: #fffafa;
}
.wsla-payment-method {
  align-items: center;
}
.wsla-payment-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 64px;
  min-height: 24px;
  margin-inline-start: auto;
  color: #64748b;
  font-size: 22px;
  line-height: 1;
  font-weight: 900;
  text-align: end;
}
.wsla-payment-logo::before {
  content: "\f09d";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}
.wsla-payment-logo[data-wsla-gateway-logo*="paypal"]::before {
  content: "PayPal";
  font-family: Arial, Helvetica, sans-serif;
  color: #003087;
  font-size: 22px;
  font-style: italic;
  letter-spacing: 0;
}
.wsla-payment-logo[data-wsla-gateway-logo*="stripe"]::before {
  content: "stripe";
  font-family: Arial, Helvetica, sans-serif;
  color: #635bff;
  font-size: 24px;
  letter-spacing: 0;
}
.wsla-payment-logo[data-wsla-gateway-logo*="bank"]::before,
.wsla-payment-logo[data-wsla-gateway-logo*="transfer"]::before,
.wsla-payment-logo[data-wsla-gateway-logo*="wire"]::before {
  content: "\f19c";
  color: #1261d8;
}
.wsla-payment-logo[data-wsla-gateway-logo*="mail"]::before,
.wsla-payment-logo[data-wsla-gateway-logo*="offline"]::before {
  content: "\f0e0";
  color: #64748b;
}
.wsla-payment-logo[data-wsla-gateway-logo*="bitcoin"]::before,
.wsla-payment-logo[data-wsla-gateway-logo*="crypto"]::before {
  content: "BTC";
  font-family: Arial, Helvetica, sans-serif;
  color: #f7931a;
  font-size: 20px;
  letter-spacing: 0;
}
.wsla-payment-method.is-disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.wsla-payment-method small {
  margin-inline-start: 8px;
  padding: 4px 8px;
  border-radius: 20px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 12px;
  font-weight: 900;
}
.wsla-gateway-dynamic-fields {
  margin-top: 10px;
  padding: 16px;
  border: 1px solid #edf1f6;
  border-radius: 12px;
  background: #fbfcfe;
  overflow: visible;
}
.wsla-notes-field::placeholder {
  opacity: 0;
}
.wsla-checkout-security-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 16px 18px;
  border: 1px solid #ffd9a6;
  border-radius: 12px;
  background: #fff3e3;
  color: #c75a00;
  font-size: 14px;
  line-height: 24px;
  font-weight: 600;
}
.wsla-tos-check a {
  color: var(--wsla-primary);
  text-decoration: none;
  font-weight: 900;
}
.wsla-checkout-captcha {
  padding: 16px;
  border: 1px solid var(--wsla-line-soft);
  border-radius: 12px;
  background: #fff;
}
.wsla-inline-field-error {
  margin-top: 6px;
  color: var(--wsla-danger);
  font-size: 12px;
  line-height: 18px;
  font-weight: 700;
}
.form-control.is-invalid,
.wsla-field.is-invalid .form-control {
  border-color: var(--wsla-danger) !important;
}

.wsla-checkout-cart-review {
  padding: 0;
  overflow: hidden;
}
.wsla-checkout-cart-review .wsla-section-title-row {
  margin: 0;
  padding: 24px;
  border-bottom: 1px solid var(--wsla-line-soft);
}
.wsla-checkout-review-list {
  display: grid;
}
.wsla-checkout-review-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px 42px;
  gap: 18px;
  align-items: center;
  padding: 22px 24px;
  border-bottom: 1px solid var(--wsla-line-soft);
}
.wsla-review-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-inline-end: 6px;
  margin-top: 4px;
  padding: 5px 8px;
  border: 1px solid #e9eef5;
  border-radius: 10px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  line-height: 18px;
  font-weight: 800;
}
.wsla-review-price {
  text-align: end;
}
.wsla-checkout-review-subitems {
  margin: -8px 24px 0 84px;
}
html[dir="rtl"] .wsla-checkout-review-subitems {
  margin: -8px 84px 0 24px;
}
.wsla-review-subitem {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: #475569;
  font-size: 13px;
  line-height: 20px;
  font-weight: 700;
}
.wsla-review-subitem span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.wsla-review-subitem i {
  color: var(--wsla-primary);
}
.wsla-review-subitem strong {
  color: #111827;
  white-space: nowrap;
  font-weight: 900;
}

/* Unified modal and toast */
.wsla-action-modal .modal-content,
.wsla-remove-modal .modal-content {
  border: 0;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: none !important;
}
.wsla-action-modal .modal-header,
.wsla-remove-modal .modal-header {
  padding: 18px 22px;
  border-bottom: 1px solid #eef2f7;
  background: #f66257;
}
.wsla-action-modal .modal-title,
.wsla-remove-modal .modal-title {
  color: #2e3442;
  font-size: 17px;
  font-weight: 800;
}
.wsla-action-modal .modal-body,
.wsla-remove-modal .modal-body {
  padding: 22px;
  color: #5f6b7a;
  font-size: 15px;
  line-height: 24px;
  font-weight: 600;
}
.wsla-action-modal .modal-footer,
.wsla-remove-modal .modal-footer {
  padding: 0 22px 22px;
  border-top: 0;
  justify-content: flex-start;
  gap: 10px;
}
/* .wsla-action-modal .modal-footer .btn,
.wsla-remove-modal .modal-footer .btn { min-width: 86px; min-height: 42px; border-radius: 10px; font-size: 14px; font-weight: 800; box-shadow: none !important; } */
.wsla-action-modal .modal-footer .btn,
.wsla-remove-modal .modal-footer .btn {
  display: flex;
  justify-content: center;
  align-items: center;
}
.modal button.btn.btn-default {
  display: flex;
  justify-content: center;
  align-items: center;
}
.wsla-action-modal-confirm.btn.btn-primary,
.wsla-remove-modal-confirm.btn.btn-primary {
  background: var(--wsla-primary);
  border-color: var(--wsla-primary);
}
.wsla-action-modal .btn-outline-secondary,
.wsla-remove-modal .btn-outline-secondary {
  background: #fff;
  border: 1px solid #d8dee8;
  color: #2e3442;
}

.wsla-action-modal[data-wsla-action-modal-root] .modal-header {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
  background: #fff;
}
.wsla-action-modal-icon {
  width: 42px;
  height: 42px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  background: #eef4ff;
  color: var(--wsla-primary);
}
.wsla-action-modal-subtitle {
  margin: 3px 0 0;
  font-size: 12px;
  line-height: 18px;
  color: var(--wsla-muted);
  font-weight: 700;
}
.wsla-action-modal[data-wsla-action-modal-root][data-wsla-action-modal-type="danger"] .wsla-action-modal-icon,
.wsla-action-modal[data-wsla-action-modal-root][data-wsla-action-modal-type="error"] .wsla-action-modal-icon {
  background: var(--wsla-soft-red);
  color: var(--wsla-danger);
}
.wsla-action-modal[data-wsla-action-modal-root][data-wsla-action-modal-type="warning"] .wsla-action-modal-icon {
  background: #fff7ed;
  color: #d97706;
}
.wsla-action-modal[data-wsla-action-modal-root][data-wsla-action-modal-type="success"] .wsla-action-modal-icon {
  background: #e3f9f2;
  color: var(--wsla-success);
}
.wsla-action-modal[data-wsla-action-modal-root][data-wsla-action-modal-type="danger"] .wsla-action-modal-confirm,
.wsla-action-modal[data-wsla-action-modal-root][data-wsla-action-modal-type="error"] .wsla-action-modal-confirm {
  background: var(--wsla-danger);
  border-color: var(--wsla-danger);
}
.wsla-action-modal-confirm[hidden],
[data-wsla-action-modal-cancel][hidden] {
  display: none !important;
}

.wsla-toast-stack {
  position: fixed;
  top: 20px;
  inset-inline-end: 20px;
  z-index: 1085;
  display: grid;
  gap: 10px;
  max-width: min(360px, calc(100vw - 24px));
}
.wsla-toast {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid #e7ecf2;
  border-radius: 14px;
  background: #fff;
  box-shadow: none !important;
  transition:
    opacity 0.2s ease,
    transform 0.2s ease;
}
.wsla-toast i {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  flex: 0 0 auto;
}
.wsla-toast strong {
  display: block;
  color: var(--wsla-dark);
  font-size: 14px;
  line-height: 20px;
  font-weight: 900;
  margin-bottom: 3px;
}
.wsla-toast p {
  margin: 0;
  color: var(--wsla-muted);
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
}
.wsla-toast--success {
  border-color: rgba(1, 170, 93, 0.16);
}
.wsla-toast--success i {
  background: #e3f9f2;
  color: var(--wsla-success);
}
.wsla-toast--error {
  border-color: rgba(235, 36, 59, 0.16);
}
.wsla-toast--error i {
  background: var(--wsla-soft-red);
  color: var(--wsla-danger);
}

/* Loading states */
[data-wsla-domain-add].is-loading,
[data-wsla-domain-add][aria-busy="true"],
.wsla-btn.is-loading,
.wsla-btn[aria-busy="true"] {
  pointer-events: none;
  opacity: 0.88;
}
[data-wsla-domain-add].is-loading i,
.wsla-btn.is-loading i {
  display: none;
}
[data-wsla-domain-add].is-loading::after,
.wsla-btn.is-loading::after {
  content: "";
  width: 14px;
  height: 14px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  display: inline-block;
  margin-inline-start: 8px;
  animation: wsla-domain-add-spin 0.7s linear infinite;
}
[data-wsla-domain-add].is-added {
  background: #1bc577 !important;
  border-color: #1bc577 !important;
  color: #fff !important;
  pointer-events: none;
}
@keyframes wsla-domain-add-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (max-width: 1199.98px) {
  .wsla-viewcart-layout,
  .wsla-checkout-layout {
    grid-template-columns: 1fr;
  }
  .wsla-viewcart-summary,
  .wsla-checkout-sidebar {
    position: static;
  }
  .wsla-tld-spotlight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .wsla-hero,
  .wsla-domain-hero {
    padding: 30px;
    min-height: auto;
  }
  .wsla-domain-hero-art {
    display: none;
  }
  .wsla-domain-search-head,
  .wsla-domain-block-head,
  .wsla-confdomains-header,
  .wsla-checkout-header,
  .wsla-viewcart-header,
  .wsla-section-title-row,
  .wsla-confdomain-top,
  .wsla-confdomains-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .wsla-domain-result-item,
  .wsla-domain-result-side {
    flex-direction: column;
    align-items: flex-start;
  }
  .wsla-domain-price {
    text-align: start;
    min-width: 0;
  }
  .wsla-tld-table {
    overflow-x: auto;
  }
  .wsla-tld-table-head,
  .wsla-tld-row {
    min-width: 820px;
  }
  .wsla-suggestion-grid,
  .wsla-nameserver-grid,
  .wsla-domain-fields-grid,
  .wsla-checkout-grid.two,
  .wsla-customer-type-tabs,
  .wsla-tax-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767.98px) {
  .wsla-container,
  .wsla-cart .wsla-container,
  .wsla-cart .wsla-container.wsla-container-fluid {
    padding-inline: 10px;
  }
  .wsla-order-clean-card,
  .wsla-checkout-section,
  .wsla-confdomain-card,
  .wsla-confdomains-nameservers {
    padding: 18px;
  }
  .wsla-hero,
  .wsla-domain-hero,
  .wsla-order-clean-card,
  .wsla-domain-search-card,
  .wsla-domain-result-item,
  .wsla-suggestion-card,
  .wsla-checkout-section,
  .wsla-cart-review-card,
  .wsla-promo-card {
    border-radius: 16px;
  }
  .wsla-domain-input-wrap {
    grid-template-columns: 44px minmax(0, 1fr);
    padding: 8px;
  }
  .wsla-domain-input-wrap .wsla-btn {
    grid-column: 1 / -1;
    width: 100%;
    margin-top: 8px;
  }
  .wsla-domain-continue-bar {
    flex-direction: column;
    align-items: stretch;
  }
  .wsla-domain-continue-bar .wsla-btn {
    width: 100%;
  }
  .wsla-tld-spotlight-grid {
    grid-template-columns: 1fr;
  }
  .wsla-suggestion-card {
    flex-direction: column;
    align-items: flex-start;
  }
  .wsla-suggestion-foot {
    width: 100%;
    justify-content: space-between;
  }
  .wsla-cart-table-head {
    display: none;
  }
  .wsla-cart-item,
  .wsla-cart-item.has-qty,
  .wsla-checkout-review-item {
    grid-template-columns: 1fr;
  }
  .wsla-cart-item-actions {
    justify-content: flex-start;
  }
  .wsla-promo-input-wrap {
    grid-template-columns: 44px minmax(0, 1fr);
  }
  .wsla-promo-input-wrap .wsla-btn {
    grid-column: 1 / -1;
    width: 100%;
  }
  .wsla-checkout-review-subitems,
  html[dir="rtl"] .wsla-checkout-review-subitems {
    margin: 0 18px;
  }
  .wsla-review-subitem {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  .wsla-payment-method small {
    margin-inline-start: 0;
    margin-top: 4px;
  }
  
.wsla-toast-stack {
    top: 12px;
    inset-inline: 12px;
    max-width: none;
  }
}

/* Promo code refined layout */
.wsla-promo-input-wrap.is-applied {
  grid-template-columns: 44px minmax(0, 1fr) 42px auto;
}

.wsla-promo-remove-inline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: #fff5f5;
  color: var(--wsla-primary);
  text-decoration: none !important;
  transition:
    background-color 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease;
}

.wsla-promo-remove-inline:hover,
.wsla-promo-remove-inline:focus {
  background: var(--wsla-primary);
  border-color: var(--wsla-primary);
  color: #fff;
}

.wsla-promo-remove-inline i {
  color: inherit;
  font-size: 15px;
}

.wsla-applied-promo {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
  color: #4b5563;
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
}

.wsla-applied-promo-code {
  display: inline-flex;
  align-items: center;
  padding: 4px 9px;
  border-radius: 999px;
  background: #fff;
  color: var(--wsla-dark);
  font-weight: 900;
}

.wsla-applied-promo-desc {
  color: #4b5563;
}

@media (max-width: 767.98px) {
  .wsla-promo-input-wrap.is-applied {
    grid-template-columns: 44px minmax(0, 1fr) 42px;
  }

  .wsla-promo-input-wrap.is-applied .wsla-promo-submit {
    grid-column: 1 / -1;
    width: 100%;
    margin-top: 8px;
  }
}

.wsla-suggestion-more-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px;
}
/* Products / Services page: /store/ and cart.php?gid=...
   Scope: customer-created WHMCS products in wslatheme_cart order form only. */
.wsla-products-page {
  padding: 0 0 56px;
}

.wsla-products-page .wsla-products-hero {
  margin-bottom: 26px;
}

.wsla-products-hero .wsla-hero-inner {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.wsla-products-trust {
  display: grid;
  gap: 10px;
  min-width: 230px;
}

.wsla-products-trust span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.9);
  font-size: 12px;
  line-height: 18px;
  font-weight: 800;
  white-space: nowrap;
}

.wsla-products-layout {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 16px;
  align-items: flex-start;
}

.wsla-products-sidebar {
  position: sticky;
  top: 110px;
  min-width: 0;
}

.wsla-products-sidebar-card,
.wsla-products-panel,
.wsla-product-card,
.wsla-products-empty {
  background: #fff;
  border: 1px solid var(--wsla-line-soft);
  border-radius: var(--wsla-radius-lg);
  box-shadow: none !important;
}

.wsla-products-sidebar-card {
  overflow: hidden;
}

.wsla-products-sidebar-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 20px;
  border-bottom: 1px solid var(--wsla-line-soft);
  background: linear-gradient(180deg, #fff, #fbfcfe);
}

.wsla-products-sidebar-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 14px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 18px;
}

.wsla-products-sidebar-head h2 {
  margin: 0;
  color: var(--wsla-dark);
  font-size: 17px;
  line-height: 24px;
  font-weight: 900;
}

.wsla-products-sidebar-head p {
  margin: 3px 0 0;
  color: var(--wsla-muted);
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
}

.wsla-products-category-list {
  display: grid;
  padding: 10px;
}

.wsla-products-category-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 40px;
  padding: 12px 13px;
  margin-bottom: 5px;
  border-radius: 8px;
  color: #4b5563;
  text-decoration: none !important;
  font-size: 15px;
  line-height: 20px;
  font-weight: 500;
  transition:
    background-color 0.16s ease,
    color 0.16s ease;
}

.wsla-products-category-link span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.wsla-products-category-link span i {
  color: var(--wsla-primary);
}

.wsla-products-category-link:hover,
.wsla-products-category-link:focus,
.wsla-products-category-link.is-active {
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
}

.wsla-products-category-arrow {
  font-size: 12px;
  opacity: 0.65;
}

html[dir="rtl"] .wsla-products-category-arrow,
body.body-rtl .wsla-products-category-arrow,
html[dir="rtl"] .wsla-product-order-btn .bi-arrow-right,
body.body-rtl .wsla-product-order-btn .bi-arrow-right {
  transform: rotate(180deg);
}

.wsla-products-sidebar-empty {
  padding: 18px 20px;
  color: var(--wsla-muted);
  font-size: 13px;
  line-height: 22px;
  font-weight: 700;
}

.wsla-products-main {
  min-width: 0;
}

.wsla-products-panel {
  padding: 24px;
}

.wsla-products-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
}

.wsla-products-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 6px 11px;
  border-radius: 999px;
  background: #f3f6f9;
  color: #64748b;
  font-size: 12px;
  line-height: 18px;
  font-weight: 900;
  white-space: nowrap;
}

.wsla-products-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 25px;
}

.wsla-product-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 22px;
  overflow: hidden;
  transition:
    border-color 0.16s ease,
    transform 0.16s ease;
}

.wsla-product-card:hover {
  border-color: rgba(246, 98, 87, 0.28);
  transform: translateY(-2px);
  box-shadow: none !important;
}

.wsla-product-card.is-featured {
  /* border-color: rgba(246, 98, 87, .42); */
  background: snow;
}

.wsla-product-badge {
  position: absolute;
  top: 16px;
  inset-inline-end: 16px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 9px;
  border-radius: 999px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 11px;
  line-height: 16px;
  font-weight: 900;
}

.wsla-product-card-top {
  display: flex;
  /* align-items: flex-start; */
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
  padding-inline-end: 76px;
}

html[dir="rtl"] .wsla-product-card-top,
body.body-rtl .wsla-product-card-top {
  padding-inline-end: 0;
  padding-inline-start: unset;
}

.wsla-product-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  min-width: 50px;
  border-radius: 16px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 22px;
}

.wsla-product-heading h3 {
  margin: 0;
  color: var(--wsla-dark);
  font-size: 20px;
  line-height: 29px;
  font-weight: 600;
  letter-spacing: -0.2px;
}

.wsla-product-heading p {
  margin: 5px 0 0;
  color: var(--wsla-muted);
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
}

.wsla-product-desc {
  color: #3f4756;
  font-size: 14px;
  line-height: 25px;
  font-weight: 500;
}

.wsla-product-desc p,
.wsla-product-desc ul,
.wsla-product-desc ol {
  margin-top: 0;
  margin-bottom: 10px;
}

.wsla-product-desc strong,
.wsla-product-desc b {
  color: var(--wsla-dark);
  font-weight: 600;
}

.wsla-product-features {
  display: grid;
  gap: 9px;
  margin: 16px 0 22px;
  padding: 0;
  list-style: none;
}

.wsla-product-features li {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  color: #4b5563;
  font-size: 13px;
  line-height: 20px;
  font-weight: 700;
}

.wsla-product-features i {
  margin-top: 2px;
  color: var(--wsla-success);
  font-size: 14px;
}

.wsla-product-features strong {
  color: var(--wsla-dark);
  font-weight: 900;
}

.wsla-product-foot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid var(--wsla-line-soft);
}

.wsla-product-price-label {
  display: block;
  margin-bottom: 4px;
  color: var(--wsla-muted);
  font-size: 14px;
  line-height: 18px;
  font-weight: 600;
}

.wsla-product-price {
  color: var(--wsla-dark);
  font-size: 50px;
  line-height: 32px;
  margin: 20px 0px 20px 0px;
  font-weight: 600;
  letter-spacing: -0.4px;
}

.wsla-product-price span {
  color: var(--wsla-muted);
  font-size: 15px;
  line-height: 18px;
  font-weight: 500;
}

.wsla-product-order-btn {
  min-width: 128px;
  white-space: nowrap;
}

.wsla-products-empty {
  padding: 48px 24px;
  text-align: center;
}

.wsla-products-empty i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  margin-bottom: 14px;
  border-radius: 18px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 26px;
}

.wsla-products-empty h3 {
  margin: 0 0 6px;
  color: var(--wsla-dark);
  font-size: 22px;
  line-height: 30px;
  font-weight: 900;
}

.wsla-products-empty p {
  margin: 0;
  color: var(--wsla-muted);
  font-size: 14px;
  line-height: 22px;
  font-weight: 600;
}

@media (max-width: 1399.98px) {
  .wsla-products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1199.98px) {
  .wsla-products-layout {
    grid-template-columns: 250px minmax(0, 1fr);
    gap: 14px;
  }
}

@media (max-width: 991.98px) {
  .wsla-products-hero .wsla-hero-inner,
  .wsla-products-panel-head,
  .wsla-product-foot {
    flex-direction: column;
    align-items: stretch;
  }

  .wsla-products-trust {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .wsla-products-layout {
    grid-template-columns: 1fr;
  }

  .wsla-products-sidebar {
    position: static;
  }

  .wsla-products-category-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .wsla-products-panel {
    padding: 18px;
    border-radius: 16px;
  }

  .wsla-products-grid,
  .wsla-products-category-list {
    grid-template-columns: 1fr;
  }

  .wsla-product-card {
    padding: 18px;
    border-radius: 16px;
  }

  .wsla-product-card-top,
  html[dir="rtl"] .wsla-product-card-top,
  body.body-rtl .wsla-product-card-top {
    padding-inline: 0;
  }

  .wsla-product-badge {
    position: static;
    align-self: flex-start;
    margin-bottom: 12px;
  }

  .wsla-product-order-btn {
    width: 100%;
  }
}

/* Configure product page: menu column + content column */
.wsla-config-page {
  padding-top: 0;
}

.wsla-config-page .wsla-config-hero {
  margin-bottom: 24px;
}

.wsla-config-hero .wsla-hero-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  width: 100%;
}

.wsla-config-trust {
  display: grid;
  gap: 10px;
  min-width: 250px;
}

.wsla-config-trust span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 10px 13px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.92);
  font-size: 13px;
  line-height: 20px;
  font-weight: 800;
  white-space: nowrap;
}

.wsla-config-layout {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 28px;
  align-items: flex-start;
}

.wsla-config-sidebar {
  position: sticky;
  top: 110px;
  min-width: 0;
}

.wsla-config-sidebar-card,
.wsla-config-panel,
.wsla-config-summary-section,
.wsla-config-option-box,
.wsla-config-field-box,
.wsla-config-addon-card {
  background: #fff;
  border: 1px solid var(--wsla-line-soft);
  border-radius: var(--wsla-radius-lg);
  box-shadow: none !important;
}

.wsla-config-sidebar-card {
  padding: 18px;
}

.wsla-config-sidebar-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--wsla-line-soft);
}

.wsla-config-sidebar-icon,
.wsla-config-current-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 14px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 19px;
}

.wsla-config-sidebar-head h2 {
  margin: 0;
  color: var(--wsla-dark);
  font-size: 18px;
  line-height: 24px;
  font-weight: 900;
}

.wsla-config-sidebar-head p {
  margin: 3px 0 0;
  color: var(--wsla-muted);
  font-size: 12px;
  line-height: 18px;
  font-weight: 700;
}

.wsla-config-menu-list {
  display: grid;
  gap: 8px;
}

.wsla-config-menu-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: #fff;
  color: #3f4756;
  text-decoration: none !important;
  font-size: 13px;
  line-height: 20px;
  font-weight: 800;
  transition:
    background-color 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease;
}

.wsla-config-menu-link span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.wsla-config-menu-link span i {
  color: var(--wsla-primary);
}

.wsla-config-menu-link:hover,
.wsla-config-menu-link:focus,
.wsla-config-menu-link.is-active {
  background: var(--wsla-soft-red);
  border-color: var(--wsla-soft-red);
  color: var(--wsla-primary);
}

.wsla-config-menu-arrow {
  color: #a3acbb;
  font-size: 12px;
}

html[dir="rtl"] .wsla-config-menu-arrow,
body.body-rtl .wsla-config-menu-arrow {
  transform: rotate(180deg);
}

.wsla-config-current-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 16px;
  padding: 14px;
  border-radius: 14px;
  background: #fbfcfe;
  border: 1px solid var(--wsla-line-soft);
}

.wsla-config-current-card small {
  display: block;
  margin-bottom: 3px;
  color: var(--wsla-muted);
  font-size: 12px;
  line-height: 18px;
  font-weight: 800;
}

.wsla-config-current-card strong {
  display: block;
  color: var(--wsla-dark);
  font-size: 14px;
  line-height: 20px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.wsla-config-main {
  min-width: 0;
}

.wsla-config-panel {
  padding: 26px;
}

.wsla-config-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--wsla-line-soft);
}

.wsla-config-sections {
  display: grid;
  gap: 18px;
}

.wsla-form-card.wsla-config-section {
  padding: 22px;
  border-radius: 16px;
}

.wsla-config-section-title {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 18px;
}

.wsla-config-section-title span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  min-width: 38px;
  border-radius: 12px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 17px;
}

.wsla-config-section-title h3 {
  margin: 0;
  color: var(--wsla-dark);
  font-size: 19px;
  line-height: 26px;
  font-weight: 900;
}

.wsla-config-option-box,
.wsla-config-field-box {
  padding: 16px;
  border-radius: 14px;
  box-shadow: none !important;
}

.wsla-config-field-box label,
.wsla-config-section label {
  display: block;
  margin-bottom: 8px;
  color: var(--wsla-dark);
  font-size: 13px;
  line-height: 20px;
  font-weight: 900;
}

.wsla-config-addon-card {
  position: relative;
  display: flex;
  gap: 12px;
  min-height: 100%;
  padding: 16px;
  border-radius: 14px;
  box-shadow: none !important;
  cursor: pointer;
  transition:
    border-color 0.16s ease,
    background-color 0.16s ease;
}

.wsla-config-addon-card:hover {
  border-color: rgba(246, 98, 87, 0.32);
  background: #fffafa;
}

.wsla-config-addon-card input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.wsla-config-addon-card input:checked + .wsla-checkbox-ui {
  border-color: var(--wsla-primary);
  background: var(--wsla-primary);
  box-shadow: none !important;
}

.wsla-config-addon-content {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.wsla-config-addon-content strong {
  color: var(--wsla-dark);
  font-size: 14px;
  line-height: 20px;
  font-weight: 900;
}

.wsla-config-addon-content small {
  color: var(--wsla-muted);
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
}

.wsla-config-addon-content em {
  color: var(--wsla-primary);
  font-size: 13px;
  line-height: 20px;
  font-style: normal;
  font-weight: 900;
}

.wsla-config-summary-section {
  overflow: hidden;
  border-radius: 16px;
  box-shadow: none !important;
}

.wsla-config-summary-section .wsla-order-summary-card {
  border: 0;
  border-radius: 0;
  box-shadow: none !important;
}

.wsla-config-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--wsla-line-soft);
}

@media (max-width: 1199.98px) {
  .wsla-config-layout {
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 20px;
  }
}

@media (max-width: 991.98px) {
  .wsla-config-hero .wsla-hero-inner,
  .wsla-config-panel-head,
  .wsla-config-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .wsla-config-trust {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .wsla-config-layout {
    grid-template-columns: 1fr;
  }

  .wsla-config-sidebar {
    position: static;
  }

  .wsla-config-menu-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .wsla-config-panel,
  .wsla-form-card.wsla-config-section {
    padding: 18px;
    border-radius: 16px;
  }

  .wsla-config-menu-list {
    grid-template-columns: 1fr;
  }

  .wsla-config-actions .wsla-btn {
    width: 100%;
  }
}

/* Products group icon/title refinements */
.wsla-products-group-title {
  display: flex;
  align-items: center;
  gap: 12px;
}

.wsla-products-group-title-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 14px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 20px;
}

.wsla-products-group-copy {
  display: grid;
  gap: 4px;
}

.wsla-products-group-copy strong {
  color: var(--wsla-dark);
  font-size: 14px;
  line-height: 22px;
  font-weight: 600;
}

.wsla-products-group-copy span {
  color: var(--wsla-muted);
  font-size: 14px;
  line-height: 22px;
  font-weight: 500;
}

.wsla-store-domain-menu-card {
  margin-top: 18px;
}

.wsla-store-domain-menu-card .wsla-products-sidebar-head {
  border-bottom: 1px solid var(--wsla-line-soft);
}

.wsla-store-domain-menu-card .wsla-products-category-link span i {
  width: 18px;
  min-width: 18px;
  text-align: center;
}

.wsla-product-card.is-out-of-stock {
  opacity: 0.72;
}

.wsla-product-card.is-out-of-stock .wsla-product-order-btn-disabled {
  background: #eef1f5 !important;
  border-color: #eef1f5 !important;
  color: #8b95a5 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  box-shadow: none !important;
}

.wsla-product-card.is-out-of-stock .wsla-product-order-btn-disabled:hover,
.wsla-product-card.is-out-of-stock .wsla-product-order-btn-disabled:focus {
  background: #eef1f5 !important;
  border-color: #eef1f5 !important;
  color: #8b95a5 !important;
  transform: none !important;
}

/* Product domain selection flow - configureproductdomain.tpl */
.wsla-product-domain-choice-card {
  overflow: hidden;
}

.wsla-product-domain-options {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  padding: 4px 0 18px;
}

.wsla-product-domain-option {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  padding: 15px 16px;
  border: 1px solid var(--wsla-line);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition:
    border-color 0.16s ease,
    background-color 0.16s ease;
}

.wsla-product-domain-option:hover,
.wsla-product-domain-option.is-active {
  border-color: var(--wsla-primary);
  background: #fff8f8;
  box-shadow: none !important;
}

.wsla-product-domain-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.wsla-product-domain-option-text {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.wsla-product-domain-option-text strong {
  color: var(--wsla-dark);
  font-size: 15px;
  line-height: 22px;
  font-weight: 900;
}

.wsla-product-domain-option-text small {
  color: var(--wsla-muted);
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
}

.wsla-product-domain-panel {
  display: none;
  padding-top: 18px;
  border-top: 1px solid var(--wsla-line-soft);
}

.wsla-product-domain-panel.is-active {
  display: block;
}

.wsla-product-domain-input-wrap {
  grid-template-columns: 52px minmax(0, 1fr) minmax(120px, 180px) auto;
}

.wsla-product-domain-input-wrap select.form-control,
.wsla-product-domain-input-wrap input.form-control,
.wsla-product-domain-panel select.form-control {
  min-height: 56px;
  padding: 0 12px;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.wsla-product-domain-free-note {
  margin-top: 16px;
}

@media (max-width: 767.98px) {
  .wsla-product-domain-input-wrap {
    grid-template-columns: 44px minmax(0, 1fr);
  }

  .wsla-product-domain-input-wrap select.form-control,
  .wsla-product-domain-input-wrap input.form-control,
  .wsla-product-domain-panel select.form-control,
  .wsla-product-domain-panel .wsla-btn {
    grid-column: 1 / -1;
  }

  .wsla-product-domain-panel .wsla-btn {
    width: 100%;
    margin-top: 8px;
  }
}
/* Confproduct configuration summary and addons refinements: cart.php?a=confproduct&i=... */
.wsla-confproduct-cart-page .wsla-config-layout {
  grid-template-columns: minmax(0, 1fr) 300px;
  align-items: flex-start;
}

.wsla-confproduct-cart-page .wsla-config-main {
  order: 1;
}

.wsla-confproduct-cart-page .wsla-config-summary-sidebar {
  order: 2;
  position: sticky !important;
  top: 110px;
  align-self: flex-start;
  height: max-content;
  z-index: 2;
}

html[dir="rtl"] .wsla-confproduct-cart-page .wsla-config-main,
body.body-rtl .wsla-confproduct-cart-page .wsla-config-main {
  order: 2;
}

html[dir="rtl"] .wsla-confproduct-cart-page .wsla-config-summary-sidebar,
body.body-rtl .wsla-confproduct-cart-page .wsla-config-summary-sidebar {
  order: 1;
}

.wsla-confproduct-summary-card {
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--wsla-line-soft);
  border-radius: var(--wsla-radius-lg);
  box-shadow: none !important;
}

.wsla-confproduct-summary-product {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--wsla-line-soft);
}

.wsla-confproduct-summary-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 14px;
  background: var(--wsla-soft-red);
  color: var(--wsla-primary);
  font-size: 18px;
}

.wsla-confproduct-summary-product strong {
  display: block;
  color: var(--wsla-dark);
  font-size: 14px;
  line-height: 20px;
  font-weight: 900;
}

.wsla-confproduct-summary-product small {
  display: block;
  margin-top: 3px;
  color: var(--wsla-muted);
  font-size: 12px;
  line-height: 18px;
  font-weight: 600;
  overflow-wrap: anywhere;
}

.wsla-confproduct-selected-section {
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--wsla-line-soft);
}

.wsla-confproduct-selected-section h4,
.wsla-confproduct-summary-subtitle {
  margin: 0 0 10px;
  color: var(--wsla-dark);
  font-size: 14px;
  line-height: 20px;
  font-weight: 900;
}

.wsla-confproduct-summary-subtitle {
  margin-top: 12px;
}

.wsla-confproduct-selected-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 7px 0;
  color: #64748b;
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
}

.wsla-confproduct-selected-item strong {
  color: var(--wsla-dark);
  font-weight: 900;
  text-align: end;
}

.wsla-confproduct-total-row {
  margin-top: 0;
}

.wsla-confproduct-total-row strong {
  font-size: 30px;
  line-height: 36px;
}

.wsla-confproduct-cart-page .wsla-available-addons-section {
  overflow: visible;
}

.wsla-confproduct-cart-page .wsla-marketconnect-addons {
  display: grid;
  gap: 16px;
}

.wsla-confproduct-cart-page .wsla-marketconnect-addon-output {
  padding: 18px;
  border: 1px solid var(--wsla-line-soft);
  border-radius: 16px;
  background: #fff;
  box-shadow: none !important;
}

.wsla-confproduct-cart-page .wsla-marketconnect-addon-output img {
  max-width: 86px;
  height: auto;
}

.wsla-confproduct-cart-page .wsla-marketconnect-addon-output h3,
.wsla-confproduct-cart-page .wsla-marketconnect-addon-output h4 {
  color: var(--wsla-dark);
  font-weight: 900;
}

.wsla-confproduct-cart-page .wsla-marketconnect-addon-output label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 42px;
  margin: 0;
  padding: 9px 10px;
  border-radius: 10px;
  color: var(--wsla-dark);
  font-size: 13px;
  line-height: 20px;
  font-weight: 800;
  cursor: pointer;
}

.wsla-confproduct-cart-page .wsla-marketconnect-addon-output label:hover,
.wsla-confproduct-cart-page .wsla-marketconnect-addon-output label.is-selected {
  background: #fff8f8;
  color: var(--wsla-primary);
}

.wsla-confproduct-cart-page .wsla-config-addon-card.is-selected,
.wsla-confproduct-cart-page .wsla-config-addon-card:has(input:checked) {
  border-color: rgba(246, 98, 87, 0.42);
  background: #fff8f8;
}

.wsla-confproduct-cart-page .wsla-config-radio-list {
  display: grid;
  gap: 10px;
  margin-top: 8px;
}

.wsla-confproduct-cart-page .wsla-config-choice-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--wsla-line-soft);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
}

.wsla-confproduct-cart-page .wsla-config-choice-row:hover,
.wsla-confproduct-cart-page .wsla-config-choice-row:has(input:checked) {
  border-color: rgba(246, 98, 87, 0.42);
  background: #fff8f8;
}

.wsla-confproduct-cart-page .wsla-config-choice-row input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.wsla-confproduct-cart-page .wsla-config-choice-row strong {
  color: var(--wsla-dark);
  font-size: 13px;
  line-height: 20px;
  font-weight: 900;
}

@media (max-width: 1199.98px) {
  .wsla-confproduct-cart-page .wsla-config-layout {
    grid-template-columns: minmax(0, 1fr) 300px;
  }
}

@media (max-width: 991.98px) {
  .wsla-confproduct-cart-page .wsla-config-layout {
    grid-template-columns: 1fr;
  }

  .wsla-confproduct-cart-page .wsla-config-main,
  .wsla-confproduct-cart-page .wsla-config-summary-sidebar,
  html[dir="rtl"] .wsla-confproduct-cart-page .wsla-config-main,
  body.body-rtl .wsla-confproduct-cart-page .wsla-config-main,
  html[dir="rtl"] .wsla-confproduct-cart-page .wsla-config-summary-sidebar,
  body.body-rtl .wsla-confproduct-cart-page .wsla-config-summary-sidebar {
    order: initial;
  }

  .wsla-confproduct-cart-page .wsla-config-summary-sidebar {
    position: static !important;
  }
}

/* Disable sticky behavior for checkout only */
/* body:has(#frmCheckout) .wsla-order-summary-card,
body:has(#frmCheckout) .wsla-config-sidebar,
body:has(form[action*="cart.php?a=checkout"]) .wsla-order-summary-card,
body:has(form[action*="cart.php?a=checkout"]) .wsla-config-sidebar {
    position: relative !important;
    top: 0 !important;
    max-height: none !important;
    overflow-y: visible !important;
} */


/* ========================================================================
   WSLA migrated page-scoped CSS from template files
   ======================================================================== */


/* === Migrated from addons.tpl:1 === */
/* =========================================
   Page layout: sidebar plus content
   ========================================= */
   .wsla-cart-page {
    padding: 40px 0;
    background: transparent;
}

.wsla-flex-layout {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

/* Sidebar */
.wsla-products-sidebar {
    width: 280px;
    flex-shrink: 0;
}

/* Main content */
.wsla-main-content {
    flex-grow: 1;
    min-width: 0; /* prevents incorrect flex expansion */
}

.wsla-main-title {
    font-size: 24px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 25px;
}

/* =========================================
   Addon row styling
   ========================================= */
.wsla-addons-list {
    display: flex;
    flex-direction: column;
    gap: 15px; /* spacing between addons */
}

.wsla-addon-row {
    display: flex;
    align-items: center;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px; /* soft rounded corners */
    padding: 20px;
    transition: all 0.2s ease;
    gap: 20px;
}

.wsla-addon-row:hover {
    border-color: #cbd5e1;
    box-shadow: none !important;
}

/* Icon box */
.wsla-addon-icon {
    width: 70px;
    height: 70px;
    background: #f8fafc;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    color: #84cc16; /* green accent */
    flex-shrink: 0;
}

/* Addon details */
.wsla-addon-details {
    flex-grow: 1;
}

.wsla-addon-details h3 {
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 5px 0;
}

.wsla-addon-desc {
    font-size: 14px;
    color: #64748b;
    line-height: 1.5;
}

/* Price and button section */
.wsla-addon-action {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* keeps alignment clean */
    gap: 8px;
    min-width: 120px;
}

html[dir="rtl"] .wsla-addon-action {
    align-items: flex-start; /* RTL alignment */
}

.wsla-addon-service-label {
    display: block;
    margin-top: 12px;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #475569;
}

.wsla-addon-service-select {
    max-width: 420px;
    height: 38px;
    border: 1px solid #dbe3ef;
    border-radius: 6px;
    color: #0f172a;
    background: #fff;
    font-size: 14px;
}

.wsla-addon-order-form {
    margin: 0;
}

.wsla-addon-setup-fee {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    color: #64748b;
}

.wsla-addon-price {
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}

/* Blue outline button */
.wsla-btn-outline-blue {
    display: inline-block;
    border: 1px solid #3b82f6;
    color: #3b82f6 !important;
    background: transparent;
    padding: 6px 16px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none !important;
    transition: all 0.2s ease;
    text-align: center;
}

.wsla-btn-outline-blue:hover {
    background: #eff6ff; /* light blue hover */
    border-color: #2563eb;
    color: #2563eb !important;
}

/* =========================================
   Mobile responsiveness
   ========================================= */
@media (max-width: 991px) {
    .wsla-flex-layout {
        flex-direction: column;
    }
    
    .wsla-products-sidebar {
        width: 100%;
    }
}

@media (max-width: 576px) {
    .wsla-addon-row {
        flex-direction: column;
        align-items: flex-start;
        text-align: center;
    }
    
    .wsla-addon-icon {
        margin: 0 auto; /* center icon on mobile */
    }
    
    .wsla-addon-details {
        text-align: center;
        width: 100%;
    }
    
    .wsla-addon-action {
        align-items: center;
        width: 100%;
        margin-top: 10px;
    }
    
    html[dir="rtl"] .wsla-addon-action {
        align-items: center;
    }
}
/* === End migrated from addons.tpl === */


/* === Migrated from checkout.tpl:455 === */
.wsla-gateway-dynamic-fields { display: block; width: 100%; max-width: 100%; overflow: visible !important; position: relative; }
    .wsla-gateway-dynamic-fields iframe, .wsla-gateway-dynamic-fields .StripeElement, .wsla-gateway-dynamic-fields .stripe-input, .wsla-gateway-dynamic-fields .hosted-field, .wsla-gateway-dynamic-fields .hosted-fields, .wsla-gateway-dynamic-fields .gateway-input { max-width: 100%; }
    .wsla-payment-methods { overflow: visible !important; }
    .wsla-password-tools { margin-top: -4px; }
    .wsla-password-tools .password-strength-meter { width: 100%; }
    .wsla-password-strength-meter { margin-top: 12px; }
    .wsla-password-strength-meter .progress { height: 8px; margin-bottom: 6px; }
    .wsla-checkout-form .wsla-field { position: relative; }
    .wsla-checkout-form .wsla-field > label { position: absolute; top: 17px; left: 18px; right: auto; z-index: 3; max-width: calc(100% - 36px); margin: 0; padding: 0 8px; background: linear-gradient(#fff, #fff); border-radius: 999px; color: #6b7890; font-size: 14px; font-weight: 700; line-height: 1.2; pointer-events: none; transition: top .16s ease, font-size .16s ease, color .16s ease, background-color .16s ease; }
    html[dir="rtl"] .wsla-checkout-form .wsla-field > label, body.body-rtl .wsla-checkout-form .wsla-field > label { left: auto; right: 18px; }
    .wsla-checkout-form .wsla-field.is-focused > label, .wsla-checkout-form .wsla-field.is-filled > label, .wsla-checkout-form .wsla-field.has-select > label { top: -8px; font-size: 12px; color: #ff4242; background: #fff; }
    .wsla-checkout-form .wsla-field.is-focused > label { box-shadow: none !important; }
    .wsla-checkout-form .wsla-field.has-select > label { background: #fff; }
    .wsla-checkout-form .wsla-field .form-control, .wsla-checkout-form .wsla-field select.form-control, .wsla-checkout-form .wsla-field textarea.form-control { min-height: 58px; border-radius: 14px; border: 1px solid #d8dee9; background-color: #fff; color: #1f2937; padding: 21px 17px 8px; box-shadow: none !important; }
    .wsla-checkout-form .wsla-field .form-control:focus, .wsla-checkout-form .wsla-field select.form-control:focus, .wsla-checkout-form .wsla-field textarea.form-control:focus { border-color: #ff4242; box-shadow: none !important; outline: 0; }
    .wsla-checkout-captcha { display: block; width: 100%; overflow: visible !important; }
    .wsla-checkout-captcha iframe, .wsla-checkout-captcha .g-recaptcha { max-width: 100%; }
    .wsla-checkout-alert-compact { border-radius: 16px !important; padding: 16px 18px !important; margin-bottom: 22px !important; }
    .wsla-alert-inline { display: flex; align-items: flex-start; gap: 12px; }
    .wsla-alert-inline i { font-size: 18px; line-height: 1.2; margin-top: 1px; }
    .wsla-alert-inline strong { display: block; margin-bottom: 3px; }
    .wsla-alert-inline small { display: block; color: inherit; opacity: .84; font-weight: 600; }
    .wsla-checkout-form .wsla-field { margin-bottom: 18px; }
    .wsla-checkout-form .wsla-field > label { padding: 0 8px !important; background: #fff !important; border-radius: 999px !important; box-shadow: none !important; }
    .wsla-checkout-form .wsla-field .form-control, .wsla-checkout-form .wsla-field select.form-control, .wsla-checkout-form .wsla-field textarea.form-control { min-height: 62px; border-radius: 16px; transition: border-color .16s ease, background-color .16s ease; }
    .wsla-checkout-form .wsla-field textarea.form-control { min-height: 132px; resize: vertical; padding-top: 25px; }
    .wsla-checkout-form .wsla-field .form-control:hover, .wsla-checkout-form .wsla-field select.form-control:hover, .wsla-checkout-form .wsla-field textarea.form-control:hover { border-color: #c5cede; box-shadow: none !important; }
    .wsla-checkout-form .wsla-field .form-control:focus, .wsla-checkout-form .wsla-field select.form-control:focus, .wsla-checkout-form .wsla-field textarea.form-control:focus { box-shadow: none !important; }
    .wsla-checkout-form .wsla-field.is-invalid > label { color: #dc2626 !important; }
    .wsla-checkout-form .wsla-field.is-invalid .form-control, .wsla-checkout-form .wsla-field.is-invalid select.form-control, .wsla-checkout-form .wsla-field.is-invalid textarea.form-control { border-color: #ef4444 !important; box-shadow: none !important; }
    .wsla-field-error { display: flex; align-items: flex-start; gap: 7px; margin: 8px 2px 0; padding: 8px 10px; color: #b42318; background: #fff2f2; border: 1px solid rgba(239,68,68,.18); border-radius: 12px; font-size: 12.5px; font-weight: 800; line-height: 1.35; }
    .wsla-field-error i { font-size: 14px; line-height: 1.2; margin-top: 1px; color: #ef4444; }
    .wsla-field-help { display: block; margin-top: 8px; color: #7c8799; font-size: 12.5px; line-height: 1.45; }
    .wsla-checkout-captcha.is-empty, .wsla-checkout-captcha.is-invisible-captcha { margin: 0 !important; min-height: 0 !important; height: 0 !important; overflow: hidden !important; border: 0 !important; padding: 0 !important; }
    .wsla-checkout-review-subitems { margin: -8px 26px 16px 92px; border: 1px solid #edf1f7; border-radius: 14px; background: #fbfcfe; overflow: hidden; }
    html[dir="rtl"] .wsla-checkout-review-subitems, body.body-rtl .wsla-checkout-review-subitems { margin-left: 26px; margin-right: 92px; }
    .wsla-review-subitem { min-height: 44px; padding: 10px 14px; border-bottom: 1px solid #edf1f7; }
    .wsla-review-subitem:last-child { border-bottom: 0; }
/* === End migrated from checkout.tpl === */


/* === Migrated from complete.tpl:134 === */
.wsla-order-complete-page .wsla-complete-card {
        padding: 28px;
    }

    .wsla-complete-status {
        display: flex;
        align-items: flex-start;
        gap: 16px;
        margin-top: 20px;
        padding: 20px;
        border: 1px solid #eef2f7;
        border-radius: 16px;
        background: #fbfcfe;
    }

    .wsla-complete-status.is-paid {
        border-color: rgba(1, 170, 93, .22);
        background: #f0fdf7;
    }

    .wsla-complete-status.is-unpaid {
        border-color: rgba(255, 168, 0, .3);
        background: #fff8e8;
    }

    .wsla-complete-status-icon {
        width: 48px;
        height: 48px;
        min-width: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: var(--wsla-soft-red);
        color: var(--wsla-primary);
        font-size: 22px;
    }

    .wsla-complete-status.is-paid .wsla-complete-status-icon {
        background: #dff8ec;
        color: var(--wsla-success);
    }

    .wsla-complete-status.is-unpaid .wsla-complete-status-icon {
        background: #fff0c7;
        color: #c75a00;
    }

    .wsla-complete-status-body h3 {
        margin: 0 0 6px;
        color: var(--wsla-dark);
        font-size: 22px;
        line-height: 30px;
        font-weight: 900;
    }

    .wsla-complete-status-body p {
        margin: 0;
        color: var(--wsla-muted);
        font-size: 14px;
        line-height: 24px;
        font-weight: 600;
    }

    .wsla-complete-meta-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
        margin-top: 18px;
    }

    .wsla-complete-meta-item {
        padding: 16px;
        border: 1px solid #eef2f7;
        border-radius: 14px;
        background: #fff;
    }

    .wsla-complete-meta-item span {
        display: block;
        margin-bottom: 6px;
        color: var(--wsla-muted);
        font-size: 12px;
        line-height: 18px;
        font-weight: 800;
    }

    .wsla-complete-meta-item strong {
        display: block;
        color: var(--wsla-dark);
        font-size: 18px;
        line-height: 26px;
        font-weight: 900;
        overflow-wrap: anywhere;
    }

    .wsla-complete-confirmation {
        margin-top: 20px;
    }

    .wsla-complete-confirmation:empty {
        display: none;
    }

    .wsla-complete-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 22px;
    }

    .wsla-complete-actions .wsla-btn {
        min-width: 150px;
    }

    @media (max-width: 767.98px) {
        .wsla-order-complete-page .wsla-complete-card {
            padding: 18px;
        }

        .wsla-complete-status {
            flex-direction: column;
            padding: 16px;
        }

        .wsla-complete-meta-grid {
            grid-template-columns: 1fr;
        }

        .wsla-complete-actions .wsla-btn {
            width: 100%;
        }
    }
/* === End migrated from complete.tpl === */


/* === Migrated from configuredomains.tpl:258 === */
.wsla-confdomains-form .wsla-floating-field {
    position: relative;
}
.wsla-confdomains-form .wsla-floating-field > label {
    position: absolute;
    top: -8px;
    left: 15px;
    z-index: 3;
    max-width: calc(100% - 30px);
    margin: 0;
    padding: 0 7px;
    background: #fff;
    border-radius: 5px;
    color: #667085;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.25;
    pointer-events: none;
    box-shadow: none !important;
}
html[dir="rtl"] .wsla-confdomains-form .wsla-floating-field > label,
body.body-rtl .wsla-confdomains-form .wsla-floating-field > label {
    left: auto;
    right: 15px;
}
.wsla-confdomains-form .wsla-floating-field .form-control {
    min-height: 56px;
    border-radius: 14px;
    border: 1px solid #d8dee9;
    background: #fff;
    padding: 18px 16px 8px;
    /*box-shadow: none !important;*/
}
.wsla-confdomains-form .wsla-floating-field .form-control:focus {
    border-color: #ff4242;
    box-shadow: none !important;
    outline: 0;
}
/* === End migrated from configuredomains.tpl === */


/* === Migrated from configureproduct.tpl:104 === */
/* 1. Prevent WHMCS containers from clipping content */
.wsla-confproduct-cart-page .wsla-config-layout,
.wsla-confproduct-cart-page form#frmConfigureProduct {
    overflow: visible;
}
/* 2. Layout container row */
                .wsla-config-layout {
                    display: flex !important;
                    flex-wrap: wrap !important;
                    align-items: stretch !important; /* keeps columns same height */
                }

                /* 3. Sidebar */
                .wsla-config-layout .col-lg-4 {
                    display: block !important;
                    /* avoid flex here */
                }

                /* 4. Sidebar sticky */
                .wsla-config-sidebar {
                    position: -webkit-sticky !important;
                    position: sticky !important;
                    top: 120px !important; /* top offset while scrolling */
                    height: max-content !important;
                    /* prevents full-page height */
                    max-height: calc(100vh - 40px);
                    overflow-y: auto;
                    z-index: 1020 !important; /* keep above other elements */
                    
                    /* Scrollbar styling */
                    scrollbar-width: thin;
                }

                .wsla-config-sidebar::-webkit-scrollbar {
                    width: 4px;
                }
                .wsla-config-sidebar::-webkit-scrollbar-thumb {
                    background: rgba(0,0,0,0.1);
                    border-radius: 10px;
                }

                /* 5. Disable sticky on mobile */
                @media (max-width: 991px) {
                    .wsla-config-sidebar {
                        position: relative !important;
                        top: 0 !important;
                        max-height: none !important;
                        overflow-y: visible !important;
                        margin-bottom: 30px;
                    }
                }
/* === End migrated from configureproduct.tpl === */


/* === Migrated from configureproduct.tpl:417 === */
/* ========================================================
                                        1. MarketConnect addons as cards
                                        ======================================================== */
                                        .wsla-mc-addon-wrapper {
                                            background: #ffffff !important;
                                            border: 1px solid #e2e8f0 !important;
                                            border-radius: 8px !important;
                                            padding: 1.5rem !important;
                                            margin-bottom: 1.5rem !important;
                                            box-shadow: none !important;
                                            overflow: hidden !important;
                                        }
                                    
                                        .wsla-mc-addon-wrapper img,
                                        .wsla-mc-addon-wrapper i[class*="fa-"] {
                                            float: left !important;
                                            width: 80px !important;
                                            height: 80px !important;
                                            background: #f4f5f7 !important;
                                            border-radius: 6px !important;
                                            object-fit: contain !important;
                                            padding: 10px !important;
                                            margin-right: 1.5rem !important;
                                            margin-bottom: 1rem !important;
                                        }
                                    
                                        .wsla-mc-addon-wrapper h3,
                                        .wsla-mc-addon-wrapper h4,
                                        .wsla-mc-addon-wrapper .headline {
                                            font-size: 1.4rem !important;
                                            font-weight: 400 !important;
                                            color: #333333 !important;
                                            margin: 0 0 0.5rem 0 !important;
                                            padding-top: 0.5rem !important;
                                        }
                                        
                                        .wsla-mc-addon-wrapper p,
                                        .wsla-mc-addon-wrapper .tagline {
                                            font-size: 0.95rem !important;
                                            color: #555555 !important;
                                            margin: 0 0 0.5rem 0 !important;
                                        }
                                        
                                        .wsla-mc-addon-wrapper a {
                                            color: #2563eb !important;
                                            font-size: 0.9rem !important;
                                            text-decoration: none !important;
                                            display: inline-block !important;
                                            margin-bottom: 1.5rem !important;
                                        }
                                    
                                        .wsla-mc-addon-wrapper .radio,
                                        .wsla-mc-addon-wrapper div[class*="radio"] {
                                            clear: both !important;
                                            display: block !important;
                                            margin: 0 !important;
                                        }
                                    
                                        /* Hide disruptive line breaks */
                                        .wsla-mc-addon-wrapper br {
                                            display: none !important;
                                        }
                                    
                                        .wsla-mc-addon-wrapper label {
                                            display: flex !important;
                                            align-items: center !important;
                                            padding: 0.8rem 1.25rem !important;
                                            background: #f8fafc !important;
                                            border: 1px solid #e2e8f0 !important;
                                            border-radius: 6px !important;
                                            cursor: pointer !important;
                                            width: 100% !important;
                                            font-weight: 500 !important;
                                            color: #333333 !important;
                                            transition: all 0.2s !important;
                                            margin-top: 0.6rem !important;
                                            box-sizing: border-box !important;
                                        }
                                        
                                        .wsla-mc-addon-wrapper label:hover {
                                            border-color: #cbd5e1 !important;
                                        }
                                        
                                        .wsla-mc-addon-wrapper label:has(input[type="radio"]:checked) {
                                            border-color: #3b82f6 !important;
                                            background: #eff6ff !important;
                                        }
                                        
                                        .wsla-mc-addon-wrapper input[type="radio"] {
                                            margin-right: 1rem !important;
                                            transform: scale(1.2) !important;
                                        }
                                        
                                        .wsla-mc-addon-wrapper label span,
                                        .wsla-mc-addon-wrapper label i {
                                            margin-left: auto !important;
                                            font-weight: 700 !important;
                                            color: #1e293b !important;
                                        }
                                    
                                        /* ========================================================
                                        2. Standard addon styling and save fix
                                        ======================================================== */
                                        .wsla-addon-card {
                                            display: flex !important;
                                            align-items: center !important;
                                            background: #ffffff !important;
                                            border: 1px solid #e2e8f0 !important;
                                            border-radius: 8px !important;
                                            padding: 1.5rem !important;
                                            margin-bottom: 1.5rem !important;
                                            width: 100% !important;
                                            cursor: pointer !important;
                                            transition: all 0.2s ease !important;
                                        }
                                        
                                        .wsla-addon-card:hover {
                                            border-color: #cbd5e1 !important;
                                            box-shadow: none !important;
                                        }
                                    
                                        .wsla-addon-icon-box {
                                            width: 80px !important;
                                            height: 80px !important;
                                            background: #f4f5f7 !important;
                                            border-radius: 6px !important;
                                            display: flex !important;
                                            align-items: center !important;
                                            justify-content: center !important;
                                            flex-shrink: 0 !important;
                                            margin-right: 1.5rem !important;
                                        }
                                        .wsla-addon-icon-box i {
                                            font-size: 28px !important;
                                            color: #94a3b8 !important;
                                        }
                                    
                                        .wsla-addon-text {
                                            flex-grow: 1 !important;
                                            display: flex !important;
                                            flex-direction: column !important;
                                            gap: 0.35rem !important;
                                        }
                                        .wsla-addon-text h3 {
                                            font-size: 1.4rem !important;
                                            font-weight: 400 !important;
                                            color: #333333 !important;
                                            margin: 0 !important;
                                        }
                                        .wsla-addon-text p {
                                            font-size: 0.95rem !important;
                                            color: #555555 !important;
                                            margin: 0 !important;
                                        }
                                    
                                        .wsla-addon-action {
                                            display: flex !important;
                                            flex-direction: column !important;
                                            align-items: flex-end !important;
                                            gap: 0.6rem !important;
                                            min-width: 130px !important;
                                            flex-shrink: 0 !important;
                                        }
                                        .wsla-addon-action strong {
                                            font-size: 1.15rem !important;
                                            font-weight: 700 !important;
                                            color: #1e293b !important;
                                        }
                                    
                                        .wsla-btn-outline {
                                            display: inline-block !important;
                                            padding: 0.4rem 1.25rem !important;
                                            font-size: 0.85rem !important;
                                            font-weight: 600 !important;
                                            color: #2563eb !important;
                                            background: #ffffff !important;
                                            border: 1px solid #bfdbfe !important;
                                            border-radius: 4px !important;
                                            text-align: center !important;
                                            min-width: 110px !important;
                                            transition: all 0.2s !important;
                                            pointer-events: none !important; /* prevents button blocking card click */
                                        }
                                    
                                        /* ---- Preserve cart selections ---- */
                                        .wsla-hidden-checkbox {
                                            position: absolute !important;
                                            opacity: 0.01 !important; /* transparent but programmatically visible */
                                            width: 1px !important;
                                            height: 1px !important;
                                            z-index: -1 !important;
                                        }
                                    
                                        .wsla-addon-card:has(.wsla-hidden-checkbox:checked) {
                                            border-color: #3b82f6 !important;
                                            background: #f8fafc !important;
                                        }
                                        .wsla-addon-card:has(.wsla-hidden-checkbox:checked) .wsla-btn-outline {
                                            background: #2563eb !important;
                                            color: #ffffff !important;
                                            border-color: #2563eb !important;
                                        }
                                        .wsla-text-added { display: none !important; }
                                        .wsla-addon-card:has(.wsla-hidden-checkbox:checked) .wsla-text-add { display: none !important; }
                                        .wsla-addon-card:has(.wsla-hidden-checkbox:checked) .wsla-text-added { display: inline !important; }
                                        
                                        /* ========================================================
                                        RTL price compatibility fix
                                        ======================================================== */
                                        html[dir="rtl"] .wsla-mc-addon-wrapper label span,
                                        html[dir="rtl"] .wsla-mc-addon-wrapper label i,
                                        body.body-rtl .wsla-mc-addon-wrapper label span,
                                        body.body-rtl .wsla-mc-addon-wrapper label i {
                                            margin-left: 0 !important;
                                            margin-right: auto !important;
                                        }
                                        
                                        html[dir="rtl"] .wsla-mc-addon-wrapper .pull-right,
                                        html[dir="rtl"] .wsla-mc-addon-wrapper .float-right,
                                        body.body-rtl .wsla-mc-addon-wrapper .pull-right,
                                        body.body-rtl .wsla-mc-addon-wrapper .float-right {
                                            float: none !important;
                                            direction: ltr !important;
                                            display: inline-block;
                                            text-align: right;
                                        }
                                        
                                        html[dir="rtl"] .wsla-addon-action,
                                        body.body-rtl .wsla-addon-action {
                                            align-items: flex-start !important;
                                        }

                                        html[dir="rtl"] .wsla-addon-action strong,
                                        body.body-rtl .wsla-addon-action strong {
                                            direction: ltr !important;
                                            display: inline-block;
                                        }
                                    
                                        /* Mobile compatibility */
                                        @media (max-width: 768px) {
                                            .wsla-addon-card { flex-direction: column !important; align-items: flex-start !important; }
                                            .wsla-addon-icon-box { margin-bottom: 1rem !important; margin-right: 0 !important; }
                                            .wsla-addon-action { width: 100% !important; flex-direction: row !important; justify-content: space-between !important; align-items: center !important; border-top: 1px solid #f1f5f9 !important; padding-top: 1rem !important; margin-top: 0.5rem !important; }
                                            .wsla-mc-addon-wrapper img { float: none !important; display: block !important; margin-bottom: 1rem !important; }
                                        }
/* === End migrated from configureproduct.tpl === */


/* === Migrated from configureproduct.tpl:888 === */
.wsla-confproduct-cart-page .wsla-config-layout {
        grid-template-columns: minmax(0, 1fr) 320px;
        align-items: flex-start;
    }

    .wsla-confproduct-cart-page .wsla-config-main { order: 1; }

    .wsla-confproduct-cart-page .wsla-config-summary-sidebar {
        order: 2;
        position: sticky;
        top: 110px;
        align-self: flex-start;
        height: max-content;
        z-index: 2;
    }

    html[dir="rtl"] .wsla-confproduct-cart-page .wsla-config-main,
    body.body-rtl .wsla-confproduct-cart-page .wsla-config-main { order: 2; }

    html[dir="rtl"] .wsla-confproduct-cart-page .wsla-config-summary-sidebar,
    body.body-rtl .wsla-confproduct-cart-page .wsla-config-summary-sidebar { order: 1; }

    .wsla-confproduct-live-summary { min-height: 120px; }
    .wsla-confproduct-live-summary.is-loading { opacity: .68; }
    .wsla-confproduct-live-summary .wsla-order-summary-card { margin: 0; width: 100%; }
    .wsla-confproduct-live-summary .wsla-order-summary-header { background: var(--wsla-soft); }

    /* Hide the bottom action bar in cart mode — Continue is now inside the summary */
    .wsla-config-actions-cart-hidden { display: none !important; }

    /* === New summary section styles === */
    .wsla-confproduct-summary-card .wsla-order-summary-body {
        padding: 18px 20px 20px;
    }

    .wsla-confproduct-summary-section {
        margin-bottom: 14px;
        padding-bottom: 14px;
        border-bottom: 1px solid var(--wsla-line-soft);
    }
    .wsla-confproduct-summary-section h4 {
        margin: 0 0 10px;
        color: var(--wsla-dark);
        font-size: 13px;
        font-weight: 800;
        letter-spacing: .02em;
        text-transform: uppercase;
        opacity: .8;
    }

    .wsla-confproduct-summary-line {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        align-items: flex-start;
    }
    .wsla-confproduct-summary-line-info {
        display: flex;
        flex-direction: column;
        gap: 2px;
        min-width: 0;
        flex: 1;
    }
    .wsla-confproduct-summary-line-price {
        flex-shrink: 0;
        color: var(--wsla-dark);
        font-weight: 900;
        font-size: 14px;
        text-align: end;
        white-space: nowrap;
    }

    .wsla-confproduct-product-name {
        color: var(--wsla-dark);
        font-weight: 900;
        font-size: 14px;
        line-height: 20px;
    }
    .wsla-confproduct-product-domain {
        color: var(--wsla-muted);
        font-size: 12px;
        line-height: 18px;
        font-weight: 600;
        word-break: break-all;
    }
    .wsla-confproduct-product-cycle {
        color: var(--wsla-primary, #f66257);
        font-size: 12px;
        line-height: 18px;
        font-weight: 700;
        margin-top: 2px;
    }

    /* Addons list */
    .wsla-confproduct-addon-line {
        display: flex;
        justify-content: space-between;
        gap: 10px;
        align-items: flex-start;
        padding: 6px 0;
    }
    .wsla-confproduct-addon-line:not(:last-child) {
        border-bottom: 1px dashed var(--wsla-line-soft);
    }
    .wsla-confproduct-addon-line-name {
        display: flex;
        align-items: flex-start;
        gap: 6px;
        min-width: 0;
        color: var(--wsla-dark);
        font-size: 13px;
        line-height: 20px;
        font-weight: 700;
    }
    .wsla-confproduct-addon-line-name .bi {
        color: #16a34a;
        font-size: 14px;
        flex-shrink: 0;
        margin-top: 2px;
    }
    .wsla-confproduct-addon-line-price {
        flex-shrink: 0;
        color: var(--wsla-dark);
        font-size: 13px;
        font-weight: 800;
        white-space: nowrap;
    }

    /* Totals */
    .wsla-confproduct-summary-totals {
        margin-top: 4px;
        padding-top: 12px;
    }
    .wsla-confproduct-summary-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
        padding: 6px 0;
        font-size: 13px;
        font-weight: 700;
        color: var(--wsla-muted);
    }
    .wsla-confproduct-summary-row strong {
        color: var(--wsla-dark);
        font-weight: 900;
    }
    .wsla-confproduct-summary-total-row {
        margin-top: 6px;
        padding-top: 12px;
        border-top: 2px solid var(--wsla-line-soft);
        font-size: 15px;
    }
    .wsla-confproduct-summary-total-row strong {
        font-size: 18px;
    }

    /* Continue button */
    .wsla-confproduct-summary-actions {
        display: grid;
        margin-top: 16px;
    }
    .wsla-confproduct-summary-continue {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
        padding: 14px 20px;
        font-size: 15px;
        font-weight: 800;
        position: relative;
    }
    .wsla-confproduct-summary-continue.is-loading {
        cursor: wait;
        opacity: .8;
    }
    .wsla-confproduct-summary-continue.is-loading::after {
        content: '';
        display: inline-block;
        width: 14px;
        height: 14px;
        margin-inline-start: 8px;
        border: 2px solid currentColor;
        border-right-color: transparent;
        border-radius: 50%;
        animation: wslaContSpin .8s linear infinite;
    }
    @keyframes wslaContSpin { to { transform: rotate(360deg); } }
    @media (prefers-reduced-motion: reduce) {
        .wsla-confproduct-summary-continue.is-loading::after { animation: none; }
    }
    .wsla-confproduct-summary-continue .bi {
        font-size: 16px;
    }
    html[dir="rtl"] .wsla-confproduct-summary-continue .bi-arrow-right,
    body.body-rtl .wsla-confproduct-summary-continue .bi-arrow-right {
        transform: scaleX(-1);
    }

    .wsla-confproduct-server-total { display: none; }

    .wsla-confproduct-selected-section {
        margin-bottom: 14px;
        padding-bottom: 14px;
        border-bottom: 1px solid var(--wsla-line-soft);
    }

    .wsla-confproduct-selected-section h4 {
        margin: 0 0 10px;
        color: var(--wsla-dark);
        font-size: 14px;
        font-weight: 900;
    }

    .wsla-confproduct-selected-item {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        padding: 6px 0;
        color: #64748b;
        font-size: 13px;
        line-height: 20px;
        font-weight: 600;
    }

    .wsla-confproduct-selected-item strong {
        color: var(--wsla-dark);
        font-weight: 900;
        text-align: end;
    }

    .wsla-config-radio-list { display: grid; gap: 10px; margin-top: 8px; }

    .wsla-config-radio-option {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        min-height: 40px;
        padding: 10px 12px;
        border: 1px solid var(--wsla-line-soft);
        border-radius: 12px;
        background: #fff;
        cursor: pointer;
        color: var(--wsla-dark);
        font-size: 13px;
        line-height: 20px;
        font-weight: 700;
    }

    .wsla-config-radio-option:hover { background: #fffafa; border-color: rgba(246, 98, 87, .25); }
    .wsla-config-radio-option input { position: absolute; opacity: 0; pointer-events: none; }

    .wsla-config-marketconnect-addons { display: grid; gap: 18px; }
    .wsla-config-marketconnect-addon { padding: 18px; border: 1px solid var(--wsla-line-soft); border-radius: 16px; background: #fff; }
    .wsla-config-marketconnect-addon img { max-width: 90px; height: auto; }
    .wsla-config-marketconnect-addon label { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; margin: 0; }
    

    @media (max-width: 1199.98px) {
        .wsla-confproduct-cart-page .wsla-config-layout { grid-template-columns: minmax(0, 1fr) 300px; }
    }

    @media (max-width: 991.98px) {
        .wsla-confproduct-cart-page .wsla-config-layout { grid-template-columns: 1fr; }
        .wsla-confproduct-cart-page .wsla-config-main,
        .wsla-confproduct-cart-page .wsla-config-summary-sidebar { order: initial; position: static; }
    }
/* === End migrated from configureproduct.tpl === */


/* === Migrated from domain-renewals.tpl:16 === */
.renewal-card { background: #fff; border: 1px solid #e3ebf6; border-radius: 16px; transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1); overflow: hidden; height: 100%; display: flex; flex-direction: column; }
    .renewal-card:hover { transform: translateY(-8px); box-shadow: none !important; border-color: #2c7be5; }
    .domain-header { padding: 25px; border-bottom: 1px dashed #e3ebf6; }
    .domain-name { font-size: 1.15rem; font-weight: 800; color: #12263f; letter-spacing: -0.02em; direction: ltr; text-align: left; }
    .info-row { padding: 15px 25px; display: flex; justify-content: space-between; align-items: center; }
    .info-label { color: #95aac9; font-size: 0.85rem; text-transform: uppercase; font-weight: 600; }
    .info-value { color: #12263f; font-weight: 700; text-align: end; }
    .action-area { padding: 20px 25px 25px; margin-top: auto; }
    
    .btn-cart-direct { background: #2c7be5; color: #fff; border-radius: 10px; padding: 12px; font-weight: 600; width: 100%; border: none; transition: all 0.2s; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; min-height: 46px; cursor: pointer; }
    .btn-cart-direct:hover, .btn-cart-direct:focus { background: #1a68d1; color: #fff; text-decoration: none; }
    .btn-cart-direct.disabled, .btn-cart-direct:disabled { opacity: 0.75; cursor: not-allowed; }
    
    .btn-cart-direct .added, .btn-cart-direct .loading { display: none; }
    .btn-cart-direct.is-loading .to-add, .btn-cart-direct.checkout .to-add { display: none; }
    .btn-cart-direct.is-loading .loading { display: inline-flex; }
    .btn-cart-direct.checkout .added { display: inline-flex; }
    .btn-cart-direct.checkout { background: #00c9a7; border-color: #00c9a7; cursor: pointer; }
    .btn-cart-direct.checkout:hover { background: #00b396; }

    @keyframes wsla-spin { 100% { transform: rotate(360deg); } }
    .btn-cart-direct.is-loading .bi-arrow-repeat { animation: wsla-spin 1s linear infinite; }

    .price-select { border-radius: 10px; border: 2px solid #e3ebf6; padding: 10px; margin-bottom: 15px; font-weight: 600; cursor: pointer; width: 100%; outline: none; }
    .price-select:focus { border-color: #2c7be5; box-shadow: none !important; }
    .price-select:disabled { opacity: 0.75; cursor: not-allowed; background-color: #f8f9fa; }
    
    .wsla-renewal-summary { margin-top: 30px; background: #fff; border: 1px solid #e3ebf6; border-radius: 16px; padding: 22px; }
    .wsla-renewal-summary .loader { display: none; margin-bottom: 15px; color: #2c7be5; font-weight: 700; }
    .wsla-renewal-summary #btnGoToCart { background: #12263f; color: #fff; border-radius: 10px; padding: 12px 18px; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; font-weight: 700; width: 100%; transition: 0.2s; }
    .wsla-renewal-summary #btnGoToCart:hover { background: #0b1727; }
/* === End migrated from domain-renewals.tpl === */


/* === Migrated from domaintransfer.tpl:3 === */
.wsla-domain-transfer-page .wsla-domain-transfer-form {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
        border-radius: 0 !important;
    }

    .wsla-domain-transfer-page .wsla-domain-transfer-form .wsla-domain-input-wrap {
        background: #fff !important;
        border: 1px solid #dfe5ec !important;
        border-radius: 20px !important;
        padding: 7px !important;
        box-shadow: none !important;
    }

    .wsla-domain-transfer-page .wsla-domain-transfer-form .wsla-domain-input-wrap:focus-within {
        border-color: var(--wsla-primary) !important;
        box-shadow: none !important;
    }

    .wsla-domain-transfer-page #inputTransferDomain.is-invalid {
        border: 0 !important;
        box-shadow: none !important;
    }

    .wsla-domain-transfer-page #transferUnavailable {
        margin-top: 12px !important;
        margin-bottom: 0 !important;
        border: 1px solid #ffd9a6 !important;
        border-radius: 12px !important;
        background: #fff8e6 !important;
        color: #c75a00 !important;
        font-size: 13px !important;
        line-height: 22px !important;
        font-weight: 700 !important;
    }

    .wsla-domain-transfer-page #transferUnavailable .btn {
        margin-inline-start: 8px;
        background: var(--wsla-primary) !important;
        border-color: var(--wsla-primary) !important;
        color: #fff !important;
        border-radius: 8px !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        padding: 6px 10px !important;
    }
/* === End migrated from domaintransfer.tpl === */


/* === Migrated from marketconnect-promo.tpl:2 === */
/* Override old grid settings for horizontal layout */
        .wsla-config-marketconnect-addons {
            display: flex !important;
            flex-direction: column !important;
            gap: 1rem !important;
        }

        /* Horizontal addon container */
        .wsla-promo-list-item {
            display: flex;
            align-items: center;
            gap: 1.5rem;
            padding: 1.5rem;
            margin-bottom: 10px;
            background: #ffffff;
            border: 1px solid #e2e8f0;
            border-radius: 8px;
            transition: none;
            position: relative;
        }

        .wsla-promo-list-item:hover {
            box-shadow: none !important;
            border-color: #cbd5e1;
        }

        /* Icon */
        .wsla-promo-icon {
            width: 85px;
            height: 85px;
            background: #f4f5f7;
            border-radius: 4px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }
        .wsla-promo-icon img {
            max-width: 60px;
            max-height: 60px;
            object-fit: contain;
        }

        /* Text content */
        .wsla-promo-content {
            flex-grow: 1;
            display: flex;
            flex-direction: column;
            gap: 0.35rem;
        }
        .wsla-promo-headline {
            font-size: 1.5rem;
            font-weight: 400;
            color: #333333;
            margin: 0;
            letter-spacing: -0.5px;
        }
        .wsla-promo-tagline {
            font-size: 0.95rem;
            color: #555555;
            line-height: 1.5;
            margin: 0;
        }

        /* Learn More link */
        .wsla-promo-learn-more {
            color: #2563eb;
            font-size: 0.95rem;
            cursor: pointer;
            text-decoration: none;
            display: inline-block;
            margin-top: 0.2rem;
        }
        .wsla-promo-learn-more:hover {
            text-decoration: underline;
        }

        /* Price and add button */
        .wsla-promo-action {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 0.6rem;
            min-width: 140px;
            text-align: right;
            flex-shrink: 0;
        }
        .wsla-promo-price {
            font-size: 1.15rem;
            font-weight: 700;
            color: #1e293b;
        }
        .btn-add {
            background: #ffffff;
            color: #2563eb;
            border: 1px solid #bfdbfe;
            padding: 0.4rem 1.25rem;
            border-radius: 4px;
            font-weight: 600;
            font-size: 0.85rem;
            cursor: pointer;
            transition: all 0.2s;
            box-shadow: none !important;
        }
        .btn-add:hover {
            background: #2563eb;
            color: #ffffff;
            border-color: #2563eb;
        }
        .btn-add.wsla-is-loading,
        .btn-add.wsla-is-added {
            opacity: 0.85;
            pointer-events: none;
        }

        .wsla-promo-list-item.wsla-promo-hidden {
            display: none !important;
        }
        .wsla-promo-load-more-wrap {
            width: 100%;
            text-align: center;
            margin: 1rem 0 0;
        }
        .wsla-promo-load-more-btn {
            background: #ffffff;
            color: #2563eb;
            border: 1px solid #bfdbfe;
            padding: 0.65rem 1.7rem;
            border-radius: 6px;
            font-weight: 600;
            font-size: 0.9rem;
            cursor: pointer;
            transition: all 0.2s;
            box-shadow: none !important;
        }
        .wsla-promo-load-more-btn:hover {
            background: #2563eb;
            color: #ffffff;
            border-color: #2563eb;
        }

        /* Feature list */
        .wsla-promo-features {
            display: none;
            width: 100%;
            margin-top: 1.5rem;
            padding-top: 1.5rem;
            border-top: 1px dashed #e2e8f0;
        }
        .wsla-promo-list-item.is-expanded {
            flex-wrap: wrap;
        }
        .wsla-promo-list-item.is-expanded .wsla-promo-features {
            display: block;
        }
        .wsla-promo-features ul {
            list-style: none;
            padding: 0; margin: 0;
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
            gap: 0.75rem;
        }
        .wsla-promo-features li {
            font-size: 0.9rem;
            color: #475569;
            display: flex;
            align-items: flex-start;
            gap: 0.5rem;
        }
        .wsla-promo-features li i {
            color: #10b981;
            margin-top: 0.2rem;
        }

        /* Mobile compatibility */
        @media (max-width: 768px) {
            .wsla-promo-list-item {
                flex-direction: column;
                align-items: flex-start;
                gap: 1.25rem;
            }
            .wsla-promo-action {
                width: 100%;
                flex-direction: row;
                justify-content: space-between;
                align-items: center;
                border-top: 1px solid #f1f5f9;
                padding-top: 1rem;
            }
        }
/* === End migrated from marketconnect-promo.tpl === */


/* === Migrated from ordersummary.tpl:19 === */
/* Safely remove clipping from possible parents */
.wsla-config-summary-sidebar,
.wsla-checkout-sidebar,
.wsla-viewcart-summary {
    overflow: visible;
}
.wsla-order-summary-card {
    position: sticky;
    top: 30px;
    z-index: 100;
    background: white;
    align-self: flex-start;
    /*max-height: calc(100vh - 40px);*/
    max-height: unset;
    overflow-y: auto;
    
    /* prevents horizontal scrolling inside card */
    overflow-x: hidden;
}
/* === End migrated from ordersummary.tpl === */


/* === Migrated from viewcart.tpl:57 === */
/* ============================================================
       CART GRID — explicit column sizing
       ============================================================
       Without this, common.tpl's grid lets the product-name column
       shrink to nothing once the Qty column appears, breaking
       the title into single characters. We define both the head row
       and every item row with the SAME grid-template-columns so they
       stay perfectly aligned, and use minmax() to give the product
       name column a guaranteed minimum width.
    */

    /* No qty column anywhere in the cart */
    .wsla-viewcart-page .wsla-cart-table-head,
    .wsla-viewcart-page .wsla-cart-item {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 160px 150px;
        gap: 16px;
        align-items: center;
    }

    /* When ANY product/addon allows qty, ALL rows reserve a qty column.
       The product name keeps a 200px floor so it never collapses. */
    .wsla-viewcart-page .wsla-cart-review-card.has-qty-column .wsla-cart-table-head,
    .wsla-viewcart-page .wsla-cart-review-card.has-qty-column .wsla-cart-item {
        grid-template-columns: minmax(200px, 1fr) 150px 190px 150px;
    }

    /* Qty cell layout: input + button on the same line */
    .wsla-qty-form {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        flex-wrap: nowrap;
        margin: 0;
    }
    .wsla-qty-form .form-control {
        width: 70px;
        min-width: 60px;
        text-align: center;
        padding: 6px 8px;
        height: auto;
    }
    .wsla-qty-form .wsla-cart-icon-btn {
        flex-shrink: 0;
    }

    /* Header cells must follow the exact same visual alignment as their columns. */
    .wsla-viewcart-page .wsla-cart-table-head .wsla-cart-head-cell {
        display: flex;
        align-items: center;
        min-width: 0;
        white-space: nowrap;
    }
    .wsla-viewcart-page .wsla-cart-table-head .wsla-cart-head-product {
        justify-content: flex-start;
        text-align: start;
    }
    .wsla-viewcart-page .wsla-cart-table-head .wsla-cart-head-qty {
        justify-content: center;
        text-align: center;
    }
    .wsla-viewcart-page .wsla-cart-table-head .wsla-cart-head-price {
        justify-content: flex-start;
        text-align: start;
    }
    .wsla-viewcart-page .wsla-cart-table-head .wsla-cart-head-actions {
        justify-content: center;
    }
    html[dir="rtl"] .wsla-viewcart-page .wsla-cart-table-head .wsla-cart-head-price,
    body.body-rtl .wsla-viewcart-page .wsla-cart-table-head .wsla-cart-head-price {
        justify-content: flex-end;
        text-align: right;
    }

    /* Keep price and billing cycle stacked cleanly under the price column */
    .wsla-viewcart-page .wsla-cart-item-price {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
        gap: 2px;
    }
    html[dir="rtl"] .wsla-viewcart-page .wsla-cart-item-price,
    body.body-rtl .wsla-viewcart-page .wsla-cart-item-price {
        align-items: flex-end;
        text-align: right;
    }

    /* Empty qty cells preserve the column width but show nothing */
    .wsla-cart-item-qty.is-empty {
        min-height: 1px;
        visibility: hidden;
    }

    /* Make sure the product-name block can wrap nicely (not character-by-character) */
    .wsla-viewcart-page .wsla-cart-item-main {
        min-width: 0;            /* allow shrinking inside grid */
        overflow-wrap: break-word;
        word-break: normal;       /* override any inherited break-all */
    }
    .wsla-viewcart-page .wsla-cart-item-main h3 {
        overflow-wrap: break-word;
        word-break: normal;
        hyphens: auto;
        line-height: 140%;
    }

    /* Tablet/mobile: collapse to single column, hide the head row */
    @media (max-width: 768px) {
        .wsla-viewcart-page .wsla-cart-table-head {
            display: none;
        }
        .wsla-viewcart-page .wsla-cart-item,
        .wsla-viewcart-page .wsla-cart-review-card.has-qty-column .wsla-cart-item {
            grid-template-columns: 1fr;
            gap: 8px;
        }
        .wsla-cart-item-qty.is-empty {
            display: none;
        }
    }
/* === End migrated from viewcart.tpl === */


/* === Migrated from viewcart.tpl:880 === */
.wsla-domain-period-control {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.wsla-domain-period-select.is-loading {
    opacity: .65;
    cursor: wait;
}
.wsla-period-update-state {
    display: inline-flex;
    align-items: center;
    min-width: 18px;
    font-size: 13px;
}
.wsla-spin {
    display: inline-block;
    animation: wslaSpin .8s linear infinite;
}
@keyframes wslaSpin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
    .wsla-spin { animation: none; }
}

.wsla-promo-review-target {
    border-color: var(--wsla-primary) !important;
    box-shadow: none !important;
    animation: wslaPromoTargetPulse 1.15s ease-in-out 0s 4;
}

.wsla-promo-review-card {
    position: relative;
    border-color: rgba(255, 66, 66, 0.32) !important;
    background: linear-gradient(90deg, rgba(255, 66, 66, 0.045), #fff 45%) !important;
}

.wsla-domain-period-control.has-promo-review-hint {
    flex-wrap: wrap;
    align-items: flex-start;
    max-width: 210px;
}

.wsla-promo-review-hint {
    flex: 0 0 100%;
    margin-top: 2px;
    padding: 6px 9px;
    border: 1px solid rgba(255, 168, 0, 0.22);
    border-radius: 8px;
    background: #fffaf0;
    color: #9a5b00;
    font-size: 11.5px;
    line-height: 17px;
    font-weight: 400;
    max-width: 190px;
}

@keyframes wslaPromoTargetPulse {
    0%   { box-shadow: none !important; }
    70%  { box-shadow: none !important; }
    100% { box-shadow: none !important; }
}
/* === End migrated from viewcart.tpl === */

/* v4: replaces inline gap style removed from configureproduct.tpl */
.wsla-config-layout-gapless { gap: 0; }

/* v4: extracted static inline styles from TPL files without changing layout */
.wsla-config-section-spaced { margin-bottom: 2rem; }
.wsla-config-section-title-inline { display: flex; align-items: center; gap: .75rem; margin-bottom: 1.5rem; }
.wsla-config-addon-title-icon { color: #2563eb; font-size: 1.3rem; }
.wsla-config-addon-title { margin: 0; font-size: 1.4rem; font-weight: 400; color: #333; }
.wsla-pe-none { pointer-events: none; }
.wsla-renewals-card-shell { border: 0; box-shadow: none !important; padding: 0; background: transparent; }
.wsla-renewals-shield { width: 60px; height: 60px; }
.wsla-renewals-status-row { background-color: #f9fbfd; }
.wsla-renewals-status-text { font-size: .9rem; }
.wsla-renewals-alert-rounded { border-radius: 10px; }
.wsla-renewals-alert-rounded-lg { border-radius: 12px; }
.wsla-spin-icon { animation: wsla-spin 1s linear infinite; display: inline-block; }
.wsla-renewals-empty-box { border-radius: 16px; border-color: #e3ebf6 !important; }
.wsla-renewals-empty-image { width: 120px; opacity: .4; }
.wsla-renewals-manage-btn { border-radius: 10px; padding: 12px; }


/* === WSLA FINAL STABLE UI/UX RESTORE (WHMCS 9 safe) === */
:root { --wsla-focus-blue: #2563eb; --wsla-danger: #ef4444; --wsla-soft-line: #d8e1ee; }
.wsla-order-clean-page input,
.wsla-order-clean-page select,
.wsla-order-clean-page textarea,
.wsla-order-clean-page .form-control,
.wsla-order-clean-page .form-select { box-shadow: none !important; }
.wsla-order-clean-page .form-control,
.wsla-order-clean-page .form-select,
.wsla-order-clean-page select.form-control {
  min-height: 52px;
  border: 1px solid var(--wsla-soft-line) !important;
  border-radius: 14px;
  background-color: #fff;
  color: #102033;
  transition: border-color .16s ease, background-color .16s ease;
}
.wsla-order-clean-page .form-control:focus,
.wsla-order-clean-page .form-select:focus,
.wsla-order-clean-page select.form-control:focus {
  border-color: var(--wsla-focus-blue) !important;
  outline: 0 !important;
  box-shadow: none !important;
}
.wsla-order-clean-page .is-invalid .form-control,
.wsla-order-clean-page .form-control.is-invalid,
.wsla-order-clean-page .is-invalid select.form-control,
.wsla-order-clean-page select.form-control.is-invalid {
  border-color: var(--wsla-danger) !important;
  background-color: #fffafa !important;
  box-shadow: none !important;
}
/* Checkout fields: labels above fields, not floating inside fields */
.wsla-checkout-form .wsla-field { position: relative !important; margin-bottom: 22px !important; }
.wsla-checkout-form .wsla-field > label {
  position: static !important;
  display: block !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #344767 !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  font-weight: 600 !important;
  pointer-events: auto !important;
}
.wsla-checkout-form .wsla-field.is-invalid > label { color: var(--wsla-danger) !important; }
.wsla-checkout-form .wsla-field .form-control,
.wsla-checkout-form .wsla-field select.form-control,
.wsla-checkout-form .wsla-field textarea.form-control {
  min-height: 54px !important;
  padding: 13px 16px !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}
.wsla-field-error { margin: 7px 0 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: var(--wsla-danger) !important; font-size: 12px !important; font-weight: 600 !important; line-height: 1.35 !important; }
.wsla-field-error i { display: none !important; }
/* Account selector should look like segmented action choices, not inputs */
.wsla-customer-type-tabs { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 14px !important; margin: 18px 0 22px !important; }
.wsla-customer-type-tab {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 58px !important;
  padding: 14px 18px !important;
  border: 1px solid var(--wsla-soft-line) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
.wsla-customer-type-tab input { position: static !important; opacity: 1 !important; width: 18px !important; height: 18px !important; margin: 0 !important; pointer-events: auto !important; accent-color: var(--wsla-danger); }
.wsla-customer-type-tab span { font-weight: 800 !important; color: #102033 !important; }
.wsla-customer-type-tab.is-selected,
.wsla-customer-type-tab:has(input:checked) { border-color: var(--wsla-danger) !important; background: #fff8f8 !important; }
/* Avoid Terms of Service duplicated inline error look */
.wsla-tos-check { display: grid !important; grid-template-columns: auto 1fr !important; gap: 10px !important; align-items: start !important; }
.wsla-tos-check .wsla-field-error, .wsla-tos-check + .wsla-field-error { display:none !important; }
/* Native selects: show arrow clearly */
.wsla-order-clean-page select,
.wsla-order-clean-page select.form-control,
.wsla-order-clean-page .form-select,
#inputDomainContact,
#inputStateSelect,
#subdomain-tld,
#incartdomain-select {
  appearance: auto !important;
  -webkit-appearance: menulist !important;
  padding-inline-end: 38px !important;
}
/* Configure product domain page: keep rows horizontal and readable */
.wsla-product-domain-page .panel-domain-search { padding: 28px 32px !important; }
.wsla-product-domain-page .panel-domain-search .inline-form {
  align-items: stretch !important;
  gap: 12px !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
}
.wsla-product-domain-page .panel-domain-search .inline-form-element { margin: 0 !important; min-width: 0 !important; }
.wsla-product-domain-page .panel-domain-search .inline-form-element.w-100 { flex: 1 1 auto !important; width: auto !important; }
.wsla-product-domain-page .panel-domain-search input.form-control,
.wsla-product-domain-page .panel-domain-search select.form-control,
.wsla-product-domain-page .panel-domain-search .dropdown-toggle,
.wsla-product-domain-page .panel-domain-search .tld-select {
  height: 54px !important;
  min-height: 54px !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.wsla-product-domain-page .panel-domain-search .dropdown { width: 110px !important; }
.wsla-product-domain-page .panel-domain-search .btn { min-width: 92px !important; height: 54px !important; border-radius: 12px !important; white-space: nowrap !important; }
.wsla-product-domain-page .panel-domain-option .content { display: grid !important; gap: 10px !important; }
.wsla-product-domain-page .panel-domain-option label.radio { display:flex !important; align-items:center !important; gap:10px !important; width: fit-content !important; max-width: 100% !important; min-height: 44px !important; padding: 10px 14px !important; border: 1px solid var(--wsla-soft-line) !important; border-radius: 10px !important; background:#fff !important; }
.wsla-product-domain-page .panel-domain-option label.radio.active { border-color: var(--wsla-danger) !important; background:#fff8f8 !important; }
@media (max-width: 700px) { .wsla-product-domain-page .panel-domain-search .inline-form { flex-wrap: wrap !important; } .wsla-product-domain-page .panel-domain-search .inline-form-element, .wsla-product-domain-page .panel-domain-search .dropdown, .wsla-product-domain-page .panel-domain-search .btn { width: 100% !important; } }
/* Configure product: MarketConnect/Available Addons should be cards, not raw rows */
.wsla-confproduct-cart-page .wsla-marketconnect-addon-output,
.wsla-confproduct-cart-page .addon-promo-container,
.wsla-confproduct-cart-page .addon-promo,
.wsla-confproduct-cart-page .panel-addon { border: 1px solid var(--wsla-soft-line) !important; border-radius: 16px !important; background:#fff !important; box-shadow: none !important; overflow:hidden !important; }
.wsla-confproduct-cart-page .wsla-marketconnect-addon-output label,
.wsla-confproduct-cart-page .addon-promo-container label,
.wsla-confproduct-cart-page label[for^="addons_radio"],
.wsla-confproduct-cart-page label:has(input[name^="addons_radio"]) {
  display:flex !important;
  align-items:center !important;
  gap: 12px !important;
  min-height: 42px !important;
  padding: 10px 14px !important;
  margin: 0 !important;
  border-bottom: 1px solid #eef2f7 !important;
  background:#fff !important;
  cursor:pointer !important;
}
.wsla-confproduct-cart-page label:has(input[name^="addons_radio"]:checked) { border-color: var(--wsla-focus-blue) !important; background:#f8fbff !important; }
.wsla-confproduct-cart-page input[name^="addons_radio"] { width: 18px !important; height: 18px !important; margin: 0 8px 0 0 !important; accent-color: var(--wsla-focus-blue) !important; flex: 0 0 auto !important; }
/* Domain registration search cards */
.wsla-domain-page .wsla-domain-search-form .form-control,
.wsla-domain-register-page .form-control,
.wsla-domain-transfer-page .form-control { box-shadow: none !important; }
.wsla-domain-page .wsla-domain-search-form button,
.wsla-domain-register-page button,
.wsla-domain-transfer-page button { box-shadow: none !important; }
/* Buttons: avoid loading text in tiny fields/quantity buttons */
input[type="number"].is-loading, input.qty.is-loading, .qty.is-loading { color: inherit !important; }


/* WSLA no-shadow baseline: requested clean flat UI across orderforms.
   This intentionally removes shadows from fields, cards, buttons, modals, and pseudo-elements
   without changing WHMCS form names, values, or submit behavior. */
.wsla-order-clean-page,
.wsla-order-clean-page *,
.wsla-order-clean-page *::before,
.wsla-order-clean-page *::after,
body[class*="cart"] .wsla-order-clean-page *,
body[class*="cart"] .wsla-order-clean-page *::before,
body[class*="cart"] .wsla-order-clean-page *::after {
  box-shadow: none !important;
  text-shadow: none !important;
}
.wsla-order-clean-page .form-control,
.wsla-order-clean-page .form-select,
.wsla-order-clean-page select,
.wsla-order-clean-page textarea,
.wsla-order-clean-page input,
.wsla-order-clean-page button,
.wsla-order-clean-page .btn,
.wsla-order-clean-page .card,
.wsla-order-clean-page .panel,
.wsla-order-clean-page .modal-content,
.wsla-order-clean-page [class*="card"],
.wsla-order-clean-page [class*="panel"],
.wsla-order-clean-page [class*="box"],
.wsla-order-clean-page [class*="summary"] {
  box-shadow: none !important;
  text-shadow: none !important;
}
.wsla-order-clean-page .form-control:focus,
.wsla-order-clean-page .form-select:focus,
.wsla-order-clean-page select:focus,
.wsla-order-clean-page textarea:focus,
.wsla-order-clean-page input:focus,
.wsla-order-clean-page button:focus,
.wsla-order-clean-page .btn:focus {
  box-shadow: none !important;
  outline: none;
}
.wsla-order-clean-page .is-invalid .form-control,
.wsla-order-clean-page .form-control.is-invalid,
.wsla-order-clean-page .is-error,
.wsla-order-clean-page .has-error .form-control {
  box-shadow: none !important;
}

/* WSLA focused step: visible select arrows + calmer Available Addons rows */
.wsla-order-clean-page select,
.wsla-order-clean-page select.form-control,
.wsla-order-clean-page .form-select,
.wsla-confproduct-cart-page select,
.wsla-product-domain-page select,
#inputBillingcycle,
#inputDomainContact,
#inputStateSelect,
#subdomain-tld,
#incartdomain-select {
  -webkit-appearance: none !important;
  appearance: none !important;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%2364758b' d='M5.25 7.5 10 12.25 14.75 7.5z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 14px 14px !important;
  padding-right: 42px !important;
}
html[dir="rtl"] .wsla-order-clean-page select,
html[dir="rtl"] .wsla-order-clean-page select.form-control,
html[dir="rtl"] .wsla-order-clean-page .form-select,
html[dir="rtl"] .wsla-confproduct-cart-page select,
html[dir="rtl"] .wsla-product-domain-page select,
html[dir="rtl"] #inputBillingcycle,
html[dir="rtl"] #inputDomainContact,
html[dir="rtl"] #inputStateSelect,
html[dir="rtl"] #subdomain-tld,
html[dir="rtl"] #incartdomain-select {
  background-position: left 14px center !important;
  padding-right: 14px !important;
  padding-left: 42px !important;
}

/* Billing cycle select should look like a single controlled dropdown, not a plain text field. */
#inputBillingcycle {
  min-height: 54px !important;
  border: 1px solid #d8e0ec !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}
#inputBillingcycle:focus {
  border-color: #2f6df6 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* Available Addons: remove excessive internal lines around every text row. Keep one outer card only. */
.wsla-confproduct-cart-page .wsla-marketconnect-addon-output,
.wsla-confproduct-cart-page .addon-promo-container,
.wsla-confproduct-cart-page .addon-promo,
.wsla-confproduct-cart-page .panel-addon {
  border: 1px solid #d8e0ec !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: none !important;
  overflow: hidden !important;
}
.wsla-confproduct-cart-page .wsla-marketconnect-addon-output label,
.wsla-confproduct-cart-page .addon-promo-container label,
.wsla-confproduct-cart-page label[for^="addons_radio"],
.wsla-confproduct-cart-page label:has(input[name^="addons_radio"]) {
  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  min-height: 36px !important;
  padding: 8px 14px !important;
}
.wsla-confproduct-cart-page label:has(input[name^="addons_radio"]:checked) {
  border: 0 !important;
  background: #f7fbff !important;
  outline: 1px solid #2f6df6 !important;
  outline-offset: -1px !important;
  border-radius: 10px !important;
}
.wsla-confproduct-cart-page input[name^="addons_radio"] {
  margin-inline-end: 12px !important;
}
.wsla-confproduct-cart-page .wsla-marketconnect-addon-output hr,
.wsla-confproduct-cart-page .addon-promo-container hr,
.wsla-confproduct-cart-page .panel-addon hr {
  display: none !important;
}

/* WSLA step: soften Available Addons borders further */
.wsla-confproduct-cart-page .wsla-marketconnect-addon-output,
.wsla-confproduct-cart-page .addon-promo-container,
.wsla-confproduct-cart-page .addon-promo,
.wsla-confproduct-cart-page .panel-addon {
  border: 1px solid #edf2f7 !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: none !important;
}
.wsla-confproduct-cart-page .wsla-marketconnect-addon-output .panel-body,
.wsla-confproduct-cart-page .addon-promo-container .panel-body,
.wsla-confproduct-cart-page .panel-addon .panel-body {
  border: 0 !important;
  box-shadow: none !important;
}
.wsla-confproduct-cart-page .wsla-marketconnect-addon-output label,
.wsla-confproduct-cart-page .addon-promo-container label,
.wsla-confproduct-cart-page label[for^="addons_radio"],
.wsla-confproduct-cart-page label:has(input[name^="addons_radio"]) {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 8px !important;
}
.wsla-confproduct-cart-page label:has(input[name^="addons_radio"]:checked) {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: #f8fbff !important;
}
.wsla-confproduct-cart-page label:has(input[name^="addons_radio"]:checked)::before,
.wsla-confproduct-cart-page label:has(input[name^="addons_radio"]:checked)::after {
  box-shadow: none !important;
}

/* ==========================================================
   WSLA reliable restore: disable all sticky/fixed summary/sidebar
   Purpose: keep WHMCS orderforms stable; no sticky experiments.
   ========================================================== */
.wsla-viewcart-summary,
.wsla-checkout-sidebar,
.wsla-config-summary-sidebar,
.wsla-confproduct-cart-page .wsla-config-summary-sidebar,
.wsla-order-summary-card,
.wsla-products-sidebar,
.wsla-config-sidebar {
  position: static !important;
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  z-index: auto !important;
}

@media (min-width: 992px) {
  .wsla-viewcart-summary,
  .wsla-checkout-sidebar,
  .wsla-config-summary-sidebar,
  .wsla-confproduct-cart-page .wsla-config-summary-sidebar,
  .wsla-order-summary-card {
    align-self: start !important;
  }
}

/* WSLA step: remove visual borders around product domain option choices only */
.wsla-product-domain-page .panel-domain-option label.radio,
.wsla-product-domain-page .panel-domain-option label.radio:hover,
.wsla-product-domain-page .panel-domain-option label.radio.active {
  border-color: transparent !important;
  border-width: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  background: transparent !important;
  padding: 8px 0 !important;
  border-radius: 0 !important;
}
.wsla-product-domain-page .panel-domain-option label.radio.active {
  color: var(--wsla-danger) !important;
}
.wsla-product-domain-page .panel-domain-option label.radio span {
  border: 0 !important;
  box-shadow: none !important;
}

/* WSLA step: product domain form layout refinement
   Scope: configureproductdomain only. No WHMCS field names or JS behavior changed. */
.wsla-product-domain-page .panel-domain-search {
  padding: 44px 32px !important;
}
.wsla-product-domain-page .panel-domain-search-primary {
  border-radius: 0 0 12px 12px !important;
}
.wsla-product-domain-page .panel-domain-search .inline-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 110px 104px !important;
  align-items: center !important;
  gap: 16px !important;
  width: 100% !important;
  max-width: 1190px !important;
  margin: 0 auto !important;
}
.wsla-product-domain-page .panel-domain-search .inline-form-element,
.wsla-product-domain-page .panel-domain-search .inline-form-element.w-100 {
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  flex: none !important;
}
.wsla-product-domain-page .panel-domain-search input.form-control,
.wsla-product-domain-page .panel-domain-search .dropdown-toggle,
.wsla-product-domain-page .panel-domain-search .tld-select,
.wsla-product-domain-page .panel-domain-search .btn {
  height: 56px !important;
  min-height: 56px !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
.wsla-product-domain-page .panel-domain-search input.form-control {
  width: 100% !important;
  padding: 0 18px !important;
}
.wsla-product-domain-page .panel-domain-search .dropdown {
  width: 110px !important;
  min-width: 110px !important;
}
.wsla-product-domain-page .panel-domain-search .dropdown-toggle {
  width: 110px !important;
  padding: 0 !important;
  background: #fff !important;
  border: 0 !important;
}
.wsla-product-domain-page .panel-domain-search .tld-select {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 110px !important;
  padding: 0 14px !important;
  border: 0 !important;
  background: #fff !important;
}
.wsla-product-domain-page .panel-domain-search .dropdown-toggle::after {
  display: none !important;
  content: none !important;
}
.wsla-product-domain-page .panel-domain-search .tld-select .caret {
  display: inline-block !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  border-top: 5px solid #64748b !important;
  border-right: 5px solid transparent !important;
  border-left: 5px solid transparent !important;
}
.wsla-product-domain-page .panel-domain-search .btn {
  width: 104px !important;
  min-width: 104px !important;
  padding: 0 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
}
.wsla-product-domain-page #panel-owndomain.inline-form {
  grid-template-columns: minmax(0, 1fr) minmax(220px, 1fr) 104px !important;
}
.wsla-product-domain-page #panel-incart.inline-form {
  grid-template-columns: minmax(0, 1fr) 104px !important;
}
@media (max-width: 900px) {
  .wsla-product-domain-page .panel-domain-search {
    padding: 28px 20px !important;
  }
  .wsla-product-domain-page .panel-domain-search .inline-form,
  .wsla-product-domain-page #panel-owndomain.inline-form,
  .wsla-product-domain-page #panel-incart.inline-form {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .wsla-product-domain-page .panel-domain-search .dropdown,
  .wsla-product-domain-page .panel-domain-search .dropdown-toggle,
  .wsla-product-domain-page .panel-domain-search .tld-select,
  .wsla-product-domain-page .panel-domain-search .btn {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* WSLA emergency fix: keep inactive domain panels hidden.
   Previous layout rules styled all .inline-form blocks and overrode inline display:none.
   This restores WHMCS/template panel switching without changing field names or JS. */
.wsla-product-domain-page .panel-domain-search .inline-form[style*="display:none"],
.wsla-product-domain-page .panel-domain-search .inline-form[style*="display: none"],
.wsla-product-domain-page .panel-domain-search .inline-form.is-hidden,
.wsla-product-domain-page .panel-domain-search .inline-form.d-none {
  display: none !important;
}

/* Keep only the visible active row using the clean three-column layout. */
.wsla-product-domain-page .panel-domain-search .inline-form[style*="display:flex"],
.wsla-product-domain-page .panel-domain-search .inline-form[style*="display: flex"] {
  display: grid !important;
}

/* WSLA own-domain compact row final override.
   Keep the visible own-domain fields together: SLD + TLD + Use. */
.wsla-product-domain-page #panel-owndomain.inline-form[style*="display: flex"],
.wsla-product-domain-page #panel-owndomain.inline-form[style*="display:flex"] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 16px !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    max-width: 820px !important;
    margin: 0 auto !important;
    grid-template-columns: none !important;
}
.wsla-product-domain-page #panel-owndomain.inline-form[style*="display:none"],
.wsla-product-domain-page #panel-owndomain.inline-form[style*="display: none"] {
    display: none !important;
}
.wsla-product-domain-page #panel-owndomain .inline-form-element-sld {
    flex: 1 1 560px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 560px !important;
    margin: 0 !important;
}
.wsla-product-domain-page #panel-owndomain .inline-form-element-tld-text {
    flex: 0 0 120px !important;
    width: 120px !important;
    min-width: 120px !important;
    max-width: 120px !important;
    margin: 0 !important;
}
.wsla-product-domain-page #panel-owndomain .inline-form-element-action {
    flex: 0 0 104px !important;
    width: 104px !important;
    min-width: 104px !important;
    max-width: 104px !important;
    margin: 0 !important;
}
.wsla-product-domain-page #panel-owndomain .inline-form-element-action .btn,
.wsla-product-domain-page #panel-owndomain .inline-form-element-action button {
    width: 104px !important;
    min-width: 104px !important;
    max-width: 104px !important;
}
@media (max-width: 768px) {
    .wsla-product-domain-page #panel-owndomain.inline-form[style*="display: flex"],
    .wsla-product-domain-page #panel-owndomain.inline-form[style*="display:flex"] {
        flex-direction: column !important;
        max-width: 100% !important;
        gap: 12px !important;
    }
    .wsla-product-domain-page #panel-owndomain .inline-form-element-sld,
    .wsla-product-domain-page #panel-owndomain .inline-form-element-tld-text,
    .wsla-product-domain-page #panel-owndomain .inline-form-element-action,
    .wsla-product-domain-page #panel-owndomain .inline-form-element-action .btn,
    .wsla-product-domain-page #panel-owndomain .inline-form-element-action button {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex: 1 1 100% !important;
    }
}

/* WSLA promo-code field cleanup: remove the inner grey/native frame while preserving WHMCS form logic */
.wsla-promo-card .wsla-promo-input-wrap {
  border: 1px solid #ffd8d8 !important;
  box-shadow: none !important;
}
.wsla-promo-card .wsla-promo-input-wrap:focus-within {
  border-color: #ffd8d8 !important;
  box-shadow: none !important;
}
.wsla-promo-card .wsla-promo-input-wrap input.form-control,
.wsla-promo-card .wsla-promo-input-wrap input.form-control:hover,
.wsla-promo-card .wsla-promo-input-wrap input.form-control:focus,
.wsla-promo-card .wsla-promo-input-wrap input.form-control:active {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  -webkit-appearance: none;
  appearance: none;
}
.wsla-promo-card .wsla-promo-input-wrap input.form-control::-webkit-search-decoration,
.wsla-promo-card .wsla-promo-input-wrap input.form-control::-webkit-search-cancel-button,
.wsla-promo-card .wsla-promo-input-wrap input.form-control::-webkit-search-results-button,
.wsla-promo-card .wsla-promo-input-wrap input.form-control::-webkit-search-results-decoration {
  display: none;
}
.wsla-promo-card .wsla-promo-submit:disabled,
.wsla-promo-card .wsla-promo-submit.disabled {
  opacity: .58;
  cursor: not-allowed;
  box-shadow: none !important;
}


/* WSLA viewcart AJAX polish */
.wsla-qty-form .wsla-cart-icon-btn.is-loading,
.wsla-qty-form .wsla-cart-icon-btn[aria-busy="true"] {
  pointer-events: none;
  color: var(--wsla-primary);
  background: #fff5f5;
}
.wsla-qty-form .wsla-cart-icon-btn.is-loading i,
.wsla-qty-form .wsla-cart-icon-btn[aria-busy="true"] i {
  animation: wsla-domain-add-spin .75s linear infinite;
}
.wsla-qty-form .form-control:focus {
  border-color: #d7e0ec !important;
  box-shadow: none !important;
  outline: 0 !important;
}
.wsla-action-modal[data-wsla-action-modal-root] .modal-content {
  border-radius: 22px !important;
  border: 1px solid #eef2f7 !important;
  box-shadow: none !important;
}
.wsla-action-modal[data-wsla-action-modal-root] .modal-header {
  padding: 22px 22px 16px !important;
  border-bottom: 1px solid #edf1f7 !important;
}
.wsla-action-modal[data-wsla-action-modal-root] .modal-body {
  padding: 24px 26px 12px !important;
  color: #4f5d70 !important;
  font-weight: 700 !important;
}
.wsla-action-modal[data-wsla-action-modal-root] .modal-footer {
  padding: 10px 26px 26px !important;
  gap: 14px !important;
}
.wsla-action-modal[data-wsla-action-modal-root] .modal-footer .btn {
  min-width: 112px !important;
  min-height: 44px !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}
.wsla-action-modal[data-wsla-action-modal-root] .wsla-action-modal-confirm.is-loading {
  pointer-events: none;
  opacity: .85;
}
.wsla-action-modal[data-wsla-action-modal-root] .wsla-action-modal-confirm.is-loading::after {
  content: "";
  width: 14px;
  height: 14px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  display: inline-block;
  margin-inline-start: 8px;
  animation: wsla-domain-add-spin .75s linear infinite;
}
.wsla-tax-estimate-form .wsla-btn.is-loading,
.wsla-summary-checkout.is-loading {
  pointer-events: none;
  opacity: .88;
}
.wsla-summary-checkout.is-loading i {
  display: none;
}
.wsla-summary-checkout.is-loading::after,
.wsla-tax-estimate-form .wsla-btn.is-loading::after {
  content: "";
  width: 14px;
  height: 14px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  display: inline-block;
  margin-inline-start: 8px;
  animation: wsla-domain-add-spin .75s linear infinite;
}

/* WSLA checkout Terms of Service cleanup */
.wsla-checkout-sidebar .wsla-tos-box {
  margin: 16px 0 14px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
.wsla-checkout-sidebar .wsla-tos-check.wsla-tos-row {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #243447 !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  white-space: normal !important;
}
.wsla-checkout-sidebar .wsla-tos-check.wsla-tos-row input {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.wsla-checkout-sidebar .wsla-tos-check .wsla-checkbox-ui {
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  margin-top: 2px !important;
  border: 2px solid #d3dce8 !important;
  border-radius: 4px !important;
  background: #fff !important;
  box-shadow: none !important;
}
.wsla-checkout-sidebar .wsla-tos-check input:checked + .wsla-checkbox-ui {
  border-color: var(--wsla-danger, #ff4242) !important;
  background: var(--wsla-danger, #ff4242) !important;
}
.wsla-checkout-sidebar .wsla-tos-text {
  display: inline !important;
  min-width: 0 !important;
  color: #243447 !important;
}
.wsla-checkout-sidebar .wsla-tos-text a {
  color: var(--wsla-danger, #ff4242) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}
.wsla-checkout-sidebar .wsla-tos-error {
  display: block !important;
  margin: 7px 0 0 28px !important;
  color: var(--wsla-danger, #ff4242) !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  font-weight: 700 !important;
}
.wsla-checkout-sidebar .wsla-tos-error[hidden] { display: none !important; }
.wsla-checkout-sidebar .wsla-tos-box.wsla-has-error .wsla-checkbox-ui {
  border-color: var(--wsla-danger, #ff4242) !important;
}

/* ========================================================
   WSLA View Cart: improved empty cart state
   Scope: /cart.php?a=view only
   ======================================================== */
.wsla-viewcart-page .wsla-viewcart-empty {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(180px, 280px) minmax(0, 1fr);
  align-items: center;
  gap: 34px;
  padding: clamp(28px, 5vw, 54px);
  min-height: 310px;
  background: #ffffff;
  border: 1px solid var(--wsla-line-soft);
  border-radius: 24px;
  box-shadow: none !important;
}

.wsla-viewcart-page .wsla-viewcart-empty::before {
  content: "";
  position: absolute;
  inset-inline-end: -90px;
  top: -110px;
  width: 280px;
  height: 280px;
  border-radius: 999px;
  background: rgba(246, 98, 87, 0.08);
  pointer-events: none;
}

.wsla-viewcart-page .wsla-viewcart-empty::after {
  content: "";
  position: absolute;
  inset-inline-start: 42px;
  bottom: -86px;
  width: 210px;
  height: 210px;
  border-radius: 999px;
  background: rgba(246, 98, 87, 0.055);
  pointer-events: none;
}

.wsla-viewcart-page .wsla-viewcart-empty-visual,
.wsla-viewcart-page .wsla-viewcart-empty-content {
  position: relative;
  z-index: 1;
}

.wsla-viewcart-page .wsla-viewcart-empty-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 210px;
  border-radius: 22px;
  background: linear-gradient(180deg, #fff8f8 0%, #ffffff 100%);
}

.wsla-viewcart-page .wsla-viewcart-empty-visual img {
  display: block;
  width: min(220px, 80%);
  height: auto;
}

.wsla-viewcart-page .wsla-viewcart-empty-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding: 8px 13px;
  border-radius: 999px;
  color: var(--wsla-primary-dark);
  background: var(--wsla-soft-red);
  font-size: 13px;
  font-weight: 800;
}

.wsla-viewcart-page .wsla-viewcart-empty h3 {
  margin: 0;
  color: #111827;
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.14;
  font-weight: 900;
  letter-spacing: -0.7px;
}

.wsla-viewcart-page .wsla-viewcart-empty p {
  max-width: 640px;
  margin: 14px 0 0;
  color: var(--wsla-muted);
  font-size: 15px;
  line-height: 1.8;
}

.wsla-viewcart-page .wsla-viewcart-empty-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
}

.wsla-viewcart-page .wsla-viewcart-empty-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 46px;
  padding: 0 18px;
  border: 1px solid #ffd2d2;
  border-radius: 12px;
  color: var(--wsla-primary-dark);
  background: #fff;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none !important;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.wsla-viewcart-page .wsla-viewcart-empty-link:hover,
.wsla-viewcart-page .wsla-viewcart-empty-link:focus {
  color: #ffffff;
  background: var(--wsla-primary);
  border-color: var(--wsla-primary);
}

html[dir="rtl"] .wsla-viewcart-page .wsla-viewcart-empty .wsla-btn .bi-arrow-right,
body.body-rtl .wsla-viewcart-page .wsla-viewcart-empty .wsla-btn .bi-arrow-right {
  transform: rotate(180deg);
}

@media (max-width: 767.98px) {
  .wsla-viewcart-page .wsla-viewcart-empty {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 28px 18px;
    text-align: center;
  }

  .wsla-viewcart-page .wsla-viewcart-empty-visual {
    min-height: 160px;
  }

  .wsla-viewcart-page .wsla-viewcart-empty-actions {
    justify-content: center;
  }
}

/* === WSLA Viewcart/Domain global input focus cleanup ===
   Purpose: remove browser/Bootstrap blue focus frame and shadow from WHMCS order form fields.
   Keep validation colors and WHMCS field names/logic unchanged. */
.wsla-order-clean-page input:focus,
.wsla-order-clean-page select:focus,
.wsla-order-clean-page textarea:focus,
.wsla-order-clean-page .form-control:focus,
.wsla-order-clean-page .form-select:focus,
.wsla-order-clean-page select.form-control:focus,
.wsla-domain-input-wrap input:focus,
.wsla-domain-input-wrap .form-control:focus,
.wsla-product-domain-page input:focus,
.wsla-product-domain-page select:focus,
.wsla-product-domain-page textarea:focus,
.wsla-checkout-page input:focus,
.wsla-checkout-page select:focus,
.wsla-checkout-page textarea:focus,
.wsla-form-card input:focus,
.wsla-form-card select:focus,
.wsla-form-card textarea:focus,
.wsla-cart input:focus,
.wsla-cart select:focus,
.wsla-cart textarea:focus {
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  border-color: #d8e1ee !important;
}

.wsla-domain-input-wrap:focus-within {
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

.wsla-domain-input-wrap .form-control,
.wsla-domain-input-wrap .form-control:focus {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

.wsla-order-clean-page .is-invalid .form-control:focus,
.wsla-order-clean-page .form-control.is-invalid:focus,
.wsla-order-clean-page .has-error .form-control:focus,
.wsla-order-clean-page .is-error:focus {
  border-color: var(--wsla-danger) !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

/* WSLA Configure Product: keep WHMCS Standard Cart loader target present without changing logic. */
.wsla-order-summary-loader {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 14px;
    margin-bottom: 12px;
    border-radius: 12px;
    background: rgba(15, 23, 42, 0.04);
    color: #64748b;
    font-weight: 700;
    font-size: 13px;
}

/* WSLA configure product validation alignment */
#order-wslatheme_cart #frmConfigureProduct .wsla-field-invalid,
#order-wslatheme_cart #frmConfigureProduct .is-invalid {
    border-color: #ef4444 !important;
}
#order-wslatheme_cart #btnCompleteProductConfig.is-loading {
    pointer-events: none;
    opacity: .88;
}

/* WSLA checkout recommendations modal refresh
   Compatibility note: this styles WHMCS Standard Cart recommendation markup only.
   It does not alter checkout submit/payment flow. */
.wsla-recommendations-modal {
  --wsla-rec-radius: 22px;
  --wsla-rec-border: #eef2f7;
  --wsla-rec-soft: #fff5f5;
  --wsla-rec-text: #111827;
  --wsla-rec-muted: #64748b;
  z-index: 1065;
}
.wsla-recommendations-modal .modal-dialog {
  width: min(860px, calc(100vw - 28px));
  max-width: 860px;
  margin-inline: auto;
}
.wsla-recommendations-modal .modal-content {
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: var(--wsla-rec-radius);
  overflow: hidden;
  background: #fff;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .22) !important;
}
.wsla-recommendations-modal .modal-header {
  min-height: 86px;
  padding: 22px 26px;
  border: 0;
  background: linear-gradient(135deg, #ff5b55 0%, #ef4444 100%);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.wsla-recommendations-modal .wsla-recommendations-heading {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
.wsla-recommendations-modal .wsla-recommendations-icon {
  width: 46px;
  height: 46px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .22);
  color: #fff;
  font-size: 22px;
  flex: 0 0 auto;
}
.wsla-recommendations-modal .modal-title {
  margin: 0;
  color: #fff !important;
  font-size: 22px;
  line-height: 1.25;
  font-weight: 900;
  letter-spacing: -.02em;
}
.wsla-recommendations-modal .wsla-recommendations-subtitle {
  margin: 5px 0 0;
  color: rgba(255, 255, 255, .86);
  font-size: 13px;
  line-height: 1.35;
  font-weight: 700;
}
.wsla-recommendations-modal .btn-close,
.wsla-recommendations-modal .close {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  opacity: 1;
  box-shadow: none !important;
  background-color: rgba(255,255,255,.18);
  color: #fff;
  border: 1px solid rgba(255,255,255,.25);
}
.wsla-recommendations-modal .modal-body {
  padding: 0 !important;
  color: var(--wsla-rec-muted);
  font-size: 14px;
  line-height: 1.65;
  font-weight: 600;
  max-height: min(74vh, 720px);
  overflow: auto;
}
.wsla-recommendations-modal .wsla-recommendations-content {
  padding: 26px;
}
.wsla-recommendations-modal .product-recommendations {
  display: grid;
  gap: 14px;
  margin: 0;
}
.wsla-recommendations-modal .product-recommendation {
  position: relative;
  border: 1px solid var(--wsla-rec-border) !important;
  border-radius: 18px;
  background: #fff;
  padding: 0;
  overflow: hidden;
  box-shadow: none !important;
}
.wsla-recommendations-modal .product-recommendation .header,
.wsla-recommendations-modal .product-recommendation > .header {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 18px 18px;
  background: #fff;
  cursor: default;
}
.wsla-recommendations-modal .product-recommendation .body {
  padding: 0 18px 18px;
  background: #fff;
}
.wsla-recommendations-modal .product-recommendation .price,
.wsla-recommendations-modal .price {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  color: #1f7a2e !important;
  font-size: 16px;
  line-height: 1;
  font-weight: 900;
  white-space: nowrap;
}
.wsla-recommendations-modal .product-recommendation .headline,
.wsla-recommendations-modal .product-recommendation .name,
.wsla-recommendations-modal .product-recommendation h4,
.wsla-recommendations-modal .product-recommendation h5 {
  margin: 0 0 5px;
  color: var(--wsla-rec-text);
  font-size: 16px;
  line-height: 1.35;
  font-weight: 900;
}
.wsla-recommendations-modal .product-recommendation .tagline,
.wsla-recommendations-modal .product-recommendation .description,
.wsla-recommendations-modal .product-recommendation p {
  margin: 0;
  color: var(--wsla-rec-muted);
  font-size: 13px;
  line-height: 1.55;
  font-weight: 700;
}
.wsla-recommendations-modal .product-recommendation .btn-add,
.wsla-recommendations-modal .btn-add {
  min-height: 42px;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #16a34a !important;
  color: #fff !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 13px;
  line-height: 1;
  font-weight: 900;
  text-decoration: none !important;
  box-shadow: none !important;
  white-space: nowrap;
}
.wsla-recommendations-modal .product-recommendation .btn-add:hover,
.wsla-recommendations-modal .btn-add:hover {
  background: #15803d !important;
  color: #fff !important;
  transform: translateY(-1px);
}
.wsla-recommendations-modal .product-recommendation .btn-add[disabled],
.wsla-recommendations-modal .product-recommendation .btn-add.disabled,
.wsla-recommendations-modal .product-recommendation .btn-add.wsla-is-loading,
.wsla-recommendations-modal .btn-add[aria-busy="true"] {
  pointer-events: none;
  opacity: .82;
}
.wsla-recommendations-modal .product-recommendation .btn-add.wsla-is-loading::after,
.wsla-recommendations-modal .btn-add[aria-busy="true"]::after {
  content: "";
  width: 14px;
  height: 14px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: wsla-domain-add-spin .75s linear infinite;
}
.wsla-recommendations-modal .product-recommendation .arrow {
  width: 22px;
  height: 22px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.18) !important;
  color: currentColor !important;
}
.wsla-recommendations-modal .expander,
.wsla-recommendations-modal .rotate,
.wsla-recommendations-modal .fa-square,
.wsla-recommendations-modal .fas.fa-square,
.wsla-recommendations-modal .far.fa-square {
  color: var(--wsla-primary) !important;
}
.wsla-recommendations-modal a:not(.btn):not(.btn-add) {
  color: #2563eb;
  font-weight: 800;
  text-decoration: none;
}
.wsla-recommendations-modal a:not(.btn):not(.btn-add):hover {
  text-decoration: underline;
}
.wsla-recommendations-modal .modal-body > .btn,
.wsla-recommendations-modal .wsla-recommendations-content > .btn,
.wsla-recommendations-modal .wsla-recommendations-content > a.btn {
  min-height: 44px;
  padding: 0 22px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--wsla-primary) !important;
  color: #fff !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  box-shadow: none !important;
  margin-top: 18px;
}
.wsla-recommendations-modal .product-recommendation.clonable {
  display: none !important;
}
@media (max-width: 767px) {
  .wsla-recommendations-modal .modal-dialog {
    width: calc(100vw - 18px);
    margin: 9px auto;
  }
  .wsla-recommendations-modal .modal-header {
    padding: 18px;
  }
  .wsla-recommendations-modal .wsla-recommendations-icon {
    width: 40px;
    height: 40px;
    border-radius: 14px;
  }
  .wsla-recommendations-modal .modal-title {
    font-size: 18px;
  }
  .wsla-recommendations-modal .wsla-recommendations-content {
    padding: 18px;
  }
  .wsla-recommendations-modal .product-recommendation .header,
  .wsla-recommendations-modal .product-recommendation > .header {
    grid-template-columns: 1fr;
  }
}


/* WSLA checkout customer type tabs: make account selection look and behave like real segmented buttons. */
.wsla-checkout-form .wsla-customer-type-tabs {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin: 20px 0 24px !important;
}
.wsla-checkout-form .wsla-customer-type-tab.wsla-choice-button {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) 26px !important;
  align-items: center !important;
  gap: 14px !important;
  min-height: 76px !important;
  padding: 15px 16px !important;
  border: 1px solid #dce4ef !important;
  border-radius: 18px !important;
  background: #fff !important;
  color: #102033 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  user-select: none !important;
  transition: border-color .16s ease, background-color .16s ease, transform .16s ease !important;
}
.wsla-checkout-form .wsla-customer-type-tab.wsla-choice-button:hover {
  border-color: rgba(248, 82, 78, .55) !important;
  background: #fffafa !important;
  transform: translateY(-1px) !important;
}
.wsla-checkout-form .wsla-customer-type-tab.wsla-choice-button input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  pointer-events: none !important;
}
.wsla-checkout-form .wsla-choice-icon {
  width: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 14px !important;
  background: #fff1f1 !important;
  color: var(--wsla-danger) !important;
  font-size: 20px !important;
  flex: 0 0 auto !important;
}
.wsla-checkout-form .wsla-choice-copy {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}
.wsla-checkout-form .wsla-choice-copy strong {
  display: block !important;
  color: #102033 !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;
}
.wsla-checkout-form .wsla-choice-copy small {
  display: block !important;
  color: #64748b !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
}
.wsla-checkout-form .wsla-choice-check {
  width: 26px !important;
  height: 26px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  border: 1px solid #dce4ef !important;
  background: #fff !important;
  color: transparent !important;
  font-size: 16px !important;
}
.wsla-checkout-form .wsla-customer-type-tab.wsla-choice-button.is-selected,
.wsla-checkout-form .wsla-customer-type-tab.wsla-choice-button:has(input:checked) {
  border-color: var(--wsla-danger) !important;
  background: linear-gradient(180deg, #fffafa 0%, #fff5f5 100%) !important;
}
.wsla-checkout-form .wsla-customer-type-tab.wsla-choice-button.is-selected .wsla-choice-icon,
.wsla-checkout-form .wsla-customer-type-tab.wsla-choice-button:has(input:checked) .wsla-choice-icon {
  background: var(--wsla-danger) !important;
  color: #fff !important;
}
.wsla-checkout-form .wsla-customer-type-tab.wsla-choice-button.is-selected .wsla-choice-check,
.wsla-checkout-form .wsla-customer-type-tab.wsla-choice-button:has(input:checked) .wsla-choice-check {
  border-color: var(--wsla-danger) !important;
  background: var(--wsla-danger) !important;
  color: #fff !important;
}
.wsla-checkout-form .wsla-customer-type-tab.wsla-choice-button:focus-within {
  border-color: var(--wsla-danger) !important;
}
@media (max-width: 767px) {
  .wsla-checkout-form .wsla-customer-type-tabs {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .wsla-checkout-form .wsla-customer-type-tab.wsla-choice-button {
    grid-template-columns: 40px minmax(0, 1fr) 24px !important;
    min-height: 68px !important;
    padding: 13px 14px !important;
  }
  .wsla-checkout-form .wsla-choice-icon {
    width: 40px !important;
    height: 40px !important;
  }
}

/* === WSLA Checkout final validation + phone input cleanup (WHMCS-safe) === */
.wsla-checkout-form .iti,
.wsla-checkout-form .intl-tel-input {
  display: block !important;
  width: 100% !important;
}
.wsla-checkout-form .iti input#inputPhone,
.wsla-checkout-form .intl-tel-input input#inputPhone,
.wsla-checkout-form input#inputPhone {
  width: 100% !important;
}
.wsla-checkout-form .iti input#inputPhone,
.wsla-checkout-form .intl-tel-input input#inputPhone {
  padding-left: 104px !important;
  padding-right: 16px !important;
}
.wsla-checkout-form .iti__flag-container,
.wsla-checkout-form .intl-tel-input .flag-container {
  z-index: 4 !important;
}
.wsla-checkout-form .iti__selected-flag,
.wsla-checkout-form .intl-tel-input .selected-flag {
  min-height: 54px !important;
  padding-left: 14px !important;
  padding-right: 10px !important;
  border-radius: 14px 0 0 14px !important;
}
.wsla-checkout-form .iti__selected-dial-code {
  color: #344767 !important;
  font-weight: 700 !important;
  margin-left: 6px !important;
}
.wsla-checkout-form .wsla-field.wsla-has-error > label,
.wsla-checkout-form .wsla-field.is-invalid > label {
  color: var(--wsla-danger) !important;
}
.wsla-checkout-form .wsla-field.wsla-has-error .form-control,
.wsla-checkout-form .wsla-field.is-invalid .form-control,
.wsla-checkout-form .form-control.is-invalid {
  border-color: var(--wsla-danger) !important;
  background-color: #fffafa !important;
  box-shadow: none !important;
}
.wsla-checkout-form .wsla-field-error[data-wsla-error] {
  display: block !important;
  margin-top: 7px !important;
  color: var(--wsla-danger) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}
.wsla-tos-box.wsla-has-error,
.wsla-tos-box.is-invalid {
  border-color: rgba(239, 68, 68, .45) !important;
  background: #fff8f8 !important;
}
.wsla-tos-box.wsla-has-error .wsla-checkbox-ui,
.wsla-tos-box.is-invalid .wsla-checkbox-ui {
  border-color: var(--wsla-danger) !important;
}
.wsla-tos-error[hidden] { display: none !important; }
.wsla-tos-error:not([hidden]) {
  display: block !important;
  margin-top: 8px !important;
  color: var(--wsla-danger) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}
.wsla-customer-type-tab input[name="wsla_custtype_choice"] {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.wsla-customer-type-tab .wsla-choice-check {
  margin-left: auto !important;
  display: inline-flex !important;
  width: 26px !important;
  height: 26px !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  border: 1px solid #d8e1ee !important;
  color: transparent !important;
  background: #fff !important;
}
.wsla-customer-type-tab.is-selected .wsla-choice-check,
.wsla-customer-type-tab:has(input:checked) .wsla-choice-check {
  border-color: var(--wsla-danger) !important;
  background: var(--wsla-danger) !important;
  color: #fff !important;
}

/* WSLA security hardening / WHMCS 9 compatibility: linked accounts + service renewals */
.wsla-linked-accounts {
    margin: 18px 0;
}
.wsla-linked-accounts:empty {
    display: none;
}
.wsla-linked-accounts .providerLinkingFeedback {
    margin-bottom: 14px;
}
.wsla-service-renewals-page .wsla-section-title-row {
    align-items: flex-start;
    gap: 16px;
}
.wsla-service-renewal-search {
    max-width: 420px;
    margin: 18px 0 22px;
}
.wsla-service-renewals-list {
    display: grid;
    gap: 16px;
}
.wsla-service-renewal-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    padding: 20px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
}
.wsla-service-renewal-card .badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 700;
}
.wsla-service-renewal-card .badge-success {
    background: rgba(22, 163, 74, 0.12);
    color: #15803d;
}
.wsla-service-renewal-card .badge-secondary {
    background: rgba(100, 116, 139, 0.14);
    color: #475569;
}
.wsla-service-renewal-card h3 {
    margin: 10px 0 4px;
    font-size: 18px;
    font-weight: 800;
    color: #0f172a;
}
.wsla-service-renewal-meta,
.wsla-service-renewal-period {
    margin-top: 10px;
    color: #64748b;
    font-size: 14px;
}
.wsla-service-renewal-period {
    display: grid;
    gap: 4px;
}
.wsla-service-renewal-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.wsla-service-renewal-actions .btn-add-renewal-to-cart i.fa-spinner {
    display: none;
    margin-inline-end: 8px;
}
.wsla-service-renewal-actions .btn-add-renewal-to-cart .added {
    display: none;
}
.wsla-addon-renewals {
    grid-column: 1 / -1;
    margin-top: 8px;
    padding: 16px;
    border-radius: 16px;
    background: #f8fafc;
}
.wsla-addon-renewals h4 {
    margin: 0 0 12px;
    font-size: 15px;
    font-weight: 800;
    color: #334155;
}
.wsla-addon-renewals .wsla-service-renewal-card {
    box-shadow: none;
}
.wsla-renewals-summary {
    margin-top: 22px;
}
.wsla-renewals-viewcart {
    width: 100%;
    justify-content: center;
    margin-top: 14px;
}
.wsla-renewals-toggle {
    white-space: nowrap;
}
@media (max-width: 768px) {
    .wsla-service-renewal-card {
        grid-template-columns: 1fr;
    }
    .wsla-service-renewal-actions {
        justify-content: stretch;
    }
    .wsla-service-renewal-actions .wsla-btn {
        width: 100%;
        justify-content: center;
    }
}


/* WSLA reusable lightweight AJAX-style button state
   Keep this intentionally quiet: no pulsing ring, no layout jump, no large text inside icon buttons. */
.wsla-cart .wsla-btn-busy,
.wsla-order-clean-page .wsla-btn-busy,
#order-wslatheme_cart .wsla-btn-busy {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    pointer-events: none;
    opacity: 0.96;
    transform: none !important;
    box-shadow: none !important;
}

.wsla-cart .wsla-btn-spinner,
.wsla-order-clean-page .wsla-btn-spinner,
#order-wslatheme_cart .wsla-btn-spinner {
    width: 12px;
    height: 12px;
    border: 1.5px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    display: inline-block;
    flex: 0 0 auto;
    opacity: 0.78;
    animation: wslaButtonSpin 0.8s linear infinite;
}

.wsla-cart .wsla-btn-busy-text,
.wsla-order-clean-page .wsla-btn-busy-text,
#order-wslatheme_cart .wsla-btn-busy-text {
    line-height: 1;
    white-space: nowrap;
}

.wsla-cart .wsla-btn-busy-compact,
.wsla-order-clean-page .wsla-btn-busy-compact,
#order-wslatheme_cart .wsla-btn-busy-compact {
    padding-inline: 0 !important;
}

.wsla-cart .wsla-cart-icon-btn.wsla-btn-busy,
#order-wslatheme_cart .wsla-cart-icon-btn.wsla-btn-busy {
    color: inherit;
    background: transparent;
}

@keyframes wslaButtonSpin {
    to { transform: rotate(360deg); }
}
