/* Presentation-only layer for maintained django-allauth flows. */
.account-shell { display: flex; width: 100%; max-width: calc(var(--lx-form-max) + 64px); flex: 1 0 auto; margin: 0 auto; padding: 48px 32px 64px; }
.account-card { display: flex; width: 100%; min-width: 0; flex-direction: column; align-self: flex-start; gap: 18px; }
.account-card h1 { color: var(--lx-text); font-size: 30px; font-weight: 500; letter-spacing: -.03em; line-height: 1.2; }
.account-card h2 { margin-top: 14px; padding-top: 22px; border-top: 1px solid var(--lx-line); color: var(--lx-text); font-size: 19px; font-weight: 600; letter-spacing: -.02em; }
.account-card > p { color: var(--lx-text-secondary); font-size: 14px; line-height: 1.6; }
.account-card form { display: flex; min-width: 0; flex-direction: column; gap: 18px; }
.account-card form > p { display: flex; min-width: 0; flex-direction: column; margin: 0; gap: 7px; }
.account-card label { color: var(--lx-text-muted); font-family: var(--lx-font-mono); font-size: 10px; font-weight: 400; letter-spacing: .16em; text-transform: uppercase; }
.account-card input:not([type="checkbox"]):not([type="radio"]), .account-card textarea, .account-card select { display: block; width: 100%; min-width: 0; min-height: 48px; padding: 11px 14px; border: 1px solid var(--lx-border-input); border-radius: var(--lx-radius); background: var(--lx-surface); color: var(--lx-text); font-size: 15px; }
.account-card textarea { min-height: 118px; resize: vertical; }
.account-card input:not([type="checkbox"]):not([type="radio"]):focus, .account-card textarea:focus, .account-card select:focus { border-color: var(--lx-indigo); box-shadow: 0 0 0 3px var(--lx-focus); outline: 0; }
.account-card input[type="checkbox"], .account-card input[type="radio"] { width: 18px; height: 18px; margin: 0 7px 0 0; accent-color: var(--lx-indigo); vertical-align: -3px; }
.account-card input[type="radio"] + label, .account-card input[type="checkbox"] + label { color: var(--lx-text-body); font-family: var(--lx-font); font-size: 14px; font-weight: 400; letter-spacing: 0; text-transform: none; }
.account-card button, .account-card a[role="button"], .account-card .account-action { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; margin: 0; padding: 12px 24px; border: 1px solid var(--lx-indigo); border-radius: var(--lx-radius); background: var(--lx-indigo); color: var(--lx-surface); cursor: pointer; font: inherit; font-size: 15px; font-weight: 500; text-decoration: none; }
.account-card .account-action--secondary { border-color: var(--lx-border-input); background: var(--lx-surface); color: var(--lx-ink); }
.account-card .account-action--secondary:hover, .account-card .account-action--secondary:focus-visible { border-color: var(--lx-indigo); }
.account-card .account-action--danger, .account-card button[name="action_remove"] { border-color: var(--lx-border-input); background: var(--lx-surface); color: var(--lx-rust); }
.account-card button[name="action_primary"], .account-card button[name="action_send"] { border-color: var(--lx-border-input); background: var(--lx-surface); color: var(--lx-ink); }
.account-card .errorlist { margin: 0; padding: 12px 14px 12px 32px; border: 1px solid var(--lx-rust-border); border-radius: var(--lx-radius); background: var(--lx-rust-tint); color: var(--lx-rust); font-size: 13px; }
.account-card .helptext, .account-card form p > span, .account-card form ul:not(.errorlist) { display: block; margin: 0; color: var(--lx-text-muted); font-size: 12px; line-height: 1.55; }
.account-card form ul:not(.errorlist) { padding-left: 20px; }
.account-card hr { width: 100%; height: 1px; margin: 6px 0; border: 0; background: var(--lx-line); }
.account-card section { display: flex; flex-direction: column; padding: 18px; border: 1px solid var(--lx-line-strong); border-radius: var(--lx-radius); background: var(--lx-surface); gap: 10px; }
.account-card section h2 { margin: 0; padding: 0; border: 0; }
.account-card section > ul { display: flex; flex-wrap: wrap; align-items: center; margin: 0; padding: 0; gap: 10px; list-style: none; }
.account-card section > ul > li { display: flex; }
.account-card table { width: 100%; max-width: 100%; border-collapse: collapse; }
.account-card th, .account-card td { padding: 10px; border-bottom: 1px solid var(--lx-line); overflow-wrap: anywhere; text-align: left; }
.account-card strong[title] { display: inline-block; margin-left: 6px; padding: 2px 6px; border-radius: var(--lx-radius-sm); background: var(--lx-sage-tint); color: var(--lx-sage); font-family: var(--lx-font-mono); font-size: 10px; font-weight: 400; }
.account-card img, .account-card svg { max-width: 100%; height: auto; }
.account-card pre, .account-card code { max-width: 100%; overflow-wrap: anywhere; white-space: pre-wrap; }
.account-tabs { display: flex; flex-wrap: wrap; padding-bottom: 14px; border-bottom: 1px solid var(--lx-line); gap: 8px 16px; }
.account-tabs a { color: var(--lx-text-secondary); font-size: 12px; text-decoration: none; }
.account-tabs a:hover, .account-tabs a:focus-visible { color: var(--lx-indigo); }
.account-page--entrance .account-nav { display: none; }
.account-page--entrance .account-card::before { align-self: center; color: var(--lx-text-muted); content: "Význam, ne překlad."; font-family: var(--lx-font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.account-page--entrance .account-card button[type="submit"] { width: 100%; }
.account-page--login { position: relative; isolation: isolate; overflow-x: clip; }
.account-page--login::before { position: fixed; z-index: 0; top: 54%; left: calc(50% + min(31vw, 410px)); width: clamp(300px, 38vw, 520px); aspect-ratio: 1; background: url("../images/lexemeo-symbol.svg") center / contain no-repeat; content: ""; opacity: .05; pointer-events: none; transform: translate3d(-50%, -50%, 0) rotate(-7deg) scale(.97); transform-origin: center; animation: lexemeo-login-drift 16s ease-in-out infinite; }
.account-page--login > .shell-header, .account-page--login > .account-shell, .account-page--login > .shell-footer, .account-page--login > .messages { position: relative; z-index: 1; }

@keyframes lexemeo-login-drift {
  0%, 100% { opacity: .04; transform: translate3d(-50%, -50%, 0) rotate(-7deg) scale(.97); }
  50% { opacity: .07; transform: translate3d(calc(-50% - 12px), calc(-50% + 8px), 0) rotate(4deg) scale(1.04); }
}

@media (max-width: 719px) {
  .account-shell { padding: 34px 20px 48px; }
  .account-card h1 { font-size: 27px; }
  .account-card button, .account-card a[role="button"], .account-card .account-action { width: 100%; }
  .account-card section > ul > li { width: 100%; }
  .account-card table { display: block; overflow-x: auto; }
  .account-page--login::before { top: 66%; left: 76%; width: clamp(260px, 82vw, 360px); opacity: .035; }
}

@media (prefers-reduced-motion: reduce) {
  .account-page--login::before { animation: none; opacity: .045; transform: translate3d(-50%, -50%, 0) rotate(-3deg); }
}
