:root {
  --header-height: 72px;
  --admin-bar-height: 0px;
  --page-side-padding: 20px;
  --page-max-width: 1180px;
  --section-spacing: 36px;
  --ed-ios-safe-bottom: env(safe-area-inset-bottom, 0px);
  --ed-native-tab-height: 0px;
  --ed-app-bottom-space: 0px;
  --ed-app-fixed-bottom: calc(12px + var(--ed-ios-safe-bottom) + var(--ed-app-bottom-space));
}

body.admin-bar {
  --admin-bar-height: 46px;
}

html.ed-native-app-shell,
html.ed-app-shell--ios {
  --ed-native-tab-height: 74px;
  --ed-app-bottom-space: calc(var(--ed-ios-safe-bottom) + var(--ed-native-tab-height));
  --ed-app-fixed-bottom: calc(12px + var(--ed-app-bottom-space));
}

html.ed-app-shell--android {
  --ed-native-tab-height: 68px;
  --ed-app-bottom-space: var(--ed-native-tab-height);
  --ed-app-fixed-bottom: calc(12px + var(--ed-app-bottom-space));
}

@media (min-width: 783px) {
  body.admin-bar {
    --admin-bar-height: 32px;
  }
}

/* EXACTLY two breakpoints only */
@media (min-width: 1024px) {
  :root {
    --header-height: 84px;
    --page-side-padding: 32px;
    --section-spacing: 52px;
  }
}

/* ---------------------------------
   WordPress admin bar
   Handle in one place only
--------------------------------- */

body.admin-bar {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

#wpadminbar {
  position: fixed !important;
  top: 0 !important;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 99999 !important;
  transform: none !important;
}

/* ---------------------------------
   Global page spacing under header
   This file handles spacing ONLY
--------------------------------- */

html {
  scroll-padding-top: calc(var(--admin-bar-height) + var(--header-height));
  margin-top: 0 !important;
  background: var(--ed-color-body-bg);
}

body {
  min-height: 100vh;
  background: var(--ed-color-body-bg);
}

.site-main {
  display: block;
  padding-top: calc(var(--admin-bar-height) + var(--header-height));
  background: var(--ed-color-body-bg);
}

.site-content {
  width: 100%;
  max-width: var(--page-max-width);
  margin-inline: auto;
  padding-inline: var(--page-side-padding);
}

.site-content {
  padding-top: var(--section-spacing);
  padding-bottom: var(--section-spacing);
  background: transparent;
}

@media (max-width: 760px) {
  html.ed-native-app-shell body {
    overscroll-behavior-y: none;
  }

  html.ed-native-app-shell body.ed-page-has-app-surface .site-main,
  html.ed-native-app-shell body.edx-has-explore-shortcode .site-main,
  html.ed-native-app-shell body.ed-member-page .site-main,
  html.ed-native-app-shell body.ed-style-hub-page .site-main,
  html.ed-native-app-shell body.w2d-business-signup-page .site-main {
    padding-bottom: var(--ed-app-bottom-space);
  }

  html.ed-native-app-shell body.ed-page-has-app-surface .entry-content,
  html.ed-native-app-shell body.edx-has-explore-shortcode .entry-content,
  html.ed-native-app-shell body.ed-member-page .entry-content,
  html.ed-native-app-shell body.ed-style-hub-page .entry-content,
  html.ed-native-app-shell body.w2d-business-signup-page .entry-content {
    padding-bottom: var(--ed-app-bottom-space);
  }
}

.entry-header,
.entry-content,
.no-results {
  margin-bottom: 20px;
}

.site-content article {
  max-width: 860px;
  background: transparent;
}

/* Shortcode apps provide their own canvas; the theme should not box them. */
body.ed-page-has-app-surface .site-content,
body.edx-has-explore-shortcode .site-content,
body.ed-member-page .site-content,
body.ed-style-hub-page .site-content,
body.w2d-business-signup-page .site-content {
  max-width: none;
  margin-inline: 0;
  padding-inline: 0;
  padding-top: 0;
  padding-bottom: 0;
}

body.ed-page-has-app-surface .site-content > article,
body.edx-has-explore-shortcode .site-content > article,
body.ed-member-page .site-content > article,
body.ed-style-hub-page .site-content > article,
body.w2d-business-signup-page .site-content > article {
  width: 100%;
  max-width: none;
  margin: 0;
}

body.ed-page-has-app-surface .entry-header,
body.edx-has-explore-shortcode .entry-header {
  display: none;
}

body.ed-page-has-app-surface .entry-content,
body.edx-has-explore-shortcode .entry-content,
body.ed-member-page .entry-content,
body.ed-style-hub-page .entry-content,
body.w2d-business-signup-page .entry-content {
  margin-bottom: 0;
  color: inherit;
}

/* Safety net for shortcode apps rendered through builders or cached content. */
body:has(.w2d-orgedit-wrap) .site-content {
  max-width: none;
  margin-inline: 0;
  padding-inline: 0;
  padding-top: 0;
  padding-bottom: 0;
}

body:has(.w2d-orgedit-wrap) .site-content > article {
  width: 100%;
  max-width: none;
  margin: 0;
}

body:has(.w2d-orgedit-wrap) .entry-header {
  display: none;
}

body:has(.w2d-orgedit-wrap) .entry-content {
  margin-bottom: 0;
  color: inherit;
}