/* Styling for Markdown-rendered legal documents (Terms, DPA, Privacy Policy,
   Cookie Policy, Withdrawal Notice) - see LegalDocumentPage.razor and
   docs/legal/07-zmiany-w-kodzie.md §7. */

/* No max-width/centering here on purpose: .legal-content sits inside the
   site's standard #middle_content/.middle_inner container (940px, same as
   every other page) - giving it its own narrower max-width made legal pages
   look like a column floating inside the page instead of a normal page. */
.legal-content {
    line-height: 1.65;
}

.legal-content h1 {
    font-size: 28px;
    margin-bottom: 10px;
}

.legal-content h2 {
    font-size: 21px;
    margin-top: 2em;
    margin-bottom: 0.6em;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    padding-bottom: 6px;
}

.legal-content h3 {
    font-size: 17px;
    margin-top: 1.5em;
}

.legal-content blockquote {
    margin: 0 0 1.5em;
    padding: 10px 16px;
    border-left: 3px solid #e8a33d;
    background: rgba(232, 163, 61, 0.08);
    font-size: 14px;
    opacity: 0.9;
}

.legal-content ol,
.legal-content ul {
    padding-left: 1.4em;
}

.legal-content li {
    margin-bottom: 0.4em;
}

.legal-content table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    margin: 1.2em 0;
    font-size: 14px;
}

.legal-content th,
.legal-content td {
    border: 1px solid rgba(255, 255, 255, 0.15);
    padding: 8px 10px;
    text-align: left;
    vertical-align: top;
    /* Without this, a long unbroken token (e.g. a cookie name like
       ".AspNetCore.Identity.Application") has no spaces to wrap on, so the
       browser stretches that whole column to fit it instead - this is what
       made the "Nazwa" column on /cookies look skewed. table-layout: fixed
       (above) plus wrapping here keeps every column the width the table
       markup implies, regardless of its longest word. overflow-wrap: anywhere
       only forces a mid-word break as a last resort (unlike word-break:
       break-all, which was cutting cookie names at ugly, arbitrary points
       even when there was room to wrap on a word boundary instead).
    */
    overflow-wrap: anywhere;
}

.legal-content th {
    background: rgba(255, 255, 255, 0.06);
}

.legal-content a {
    color: #6cb4ff;
}

.legal-content hr {
    border: none;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    margin: 2em 0;
}