/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */

/**
 * @file
 * Special grid system for sidebar.
 */

.sidebar-grid {
  position: relative;
}

.sidebar-grid > .site-main {
  grid-column: 1 / 7;
  align-self: flex-start;
}

@media (min-width: 43.75rem) {
  .sidebar-grid > .site-main {
    grid-column: 1 / 15;
  }
}

@media (min-width: 62.5rem) {
  .sidebar-grid > .site-main {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    grid-column: 1 / 12;
  }

  .sidebar-grid > .site-main > .region--content-above,
  .sidebar-grid > .site-main > .region--content {
    grid-template-columns: repeat(8, minmax(0, 1fr));
    grid-column: 1 / 9;
  }

  .sidebar-grid > .site-main .layout--content-narrow,
  .sidebar-grid > .site-main .layout--pass--content-narrow > *,
  .sidebar-grid > .site-main .layout--content-medium,
  .sidebar-grid > .site-main .layout--pass--content-medium > * {
    grid-column: 1 / 9;
  }
}

.sidebar-grid .region--sidebar {
  grid-column: 1 / 7;
}

@media (min-width: 43.75rem) {
  .sidebar-grid .region--sidebar {
    grid-column: 7 / 16;
  }
}

@media (min-width: 62.5rem) {
  .sidebar-grid .region--sidebar {
    grid-column: 12 / 16;
  }
}

/* When collapsed: main content expands to fill the freed column. */

@media (min-width: 62.5rem) {
  .sidebar-grid.sidebar-is-collapsed > .site-main {
    grid-column: 1 / -1;
  }
}

/* When collapsed: sidebar floats absolutely over the map. */

.sidebar-grid.sidebar-is-collapsed .region--sidebar {
  position: absolute;
  z-index: 400;
  top: 12.5rem;
  right: 0.3125rem;
  width: auto;
  padding: 0.5rem 1rem;
  border: solid 1px gray;
  border-radius: 0.25rem;
  background: #fff;
}

.sidebar-grid.sidebar-is-collapsed .region--sidebar > * {
  margin-top: 0.625rem !important;
  margin-block-end: 0.625rem !important;
}

/* Sidebar toggle button (×), visible when the sidebar is open. */

.region--sidebar {
  position: relative;
}

.region--sidebar .sidebar-toggle {
  position: absolute;
  top: -0.4rem;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.6rem;
  height: 1.6rem;
  padding: 0;
  background: rgba(0, 0, 0, 0.06);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  color: #444;
  transition: background 150ms ease, color 150ms ease;
  z-index: 1;
}

.region--sidebar .sidebar-toggle:hover {
  background: rgba(0, 0, 0, 0.14);
  color: #111;
}

/* Collapsed state: hide block content and the close button. */

.region--sidebar.is-collapsed .sidebar-toggle {
  display: none;
}

.region--sidebar.is-collapsed .block__content {
  display: none;
}

/* Block title becomes the re-open trigger when collapsed. */

.region--sidebar.is-collapsed .block__title {
  cursor: pointer;
  margin: 0;
  -webkit-user-select: none;
  user-select: none;
}
