/* The reference's cascade, declared once, first in <head>.

   Doxygen's own sheets and the vendored theme are imported into one
   layer, in their load order, so the site's built sheet (dist/main.shell.css,
   the seven layers from tokens to site, re-rooted under .site-shell) and
   the reference's skin (the api layer) sit above them by layer order
   rather than by specificity or !important. One layer, not one per
   sheet: important declarations invert the layer order (the first
   layer's win), and doxygen.css and the theme both use !important on
   the same rules (.memitem's display, the menu's radius), which their
   load order settles inside a single layer as it did unlayered. The
   Doxygen layer comes first: the site's sheet is the re-rooted form
   (dist/main.shell.css), so its rules reach nothing outside a
   .site-shell container, and inside one every site layer, the base's
   components included, must win over Doxygen's element rules (the
   footer's divs and paragraphs would otherwise take doxygen.css's 14px).
   api-important, first, holds the skin's rules that
   must beat the theme's own !important (its link colour above all). */
@layer api-important, doxygen, api-shell, tokens, reset, typography, layout, components, themes, site, api;

@import url("tabs.css") layer(doxygen);
@import url("navtree.css") layer(doxygen);
@import url("search/search.css") layer(doxygen);
@import url("doxygen.css") layer(doxygen);
@import url("doxygen-awesome.css") layer(doxygen);
@import url("doxygen-awesome-sidebar-only.css") layer(doxygen);
@import url("api-important.css") layer(api-important);   /* scripts/api-skin.py writes it from the skin sources */

/* Inside a .site-shell container Doxygen's sheets are as if absent: this
   layer sits after theirs and before the site's, and reverts every
   author declaration to the user agent's, so the site's layers then
   cascade over browser defaults exactly as they do on the site's pages
   (Doxygen's `div, p` font rule would otherwise reach the footer's
   paragraphs wherever the site sets nothing of its own). Important
   declarations are not reverted this way; the theme's link colour, the
   one that reached the shell, has its !important removed in the vendored
   file. */
@layer api-shell {
  :where(.site-shell, .site-shell *):not(svg, svg *) { all: revert; }   /* not the icons: revert would drop their presentation attributes (stroke, fill), which Doxygen never styles */
}

/* The one place the reference styles inside a container: the element in
   the drawer head's container that carries the docs page's navigator
   classes, so the head takes the navigator's rules, is a plain block
   here (on the docs page it is the navigator itself: hidden until the
   toggle opens it, sticky, sized to the viewport). */
@layer api {
  .api-drawer-head > .guide-nav { display: flex; flex-direction: column; position: static; top: auto; margin: 0; padding: 0; max-height: none; overflow: visible; }   /* a column, as the open navigator is, so the head's children lay out as they do there */
}
