/* ---- Layout ---- */

/* Overall site */
.wp-site-blocks {
  margin: 0 auto;
  max-width: none;
  overflow-x: clip;

  .page-template-page-header-left & {
    overflow-x: visible;
  }
}

.wp-site-blocks,
.wp-site-blocks.alignwide {
  width: 100%;
}

.main,
.mxs-card .sidebar {
  padding-top: var(--wp--style--root--padding-top);
  padding-bottom: var(--wp--style--root--padding-bottom);
}

.main {
  overflow-x: hidden;
}

.entry-content.is-layout-flow,
.wp-block-post-template.is-layout-flow {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}

/* Override column structures */
.content-sidebar.wp-block-columns,
.sidebar-content.wp-block-columns,
.header-left-columns {
  flex-direction: column;
  margin-block-start: 0;

  &.is-not-stacked-on-mobile {
    flex-wrap: wrap;
  }
}

.header-left-columns {
  margin-left: var(--wp--style--block-gap, 1.5em);
  margin-right: var(--wp--style--block-gap, 1.5em);
}

.header-left-columns:where(.is-layout-flex) {
  gap: 24px;
}

.content-sidebar > .wp-block-column,
.sidebar-content > .wp-block-column,
.wp-block-column.content-column {
  padding: 0;
}

.content-sidebar,
.sidebar-content {
  .wp-block-column:has(.mxs-card) {
    margin-left: var(--wp--style--block-gap, 1.5em);
    margin-right: var(--wp--style--block-gap, 1.5em);
  }

  .wp-block-column:has(.mxs-no-card.is-style-group-outline) {
    margin-left: var(--wp--style--block-gap, 1.5em);
    margin-right: var(--wp--style--block-gap, 1.5em);
  }
}

.no-sidebar {
  margin-block-start: 0;

  .wp-block-column {
    padding: 0;
  }

  .mxs-card,
  .mxs-no-card.is-style-group-outline {
    margin-left: var(--wp--style--block-gap, 1.5em);
    margin-right: var(--wp--style--block-gap, 1.5em);
  }
}

.wp-block-column.header-column {
  background-color: var(--wp--preset--color--base);
  padding-left: 1.5em;
  padding-right: 1.5em;
  position: sticky;
  top: 0;

  .admin-bar & {
    top: 46px;
  }
  z-index: 100;
}

@media (min-width: 600px) and (max-width: 1024px) {
  .content-sidebar.wp-block-columns > .wp-block-column:not(:only-child) {
    flex-basis: 100% !important;
  }
}

@media (min-width: 782px) {
  .content-sidebar.wp-block-columns.is-not-stacked-on-mobile > .wp-block-column[style*="flex-basis"],
  .content-sidebar.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis"],
  .sidebar-content.wp-block-columns.is-not-stacked-on-mobile > .wp-block-column[style*="flex-basis"],
  .sidebar-content.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis"] {
    flex-grow: 1;
  }

  .admin-bar .wp-block-column.header-column {
    top: 32px;
  }
}

@media (min-width: 1024px) {
  .content-sidebar.wp-block-columns,
  .sidebar-content.wp-block-columns,
  .header-left-columns {
    flex-direction: row;
    flex-wrap: nowrap !important;
  }

  .wp-block-column.header-column {
    align-self: flex-start;
    flex-basis: 25% !important;
    padding-left: 0;
    padding-right: 0;
  }

  .content-sidebar.wp-block-columns,
  .sidebar-content.wp-block-columns {
    > .wp-block-column {
      margin-bottom: 0;
    }

    .content {
      flex-basis: calc(75% - var(--wp--style--block-gap, 1.5em)) !important;
    }

    .sidebar-outer {
      flex-basis: 25% !important;
    }
  }

  .content-sidebar {
    .content:has(.wp-block-group.mxs-card) {
      margin-right: 0;
    }

    .sidebar-outer:has(.mxs-card),
    .sidebar-outer:has(.mxs-no-card) {
      margin-left: 0;
    }
  }

  .sidebar-content {
    .content:has(.wp-block-group.mxs-card) {
      margin-left: 0;
    }

    .sidebar-outer:has(.mxs-card),
    .sidebar-outer:has(.mxs-no-card) {
      margin-right: 0;
    }
  }

  .sidebar-content.wp-block-columns > .wp-block-column:first-child {
    order: 0;
  }

  .sidebar-content.wp-block-columns .wp-block-column:nth-of-type(1) {
    order: 1;
  }

  .sidebar-content {
    .sidebar-outer .mxs-card {
      margin-right: 0;
    }
  }

  .header-left-columns {
    margin-left: 0;
  }
}

@media (min-width: 1366px) {
  .content-sidebar.wp-block-columns,
  .sidebar-content.wp-block-columns {
    .content {
      flex-basis: calc(85% - var(--wp--style--block-gap, 2em)) !important;
    }

    .sidebar-outer {
      flex-basis: 15% !important;
    }
  }

  .wp-block-column.header-column {
    flex-basis: 15% !important;
  }
}

/* Header */
.site-header > .wp-block-group:not(.mxs-header) {
  padding: 0 1.5em 1.5em 1.5em;
}

.site-header > .wp-block-group.header-hero-title-inside {
  padding-bottom: 0;
}

.mxs-header {
  display: grid;
  grid-template-columns: minmax(320px, 1fr);
  grid-template-rows: 1fr auto auto;
  margin-top: -1.5em; /* To negate margin on .wp-site-blocks */
  padding: 0;
}

