/* ==========================================================================
   Legal / static content pages (Privacy, BusinessTerms, CustomerTerms).
   Long-form readable typography on the --tt-* / --kuka-* token foundation.
   Mobile-first: base targets 360px phones; 768px bumps the reading size.
   Theme-safe: surfaces, text and borders all come from tokens (light + dark).
   ========================================================================== */

/* Page title: display serif + bronze hairline (header sits outside .tt-legal) */
.tt-legal-header {
    position: relative;
    max-width: min(70ch, 100%);
    padding-block-end: var(--tt-space-4);
    margin-block-end: var(--tt-space-5);
    border-bottom: 1px solid var(--tt-color-border);
}

.tt-legal-header::after {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    bottom: -1px;
    width: 4.5rem;
    height: 2px;
    border-radius: 2px;
    background: var(--kuka-bronze-500, #b78a2e);
}

.tt-legal-header .tt-page-header__title {
    font-family: var(--kuka-font-display, Georgia, serif);
    font-weight: 600;
    font-size: clamp(1.75rem, 1.4rem + 1.6vw, 2.5rem);
    letter-spacing: -0.015em;
    color: var(--tt-color-text);
}

.tt-legal {
    max-width: min(70ch, 100%); /* comfortable reading measure */
    font-size: var(--tt-font-size-base);
    line-height: var(--tt-line-height-relaxed);
    color: var(--tt-color-text);
    overflow-wrap: anywhere; /* long URLs/emails never force horizontal scroll */
}

@media (min-width: 768px) {
    .tt-legal {
        font-size: var(--tt-font-size-lg);
    }
}

.tt-legal p {
    margin: 0 0 var(--tt-space-4);
}

.tt-legal > p:last-child,
.tt-legal > ul:last-child {
    margin-block-end: 0;
}

.tt-legal a {
    color: var(--tt-color-primary);
    text-underline-offset: 0.2em;
}

.tt-legal strong {
    font-weight: var(--tt-font-weight-semibold);
}

/* "Last updated: ..." preamble line (Shared/_LegalTermsContent) */
.tt-legal__updated {
    font-size: var(--tt-font-size-sm);
    color: var(--tt-color-text-muted);
    padding-block-end: var(--tt-space-4);
    margin-block-end: var(--tt-space-5);
    border-bottom: 1px solid var(--tt-color-border);
}

.tt-legal__updated strong {
    font-weight: var(--tt-font-weight-medium);
}

/* Section headings ("## ..." blocks in terms content, sections in Privacy) */
.tt-legal__section-title {
    margin: var(--tt-space-6) 0 var(--tt-space-3);
    font-family: var(--kuka-font-display, Georgia, serif);
    font-size: var(--tt-font-size-xl);
    font-weight: 600;
    line-height: var(--tt-line-height-tight);
    letter-spacing: -0.01em;
    color: var(--tt-color-text);
}

/* Sub-headings that introduce a bullet list inside a section */
.tt-legal__subsection-title {
    margin: var(--tt-space-5) 0 var(--tt-space-2);
    font-size: var(--tt-font-size-lg);
    font-weight: var(--tt-font-weight-semibold);
    line-height: var(--tt-line-height-tight);
}

.tt-legal ul {
    margin: 0 0 var(--tt-space-4);
    padding-inline-start: var(--tt-space-5);
}

.tt-legal li {
    margin-block-end: var(--tt-space-2);
}

.tt-legal li::marker {
    color: var(--kuka-bronze-500, var(--tt-color-text-subtle));
}

/* Long documents: anchored blocks, numbering, summary, contents, tables, placeholders */
.tt-legal__block {
    scroll-margin-top: var(--tt-space-8); /* keep the heading clear of a sticky navbar when jumping to #anchor */
}

.tt-legal__block:target > .tt-legal__section-title {
    text-decoration: underline;
    text-decoration-color: var(--kuka-bronze-500, #b78a2e);
    text-underline-offset: 0.3em;
}

.tt-legal__num {
    color: var(--kuka-bronze-700, var(--tt-color-text-muted));
    font-variant-numeric: tabular-nums;
    margin-inline-end: var(--tt-space-1);
}

.tt-legal__summary {
    margin-block: var(--tt-space-5);
    padding: var(--tt-space-4) var(--tt-space-5);
    background: var(--tt-color-surface);
    border: 1px solid var(--tt-color-border);
    border-inline-start: 3px solid var(--kuka-bronze-500, #b78a2e);
    border-radius: var(--tt-radius-lg);
}

.tt-legal__summary-title {
    margin: 0 0 var(--tt-space-3);
    font-family: var(--kuka-font-display, Georgia, serif);
    font-size: var(--tt-font-size-lg);
    font-weight: 600;
    line-height: var(--tt-line-height-tight);
}

.tt-legal__summary > :last-child {
    margin-block-end: 0;
}

.tt-legal__summary-note {
    font-size: var(--tt-font-size-sm);
    color: var(--tt-color-text-muted);
}

.tt-legal__notice {
    padding: var(--tt-space-3) var(--tt-space-4);
    font-size: var(--tt-font-size-sm);
    background: var(--tt-color-surface-sunken);
    border: 1px dashed var(--tt-color-border-strong);
    border-radius: var(--tt-radius-md);
}

/* [PLACEHOLDER] values the operator still has to fill in: impossible to miss */
.tt-legal__placeholder {
    padding: 0 var(--tt-space-1);
    color: var(--tt-color-text);
    background: var(--tt-color-primary-subtle);
    border: 1px dashed var(--tt-color-border-strong);
    border-radius: var(--tt-radius-sm);
    font-weight: var(--tt-font-weight-semibold);
}

.tt-legal__toc {
    margin-block-end: var(--tt-space-5);
}

.tt-legal__toc summary {
    cursor: pointer;
    font-weight: var(--tt-font-weight-semibold);
    padding-block: var(--tt-space-2);
}

.tt-legal__toc ol {
    margin: var(--tt-space-2) 0 0;
    padding-inline-start: var(--tt-space-6);
}

.tt-legal__toc li {
    margin-block-end: var(--tt-space-1);
}

/* Tables scroll sideways inside their own box on phones instead of widening the page */
.tt-legal__table-wrap {
    margin: 0 0 var(--tt-space-4);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--tt-color-border);
    border-radius: var(--tt-radius-md);
}

.tt-legal__table-wrap:focus-visible {
    outline: 2px solid var(--tt-color-primary);
    outline-offset: 2px;
}

.tt-legal__table {
    width: 100%;
    min-width: 34rem;
    border-collapse: collapse;
    font-size: var(--tt-font-size-sm);
    line-height: var(--tt-line-height-normal);
    overflow-wrap: normal; /* undo the page-level anywhere-wrap so columns keep a sensible width */
}

.tt-legal__table th,
.tt-legal__table td {
    padding: var(--tt-space-2) var(--tt-space-3);
    text-align: start;
    vertical-align: top;
    border-bottom: 1px solid var(--tt-color-border);
}

.tt-legal__table thead th {
    background: var(--tt-color-surface-sunken);
    font-weight: var(--tt-font-weight-semibold);
    white-space: nowrap;
}

.tt-legal__table tbody tr:last-child td {
    border-bottom: 0;
}

.tt-legal__table td:first-child {
    font-weight: var(--tt-font-weight-medium);
}

@media print {
    .tt-legal-header,
    .tt-legal {
        max-width: none;
    }

    .tt-legal {
        font-size: 11pt;
        color: #000;
    }

    .tt-legal a {
        color: inherit;
        text-decoration: underline;
    }

    .tt-legal a[href^="http"]::after {
        content: " (" attr(href) ")";
        font-size: 0.85em;
    }

    .tt-legal__toc,
    .tt-legal__notice {
        display: none;
    }

    .tt-legal__summary,
    .tt-legal__table-wrap {
        break-inside: avoid;
        border-color: #999;
        background: none;
    }

    .tt-legal__table-wrap {
        overflow: visible;
    }

    .tt-legal__table {
        min-width: 0;
    }

    .tt-legal__section-title,
    .tt-legal__subsection-title {
        break-after: avoid;
    }

    .tt-legal__placeholder {
        background: none;
    }
}
