/**
 * Remove Olivero's decorative left "rail" and its tiled page background.
 *
 * Olivero reserves a left column of width `--content-left` (5.625rem) down the
 * whole page and styles each section's slice of it differently, which reads as
 * a three-part vertical sidebar the original D7 site never had:
 *   - header:  `.site-header__initial` / `.sticky-header-toggle` -- the strip
 *              holding the sticky-header hamburger (recoloured light blue by
 *              header.css), revealed when the header sticks on scroll.
 *   - content: the `.social-bar` region -- the grey (`--color--gray-100`)
 *              column beside the main content.
 *   - footer:  `.site-footer` -- a black `border-inline-start` of width
 *              `--content-left` (core olivero components/footer.css).
 * Olivero also tiles a faint blue "teardrop" SVG across the whole `body`
 * background (core olivero base/base.css), which shows in the margins on wide
 * viewports.
 *
 * The rules below collapse that rail and drop the decorative background, so the
 * content sits centred on a plain backdrop like the D7 layout. Everything here
 * is additive and scoped; deleting this file (and its libraries.yml entry)
 * restores stock Olivero.
 */

/*
 * Drupal loads module CSS *before* theme CSS, so every rule below targets an
 * Olivero rule that loads afterwards and would win at equal specificity. Each
 * selector is therefore deliberately raised one step above Olivero's own (the
 * same tactic header.css / footer.css use) so these overrides take effect.
 */

/* (2) Drop the tiled teardrop pattern. `html body` (beats Olivero's `body` in
   base/base.css); Olivero's flat light-grey backdrop (`--color--gray-100`, the
   body background-color) is kept underneath. */
html body {
  background-image: none;
}

/* The left rail only exists at Olivero's desktop breakpoint (>= 75rem); at
   narrower widths the layout is a single column, so leave it untouched. */
@media (min-width: 75rem) {
  /* (1a) Grey "social bar" column beside the content. `.layout-main` prefix
     beats Olivero's `.social-bar` (layout/social-bar.css). */
  .layout-main .social-bar {
    display: none;
  }

  /* Main content reclaims the width the social bar occupied, so it centres
     symmetrically within Olivero's max-width grid instead of being nudged
     right by the rail. `.layout-main` prefix beats Olivero's `.main-content`
     (layout/layout.css). */
  .layout-main .main-content {
    width: 100%;
  }

  /* (1b) Black left border running down the footer. `footer.site-footer`
     (element + class) beats Olivero's `body:not(...) .site-footer`
     (components/footer.css). */
  body:not(.is-always-mobile-nav) footer.site-footer {
    border-inline-start: 0;
  }

  /* (1c) Blue header strip and its sticky-header hamburger toggle. Hiding the
     strip removes the toggle; the header still sticks on scroll, it just can no
     longer be collapsed. `.site-header` prefix beats Olivero's
     `.site-header__initial`. */
  .site-header .site-header__initial {
    display: none;
  }

  /*
   * (3) Centre the content on wide viewports.
   *
   * Olivero left-anchors the whole layout: `.page-wrapper` caps the page at
   * `--max-bg-color` (98.125rem) but never centres it, and each section's
   * max-width `.container` (`--max-width`, 84.375rem) is left-aligned within
   * its parent. With the left rail present that looked deliberate; with the
   * rail removed the page just hugs the left, leaving a large gap on the right.
   *
   * Centre the outer page box in the viewport, then centre each section's
   * `.container` within its (now full-width) parent. Because the header inner,
   * the main content and the footer inner are all the same full width and share
   * the same left edge, centring their containers keeps header/content/footer
   * aligned with each other while sitting centred in the viewport. */
  #page-wrapper.page-wrapper {
    margin-inline: auto;
  }

  .site-header__inner__container.container,
  .main-content .main-content__container.container,
  .site-footer .site-footer__inner.container {
    margin-inline: auto;
  }
}

/*
 * (4) Move the sidebar column to the left.
 *
 * On pages with blocks in the Sidebar region, Olivero lays the main content and
 * the sidebar out as a CSS grid (`.sidebar-grid`, core olivero
 * layout/layout-sidebar.css). At its desktop breakpoint (>= 62.5rem) it places
 * `.site-main` at `grid-column: 3 / 11` (left) and `.region--sidebar` at
 * `grid-column: 12 / 15` (right). Below that breakpoint the sidebar isn't a
 * side column at all -- it stacks full-width below the content -- so "left vs
 * right" only applies here.
 *
 * The two rules below mirror those columns so the sidebar sits on the left,
 * preserving each element's original width and the one-column gap between them.
 * `grid-row: 1` is pinned on both: the sidebar follows the content in the DOM,
 * and CSS grid's (sparse) auto-placement won't move its cursor back to fill the
 * now-earlier columns 1-4, so without an explicit row the sidebar would drop
 * onto a second row below the content. Pinning both to row 1 keeps them side by
 * side at the same vertical position.
 *
 * The `:has(.region--sidebar > *)` guard is important: Olivero still emits the
 * `.sidebar-grid` wrapper (narrowing the content) on pages where the sidebar's
 * block is hidden by its visibility rules, leaving an *empty* `.region--sidebar`
 * aside (e.g. the front page, /knowledge, /partners). Those pages have no
 * sidebar to move, so the guard leaves them exactly as Olivero renders them and
 * only mirrors the columns where the sidebar actually has content.
 *
 * `.main-content` prefixes lift these one step above Olivero's own selectors
 * (which load afterwards and would otherwise win at equal specificity), the same
 * tactic the rules above use. Deleting this block restores Olivero's right-hand
 * sidebar.
 */
