:root {
  --simple-banner-height: 0px;
}

.menu-centered {
	top: 110px;
}
header.main {
	top: var(--simple-banner-height)
}

body > main {
  padding-top: calc(220px + var(--simple-banner-height));
}

@media print, screen and (min-width: 46.25em) {
  body > main {
    padding-top: calc(270px + var(--simple-banner-height));
  }
}

.page-template-template-minimal-layout #sidebar, .page-template-template-minimal-layout .simple-banner, .page-template-template-minimal-layout header.main, .page-template-template-minimal-layout footer , .page-template-template-minimal-layout .sub-header, .page-template-template-minimal-layout header.main > .wrap #menu-main-menu, .page-template-template-minimal-layout .menu-centered, .page-template-template-minimal-layout #checkout, .page-template-template-minimal-layout #comment-bubble  {
	display: none;
}
body.page-template-template-minimal-layout > main {
	padding-top: 85px;
}
body.page-template-template-minimal-layout header.main {
	/* top: 86px; */
}
@media print,screen and (min-width: 46.25em) {
	.menu-centered {
		top: 110px;
	}
}

/* ISD-1823: Ensure mobile web modals are not hidden behind banner/menu */
/* NOTE: this is different from the following selector, it is used for dialog/confirm modals. There are two base elements used for modals: "general_modal" (which gets a frame_modal injected) and "frame_modal" */
#general_modal #frame_modal .active-frame .frame-container {
  /* adds 20px of breathing room */
  top: calc(90px + 20px + var(--simple-banner-height));
}

@media screen and (min-width: 46.25em) {
  #general_modal #frame_modal .active-frame .frame-container {
    /* original styles as per _general_modal.scss */
    top: 50%;
  }
}

/* ISD-1943: Ensure nutrition modal is properly aligned */
/* Adds 40px/20px of breathing room in mobile/desktop */
#frame_modal .active-frame .frame-container {
  top: calc(50px + var(--simple-banner-height) + 40px);
  height: calc(100% - 50px - var(--simple-banner-height) - 40px);
}

@media print, screen and (min-width: 46.25em) {
  #frame_modal .active-frame .frame-container {
    height: calc(90% - 120px - var(--simple-banner-height) - 20px);
    top: calc(120px + var(--simple-banner-height) + 20px);
  }
}

/* ISD-1832: COVID-19 banner is blocking error message cancel button */
#message_bar .message-bar-open {
  margin-top: var(--simple-banner-height)
}

/* ISD-1943: Ensure modal-right header and content are visible */
.react-modal-right .modal-right-content > header {
  top: calc(90px + var(--simple-banner-height));
}

.modal-right-content div.content {
  top: calc(140px + 46px);
  height: calc(100% - 140px - 46px);
}

@media print, screen and (min-width: 46.25em) {
  .react-modal-right .modal-right-content > header {
    top: calc(110px + var(--simple-banner-height));
  }

  .modal-right-content div.content {
    top: calc(210px + var(--simple-banner-height));
    max-height: calc(100% - 210px - var(--simple-banner-height));
  }
}

/* ISD-1943: Ensure product category header and content (products, order panel) are visible */
.react-modal-primary div.callout {
  top: calc(90px + var(--simple-banner-height));
}

.react-modal-primary ul.products,
.react-modal-primary.react-modal-secondary section.order-panel {
  height: calc(100% - 140px - var(--simple-banner-height));
  top: calc(140px + var(--simple-banner-height));
}

@media print, screen and (min-width: 46.25em) {
  .react-modal-primary div.callout {
    top: calc(110px + var(--simple-banner-height));
  }

  .react-modal-primary ul.products,
  .react-modal-primary.react-modal-secondary section.order-panel {
    top: calc(210px + var(--simple-banner-height));
    height: calc(100% - 210px - var(--simple-banner-height));
  }
}

/* ISD-1943: Ensure location picker is properly aligned */
.location-choice-panel {
  height: calc(100% - 90px - var(--simple-banner-height));
  top: calc(90px + var(--simple-banner-height));
}

@media print, screen and (min-width: 46.25em) {
  .location-choice-panel {
    height: calc(100% - 110px - var(--simple-banner-height));
    top: calc(110px + var(--simple-banner-height));
  }
}
