/* ============================================================
   Ln2CRM · DARK  sign-in, utility and status pages

   login, register, forgot, reset, check-email, verify*, invite, goodbye,
   unsubscribe, pay, 404, 500, and the account sub-pages (connect-hubspot,
   confirm-delete). Every card here is a content block, so each one takes
   the violet edge; form fields sit one step above the card (surf-2) with
   the same edge and a clear violet focus ring.
   ============================================================ */

/* ---- shared card ---- */
.auth-card, .invite-card, .checkout-card, .confirm-card, .chs-card, .card{
  background: var(--p-surf) !important;
  border: 1px solid var(--p-edge) !important;
  box-shadow: 0 40px 90px -40px rgba(0,0,0,.85), 0 30px 80px -50px var(--p-violet-glow) !important;
  -webkit-backdrop-filter: none; backdrop-filter: none;
  color: var(--p-ivory);
}
.auth-brand span, .auth-card h1, .auth-card h2, .invite-title, .checkout-card h1, .confirm-title, .chs-card h1, .brand{ color: var(--p-ivory) !important; }
.auth-slogan, .invite-subtitle, .checkout-note, .confirm-msg, .chs-lead, .chs-note, .auth-divider, .auth-card p{ color: var(--p-ivory-2) !important; }
.confirm-note, .retain-note, .invite-note, .invite-meta{ color: var(--p-mid) !important; }

/* ---- forms ---- */
.auth-field label, .reason-label, .invite-label{ color: var(--p-ivory) !important; }
.auth-field input, .auth-field .auth-select, .exit-field, .reason-detail, input[type="email"], input[type="text"], input[type="password"], textarea{
  background: var(--p-ink-2) !important;
  border: 1px solid var(--p-edge) !important;
  color: var(--p-ivory) !important;
}
.auth-field input::placeholder, .exit-field::placeholder, .reason-detail::placeholder, input::placeholder, textarea::placeholder{ color: var(--p-mid) !important; opacity: 1; }
.auth-field input:focus, .auth-field .auth-select:focus, .exit-field:focus, .reason-detail:focus{
  border-color: var(--p-violet) !important;
  box-shadow: 0 0 0 4px rgba(102,81,246,.25) !important;
}
.auth-field .auth-select option{ background: var(--p-surf-2); color: var(--p-ivory); }
.auth-divider:before, .auth-divider:after{ background: var(--p-line-2) !important; }
.auth-links a{ color: var(--p-ivory-2) !important; text-decoration-color: var(--p-edge-2); }
.auth-links a:hover{ color: var(--p-ivory) !important; }
.auth-msg{ background: var(--p-violet-soft) !important; border-color: var(--p-edge-2) !important; color: var(--p-ivory) !important; }
.btn-oauth{ background: var(--p-surf-2) !important; border: 1px solid var(--p-edge) !important; color: var(--p-ivory) !important; box-shadow: none !important; }
.btn-oauth:hover{ background: var(--p-surf-3) !important; border-color: var(--p-edge-2) !important; }

/* ---- invite ---- */
.invite-kicker{ color: var(--p-violet-ink) !important; font-family: var(--p-mono); letter-spacing: .12em !important; }
.invite-status{ background: var(--p-violet-soft) !important; border-color: var(--p-edge) !important; color: var(--p-violet-ink) !important; }
.invite-status.error{ background: rgba(255,107,107,.12) !important; border-color: rgba(255,107,107,.3) !important; color: #ff9b9b !important; }
.invite-panel{ background: var(--p-surf-2) !important; border: 1px solid var(--p-edge) !important; }
.invite-row{ border-top-color: var(--p-line-2) !important; }
.invite-value, .invite-org{ color: var(--p-ivory) !important; }
.invite-role{ background: var(--p-violet-soft) !important; color: var(--p-violet-ink) !important; }
.invite-actions .btn-primary{ background: var(--p-violet) !important; color: #fff !important; }
.invite-actions .btn-secondary, .btn-secondary{ background: transparent !important; color: var(--p-ivory) !important; border: 1px solid var(--p-line-2) !important; }
.invite-actions .btn-secondary:hover, .btn-secondary:hover{ background: rgba(244,241,234,.06) !important; border-color: var(--p-edge-2) !important; }

/* ---- goodbye survey ---- */
.exit-option{ border-color: var(--p-line-2) !important; color: var(--p-ivory-2); background: var(--p-surf-2); }
.exit-option:hover{ border-color: var(--p-edge-2) !important; color: var(--p-ivory); }
.exit-option:has(input:checked){ border-color: var(--p-violet) !important; background: var(--p-violet-soft) !important; color: var(--p-ivory); }
.exit-option input, .reason-opt input, input[type="radio"], input[type="checkbox"]{ accent-color: var(--p-violet); }

/* ---- pay + errors + confirm-delete ---- */
.checkout-card .eyebrow{ color: var(--p-violet-ink) !important; font-family: var(--p-mono); letter-spacing: .12em; }
.checkout-error{ background: rgba(255,107,107,.1) !important; border-color: rgba(255,107,107,.3) !important; color: #ff9b9b !important; }
.error-code{ color: var(--p-ivory) !important; opacity: .14 !important; }
.error-title{ color: var(--p-ivory) !important; }
.error-sub{ color: var(--p-ivory-2) !important; }
.error-page a:not(.btn){ color: var(--p-violet-ink) !important; }
.confirm-btn{ background: #d63b3b !important; color: #fff !important; }
.reason-block{ border-top-color: var(--p-line-2) !important; }
.reason-opt{ color: var(--p-ivory-2) !important; }
.confirm-card a, .auth-card a:not(.btn){ color: var(--p-violet-ink); }

/* ---- connect-hubspot ---- */
.chs-facts{ border-color: var(--p-edge) !important; }
.chs-facts div + div{ border-top-color: var(--p-line-2) !important; }
.chs-facts dt{ color: var(--p-mid) !important; }
.chs-facts dd, .chs-block p, .chs-check{ color: var(--p-ivory) !important; }
.chs-warn{ background: rgba(242,193,78,.1) !important; border-color: rgba(242,193,78,.35) !important; color: #f2d58a !important; }
.chs-warn--replace{ background: rgba(255,107,107,.1) !important; border-color: rgba(255,107,107,.3) !important; color: #ff9b9b !important; }
.chs-hs{ color: #2b0e06 !important; }   /* HubSpot's own brand orange stays (it names their product); dark text for contrast */
.foot a{ color: var(--p-violet-ink) !important; }
