/* Sign-in, registration, recovery and consent pages. */

.auth-card {
    max-width: 30rem;
    margin: var(--ui-space-4) auto var(--ui-space-6);
    padding: var(--ui-space-5);
    border: 1px solid var(--ui-card-border, var(--line));
    border-radius: var(--ui-card-radius, var(--ui-radius-lg));
    background: var(--ui-card-fill, var(--ui-card-bg, var(--card)));
}

.auth-card h1 { margin: var(--ui-space-2) 0; font-size: 1.5rem; line-height: 1.2; }
.auth-logo { display: block; }
.auth-card form { display: grid; gap: var(--ui-space-3); margin: 0; }
.auth-card .lead { margin-bottom: var(--ui-space-4); }

.full-width { width: 100%; }
.stack { display: grid; gap: var(--ui-space-3); }

.field-hint { color: var(--muted); font-size: var(--ui-font-sm); }
.pw-rules { display: grid; gap: var(--ui-space-1); margin: var(--ui-space-2) 0 0; padding: 0; list-style: none; font-size: var(--ui-font-sm); color: var(--muted); }
.pw-rules li::before { content: "\25CB"; display: inline-block; width: 1.25em; }
.pw-rules li.is-met { color: var(--ui-positive); }
.pw-rules li.is-met::before { content: "\2713"; }
.field label { font-weight: 600; }

.check { display: flex; align-items: center; gap: var(--ui-space-2); font-size: var(--ui-font-sm); }

.auth-feedback {
    padding: var(--ui-space-2) var(--ui-space-3);
    border-radius: var(--ui-radius-md);
    border: 1px solid var(--line);
    font-size: var(--ui-font-sm);
}

