/* WhatsApp pairing modal and brand styles. */
.whatsapp-pairing-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  padding: 24px;
  overflow-y: auto;
  place-items: center;
  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(6px);
  animation: whatsappFadeIn 0.2s ease-out;
}
.whatsapp-pairing-modal {
  position: relative;
  width: min(100%, 420px);
  padding: 28px;
  color: var(--bone);
  text-align: center;
  background: var(--charcoal);
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: 0 30px 100px rgba(0, 0, 0, 0.55);
  animation: whatsappModalIn 0.22s ease-out;
}
.whatsapp-pairing-close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  width: 34px;
  height: 34px;
  padding: 0;
  color: var(--stone);
  font-family: inherit;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  place-items: center;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 10px;
  transition: color 0.15s, background 0.15s;
}
.whatsapp-pairing-close:hover { color: var(--bone); background: rgba(255, 255, 255, 0.05); }
.whatsapp-pairing-icon {
  display: grid;
  width: 52px;
  height: 52px;
  margin: 0 auto 16px;
  color: #fff;
  place-items: center;
  background: linear-gradient(145deg, #2ed66b 0%, #16a34a 100%);
  border: 1px solid rgba(83, 231, 131, .55);
  border-radius: 16px;
  box-shadow: 0 10px 22px rgba(22, 163, 74, .25), inset 0 1px rgba(255, 255, 255, .28);
}
.whatsapp-pairing-icon svg { width: 31px; height: 31px; }
.whatsapp-pairing-eyebrow {
  margin: 0 0 8px;
  color: var(--stone-dark);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.whatsapp-pairing-modal h2 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.whatsapp-pairing-description {
  max-width: 320px;
  margin: 8px auto 24px;
  color: var(--stone);
  font-size: 13px;
  line-height: 1.55;
}
.whatsapp-pairing-content { min-height: 150px; }
.whatsapp-pairing-steps {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0 0 20px;
  padding: 16px;
  color: var(--stone);
  font-size: 12px;
  line-height: 1.5;
  text-align: left;
  list-style: none;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.whatsapp-pairing-steps li { display: flex; align-items: flex-start; gap: 10px; }
.whatsapp-step-num {
  display: grid;
  flex: none;
  width: 22px;
  height: 22px;
  color: var(--lime);
  font-size: 10px;
  font-weight: 700;
  place-items: center;
  background: rgba(200, 240, 62, 0.1);
  border: 1px solid rgba(200, 240, 62, 0.22);
  border-radius: 7px;
}
.whatsapp-step-text { flex: 1; padding-top: 2px; }
.whatsapp-pairing-steps strong { color: var(--bone); font-weight: 600; white-space: nowrap; }
.whatsapp-pairing-generate,
.whatsapp-pairing-done {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  gap: 8px;
  color: var(--ink);
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  background: var(--lime);
  border: none;
  border-radius: 10px;
  transition: filter 0.15s, transform 0.15s;
}
.whatsapp-pairing-generate:hover,
.whatsapp-pairing-done:hover { filter: brightness(1.06); }
.whatsapp-pairing-generate:active,
.whatsapp-pairing-done:active { transform: scale(0.98); }
.whatsapp-pairing-generate:focus-visible,
.whatsapp-pairing-done:focus-visible { outline: 3px solid rgba(107, 145, 30, .28); outline-offset: 3px; }
.whatsapp-pairing-generate.is-loading { cursor: wait; opacity: .78; }
.whatsapp-button-spinner {
  width: 14px;
  height: 14px;
  border: 2px solid rgba(11, 11, 12, .22);
  border-top-color: var(--ink);
  border-radius: 50%;
  animation: whatsappSpin .7s linear infinite;
}
.whatsapp-qr-frame {
  display: grid;
  width: 210px;
  height: 210px;
  margin: 0 auto 16px;
  padding: 12px;
  place-items: center;
  background: var(--bone);
  border-radius: 14px;
}
.whatsapp-qr-code { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 4px; }
.whatsapp-pairing-spinner {
  width: 34px;
  height: 34px;
  margin: 40px auto 18px;
  border: 3px solid var(--border);
  border-top-color: var(--lime);
  border-radius: 50%;
  animation: whatsappSpin .8s linear infinite;
}
.whatsapp-pairing-error {
  margin: 30px 0 18px;
  padding: 12px 14px;
  color: #fca5a5;
  font-size: 13px;
  line-height: 1.5;
  background: rgba(248, 113, 113, .08);
  border: 1px solid rgba(248, 113, 113, .22);
  border-radius: 10px;
}
.whatsapp-pairing-success-mark {
  display: grid;
  width: 56px;
  height: 56px;
  margin: 4px auto 16px;
  color: var(--ink);
  font-size: 26px;
  font-weight: 700;
  place-items: center;
  background: var(--lime);
  border-radius: 50%;
}
.whatsapp-pairing-success-title { margin: 0; color: var(--bone); font-size: 16px; font-weight: 700; }
.whatsapp-pairing-success-copy { max-width: 260px; margin: 8px auto 22px; color: var(--stone); font-size: 13px; line-height: 1.5; }
.whatsapp-icon { color: #16a34a; background: #effbf1; border: 1px solid #d8f0dc; }
.whatsapp-icon svg { width: 27px; height: 27px; }
@keyframes whatsappSpin { to { transform: rotate(360deg); } }
@keyframes whatsappFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes whatsappModalIn { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (max-width: 480px) {
  .whatsapp-pairing-backdrop { padding: 12px; }
  .whatsapp-pairing-modal { padding: 24px 18px; }
  .whatsapp-qr-frame { width: min(210px, calc(100vw - 80px)); height: auto; aspect-ratio: 1; }
}

/* Refined QR state, refresh action, and connected card state. */
.whatsapp-pairing-modal {
  width: min(100%, 460px);
  padding: 34px 32px 28px;
  background: radial-gradient(circle at 50% -10%, rgba(200, 240, 62, .08), transparent 42%), #111113;
  border-color: rgba(255, 255, 255, .11);
  border-radius: 24px;
  box-shadow: 0 34px 100px rgba(0, 0, 0, .62), 0 0 0 1px rgba(255, 255, 255, .025);
}
.whatsapp-pairing-icon { width: 60px; height: 60px; margin-bottom: 18px; border-radius: 18px; }
.whatsapp-pairing-eyebrow { margin-bottom: 10px; color: #9b9ca3; font-size: 10px; letter-spacing: .13em; }
.whatsapp-pairing-modal h2 { font-size: 23px; letter-spacing: -.045em; }
.whatsapp-pairing-description { max-width: 340px; margin: 10px auto 26px; color: #a7a7af; font-size: 12px; line-height: 1.6; }
.whatsapp-pairing-content { min-height: 0; }
.whatsapp-qr-frame {
  width: 224px;
  height: 224px;
  margin: 0 auto 18px;
  padding: 10px;
  border: 1px solid rgba(0, 0, 0, .08);
  border-radius: 18px;
  box-shadow: 0 14px 30px rgba(0, 0, 0, .24);
}
.whatsapp-qr-code { border-radius: 8px; }
.whatsapp-qr-status { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0; color: #f1f1f3; font-size: 12px; font-weight: 700; line-height: 1.4; }
.whatsapp-qr-status-dot { width: 7px; height: 7px; flex: 0 0 7px; background: #38d36b; border-radius: 50%; box-shadow: 0 0 0 4px rgba(56, 211, 107, .12); }
.whatsapp-qr-expiry { max-width: 300px; margin: 9px auto 18px; color: #92939a; font-size: 11px; line-height: 1.5; }
.whatsapp-qr-expiry strong { color: #d8d8dc; font-weight: 600; }
.whatsapp-pairing-regenerate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  min-height: 0;
  padding: 9px 13px;
  color: #bfc0c6;
  font: 600 11px/1 var(--font-body);
  cursor: pointer;
  text-decoration: none;
  background: rgba(255, 255, 255, .045);
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 10px;
  transition: color .15s, background .15s, border-color .15s, transform .15s;
}
.whatsapp-pairing-regenerate:hover { color: #fff; background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .2); }
.whatsapp-pairing-regenerate:active { transform: translateY(1px); }
.whatsapp-pairing-spinner { margin: 44px auto 18px; }
.whatsapp-pairing-error { margin: 14px 0 18px; text-align: left; }
.apps-card.is-connected { border-color: #cfe99d; background: linear-gradient(145deg, #fbfdf7 0%, #f5f9ee 100%); }
.apps-card.is-connected:hover { border-color: #acd75c; }
.apps-status.is-connected { color: #28733d; background: #e2f5ca; }
.apps-connect-button.is-connected {
  color: #17431f;
  background: linear-gradient(135deg, #dffb88 0%, #bfe969 100%);
  border-color: rgba(75, 133, 35, .25);
  box-shadow: 0 6px 16px rgba(113, 164, 46, .16), inset 0 1px rgba(255, 255, 255, .7);
}
.apps-connect-button.is-connected:hover { background: linear-gradient(135deg, #e9ffad 0%, #c8ef79 100%); }
@media (max-width: 480px) {
  .whatsapp-pairing-modal { padding: 28px 18px 22px; }
  .whatsapp-qr-frame { width: min(224px, calc(100vw - 76px)); height: auto; aspect-ratio: 1; }
}

/* Settings panel, disabled state, and intentionally flat WhatsApp card. */
.apps-card-featured,
.apps-card-featured:hover {
  transition: none;
  transform: none;
  box-shadow: none;
}
.apps-card-featured:hover { border-color: #e4e4e4; }
.apps-card-featured.is-connected:hover { border-color: #cfe99d; }
.apps-card-featured.is-disabled:hover { border-color: #dfe2e5; }
.apps-card-featured .apps-connect-button,
.apps-card-featured .apps-connect-button:hover {
  transition: none;
  transform: none;
}
.apps-card-featured .apps-connect-button.is-available:hover {
  background: linear-gradient(135deg, #d9ff63 0%, #c8f03e 56%, #a9d42c 100%);
  box-shadow: 0 6px 16px rgba(143, 177, 36, .2), inset 0 1px rgba(255, 255, 255, .55);
}
.apps-card-featured .apps-connect-button.is-connected:hover {
  background: linear-gradient(135deg, #dffb88 0%, #bfe969 100%);
  box-shadow: 0 6px 16px rgba(113, 164, 46, .16), inset 0 1px rgba(255, 255, 255, .7);
}
.apps-card-featured .apps-connect-button.is-disabled,
.apps-card-featured .apps-connect-button.is-disabled:hover {
  color: #62686d;
  background: #edf0f2;
  border-color: #d9dde0;
  box-shadow: none;
}
.apps-card.is-disabled { border-color: #dfe2e5; background: #f8f9fa; }
.apps-status.is-disabled { color: #697077; background: #eceff1; }
.whatsapp-settings-off-mark {
  display: grid;
  width: 56px;
  height: 56px;
  margin: 4px auto 16px;
  color: #697077;
  font-size: 24px;
  font-weight: 800;
  place-items: center;
  background: #edf0f2;
  border: 1px solid #dfe2e5;
  border-radius: 50%;
}
.whatsapp-settings-form { display: grid; gap: 14px; text-align: left; }
.whatsapp-settings-bots { display: grid; gap: 10px; }
.whatsapp-settings-row {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 13px 14px;
  color: var(--stone);
  background: rgba(255, 255, 255, .035);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 12px;
}
.whatsapp-settings-agent {
  overflow: hidden;
  color: #c8f03e;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  line-height: 1.3;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}
.whatsapp-settings-bot-user {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #f8f8fa;
  font-size: 14px;
  line-height: 1.35;
}
.whatsapp-settings-status {
  display: block;
  color: #9fa1a8;
  font-size: 10px;
  line-height: 1.4;
  text-transform: capitalize;
}
.whatsapp-settings-status a { color: #c8f03e; text-decoration: none; }
.whatsapp-settings-status a:hover { text-decoration: underline; }
.whatsapp-settings-error { color: #fca5a5; }
.whatsapp-settings-field { display: grid; gap: 7px; color: #d8d8dc; font-size: 11px; font-weight: 700; }
.whatsapp-settings-field input {
  width: 100%;
  height: 42px;
  padding: 0 12px;
  color: var(--bone);
  font: 500 12px/1 var(--font-body);
  background: rgba(255, 255, 255, .045);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 10px;
  outline: none;
  transition: border-color .15s, background .15s;
}
.whatsapp-settings-field input:focus { background: rgba(255, 255, 255, .07); border-color: rgba(200, 240, 62, .65); }
.whatsapp-settings-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 62px;
  padding: 12px 13px;
  cursor: pointer;
  background: rgba(255, 255, 255, .035);
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 13px;
}
.whatsapp-settings-toggle > span:first-child { display: grid; gap: 5px; }
.whatsapp-settings-toggle strong { color: #f0f0f2; font-size: 12px; }
.whatsapp-settings-toggle small { color: #94959c; font-size: 10px; font-weight: 500; line-height: 1.4; }
.whatsapp-settings-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.whatsapp-switch {
  position: relative;
  width: 42px;
  height: 24px;
  flex: 0 0 42px;
  background: #3b3e43;
  border: 1px solid #555960;
  border-radius: 999px;
  transition: background .15s, border-color .15s;
}
.whatsapp-switch::after {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  content: '';
  background: #d7d9dc;
  border-radius: 50%;
  transition: transform .15s, background .15s;
}
.whatsapp-settings-toggle input:checked + .whatsapp-switch { background: #8ebd2d; border-color: #bde969; }
.whatsapp-settings-toggle input:checked + .whatsapp-switch::after { background: #fff; transform: translateX(18px); }
.whatsapp-settings-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 4px; }
.whatsapp-settings-cancel,
.whatsapp-settings-save {
  min-height: 38px;
  padding: 0 14px;
  font: 700 11px/1 var(--font-body);
  border-radius: 9px;
  cursor: pointer;
}
.whatsapp-settings-cancel { color: #bfc0c6; background: transparent; border: 1px solid rgba(255, 255, 255, .12); }
.whatsapp-settings-save { color: #10130b; background: var(--lime); border: 1px solid rgba(118, 153, 18, .22); }
.whatsapp-settings-cancel:hover,
.whatsapp-settings-save:hover { transform: none; filter: none; }
.whatsapp-settings-save:disabled { cursor: wait; opacity: .6; }
.whatsapp-settings-feedback { min-height: 16px; color: #96979e; font-size: 11px; line-height: 1.4; }
.whatsapp-settings-feedback.is-success { color: #9edc52; }
.whatsapp-settings-feedback.is-error { color: #fca5a5; }

.whatsapp-pairing-disconnect {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  margin: 0 8px 0 0;
  padding: 0 14px;
  color: #fca5a5;
  font: 700 11px/1 var(--font-body);
  cursor: pointer;
  background: rgba(248, 113, 113, .08);
  border: 1px solid rgba(248, 113, 113, .28);
  border-radius: 9px;
  transition: background .15s, border-color .15s, transform .15s;
}
.whatsapp-pairing-disconnect:hover { background: rgba(248, 113, 113, .15); border-color: rgba(248, 113, 113, .5); }
.whatsapp-pairing-disconnect:active { transform: translateY(1px); }


/* Connected state: compact, readable Discord bot management modal. */
.whatsapp-pairing-modal:has(.whatsapp-connected-state) {
  width: min(100%, 420px);
  padding: 20px;
  background: #101011;
  border-color: rgba(255, 255, 255, .1);
  border-radius: 20px;
}
.whatsapp-pairing-modal:has(.whatsapp-connected-state) .whatsapp-pairing-icon,
.whatsapp-pairing-modal:has(.whatsapp-connected-state) .whatsapp-pairing-eyebrow,
.whatsapp-pairing-modal:has(.whatsapp-connected-state) h2,
.whatsapp-pairing-modal:has(.whatsapp-connected-state) .whatsapp-pairing-description {
  display: none;
}
.whatsapp-connected-state { display: grid; gap: 14px; }
.whatsapp-connected-summary {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 0 0 16px;
  text-align: left;
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  border-radius: 0;
}
.whatsapp-connected-summary .whatsapp-pairing-success-mark {
  display: grid;
  width: 44px;
  height: 44px;
  margin: 0;
  color: #10130b;
  font-size: 20px;
  background: #c8f03e;
  border-radius: 13px;
  box-shadow: 0 6px 16px rgba(200, 240, 62, .16);
}
.whatsapp-connected-kicker {
  display: block;
  margin-bottom: 3px;
  color: #c8f03e;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .11em;
  line-height: 1.2;
  text-transform: uppercase;
}
.whatsapp-connected-summary .whatsapp-pairing-success-title {
  color: #f8f8fa;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.25;
}
.whatsapp-connected-summary .whatsapp-pairing-success-copy {
  max-width: none;
  margin: 4px 0 0;
  color: #92949c;
  font-size: 10px;
  line-height: 1.4;
}
.whatsapp-settings-form { display: grid; gap: 10px; }
.whatsapp-settings-feedback { min-height: 0; }
.whatsapp-settings-feedback:empty { display: none; }
.whatsapp-settings-bots { display: grid; gap: 8px; }
.whatsapp-settings-row {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 11px 12px;
  background: #18181a;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 11px;
}
.whatsapp-settings-agent {
  overflow: hidden;
  color: #c8f03e;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .07em;
  line-height: 1.25;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}
.whatsapp-settings-bot-user {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #f1f1f3;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
}
.whatsapp-settings-status {
  display: block;
  color: #94969e;
  font-size: 10px;
  line-height: 1.35;
  text-transform: capitalize;
}
.whatsapp-settings-status a { color: #c8f03e; text-decoration: none; }
.whatsapp-settings-status a:hover { text-decoration: underline; }
.whatsapp-settings-error { color: #fca5a5; }
.whatsapp-settings-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  margin-top: 2px;
}
.whatsapp-settings-actions .whatsapp-pairing-generate,
.whatsapp-settings-actions .whatsapp-settings-cancel {
  min-height: 42px;
  margin: 0;
  border-radius: 10px;
}
.whatsapp-settings-actions .whatsapp-pairing-generate {
  width: 100%;
  padding: 0 14px;
  font-size: 11px;
}
.whatsapp-settings-actions .whatsapp-settings-cancel { padding: 0 14px; }
@media (max-width: 480px) {
  .whatsapp-pairing-modal:has(.whatsapp-connected-state) { padding: 18px; }
  .whatsapp-connected-summary { grid-template-columns: 40px minmax(0, 1fr); gap: 10px; padding-bottom: 14px; }
  .whatsapp-connected-summary .whatsapp-pairing-success-mark { width: 40px; height: 40px; font-size: 18px; border-radius: 12px; }
  .whatsapp-settings-actions { grid-template-columns: 1fr; }
}

/* Shopify setup dialog: compact, branded, and easier to scan. */
.shopify-setup-backdrop {
  background: rgba(8, 10, 9, .62);
  backdrop-filter: blur(14px) saturate(.82);
}
.shopify-setup-modal {
  width: min(100%, 504px);
  padding: 34px 36px 30px;
  overflow: hidden;
  text-align: left;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 24px;
  box-shadow: 0 34px 90px rgba(15, 23, 42, .22), 0 8px 24px rgba(15, 23, 42, .08);
}
.shopify-setup-modal::before { display: none; }
.shopify-setup-modal .whatsapp-pairing-icon {
  width: 54px;
  height: 54px;
  margin: 0 0 22px;
  padding: 0;
  color: #95bf47;
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.shopify-setup-modal .whatsapp-pairing-icon svg { width: 54px; height: 54px; }
  top: 20px;
  right: 20px;
  width: 32px;
  height: 32px;
  color: #6b7280;
  border-color: #e5e7eb;
  background: #ffffff;
}
.shopify-setup-modal .whatsapp-pairing-icon {
  position: relative;
  width: 54px;
  height: 54px;
  margin: 0 0 22px;
  border-radius: 16px;
  box-shadow: 0 12px 28px rgba(22, 163, 74, .18), inset 0 1px rgba(255, 255, 255, .3);
}
.shopify-setup-modal .whatsapp-pairing-eyebrow { margin-bottom: 9px; }
.shopify-setup-modal h2 { font-size: 28px; letter-spacing: -.055em; }
.shopify-setup-modal .whatsapp-pairing-description {
  max-width: 365px;
  margin: 10px 0 28px;
  color: #aeb2aa;
  font-size: 13px;
  line-height: 1.55;
}
.shopify-setup-modal .whatsapp-pairing-content { position: relative; }
.shopify-setup-modal .whatsapp-settings-form { gap: 12px; }
.shopify-setup-modal .whatsapp-settings-field { gap: 8px; color: #e3e6dc; font-size: 11px; }
.shopify-setup-modal .whatsapp-settings-field input {
  height: 50px;
  padding: 0 15px;
  color: var(--bone);
  background: rgba(255, 255, 255, .055);
  border-color: rgba(255, 255, 255, .14);
  border-radius: 12px;
  font-size: 13px;
}
.shopify-setup-modal .whatsapp-settings-field input::placeholder { color: #73786f; }
.shopify-setup-modal .whatsapp-settings-field input:focus {
  background: rgba(200, 240, 62, .055);
  border-color: rgba(200, 240, 62, .7);
  box-shadow: 0 0 0 4px rgba(200, 240, 62, .08);
}
.shopify-setup-modal .whatsapp-settings-feedback { margin: 1px 0 0; }
.shopify-setup-modal .whatsapp-settings-actions { display: grid; grid-template-columns: 1fr 1.15fr; gap: 10px; margin-top: 7px; }
.shopify-setup-modal .whatsapp-settings-cancel,
.shopify-setup-modal .whatsapp-settings-save { min-height: 46px; border-radius: 12px; font-size: 12px; }
.shopify-setup-modal .whatsapp-settings-cancel { color: #c5c9c0; background: rgba(255, 255, 255, .035); border-color: rgba(255, 255, 255, .13); }
.shopify-setup-modal .whatsapp-settings-cancel:hover { color: var(--bone); background: rgba(255, 255, 255, .075); }
.shopify-setup-modal .whatsapp-settings-save { box-shadow: 0 8px 22px rgba(162, 205, 32, .17); }
.shopify-setup-modal .whatsapp-settings-save:hover { filter: brightness(1.06); transform: translateY(-1px); }
@media (max-width: 480px) {
  .shopify-setup-modal { padding: 28px 20px 22px; border-radius: 22px; }
  .shopify-setup-modal h2 { font-size: 25px; }
  .shopify-setup-modal .whatsapp-settings-actions { grid-template-columns: 1fr; }
  .shopify-setup-modal .whatsapp-settings-save { order: -1; }
}

/* White Shopify variant. */
.shopify-setup-modal .whatsapp-pairing-eyebrow { color: #7b8490; }
.shopify-setup-modal h2 { color: #111827; }
.shopify-setup-modal .whatsapp-pairing-description { color: #667085; }
.shopify-setup-modal .whatsapp-settings-field { color: #344054; }
.shopify-setup-modal .whatsapp-settings-field input {
  color: #111827;
  background: #f8fafc;
  border-color: #d9dee7;
}
.shopify-setup-modal .whatsapp-settings-field input::placeholder { color: #98a2b3; }
.shopify-setup-modal .whatsapp-settings-field input:focus {
  background: #fff;
  border-color: #a7d934;
  box-shadow: 0 0 0 4px rgba(167, 217, 52, .16);
}
.shopify-setup-modal .whatsapp-settings-cancel {
  color: #475467;
  background: #fff;
  border-color: #d9dee7;
}
.shopify-setup-modal .whatsapp-settings-cancel:hover { color: #111827; background: #f8fafc; }
.shopify-setup-modal .whatsapp-settings-feedback { color: #667085; }
.shopify-setup-modal .whatsapp-settings-feedback.is-error { color: #c0392b; }