/* Sensito account pages: sign-up, log-in, email confirmation, password reset, account. */
.sen-auth { display: grid; justify-items: center; align-content: start; min-height: calc(100vh - var(--nav-height)); padding: var(--space-8) var(--gutter-mobile) var(--space-9); }
.sen-auth__card { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-5); width: 100%; max-width: 460px; padding: var(--space-6) var(--space-5); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-md); }
@media (min-width: 480px) { .sen-auth__card { padding: var(--space-7) var(--space-6); } }
.sen-auth__back { margin-left: auto; font-size: 14px; }
.sen-auth__form { display: grid; gap: var(--space-4); }
.sen-auth__form .sen-field { max-width: none; }
.sen-auth__aside { margin-top: calc(var(--space-2) * -1); text-align: right; }
.sen-auth__switch { text-align: center; }

/* Messages */
.sen-alert { margin: 0; padding: var(--space-3) var(--space-4); border: 1px solid; border-radius: var(--radius-sm); font-size: 14px; line-height: 21px; color: var(--ink); }
.sen-alert--error { background: var(--danger-soft); border-color: rgba(237, 104, 98, 0.5); }
.sen-alert--ok { background: var(--signal-soft); border-color: rgba(210, 254, 99, 0.4); }
.sen-alert--info { background: var(--surface-raised); border-color: var(--line-strong); }

/* "or" between the email form and Discord */
.sen-divider { display: flex; align-items: center; gap: var(--space-3); font-family: var(--font-mono); font-size: 12px; color: var(--ink-faint); }
.sen-divider::before, .sen-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }

/* Discord's brand colour; white text on it is 4.6:1 */
.sen-btn--discord { background: #5865f2; color: #fff; }
.sen-btn--discord:hover { background: #4752c4; }
.sen-btn--danger { background: transparent; color: var(--danger); border-color: rgba(237, 104, 98, 0.6); }
.sen-btn--danger:hover { background: var(--danger-soft); }

/* Terms checkbox */
.sen-check { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: var(--space-2) var(--space-3); align-items: start; font-size: 14px; line-height: 21px; color: var(--ink-muted); }
.sen-check input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--signal); }
.sen-check input:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.sen-check .sen-field__error { grid-column: 2; }

/* Account details; long names and addresses wrap inside the card */
.sen-auth__card .sen-h2 { overflow-wrap: anywhere; }
.sen-auth__details { display: grid; margin: 0; border-top: 1px solid var(--line); }
.sen-auth__details div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-2) var(--space-4); padding-block: var(--space-3); border-bottom: 1px solid var(--line); }
.sen-auth__details dt { font-family: var(--font-mono); font-size: 13px; color: var(--ink-faint); }
.sen-auth__details dd { margin: 0; font-size: 14px; color: var(--ink); overflow-wrap: anywhere; }
.sen-auth__danger { border-top: 1px solid var(--line); padding-top: var(--space-4); }
.sen-auth__danger summary { cursor: pointer; font-size: 14px; color: var(--danger); }
.sen-auth__danger summary:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-xs); }
.sen-auth__danger .sen-auth__form { margin-top: var(--space-4); }

/* Contact form */
.sen-textarea { min-height: 160px; padding-block: var(--space-3); resize: vertical; line-height: 22px; }
.sen-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Customer portal on the account page */
.sen-portal { display: grid; gap: var(--space-3); }
.sen-portal__title { margin: 0; font-family: var(--font-mono); font-size: 13px; font-weight: 400; letter-spacing: 0.02em; text-transform: lowercase; color: var(--ink-faint); }
.sen-portal__box { display: grid; gap: var(--space-3); padding: var(--space-4); background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-sm); }
.sen-portal__box .sen-small { margin: 0; }
.sen-portal__status { margin: 0; font-size: 18px; font-weight: 600; color: var(--ink); }
.sen-portal__links { display: grid; gap: var(--space-3); margin: 0; padding: 0; list-style: none; font-size: 14px; }
.sen-portal__links li { display: grid; gap: 2px; }
.sen-portal__links span { font-size: 13px; color: var(--ink-faint); }
.sen-portal__id { margin: 0; font-family: var(--font-mono); font-size: 22px; font-weight: 600; letter-spacing: 0.06em; color: var(--signal); user-select: all; }