.mxs-title-panel {
  grid-row: 2 / 3;
  padding: 1.5em;
}

.mxs-header-searchbar-center .mxs-title-panel {
  flex-wrap: wrap;
  padding: 1em 1.5em;
  row-gap: 0;
}

.mxs-header .wp-block-navigation {
  grid-row: 3 / 4;
}

.header-hero .wp-block-navigation {
  grid-row: 4 / 5;
}

.header-vertical {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.header-vertical > :nth-child(1) {
  grid-column: 1 / 3;
}

.header-vertical > :nth-child(2) {
  grid-column: 1 / 2;
}

.header-vertical > :nth-child(3) {
  grid-column: 2 / 3;
}

@media (min-width: 600px) {
  .site-header > .wp-block-group.header-hero-title-inside {
    padding-bottom: 1.5em;
  }
}

@media (min-width: 768px) {
  .mxs-header-searchbar-center .mxs-title-panel {
    flex-wrap: nowrap;
  }
}

@media (min-width: 1024px) {
  .mxs-header {
    grid-template-columns: calc(75% - 0.75em) auto;
  }

  .header-vertical {
    grid-template-columns: 1fr;
  }

  .header-vertical > :nth-child(1),
  .header-vertical > :nth-child(2),
  .header-vertical > :nth-child(3) {
    grid-column: 1 / 3;
  }

  .mxs-title-panel {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
  }

  .mxs-header-searchbar-left {
    grid-template-columns: auto calc(75% - 0.75em);
  }

  .mxs-header-searchbar-left .mxs-title-panel {
    grid-column: 2 / 3;
  }

  .mxs-header-searchbar-center {
    grid-template-columns: auto var(--wp--style--global--content-size) auto;
  }

  .mxs-header-searchbar-center .mxs-title-panel {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
  }

  .header-hero .wp-block-cover {
    grid-column: 1 / 3;
  }

  .mxs-header .wp-block-navigation {
    grid-column: 1 / 2;
  }

  .mxs-header .wp-block-navigation.is-style-flat-nav {
    grid-column: 1 / 3;
  }

  .header-hero .wp-block-navigation {
    grid-column: 1 / 3;
    grid-row: 3 / 4;
  }

  .site-header > .wp-block-group.mxs-header-searchbar-center .wp-block-navigation {
    margin: 1em 0;
  }

  .mxs-header-searchbar-left .wp-block-navigation,
  .mxs-header-searchbar-center .wp-block-navigation {
    grid-column: 2 / 3;
  }
}

@media (min-width: 1366px) {
  .mxs-header {
    grid-template-columns: calc(85% - 1em) auto;
  }

  .mxs-header-searchbar-left {
    grid-template-columns: auto calc(85% - 1em);
  }

  .mxs-header-searchbar-center {
    grid-template-columns: auto var(--wp--style--global--content-size) auto;
  }
}

/* Sidebar */
.sidebar.mxs-card {
  padding-top: 1.5rem;
  padding-right: var(--wp--preset--spacing--40);
  padding-bottom: 1.5rem;
  padding-left: var(--wp--preset--spacing--40);
}

.sidebar.mxs-no-card {
  padding-right: var(--wp--preset--spacing--40);
}

/* Footer */
.mxs-footer {
  padding: 1em 1.5em;
}

/* Navigation */
@media (min-width: 600px) and (max-width: 1024px) {
  .page-template-page-header-left .wp-block-navigation__responsive-container-open:not(.always-shown) {
    display: flex;
  }

  .header-left-columns .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
    display: none;
  }
}

@media (min-width: 1024px) {
  .page-template-page-header-left .wp-block-navigation__responsive-container-open:not(.always-shown) {
    display: none;
  }

  .header-left-columns .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
    display: block;
  }
}

/* Search */
.is-layout-flow {
  .is-style-search-header,
  .is-style-search-header-dark-bg {
    margin-top: 0;
  }
}

.mxs-header .wp-block-search {
  grid-row: 1 / 2;
}

@media (min-width: 1024px) {
  .mx-header-left-searchbar .wp-block-search {
    grid-column: 1 / 2;
  }

  .mxs-header-searchbar-center .wp-block-search {
    grid-column: 1 / 4;
    grid-row: 1 / 2;
  }

  .mxs-header.is-layout-flow > .wp-block-search.alignright,
  .mxs-header.is-layout-flow > .is-layout-constrained .wp-block-search.alignright {
    grid-column: 1 / 3;
  }
}

/* Alignments */
.aligncenter {
  margin-left: auto;
  margin-right: auto;
}

img.alignleft {
  margin-right: 1em;
  margin-bottom: 1em;
}

img.alignright {
  margin-left: 1em;
  margin-bottom: 1em;
}

img.aligncenter {
  margin-bottom: 1em;
}

.alignwide {
  margin-left: auto;
  margin-right: auto;
}

.entry-content.is-layout-flow .alignfull,
.wp-block-post-template.is-layout-flow .alignfull {
  margin-left: -1.5rem;
  margin-right: -1.5rem;
}

.mxs-card .alignfull {
  margin-left: calc(var(--wp--style--root--padding-left) * -1);
  margin-right: calc(var(--wp--style--root--padding-right) * -1);
}

/* Miscellaneous */
.observed-element + .main {
  margin-block-start: 0;
}
