/* One download-free text system in owned pages and accessible MLS shadow roots.
   system-ui bypasses the provider's Arial -> Roboto face alias. */
:root, :host {
  --wsh-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --wsh-font-weight-normal: 400;
  --wsh-font-weight-medium: 500;
  --wsh-font-weight-semibold: 600;
  --wsh-font-weight-bold: 700;
}

:where(body, :host) {
  font-family: var(--wsh-font-family) !important;
  font-weight: var(--wsh-font-weight-normal);
}

/* Text and native controls, not a universal font override. Keep icon-font
   markers, code/monospace subtrees and intentional font exceptions intact. */
:where(body, :host) :is(h1,h2,h3,h4,h5,h6,p,a,button,input,select,option,optgroup,
  textarea,label,legend,fieldset,summary,li,dt,dd,th,td,caption,figcaption,
  div,span,strong,small,em,b,blockquote,output,mark,abbr,time,address,q,cite):not(:where(
  [class*="fa-"], [class*="fa-"] *, [class~="fa"], [class~="fa"] *,
  .fas, .fas *, .far, .far *, .fab, .fab *, .fal, .fal *, .fad, .fad *, .fat, .fat *,
  [class*="icon"]:not(.btn-label-icon), [class*="icon"]:not(.btn-label-icon) *,
  .material-icons *, [class*="material-symbols"],
  [class*="material-symbols"] *, .glyphicon, .glyphicon *,
  pre, pre *, code, code *, kbd, kbd *, samp, samp *,
  .CodeMirror, .CodeMirror *, .cm-editor, .cm-editor *, .monaco-editor, .monaco-editor *,
  [data-wsh-font-exempt], [data-wsh-font-exempt] *)) {
  font-family: var(--wsh-font-family) !important;
}

/* The browser's file button otherwise need not inherit the input's font. */
:where(body, :host) input::file-selector-button { font: inherit; }
:where(body, :host) :is(input, textarea)::placeholder { font-family: inherit; }

/* Provider loading placeholders: dark cards and a soft gold-grey shimmer instead of
   white boxes that flash on the dark site before the listings arrive. This file is
   the first stylesheet in every MLS shadow root, so it applies from the first frame. */
:host :is(.mbb-sk-card, .mbb-sk-list-item, .mbb-sk-prop) {
  background: #181713 !important; /* the listing card colors (listing-strip.css) */
  box-shadow: inset 0 0 0 1px #ffffff26 !important;
  border-radius: 12px !important;
}
:host .mbb-sk-shimmer, :host .mbb-sk-fill {
  background: linear-gradient(90deg, #24211c 25%, #2f2a22 50%, #24211c 75%) 0 0 / 200% 100% !important;
}
:host .mbb-sk-prop.layout--immersive .mbb-sk-prop__meta { background: rgba(255, 255, 255, 0.04) !important; }
@media (prefers-reduced-motion: reduce) {
  :host :is(.mbb-sk-shimmer, .mbb-sk-fill) { animation: none !important; }
}