:root {
  --checkoutHeaderHeight: 5.5em;
}
body #block-bot-custom5-content {
  overflow: visible;
}

/* unauth */
.checkout-page-header {
  height: var(--checkoutHeaderHeight);
  z-index: 999!important;
  

}
.path-checkout main[role="main"] {
  padding-left: 0!important;
  padding-right: 0!important;
}


.checkout-page #total-price {
  top: -999em;
}

.checkout-summary-wrapper {
  display: none;
}
.checkout-summary-wrapper.shown {
  display: block;
}

.checkout-page-summary {
  background: var(--bg-color-light-gray);
  .item-free {display: none;}
  .checkout-summary-main {
    position: sticky;
    top: 6em;
  }
}
.checkout-page-layout-wrapper:not(.summary-shown) .checkout-page-summary {
  display: block;
  position: sticky;
  top: 5.5em;
  .toggle-order-summary {
    position: relative;
    top: -.45em;

  }
  @media all and (max-width: 768px) {
     .toggle-order-summary {
      top: 0;
    }
    .cart-page-wrapper {
      padding-bottom: .5em;
    }
  }
}
.mobile-order-summary-wrapper {
  display: block;
}
@media all and (max-width: 768px){
  .checkout-page-summary {
    position: static;
    width: 100%;
    order: -1;
    padding: 0;
    height: auto;
    margin-bottom: 2em;

    .checkout-summary-main {
      position: static;
      top: 0;
      padding-left: 1em;
    }
    .mobile-order-summary-wrapper {
      display: block;
    }
  }
}

#block-bot-custom5-content, .footer-above-container {
  overflow-x: visible;
}

.checkout-page-layout-wrapper:not(.summary-shown) {
  .checkout-page-form, .checkout-page-summary {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .checkout-page-summary {
    order: -1;
  }

}

.checkout-helper {
  position: relative;
}
.checkout-helper-content {
  position: absolute;
  width: 100%;
  background: var(--bs-body-bg);
  padding: 1em;
  border: 1px solid #ddd;
  border-radius: 6px;
  top: .5em;
  left: 0;
  margin-top: 1em;
  z-index: 656;

}
.checkout-helper-header {
  margin: -1em;
  padding: 1em;
  background-color: var(--bg-color-light-gray);
  margin-bottom: .5em;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

.checkout-page {

  .donation-container, .payment-container {
    margin-top: 1em;
  }

  .donations-total-price.text-green {
    color: var(--green);
    }
  .step {
    h3 {
      color: var(--body-text);
      margin-top: .75em;
    }
  }

  #edit-finish {
    margin: 1em 0;
    color: var(--white);
  }

  .step.step-completed {
    h3 {
      color: var(--body-text);
      
    }
  }
  .js-form-item-contact-receive-communications {
    position: relative;
    top: -.5em;
  }

  .saved-address p {
    margin-bottom: 0;
  }

  .custom-donation-amount-display-wrapper {
    display: flex;
    align-items: center;
    gap: .5em;
  }

  .address-container-inline > .form-item {
    margin-right: 0;
  }


  .visually-hide {
    position: absolute;
    top: -999em;
  }

  .other-option-additional-markup {
    padding-left: 1.6em;
  }

  .step.completed h3 {
    color: var(--body-text);
     
  }

  #saved-payment-methods-options {
    label {
      display: block;
      padding: 1em;
      background-position: right 0.5em center;
      background-repeat: no-repeat;
      background-size: 3em;
      border: 1px solid #ddd;
      border-radius: 6px;
      margin-bottom: .5em;

      span {
        margin-left: .5em;
      }

      input {
        position: relative;
        top: 2px;
      }
    }
  }
}

#paypal-button-container {
  background-color: transparent;
  color-scheme: none;
  &:before {
    content: attr(data-label); 
    display:block; 
    text-align: center; 
    font-style: italic;
    margin-bottom: .5em; 
    color: var(--body-text);
  }
}

/* admin */
.gin--vertical-toolbar .checkout-page-header {
  left: var(--gin-offset-x);
  top: var(--gin-offset-y);
}
.gin--vertical-toolbar .checkout-page {
  /*margin-top: var(--gin-offset-y);*/
  margin-top: 0;
}
@media all and (min-width: 992px) {
  .gin--vertical-toolbar .checkout-page {
    margin-top: calc(var(--gin-offset-y) + 2em);
    margin-top: 0;
  }
}
.gin--vertical-toolbar .checkout-page-layout-wrapper:not(.summary-shown) {
  .checkout-page-summary {
    top: 8em;
  }
  @media all and (min-width: 976px) {
    .checkout-page-summary {
      top: 9.5em;
    }
  }
}

.gin--vertical-toolbar .checkout-page-summary {
  .checkout-summary-main {
    position: sticky;
    top: 9.5em;
  }
}

[data-drupal-messages] {
  display: none;
}