/* Scoped checkout palette: keep the surrounding marketing page unchanged. */
.promogen-dialog {
  --checkout-accent: #1da1f2;
  --checkout-ink: #182b37;
  --checkout-muted: #526570;
  --checkout-line: #dce3e7;
  color: var(--checkout-ink);
  background: #f6f8f9 !important;
  border: 1px solid #e1e7ea;
  border-radius: 20px;
  box-shadow: 0 24px 80px rgba(15, 30, 40, .24);
}
.promogen-dialog::backdrop {
  background: rgba(17, 29, 39, .58);
  backdrop-filter: blur(5px);
}
.promogen-dialog .promogen-dialog-head {
  background: #fff !important;
  border-bottom: 1px solid var(--checkout-line);
  padding-block: 24px;
}
.promogen-dialog .promogen-dialog-head .kicker {
  color: var(--checkout-accent);
  font-size: .68rem;
  letter-spacing: .14em;
}
.promogen-dialog .promogen-dialog-head h2 {
  color: var(--checkout-ink);
  font-size: clamp(1.2rem, 3vw, 1.5rem);
  line-height: 1.35;
  letter-spacing: -.035em;
}
.promogen-dialog .dialog-close {
  flex-shrink: 0;
  color: #526570;
  background: #f3f5f6;
  border: 1px solid var(--checkout-line);
  border-radius: 10px;
}
.promogen-dialog .dialog-close:hover { background: #e7edf0; color: #182b37; }
.promogen-dialog .promogen-steps { padding-block: 22px 0; }
.promogen-dialog .promogen-steps span { color: #637580; font-weight: 600; }
.promogen-dialog .promogen-steps span.active { color: var(--checkout-accent); }
.promogen-dialog .promogen-steps span.active::before {
  background: var(--checkout-accent) !important;
  box-shadow: 0 0 0 4px #e5f4ff;
}
.promogen-dialog .promogen-steps i { background: var(--checkout-line) !important; }
.promogen-dialog .mode-card,
.promogen-dialog .category-card {
  border: 1px solid var(--checkout-line);
  background: #fff !important;
  box-shadow: none !important;
  transition: border-color .15s, background-color .15s;
}
.promogen-dialog .mode-card { border-radius: 12px; padding: 18px 16px; }
.promogen-dialog .mode-card strong { font-weight: 700; }
.promogen-dialog .mode-card > span {
  color: #526570;
  background: #eff3f5;
  border-radius: 10px;
}
.promogen-dialog .mode-card > span svg { width: 24px; height: 24px; }
.promogen-dialog .mode-card.active,
.promogen-dialog .category-card.active {
  color: #125d8b;
  border-color: var(--checkout-accent) !important;
  background: #eef8ff !important;
  box-shadow: inset 0 0 0 1px var(--checkout-accent) !important;
}
.promogen-dialog .mode-card.active > span,
.promogen-dialog .category-card.active i {
  color: #fff !important;
  background: var(--checkout-accent) !important;
}
.promogen-dialog .mode-card:hover,
.promogen-dialog .category-card:hover { border-color: #73bff0; }
.promogen-dialog .promo-mode-panel,
.promogen-dialog .guest-contact-section,
.promogen-dialog .payment-panel {
  border-color: var(--checkout-line);
  border-radius: 14px;
  background: #fff !important;
  box-shadow: none;
}
.promogen-dialog .form-section-heading strong { font-weight: 700; font-size: .98rem; }
.promogen-dialog .form-section-heading { gap: 6px; }
.promogen-dialog .category-heading > span {
  color: #36535d !important;
  background: #edf2f4 !important;
  font-weight: 600;
}
.promogen-dialog .category-card { border-radius: 10px; }
.promogen-dialog .category-card i { background: #f1f4f6; color: #526570; border-radius: 10px; }
.promogen-dialog small,
.promogen-dialog label > small,
.promogen-dialog .guest-email-note,
.promogen-dialog .payment-note,
.promogen-dialog .consent-copy { color: var(--checkout-muted); }
.promogen-dialog label b { color: #637580; font-weight: 500; letter-spacing: .04em; font-size: .6rem; }
.promogen-dialog input,
.promogen-dialog textarea,
.promogen-dialog select,
.promogen-dialog .select-shell {
  color: var(--checkout-ink);
  background-color: #fff;
  border-color: #cbd6dc;
  border-radius: 8px;
  box-shadow: none;
}
.promogen-dialog input::placeholder,
.promogen-dialog textarea::placeholder { color: #8a98a3; opacity: 1; font-weight: 400; }
.promogen-dialog input:focus,
.promogen-dialog textarea:focus,
.promogen-dialog select:focus {
  border-color: var(--checkout-accent) !important;
  box-shadow: 0 0 0 3px rgba(29, 161, 242, .16) !important;
}
.promogen-dialog button:focus-visible,
.promogen-dialog summary:focus-visible {
  outline: 3px solid #1da1f2;
  outline-offset: 3px;
}
.promogen-dialog .optional-details { border-color: var(--checkout-line); border-radius: 10px; background: #f8fafb !important; }
.promogen-dialog .optional-details summary { font-size: .82rem; font-weight: 600; }
.promogen-dialog .optional-details summary span,
.promogen-dialog .image-upload-card strong { color: var(--checkout-accent); }
.promogen-dialog .image-upload-card { border-color: #b8cbd1; border-radius: 10px; box-shadow: none; }
.promogen-dialog .image-upload-card > span { color: var(--checkout-accent); background: #e8f5ff; }
.promogen-dialog .image-upload-card.has-preview { border-color: var(--checkout-accent) !important; background: #eef8ff !important; box-shadow: none !important; }
.promogen-dialog .payment-summary { background: #eff8ff; border: 1px solid #d4eafb; border-radius: 10px; }
.promogen-dialog .payment-summary > span { color: var(--checkout-accent); }
.promogen-dialog .button.primary {
  background: var(--checkout-accent) !important;
  color: #fff !important;
  border: 1px solid var(--checkout-accent);
  border-radius: 10px;
  box-shadow: 0 2px 3px rgba(17, 52, 61, .08);
  font-weight: 600;
}
.promogen-dialog .button.primary:hover { background: #1686cc !important; box-shadow: none; }
.promogen-dialog .button.secondary { color: #344a57; border: 1px solid #cad5dc; border-radius: 10px; box-shadow: none; }
.promogen-dialog .consent-row input:checked + .consent-check { background: var(--checkout-accent) !important; border-color: var(--checkout-accent) !important; }
.promogen-dialog .promogen-status.show { color: #125d8b; background: #eaf6ff; }
.promogen-dialog .promogen-status.error { color: #9e302c; background: #fceeed; }
@media (max-width: 620px) {
  .promogen-dialog .mode-card { padding: 14px; }
  .promogen-dialog .promogen-steps span b { display: inline; }
  .promogen-dialog .promogen-steps i { width: 24px; margin-inline: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .promogen-dialog *, .promogen-dialog *::before { transition: none !important; animation: none !important; }
}

/* A quiet luminous treatment keeps the original LoyaBuzz blue at the center. */
.promogen-dialog {
  background: radial-gradient(ellipse at 100% 0, rgba(110, 157, 255, .10), transparent 45%), #f6faff !important;
  box-shadow: 0 24px 80px rgba(15, 30, 40, .24), 0 0 0 1px rgba(131, 200, 255, .25);
}
.promogen-dialog .promogen-dialog-head {
  background: radial-gradient(ellipse at 95% 0, #eaf3ff, transparent 65%), #fff !important;
  border-bottom-color: #d9eafa;
}
.promogen-dialog .promogen-dialog-head .kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #147fc0;
}
.promogen-dialog .promogen-dialog-head .kicker::before {
  content: "✦";
  font-size: .95rem;
  color: #1da1f2;
  text-shadow: 0 0 12px rgba(29, 161, 242, .3);
}
.promogen-dialog .mode-card.active,
.promogen-dialog .category-card.active {
  background: linear-gradient(135deg, #edf8ff, #f2f4ff) !important;
  box-shadow: inset 0 0 0 1px #1da1f2, 0 3px 14px rgba(29, 161, 242, .10) !important;
}
.promogen-dialog .mode-card.active > span,
.promogen-dialog .category-card.active i {
  background: linear-gradient(145deg, #1da1f2, #398bea) !important;
}
.promogen-dialog .button.primary {
  background: linear-gradient(110deg, #1da1f2, #298ee9) !important;
  box-shadow: 0 5px 18px rgba(29, 161, 242, .23);
}
.promogen-dialog .button.primary:hover {
  background: linear-gradient(110deg, #168fdb, #247bd1) !important;
  box-shadow: 0 6px 22px rgba(29, 161, 242, .28);
}
.promogen-dialog .promogen-steps span.active { color: #147fc0; }
