/* The bounded content blocks GuestContentSections.razor emits, shipped from the library that emits them and served as
   _content/Ardoise.Presentation.Guest.Shared/content-sections.css to every surface that renders it: the Menu app, the
   Showcase vitrine and the Dashboard composer preview.

   One render, one stylesheet. Two host copies drifted the moment there were two — measured at #2790, the Showcase
   shipped no .content-section-legal rule at all, so the tenant's legal identity, SIRET and alcohol-licence reminder
   rendered at body size and colour on the vitrine while reading correctly on the ordering app.

   The HEADING is deliberately absent: it arrives as the component's HeadingClass parameter, so each host styles its own
   (the Menu composes utilities, the Showcase uses .content-section-title, the composer .composer-preview-title).

   No :root block here, and no token DEFINITIONS. The tokens read below belong to the consuming host's own theme layer;
   declaring them would override the guest hosts' dark theme and, in the Dashboard, repaint the staff chrome. */

.content-section { margin: 2rem 0; }

/* The body no longer needs white-space: pre-line — the render emits a paragraph per paragraph and a <br> per line
   break, so the breaks are elements rather than characters CSS has to preserve. Keeping pre-line here would also make
   the render's own indentation visible the moment a paragraph holds more than one text node. */
.content-section-body { color: var(--ink); margin: 0 0 0.75rem; }
.content-section-body:last-child { margin-bottom: 0; }
.content-section-list { color: var(--ink); margin: 0 0 0.75rem; padding-left: 1.25rem; list-style: disc outside; }
.content-section-list:last-child { margin-bottom: 0; }
.content-section-list-item { margin: 0.25rem 0; }
/* Underlined, not coloured: the link is distinguishable without relying on colour (WCAG 2.2), and it inherits the
   host's ink so a tenant brand or the dark theme carries it. */
.content-section-link { color: inherit; text-decoration: underline; }
.content-section-hours { color: var(--ink); margin: 0; white-space: pre-line; }
.content-section-contact { color: var(--ink); margin: 0; font-style: normal; display: flex; flex-direction: column; gap: 0.25rem; }
.content-section-contact-line { color: inherit; }
.content-section-legal { color: var(--ink); margin: 0; display: flex; flex-direction: column; gap: 0.25rem; }
.content-section-legal-line { color: var(--muted); font-size: 0.875rem; margin: 0; }
.content-section-faq { margin: 0; color: var(--ink); }
.content-section-faq-question { font-weight: 600; margin: 0.75rem 0 0.25rem; }
.content-section-faq-answer { margin: 0; }
/* A bounded grid, never a carousel: no script ships with these blocks, and a row that scrolls sideways hides half the
   photos from a keyboard. auto-fill keeps a two-photo gallery from stretching into two half-page frames. */
.content-section-gallery {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
    gap: 0.5rem;
}
.content-section-gallery-item { margin: 0; }
/* Fixed aspect + cover so photographs of different shapes still read as one grid rather than a ragged column. */
.content-section-gallery-image {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 0.5rem;
    background: var(--brand-band);
}

.content-section-reviews {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.content-section-review { color: var(--ink); margin: 0; }
.content-section-review-head {
    margin: 0 0 0.25rem;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
}
.content-section-review-author { font-weight: 600; }
/* The accent inked for body-size text (contrast-gated by BrandKitResolver), never the raw brand accent. */
.content-section-review-stars { color: var(--brand-accent-ink); white-space: nowrap; }
.content-section-review-comment { margin: 0; color: var(--ink); }

.content-section-cta {
    display: inline-block;
    background: var(--brand-primary-raised);
    color: var(--brand-on-primary);
    border-radius: 0.5rem;
    padding: 0.6rem 1.2rem;
    text-decoration: none;
    font-weight: 600;
}