/* ==========================================================================
   BEL-AIR public site (Mockup 02) — Government, Transparency and Help pages
   (wave W6): what the mock wrote as style="" attributes, or built in script, is
   a class here, so the pages carry no inline styles (CSP, BRD M2-NFR-56).
   Loaded after pages-government.css or pages-help.css. Colours from tokens.css.
   ========================================================================== */

/* spacing the page bodies used to write inline (one value each) */
.u-mt-04 { margin-top: .4rem; }
.u-mt-06 { margin-top: .6rem; }
.u-mt-075 { margin-top: .75rem; }
.u-mt-11 { margin-top: 1.1rem; }
.u-mt-25 { margin-top: 2.5rem; }
.u-mb-1 { margin-bottom: 1rem; }

/* rows of buttons and of arrow links under a section */
.btn-row { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.link-row { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin-top: 1rem; }

/* people cards: the feature card stands apart; a group heading between the card grids */
.card--feature { display: block; margin-bottom: 1rem; }
.eyebrow--card { color: var(--ink-d3); }
.group-heading { margin: 1.75rem 0 1rem; }
.facts-d--grow { flex: 1; }

/* a service row with an action or tags on the right */
.svc-row--action { grid-template-columns: 1fr auto; }

/* a document row that is itself a link (authored measures on a profile) */
a.doc--link { color: var(--ink-d); text-decoration: none; }
a.doc--link:hover b { text-decoration: underline; }

/* headings in the UI face: "Call 911 first" and a notice's own heading */
.h2-ui, .notice__title { font-family: var(--font-ui); font-size: var(--t-lg); font-weight: 800; }
.notice__title { margin-top: 0; }

/* rich-text bodies of the help pages */
.prose > :first-child { margin-top: 0; }
.dpo-card { max-width: 32rem; }
.motion-here { margin-top: .75rem; }

/* a lede under a section heading, and links inside a hero lede */
.lede--body { margin-top: .75rem; }
.lede__link { color: var(--blue-light); }
.lede__link--gold { color: var(--gold); }

/* the ordinance page's print-only header (UX-54): the title is an h2, so the page keeps one h1 */
.print-head { margin-bottom: 6mm; }
.print-head h2 { font-family: var(--font-display); font-weight: 400; font-size: 20pt; line-height: 1.1; color: #000; }

/* filters are GET forms: they work without scripts; with scripts a changed select submits the form */
.filters__apply { flex: 0 0 auto; align-self: end; }
.filters .field--chips { flex: 2 1 22rem; }
.filters .field--full { flex: 1 1 100%; }

/* the hall map's fallback when the tiles cannot load (M2-HOME-44) */
.map-fallback { display: grid; place-items: center; align-content: center; gap: .5rem; min-height: 12rem; padding: 2rem 1.5rem; background: var(--night-2); color: var(--ink); text-align: center; }
.map-fallback .link-arrow { color: var(--blue-light); }

/* the PDF viewer shows the browser's own PDF viewer in a frame (page by page, with zoom) */
.pdf-view__frame { position: relative; margin: 1rem 1.25rem; }
.pdf-view__frame iframe { display: block; width: 100%; height: min(70dvh, 52rem); border: 1px solid var(--line-d-strong); background: #fff; }
.pdf-view__status { padding: 2rem 0; text-align: center; color: var(--ink-d2); }

/* a site-map page listed with a note and no link */
.sitemap__item { display: inline-flex; align-items: center; min-height: 2.75rem; color: var(--ink-d); }
