/* Shared public account theme, matched to the research intelligence branding. */
.account-page {
  --account-canvas: #071c30;
  --account-surface: #142e49;
  --account-field: #0c2238;
  --account-line: #365672;
  --account-muted: #bacddd;
  --account-cyan: #83dfec;
  --account-blue: #6b9dff;
  --account-violet: #b9b3ff;
  --account-action: linear-gradient(110deg, #6899f5, #7dd7e8);
  color-scheme: dark;
  background: var(--account-canvas);
  color: #f5f9ff;
}

.account-page .layout {
  min-height: calc(100svh - var(--bsb-menu-height, 80px));
  background:
    linear-gradient(rgba(132, 199, 233, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(132, 199, 233, .025) 1px, transparent 1px),
    linear-gradient(125deg, #092535, #0b233c 52%, #24335b);
  background-size: 44px 44px, 44px 44px, auto;
  color: #f5f9ff;
  letter-spacing: 0;
}

.account-page :is(.auth-shell, .signup-form-card, .accept-panel) {
  position: relative;
  border: 1px solid var(--account-line);
  border-top: 3px solid var(--account-cyan);
  border-radius: 8px;
  background: linear-gradient(135deg, #143149, #1c2d50);
  box-shadow: 0 20px 56px rgba(2, 14, 29, .28);
}

.account-page .layout :is(.auth-title, .signup-title, .signup-form-title, .accept-title) {
  color: #fff;
  font-size: 2rem !important;
  font-weight: 900;
  line-height: 1.3 !important;
  letter-spacing: 0;
  text-wrap: balance;
}

.account-page .layout :is(.signup-section-title, .accept-summary h2) {
  font-size: 1.25rem !important;
  line-height: 1.4 !important;
  letter-spacing: 0;
}

.account-page :is(.auth-sub, .auth-flow__copy, .auth-brand, .auth-panel-row .k,
  .signup-sub, .signup-form-sub, .signup-section-copy, .signup-feature-copy,
  .signup-journey-copy, .signup-form-note, .signup-final-note, .signup-brand-note,
  .accept-sub, .accept-muted, .accept-local-hint, .intl-phone-note, .accept-password-list li) {
  color: var(--account-muted);
}

.account-page :is(.auth-flow__kicker, .signup-kicker, .accept-kicker) {
  color: var(--account-cyan);
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  font-size: .78rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.account-page .auth-flow__kicker span {
  animation: none;
  box-shadow: 0 0 0 4px rgba(131, 223, 236, .1);
}

.account-page .auth-flow__steps {
  border-color: var(--account-line);
  background: rgba(113, 183, 230, .04);
}

.account-page .auth-flow__step {
  border-color: var(--account-line);
}

.account-page :is(.auth-flow__step i, .signup-feature-icon i, .accept-kicker i) {
  color: var(--account-cyan);
  animation: none;
}

.account-page .auth-flow__step:nth-child(2) i {
  color: #a1c4ff;
}

.account-page .auth-flow__step:nth-child(3) i {
  color: var(--account-violet);
}

.account-page :is(.auth-flow__step small, .auth-method-option small, .signup-account-option small) {
  color: var(--account-muted);
}

.account-page .layout .form-label {
  color: #f0f6ff;
  font-size: 1rem;
  font-weight: 750;
}

.account-page .layout :is(.form-control, .form-select, .otp-single-input) {
  min-width: 0;
  min-height: 48px;
  border: 1px solid var(--account-line);
  border-radius: 6px;
  background-color: var(--account-field);
  color: #f5f9ff;
  font-size: 1rem;
  box-shadow: none;
  caret-color: var(--account-cyan);
}

.account-page .layout :is(.form-control, .otp-single-input)::placeholder {
  color: #9fb5cb;
  opacity: 1;
}

.account-page .layout :is(.form-control, .form-select, .otp-single-input):focus {
  border-color: var(--account-cyan);
  background-color: #102b45;
  color: #fff;
  box-shadow: 0 0 0 3px rgba(131, 223, 236, .16);
}

.account-page .layout input:autofill {
  -webkit-text-fill-color: #f5f9ff;
  caret-color: var(--account-cyan);
  box-shadow: 0 0 0 1000px var(--account-field) inset;
}

.account-page .layout .input-group-text {
  border-color: var(--account-line);
  border-radius: 6px;
  background: #1b3855;
  color: var(--account-cyan);
  font-size: 1rem;
}

.account-page .layout .input-group > :is(.form-control, .input-group-text, .btn) {
  border-radius: 0;
}

.account-page .layout .input-group > :first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}

.account-page .layout .input-group > :last-child,
.account-page .layout .input-group > .btn:has(+ .invalid-feedback) {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

.account-page .layout .btn {
  min-height: 48px;
  border-radius: 6px;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: 0;
  white-space: normal;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
  transform: none;
}

.account-page .layout .btn-primary {
  border-color: #8fc8f0;
  background: var(--account-action);
  color: #071d35;
  box-shadow: 0 6px 20px rgba(49, 123, 237, .18);
}

.account-page .layout .btn-primary:is(:hover, :focus-visible, :active) {
  border-color: #b7f0f7;
  background: linear-gradient(110deg, #85aeff, #93e3ed);
  color: #071d35;
  box-shadow: 0 8px 24px rgba(49, 123, 237, .24);
}

.account-page .layout .btn-primary:disabled {
  background: var(--account-action);
  color: #071d35;
  opacity: .65;
}

.account-page .layout :is(.btn-outline-light, .btn-outline-secondary) {
  border-color: var(--account-line);
  background: rgba(134, 190, 233, .06);
  color: #e0edfa;
}

.account-page .layout :is(.btn-outline-light, .btn-outline-secondary):hover {
  border-color: #90bddc;
  background: #234663;
  color: #fff;
}

.account-page .layout .input-group .btn {
  min-width: 48px;
  flex-shrink: 0;
}

.account-page .layout :is(a, button, input, select):focus-visible {
  outline: 3px solid var(--account-cyan);
  outline-offset: 3px;
}

.account-page :is(.auth-method-option, .signup-account-option) {
  border-color: var(--account-line);
  border-radius: 8px;
  background: rgba(145, 184, 225, .05);
  transform: none;
}

.account-page :is(.auth-method-option, .signup-account-option):hover {
  border-color: #81bcdd;
  background: rgba(111, 191, 240, .1);
}

.account-page :is(.auth-method-option, .signup-account-option):has(input:checked) {
  border-color: var(--account-cyan);
  background: rgba(98, 185, 236, .14);
  box-shadow: inset 0 0 0 1px rgba(131, 223, 236, .1);
}

.account-page :is(.auth-method-option__icon, .signup-account-option-icon, .signup-feature-icon) {
  border-color: var(--account-line);
  border-radius: 6px;
  background: rgba(131, 223, 236, .08);
  color: var(--account-cyan);
  box-shadow: none;
}

.account-page :is(.auth-method-option__check, .signup-account-option-check) {
  color: var(--account-cyan);
}

.account-page :is(.auth-hint, .auth-note) {
  border-left-color: #679acc;
  color: var(--account-muted);
}

.account-page :is(.auth-panel, .auth-method-switch, .auth-checkbox, .signup-consent) {
  border: 0;
  border-block: 1px solid var(--account-line);
  border-radius: 0;
  background: transparent;
  padding: .85rem 0;
}

.account-page .layout .form-check-input {
  background-color: var(--account-field);
  border-color: #8199b3;
}

.account-page .layout .form-check-input:checked {
  background-color: #3f7fda;
  border-color: #91b9ff;
}

.account-page .layout :is(.auth-links a, .auth-brand a, .signup-links a, .auth-link-button) {
  border: 0;
  padding: .25rem 0;
  background: transparent;
  color: #a2e6f4;
  font-size: .94rem;
  font-weight: 750;
  text-decoration: none;
  text-underline-offset: 4px;
}

.account-page .layout :is(.auth-links a, .auth-brand a, .signup-links a, .auth-link-button):hover {
  color: #fff;
  text-decoration: underline;
}

.account-page .layout .otp-single-input {
  min-height: 72px;
  font-size: 2rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

/* Keep invalid and focused-invalid fields distinguishable from the brand accent. */
.account-page .layout :is(.form-control, .form-select, .otp-single-input, .form-check-input).is-invalid,
.account-page .layout :is(.form-control, .form-select, .otp-single-input)[aria-invalid="true"] {
  border-color: #f594a8 !important;
  box-shadow: 0 0 0 3px rgba(245, 148, 168, .15) !important;
}

.account-page .layout :is(.alert, .bsb-inline-alert, .auth-human-check__feedback) {
  border-radius: 6px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.account-page .layout :is(.alert-danger, .bsb-inline-alert.is-danger, .auth-human-check__feedback) {
  border: 1px solid #95556d;
  background: #3b263e;
  color: #ffe0e8;
}

.account-page .layout :is(.alert-success, .bsb-inline-alert.is-success) {
  border: 1px solid #478b81;
  background: #173c42;
  color: #c1f5e4;
}

.account-page .layout :is(.alert-warning, .bsb-inline-alert.is-warning) {
  border: 1px solid #9e885e;
  background: #383547;
  color: #ffebbb;
}

.account-page .layout .alert-info {
  border: 1px solid #5c86b2;
  background: #203f61;
  color: #dbeeff;
}

.account-page .layout :is(.invalid-feedback, .auth-field-error, .auth-inline-feedback) {
  color: #ffc4d2;
}

.account-page .layout .auth-human-check[data-state="challenge"] {
  border-color: var(--account-line);
  border-radius: 6px;
  background: #102b45;
}

.account-page .layout .auth-human-check[data-state="challenge"] .auth-human-check__feedback {
  border: 0;
  background: transparent;
  color: var(--account-muted);
}

/* Longer signup and invitation forms share the same surfaces and controls. */
.account-page :is(.signup-hero, .accept-hero, .signup-info-card) {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
  transform: none;
}

.account-page :is(.signup-hero, .accept-hero) {
  padding-block: .5rem 1.25rem;
}

.account-page .signup-grid {
  gap: 2rem;
}

.account-page .signup-form-card {
  padding: 1.5rem;
  overflow: visible;
}

.account-page :is(.signup-feature, .signup-journey-card) {
  border-color: var(--account-line);
  border-radius: 8px;
  background: rgba(130, 178, 219, .06);
  box-shadow: none;
  transform: none;
}

.account-page :is(.signup-pill, .signup-badge, .signup-step-badge) {
  border-color: var(--account-line);
  background: rgba(141, 194, 230, .07);
  color: #bcebf5;
}

.account-page :is(.signup-support-strip, .accept-summary, .accept-empty) {
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--account-muted);
  box-shadow: none;
}

.account-page .signup-support-strip {
  border-top: 1px solid var(--account-line);
  padding-inline: 0;
}

.account-page .accept-panel-header {
  padding: 1.5rem 1.5rem 1rem;
  border-color: var(--account-line);
  background: transparent;
}

.account-page .accept-panel-body {
  padding: 1.5rem;
}

.account-page .accept-summary {
  padding: 1.5rem 0 0;
  margin-top: 1.5rem;
  border-top: 1px solid var(--account-line);
}

.account-page .accept-empty {
  padding: 0;
}

.account-page .layout .iti {
  --bsb-phone-selected-radius: 6px;
}

/* Override the global mobile focus colours while retaining its zoom protection. */
@media (max-width: 899.98px), (hover: none) and (pointer: coarse) {
  .account-page .layout :is(.form-control, .form-select, .otp-single-input):is(:focus, :focus-visible) {
    border-color: var(--account-cyan) !important;
    box-shadow: inset 0 0 0 1px var(--account-cyan) !important;
  }

  .account-page .layout :is(.form-control, .form-select, .otp-single-input):is(.is-invalid, [aria-invalid="true"]):focus {
    border-color: #f594a8 !important;
    box-shadow: inset 0 0 0 1px #f594a8 !important;
  }

  .account-page .layout .otp-single-input {
    font-size: 2rem !important;
  }
}

@media (min-width: 992px) {
  .account-page .signup-grid {
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  }
}

@media (max-width: 575.98px) {
  .account-page :is(.auth-shell, .signup-form-card, .accept-panel-body) {
    padding: 1rem;
  }

  .account-page .accept-panel-header {
    padding: 1rem;
  }

  .account-page .layout :is(.auth-title, .signup-title, .signup-form-title, .accept-title) {
    font-size: 1.65rem !important;
  }

  .account-page .signup-account-option {
    grid-template-columns: 1fr auto;
    align-content: start;
    min-height: 112px;
    gap: .4rem;
    padding: .65rem;
  }

  .account-page .signup-account-option-icon {
    grid-column: 1;
  }

  .account-page .signup-account-option > span:nth-of-type(2) {
    grid-column: 1 / -1;
  }

  .account-page .signup-account-option-check {
    grid-column: 2;
    grid-row: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .account-page .layout .btn {
    transition: none;
  }
}