@media (min-width: 62.5rem) {
  .main-content .sidebar-grid:has(.region--sidebar > *) > .site-main {
    grid-column: 5 / 13;
    grid-row: 1;
  }

  .main-content .sidebar-grid:has(.region--sidebar > *) .region--sidebar {
    grid-column: 1 / 4;
    grid-row: 1;
  }
}

/*
 * (5) Close the gap under the title on emptied-node + view-block pages.
 *
 * A few pages have their node body cleared and get their content from a scoped
 * view block placed in the content region: /software/categories (node 78),
 * /software/keywords (node 80) and /news/archive (node 85). Olivero still renders
 * each empty node as the main content block *above* that view block, adding ~108px
 * of dead space (an empty .node__content with padding-block-end plus the block's
 * own margin). Hide the empty main block on exactly those pages -- each is
 * identified by the view block it carries -- so the content sits directly under
 * the title at Olivero's normal title spacing.
 *
 * Deliberately NOT applied to /articles (node 86) or the home page (node 87):
 * their bodies hold real content that the main block must keep showing.
 */
.region--content:has(
    .block-views-blocklist-of-software-categories-block-1,
    .block-views-blocklist-of-software-keywords-block-1,
    .block-views-blocknewsletter-list-block-1
  ) .block-system-main-block {
  display: none;
}

/*
 * (6) Group headings on the software programs, publishers and countries lists.
 *
 * All three tables group their rows -- list_of_software and list_of_publishers
 * by first letter, list_of_countries by country -- and Views table grouping
 * renders each group's label as the table <caption> ("0 - 9", "A", ... "Z";
 * "Australia" ... "Country Not Provided"), which both Olivero and Bootstrap
 * leave as small, muted, normal-weight text. Style those captions to read as
 * headings, matching the <h3> group headings on the keywords glossary (Olivero
 * heading scale: 1.5rem / 700).
 */
.view-id-list_of_software .views-table > caption,
.view-id-list_of_publishers .views-table > caption,
.view-id-list_of_countries .views-table > caption {
  margin-block: 1.5rem 0.25rem;
  color: inherit;
  font-family: var(--font-family, metropolis, sans-serif);
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  text-align: start;
}

/*
 * (7) Match the sidebar menu font to the primary menu.
 *
 * Olivero styles menus in the Sidebar region (see (4)) in its serif face:
 * `preprocess_menu` tags them `menu--sidebar` and `preprocess_block` attaches
 * `olivero/menu-sidebar` (core olivero src/Hook/OliveroHooks.php), whose
 * `.menu--sidebar .menu__link` rule sets `font-family: var(--font-serif)`
 * (Lora). The header's primary nav has no `font-family` of its own, so it
 * inherits `--font-sans` (metropolis) from `body` -- leaving the two menus in
 * different faces. Put the sidebar menu back on `--font-sans` so both match.
 *
 * Family only: the sidebar's own size (1.125rem) and weight (600) are left
 * alone. The primary nav's size is breakpoint-dependent (1.75rem, dropping to
 * 1rem at >= 75rem via nav-primary-wide.css), so there is no single size to
 * match, and the size/weight difference is the intended hierarchy between a
 * nav bar and a sidebar list.
 *
 * The `.region--sidebar` prefix is required, not cosmetic: module CSS loads
 * before theme CSS (see the note at the top of this file), so an equal-
 * specificity `.menu--sidebar .menu__link` rule would lose to Olivero's and
 * silently do nothing. This lifts the selector one step above it.
 *
 * Deliberately unscoped: below Olivero's 62.5rem sidebar breakpoint the region
 * stacks full width under the content rather than sitting on the left, and the
 * font should be consistent there too.
 */
.region--sidebar .menu--sidebar .menu__link {
  font-family: var(--font-sans);
}

/*
 * (8) The "Software" column on the publishers list.
 *
 * Each cell holds a bulleted list of the publisher's programs (view field
 * ba_publisher_software). Olivero's default list indent pushes the links well
 * clear of the column heading inside a narrow table cell; use the same compact
 * indent as the equivalent list on the publisher detail page
 * (.ba-detail__programs in ba_software_page/css/software.css).
 */
.ba-publisher-software {
  margin: 0;
  padding-left: 1.2rem;
}