/* auth.css — shared styles for unauthenticated pages (login, password reset, invites, errors) */

/* ── Layout ── */
body{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem}

/* ── Logo ── */
.logo{margin-bottom:2rem;text-align:center}
.logo span{color:var(--accent)}
.logo-img{width:100%;max-width:380px;height:auto;display:block;margin:0 auto}

/* ── Card containers ── */
/* .wrap constrains width for login-style pages; .card provides the box */
.wrap{width:100%;max-width:380px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:2rem}

/* Wider card variants (invite / upgrade pages) */
.card--invite{width:100%;max-width:460px;border-radius:3px;padding:2.5rem}
.card--invalid{width:100%;max-width:420px;border-radius:3px;padding:2.5rem;text-align:center}
.card--upgrade{width:100%;max-width:440px;border-radius:3px;padding:2.5rem;text-align:center}

/* ── Card typography ── */
.card-title{font-family:'Syne',sans-serif;font-size:1rem;font-weight:700;margin-bottom:.35rem}
.card-sub{font-size:.78rem;color:var(--muted);margin-bottom:1.75rem;line-height:1.6}
.sub{font-size:.8rem;color:var(--muted);margin-bottom:.4rem}

/* ── Buttons ── */
/* Full-width action button (login, password reset, invite accept) */
.auth-btn{width:100%;font-size:.85rem;font-weight:600;padding:.7rem;border:none;background:var(--accent);color:#0e0e0e;margin-top:.5rem}
.auth-btn:hover{background:#d4923c}
/* Block (full-width link styled as button) */
.auth-btn--block{display:block;text-align:center;text-decoration:none;border-radius:2px}
.auth-btn--block:hover{background:#d4923c;color:#0e0e0e}
/* Inline (centered icon-page CTA) */
.auth-btn--inline{display:inline-block;font-size:.85rem;font-weight:600;padding:.6rem 1.5rem;border:none;background:var(--accent);color:#0e0e0e;text-decoration:none}
.auth-btn--inline:hover{background:#d4923c}
/* Ghost variant */
.btn-ghost{background:transparent;border:1px solid var(--border-hi);color:var(--text)}
.btn-ghost:hover{background:var(--surface2);color:var(--text)}

/* ── Alerts ── */
.auth-error{font-size:.78rem;color:var(--danger);background:rgba(196,80,80,.08);border:1px solid rgba(196,80,80,.2);border-radius:2px;padding:.55rem .75rem;margin-bottom:1.1rem}
.invalid-notice{font-size:.82rem;color:var(--muted);line-height:1.6}
.invalid-notice a{color:var(--accent);text-decoration:none}

/* ── Footer nav / back links ── */
.auth-footer{text-align:center;margin-top:1.25rem;font-size:.75rem;color:var(--muted)}
.auth-footer a{color:var(--accent);text-decoration:none}
.auth-footer a:hover{text-decoration:underline}

/* ── Invite accept form ── */
.auth-divider{border:none;border-top:1px solid var(--border);margin:1.5rem 0}
.auth-link{text-align:center;margin-top:1.5rem;font-size:.78rem;color:var(--muted)}
.auth-link a{color:var(--accent);text-decoration:none}
.invite-meta{font-size:.8rem;color:var(--muted);background:var(--surface2);border:1px solid var(--border);border-radius:2px;padding:.75rem 1rem;margin-bottom:2rem;line-height:1.6}
.invite-meta strong{color:var(--text)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.field{margin-bottom:1.25rem}
.tos-note{font-size:.72rem;color:var(--muted);text-align:center;margin-top:.75rem}
.tos-note a{color:var(--muted);text-decoration:underline}
.err-note{margin-bottom:1rem}

/* ── Icon / info pages (invite_invalid, upgrade_required) ── */
.auth-icon{font-size:2rem;margin-bottom:1.25rem}
.auth-reason{font-size:.85rem;color:var(--muted);margin-bottom:.5rem;line-height:1.6}
.auth-hint{font-size:.75rem;color:var(--muted);margin-top:1.25rem}
.plan-badge{display:inline-block;font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:.25rem .65rem;border-radius:2px;background:var(--surface2);border:1px solid var(--border-hi);color:var(--muted);margin-bottom:2rem}
.auth-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}

/* ── Error pages (400 / 403 / 404 / 500) ── */
.error-page{display:flex;align-items:center;justify-content:center;min-height:60vh}
.error-page__inner{text-align:center}
.error-page__title{font-family:'Syne',sans-serif;font-size:1.4rem;font-weight:700;margin-bottom:.5rem}
.error-page__msg{font-size:.85rem;color:var(--muted2)}
.error-page__link{display:inline-block;margin-top:1.25rem;font-size:.85rem;color:var(--accent)}
