/* ==========================================================================
   Astra compatibility layer
   --------------------------------------------------------------------------
   By default the theme does not load Astra's front-end stylesheet at all
   (see nbi_enqueue_assets() / the `nbi_dequeue_astra_css` filter), because the
   approved design is a complete stylesheet of its own. This file only matters
   if that filter is switched off. It uses :where() so it adds no specificity of
   its own and cannot clash with the component classes in main.css.
   ========================================================================== */

/* Astra's layout classes (.ast-separate-container etc.) colour the page */
body.nbi-site {
  background: var(--color-cream);
  color: var(--color-brown);
  font-family: var(--font-body);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

:where(body.nbi-site) :is(h1, h2, h3, h4) {
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--color-brown);
  margin: 0;
  line-height: inherit;
}
:where(body.nbi-site) p { margin: 0; }
:where(body.nbi-site) a { color: inherit; }

/* Astra styles a:hover globally; keep the design's button text colours */
body.nbi-site .btn--primary:hover,
body.nbi-site .mobile-cta-bar__link--primary:hover { color: #fff; }
body.nbi-site .btn--on-white:hover { color: var(--color-coral-deep); }
body.nbi-site .btn--outline:hover { color: #fff; }
body.nbi-site .btn--outline-light:hover { color: var(--color-brown); }

/* Astra gives <button> a filled background; the design's icon buttons have none */
body.nbi-site .menu-toggle:not(:hover),
body.nbi-site .mobile-panel__close { background: transparent; border: 0; box-shadow: none; }