.auth-feedback-error { border-color: var(--ui-danger, #c0352b); color: var(--ui-danger, #c0352b); background: var(--ui-tint-danger-subtle, transparent); }
.auth-feedback-success { border-color: var(--ui-tint-positive-border, var(--green)); background: var(--ui-tint-positive-subtle, transparent); }

.auth-divider { display: flex; align-items: center; gap: var(--ui-space-3); margin: var(--ui-space-4) 0; color: var(--muted); }
.auth-divider span { flex: 1; height: 1px; background: var(--line); }

.auth-footer { margin: var(--ui-space-4) 0 0; text-align: center; font-size: var(--ui-font-sm); }
.auth-footer a { color: var(--green-strong); }
.check-email-address { font-weight: 700; overflow-wrap: anywhere; }

.link-button { padding: 0; border: 0; background: none; color: var(--green-strong); font: inherit; text-decoration: underline; cursor: pointer; }
.btn-danger { border-color: var(--ui-danger, #c0352b); color: var(--ui-danger, #c0352b); }
.btn[disabled], .btn:disabled { opacity: .55; cursor: not-allowed; }

/* Consent block */
.consents { display: grid; gap: var(--ui-space-3); margin: 0; padding: var(--ui-space-3); border: 1px solid var(--line); border-radius: var(--ui-radius-md); }
.consent-row { display: flex; align-items: flex-start; gap: var(--ui-space-2); }
.consent-row p { margin: 0; font-size: var(--ui-font-sm); }
.consent-row input[type="checkbox"] { margin-top: 2px; }
.consent-link { padding: 0; border: 0; background: none; color: var(--green-strong); font: inherit; text-decoration: underline; cursor: pointer; text-align: left; }
.consent-link.is-complete { color: var(--ui-positive, #0b7a55); }
.consent-link.is-complete::after { content: " ✓"; }
.data-table .consent-link { overflow-wrap: anywhere; white-space: normal; }

/* Google */
.google-host { position: relative; min-height: 44px; }
.google-button { min-height: 44px; overflow: hidden; }
.google-gate { position: absolute; inset: 0; border: 0; background: transparent; cursor: pointer; }

/* Legal document dialog */
.legal-dialog { width: min(42rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); padding: 0; border: 1px solid var(--line); border-radius: var(--ui-radius-lg); background: var(--ui-modal-fill, var(--card)); color: var(--ink); }
.legal-dialog::backdrop { background: var(--ui-modal-scrim, rgba(0, 0, 0, .5)); }
.legal-dialog-shell { display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto; gap: var(--ui-space-3); max-height: calc(100dvh - 2rem); padding: var(--ui-space-4); }
.legal-dialog header { display: flex; align-items: center; justify-content: space-between; gap: var(--ui-space-3); }
.legal-dialog h2 { margin: 0; font-size: 1.1rem; }
.legal-close { border: 0; background: none; color: var(--green-strong); font: inherit; text-decoration: underline; cursor: pointer; }
.legal-body { overflow-y: auto; max-height: 50dvh; padding-right: var(--ui-space-2); font-size: var(--ui-font-sm); }
.legal-body h3 { margin: var(--ui-space-3) 0 var(--ui-space-1); font-size: 1rem; }
.legal-body p { margin: 0 0 var(--ui-space-2); overflow-wrap: anywhere; }
.legal-hint { margin: 0; color: var(--muted); font-size: var(--ui-font-sm); }
.legal-dialog footer { display: flex; justify-content: flex-end; }

@media (max-width: 800px) {
    .auth-card { padding: var(--ui-space-4) var(--ui-space-3); margin-top: var(--ui-space-2); }
}

/* Sign-in and registration: brand panel on the left on wide screens, a slim strip above the form on phones. */
.auth-brand { display: grid; gap: var(--ui-space-2); margin: 0 0 var(--ui-space-4); padding: var(--ui-space-3); border: 1px solid var(--ui-tint-positive-border); border-radius: var(--ui-radius-lg); background: var(--ui-tint-positive-subtle); }
.auth-brand-name { font-size: 1.2rem; color: var(--green-strong); }
.auth-brand p { margin: 0; }
.auth-brand-points, .auth-brand-chips, .auth-brand-note { display: none; }
.auth-brand-note { color: var(--muted); font-size: var(--ui-font-sm); }
.auth-check-row { display: flex; align-items: center; justify-content: space-between; gap: var(--ui-space-3); flex-wrap: wrap; }
.auth-check-row a { color: var(--green-strong); font-size: var(--ui-font-sm); }
@media (min-width: 1000px) {
    .auth-split { max-width: 56rem; display: grid; grid-template-columns: 18rem minmax(0, 1fr); column-gap: var(--ui-space-5); }
    .auth-split > :not(.auth-brand) { grid-column: 2; }
    .auth-brand { align-content: start; align-self: start; position: sticky; top: 6rem; gap: var(--ui-space-3); grid-column: 1; grid-row: 1 / span 30; margin: 0; padding: var(--ui-space-5) var(--ui-space-4); background: linear-gradient(160deg, color-mix(in srgb, var(--brand-mint) 34%, var(--card)) 0%, color-mix(in srgb, var(--brand-mint) 12%, var(--card)) 100%); }
    .auth-brand-name { font-size: 1.7rem; }
    .auth-brand-lead { font-size: 1.05rem; font-weight: 600; line-height: 1.35; }
    .auth-brand-points { display: grid; gap: var(--ui-space-2); margin: 0; padding: 0; list-style: none; }
    .auth-brand-points li { position: relative; padding-inline-start: 1.5rem; font-size: var(--ui-font-sm); }
    .auth-brand-points li::before { content: ""; position: absolute; inset-inline-start: 0; top: .1em; width: 1rem; height: 1rem; border-radius: 50%; background: var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23062b21' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 10.5l3.4 3.4 6.6-7'/%3E%3C/svg%3E") center / 70% no-repeat; }
    .auth-brand-chips { display: flex; flex-wrap: wrap; gap: var(--ui-space-2); }
    .auth-brand-note { display: block; }
}
