/* Shared recovery and account-settings presentation. Authentication, account
   permissions, and destructive-action confirmations stay with their owners. */
body.dancr-button-system :is(.recovery-popover-surface, .reset-card, .customer-account-details, .account-controls-panel).account-form-surface {
  box-sizing: border-box;
  min-width: 0;
  gap: 18px;
  padding: clamp(20px, 5vw, 28px);
  border: 1px solid rgba(196, 181, 253, .2) !important;
  border-radius: 24px !important;
  background: radial-gradient(ellipse at top left, rgba(124, 58, 237, .09), transparent 65%), #111118 !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .04) !important;
  color: var(--dancr-color-text-primary);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  text-align: left;
}

body.dancr-button-system .account-form-surface :is(h1, h2, h3) {
  margin: 0;
  color: var(--dancr-color-text-primary) !important;
  font-size: 22px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
  letter-spacing: -.025em !important;
}
body.dancr-button-system .account-form-surface :is(.eyebrow, .reset-brand) {
  color: #c4b5fd !important;
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .14em;
}
body.dancr-button-system .account-form-surface .login-recovery-head h3 { margin-top: 6px; }
body.dancr-button-system .account-form-surface :is(p, small),
body.dancr-button-system .reset-card.account-form-surface form > p:not(.reset-error) {
  color: var(--dancr-color-text-secondary);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.6;
}
body.dancr-button-system .account-form-surface :is(form, .account-form-fields) {
  display: grid;
  gap: 16px;
  min-width: 0;
}
body.dancr-button-system .account-form-fields { margin: 0; padding: 0; border: 0; }
body.dancr-button-system .account-form-surface :is(label, .field) { display: grid; gap: 8px; min-width: 0; }
body.dancr-button-system .account-form-surface label {
  color: var(--dancr-color-text-secondary) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: .015em !important;
}
body.dancr-button-system .account-form-surface :is(input:not([type="checkbox"]), select, textarea) {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 50px;
  padding: 12px 14px;
  border: 1px solid rgba(203, 213, 225, .23) !important;
  border-radius: 12px !important;
  color: var(--dancr-color-text-primary) !important;
  background: #0d0d14 !important;
  box-shadow: none !important;
  font-size: 16px !important;
  font-weight: 400;
  line-height: 1.5;
}
body.dancr-button-system .account-form-surface :is(input, textarea)::placeholder { color: var(--dancr-color-text-muted); opacity: 1; }
body.dancr-button-system .account-form-surface textarea { resize: vertical; }
body.dancr-button-system .account-form-surface :is(button, a, input, select, textarea):focus-visible {
  outline: 2px solid #c4b5fd !important;
  outline-offset: 3px !important;
}
body.dancr-button-system .account-form-surface :is(.login-recovery-close, .recovery-close) {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  padding: 0;
  border-color: transparent !important;
  color: var(--dancr-color-text-secondary) !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 26px;
}
body.dancr-button-system .account-form-surface .account-form-primary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 50px !important;
  padding: 12px 16px !important;
  border: 1px solid rgba(196, 181, 253, .45) !important;
  border-radius: 12px !important;
  color: #fff !important;
  background: linear-gradient(110deg, var(--dancr-color-brand-primary), #6d28d9) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 6px 18px rgba(124, 58, 237, .2) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-align: center;
  text-decoration: none;
}
body.dancr-button-system .account-form-surface .account-form-primary[aria-busy="true"] { cursor: wait; opacity: .8; }
body.dancr-button-system .account-form-surface .account-form-back {
  width: 100%;
  min-height: 44px;
  border-color: transparent !important;
  color: #cbd5e1 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13px;
  font-weight: 500 !important;
}
body.dancr-button-system .account-form-surface .account-form-security {
  margin: 0;
  padding: 12px 14px;
  border: 1px solid rgba(196, 181, 253, .16);
  border-radius: 12px;
  color: #cbd5e1 !important;
  background: rgba(124, 58, 237, .045);
  font-size: 12px;
  font-weight: 400;
}
body.dancr-button-system .account-form-surface :is(.auth-status, .recovery-status, .customer-credential-feedback, .account-form-confirmation, .reset-error) {
  margin: 0;
  padding: 14px 16px;
  border: 1px solid rgba(110, 231, 183, .22) !important;
  border-radius: 12px;
  color: #d1e9df !important;
  background: rgba(16, 185, 129, .07) !important;
  font-size: 13px;
  font-weight: 400 !important;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
body.dancr-button-system #loginRecoveryCard[data-state="error"] .auth-status,
body.dancr-button-system .account-form-surface[data-state="error"] .recovery-status,
body.dancr-button-system .account-form-surface :is(.customer-credential-feedback.is-error, .reset-error) {
  border-color: rgba(251, 113, 133, .3) !important;
  color: #fecdd3 !important;
  background: rgba(251, 113, 133, .08) !important;
}
body.dancr-button-system #loginRecoveryCard[data-state="success"] .account-form-primary,
body.dancr-button-system .recovery-popover-surface[data-state="success"] .account-form-primary,
body.dancr-button-system .account-form-surface.customer-account-details button.customer-credential-option.is-complete {
  border-color: rgba(110, 231, 183, .38) !important;
  color: #a7f3d0 !important;
  background: #14372d !important;
  box-shadow: none !important;
  opacity: 1 !important;
  filter: none !important;
}
body.dancr-button-system .account-form-primary:disabled:not([aria-busy="true"]) { cursor: default; }
body.dancr-button-system .account-form-surface.customer-account-details button.customer-credential-option {
  min-height: 54px !important;
  border-color: rgba(196, 181, 253, .2) !important;
  background: #16151f !important;
  font-weight: 600 !important;
}
body.dancr-button-system .account-form-surface.customer-account-details button.customer-credential-option[aria-expanded="true"] {
  border-color: rgba(196, 181, 253, .4) !important;
  background: linear-gradient(135deg, #51278b, #35204f) !important;
}
body.dancr-button-system .account-form-surface .customer-account-email { padding: 14px 16px; border: 1px solid rgba(196, 181, 253, .12); border-radius: 12px; background: #0d0d14; }
body.dancr-button-system .account-form-surface .customer-account-email strong { font-size: 15px; font-weight: 500; }
body.dancr-button-system .account-form-surface .customer-credential-form { margin-top: 0; }
body.dancr-button-system .account-form-surface .customer-credential-form h3 { font-size: 18px !important; }
body.dancr-button-system .account-form-surface .customer-password-control input { padding-right: 56px; }
body.dancr-button-system .account-form-surface button.dancr-password-toggle {
  height: 44px !important;
  min-height: 44px !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: #c6a5fb !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: translateY(-50%) !important;
}
body.dancr-button-system .account-form-surface .customer-credential-form-actions { grid-template-columns: 1fr; }
body.dancr-button-system .account-form-surface .customer-credential-form-actions > button[type="button"] { border-color: transparent !important; background: transparent !important; box-shadow: none !important; font-weight: 500 !important; }
body.dancr-button-system .reset-card.account-form-surface { text-align: left; }
body.dancr-button-system .reset-card.account-form-surface .dancr-status-mark { justify-self: start; border-radius: 15px; color: #c4b5fd; background: var(--dancr-color-brand-primary-soft); }
body.dancr-button-system .reset-card.account-form-surface .dancr-status-mark.is-success { color: #a7f3d0; background: #14372d; }

@media (max-width: 520px) {
  body.dancr-button-system .account-form-surface .login-recovery-grid { grid-template-columns: 1fr; }
}