/* ─────────────────────────────────────────────────────────────────────────────────────────────
   Typography for operator- and seller-authored HTML (terms, privacy policies, descriptions).

   This content is pasted out of the Quill editor and arrives as real <h1>-<h6>, <p>, <ol>, <ul>
   with NO colours or sizes of its own — verified against the stored rows. It therefore inherits
   from whichever of the app's many stylesheets wins, and headings were losing: they rendered
   invisible against the white card, so a reader saw blank gaps where "1. Introduction" and
   "3. Cancellations and Refunds" should be, and only select-all revealed them. Where they were
   visible they came out at page-title size, far larger than the body around them.

   Scoping everything under .quill-content means this content styles itself wherever it is shown —
   the legal modal on Reserve and CheckOut, and the terms blocks on the IM page — without touching
   any other heading on the site. Sizes step down from the surrounding body text so a pasted <h1>
   can never tower over its container.
   ───────────────────────────────────────────────────────────────────────────────────────────── */

.quill-content {
    color: #374151;
    line-height: 1.65;
}

.quill-content h1,
.quill-content h2,
.quill-content h3,
.quill-content h4,
.quill-content h5,
.quill-content h6 {
    color: #111827;
    font-weight: 700;
    line-height: 1.3;
    margin: 1.1rem 0 0.4rem;
}

.quill-content h1 { font-size: 1.05rem; }
.quill-content h2 { font-size: 0.97rem; }
.quill-content h3 { font-size: 0.92rem; }
.quill-content h4,
.quill-content h5,
.quill-content h6 { font-size: 0.88rem; }

/* The first element sits directly under a card heading or owner label, so it needs no leading gap. */
.quill-content > :first-child { margin-top: 0; }

.quill-content p { margin-bottom: 0.7rem; }
.quill-content p:last-child { margin-bottom: 0; }
.quill-content a { text-decoration: underline; }

/* Quill v2 writes its own list markers and leaves editor-only UI spans in the saved HTML. */
.quill-content ol,
.quill-content ul { list-style: none !important; padding-left: 1.5rem; margin-bottom: 0.5rem; }
.quill-content li { list-style: none !important; margin-bottom: 0.25rem; }
.quill-content .ql-ui { display: none !important; }
.quill-content li[data-list="bullet"]::before { content: '\2022'; margin-right: 0.4em; }
.quill-content li[data-list="ordered"] { counter-increment: ql-list; }
.quill-content li[data-list="ordered"]::before { content: counter(ql-list) '. '; margin-right: 0.4em; }

/* Seller or operator label above each document in the legal modal. */
.legal-doc-owner {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #6b7280;
    margin-bottom: 0.25rem;
}

/* Between two sellers' documents: a plain rule is enough, they are peers. */
hr.legal-doc-rule {
    margin: 1.25rem 0;
    border: 0;
    border-top: 1px solid #e5e7eb;
}

/* Between the sellers and the marketplace's own terms: a labelled divider, because this is a
   different party's document underneath rather than one more of the same kind. Stronger than the
   peer rule above so the boundary is unmistakable when scrolling. */
.legal-base-divider {
    position: relative;
    text-align: center;
    margin: 1.75rem 0 1rem;
    border-top: 2px solid #d1d5db;
}

.legal-base-divider > span {
    position: relative;
    top: -0.72rem;
    background: #fff;
    padding: 0 0.7rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #9ca3af;
}

/* Nothing above it, so it needs no leading gap and no rule to separate from. */
.legal-base-divider-first {
    margin-top: 0;
    border-top: 0;
}

.legal-base-divider-first > span {
    top: 0;
    padding-left: 0;
    display: inline-block;
    margin-bottom: 0.25rem;
}