/* COP-306 — page de connexion (classes lg-, jetons Medina seuls). */
.lg-body { min-height: 100vh; display: grid; place-items: center; background: var(--base-200); padding: 24px; position: relative; }
.lg-top { position: absolute; top: 14px; inset-inline: 16px; display: flex; justify-content: flex-end; }
.lg-seg { display: inline-flex; border: 1px solid var(--base-300); border-radius: 99px; overflow: hidden; background: var(--base-100); }
.lg-seg a { padding: 5px 13px; font-weight: 600; font-size: 12.5px; color: var(--muted); text-decoration: none; }
.lg-seg a[aria-current="true"] { background: var(--primary); color: var(--base-100); }
.lg-card { width: 100%; max-width: 400px; padding: 30px 28px 24px; }
.lg-brand { text-align: center; margin-bottom: 22px; }
.lg-mark { width: 46px; height: 46px; margin: 0 auto 12px; border-radius: 14px; background: var(--primary); color: var(--base-100); display: grid; place-items: center; }
.lg-mark svg, .lg-label svg, .lg-eye svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lg-ctx { font-size: 12.5px; color: var(--muted); font-weight: 600; }
.lg-title { margin: 2px 0 0; font-size: 21px; font-weight: 700; letter-spacing: -.02em; }
.lg-alert { display: flex; gap: 9px; margin-bottom: 16px; padding: 10px 12px; border-radius: var(--r-btn); font-size: 13px; }
.lg-alert.err { background: var(--error-soft); color: var(--error); }
.lg-alert.ok { background: var(--primary-soft); color: var(--primary-2); }
.lg-form { display: flex; flex-direction: column; gap: 14px; }
.lg-label { display: flex; align-items: center; gap: 7px; }
.lg-label svg { width: 16px; height: 16px; color: var(--primary); }
.lg-pw { position: relative; }
.lg-pw .input { padding-inline-end: 44px; }
.lg-eye { position: absolute; inset-inline-end: 6px; top: 50%; transform: translateY(-50%); border: 0; background: none; color: var(--muted); padding: 6px; border-radius: 8px; cursor: pointer; display: grid; }
.lg-eye:hover { background: var(--base-200); }
.lg-caps { font-size: 12.5px; color: var(--warning-content); margin-top: 6px; }
.lg-submit[disabled] { opacity: .75; cursor: progress; }
.lg-foot { margin-top: 16px; text-align: center; color: var(--muted); font-size: 12.5px; line-height: 1.5; }
.lg-link { display: block; text-align: center; margin-top: 12px; color: var(--primary-2); font-weight: 600; font-size: 13px; text-decoration: none; }
.lg-link:hover { text-decoration: underline; }
