/* Shared, host-agnostic styles of the landing blocks. Loaded by BOTH the public site and the
   cabinet, so nothing here may assume a page-level reset. */

/* Material Symbols Rounded — self-hosted subset (51 icons; Filled instance, opsz 20–48 variable).
   Covers every ligature the public landing can emit: static chrome icons, the 12 LandingIcons
   subject ligatures, and the footer app links (shop/android). Regenerate when adding an icon:
   pyftsubset over the upstream variable font, pinning FILL=1/GRAD=0/wght=400 (keep opsz), keeping
   layout features rlig+rclt with --no-layout-closure (closure over rlig would pull in every icon
   spellable from the retained letters and bloat the file ~100×). */
@font-face {
  font-family: 'Material Symbols Rounded';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/_content/Repetitum.Landing.Blocks/fonts/MaterialSymbolsRounded-subset.woff2') format('woff2');
}

.material-symbols-rounded {
  font-family: 'Material Symbols Rounded';
  font-weight: normal;
  font-style: normal;
  font-feature-settings: 'liga' 1;
  font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  vertical-align: middle; line-height: 1;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

/* Two-tone palette helpers (moved out of app.tailwind.css — the blocks use them in both hosts). */
.accent-bg { background-color: var(--accent); color: #fff; }
.accent-bg:hover { filter: brightness(1.08); }
.accent-text { color: var(--accent); }
.accent-border { border-color: var(--accent); }
.accent-ring { box-shadow: inset 0 0 0 1px var(--accent); }
.accent-tint-bg { background-color: var(--accent-tint); }

/* FAQ accordion rules deliberately do NOT live here (task 11 cleanup): FaqBlock.razor kept the source
   _Faq.cshtml's inline <style> verbatim because the frozen faq.*.html goldens pin that literal element
   as part of the block's own render-tree output (see the comment on that component), so a second copy
   of the same rules here was pure duplication, not "one instance shared by both hosts" as an earlier
   version of this comment claimed — the inline copy was never removed from the partial it was meant to
   replace. Consolidating the two into one shared instance is a cleanup for after the goldens retire. */

/* ── Cabinet surface only ─────────────────────────────────────────────────────────────────────
   The cabinet bundle of the block utilities is built with preflight OFF (it would wipe the cabinet's
   own styles), so the handful of resets the blocks rely on are restated here, scoped to the surface. */
.rp-site-surface, .rp-site-surface *, .rp-site-surface *::before, .rp-site-surface *::after { box-sizing: border-box; }
.rp-site-surface h1, .rp-site-surface h2, .rp-site-surface h3, .rp-site-surface h4,
.rp-site-surface p, .rp-site-surface ul, .rp-site-surface ol, .rp-site-surface figure,
.rp-site-surface blockquote { margin: 0; }
.rp-site-surface ul, .rp-site-surface ol { padding: 0; list-style: none; }
.rp-site-surface img, .rp-site-surface svg { display: block; max-width: 100%; }
.rp-site-surface button, .rp-site-surface input, .rp-site-surface textarea { font: inherit; }

/* A link, CTA, form control or FAQ toggle inside the editing surface must never navigate, submit or
   steal the click that opens the block for editing. Several inline editors DO live inside an <a> or a
   <summary> today (Hero/Contacts/Parents' CTA text, Contacts' four channel labels, FAQ questions) —
   pointer-events:none here only stops THESE elements from being the hit-test target; the editing
   control nested inside restores its own pointer-events:auto (bp.css, scoped to .rp-site-surface) so
   it stays clickable, and the cabinet additionally @onclick:preventDefault's each such <a>/<summary>
   so a click that bubbles up from the nested control doesn't ALSO fire the ancestor's native action
   (navigate / toggle) — pointer-events only gates hit-testing, not event bubbling. See HeroBlock.razor's
   CTA for the canonical comment on that second half of the fix. */
.rp-site-surface a,
.rp-site-surface summary,
.rp-site-surface form,
.rp-site-surface .tpl-btn { pointer-events: none; }
