/* The legal pages (/terms, /privacy), on top of approval.css's tokens and base styles. Long prose: a readable line
   length, clear heading spacing and list indents. Light only, 360 px and up. */

.legal-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 2) calc(var(--spacing) * 4);
}

.legal-brand {
    font-weight: 700;
    text-decoration: none;
}

.legal-languages {
    display: flex;
    gap: calc(var(--spacing) * 3);
    font-size: var(--text-sm);
}

.legal-languages a {
    color: var(--muted-foreground);
}

.legal-languages a[aria-current="page"] {
    color: var(--foreground);
    font-weight: 600;
    text-decoration: none;
}

.legal {
    overflow-wrap: break-word;
}

.legal h1 {
    font-size: 1.5rem;
    line-height: 1.25;
}

.legal h2 {
    margin-top: calc(var(--spacing) * 6);
    font-size: 1.125rem;
    line-height: 1.3;
}

.legal p,
.legal ul {
    margin-top: calc(var(--spacing) * 3);
}

.legal ul {
    padding-left: 1.25rem;
}

.legal li + li {
    margin-top: calc(var(--spacing) * 1.5);
}

.legal .legal-updated {
    margin-top: calc(var(--spacing) * 1);
    color: var(--muted-foreground);
    font-size: var(--text-sm);
}

.legal-footer {
    font-size: var(--text-sm);
}