/* DO NOT CHANGE THIS FILE - Override in styles.css if necessary */
/*
 * Overrides for Commerce
 */
/* Top Header Cart Icon */
#page-wrap.header-top-used {
  /* Set value if #block-useraccountmenu exists + 5px to accomodate additional height of commerce icon */
  --d-user-account-menu-height: calc((var(--d-user-account-menu-padding-tb) * 2) + var(--d-user-account-menu-font-size) + 5px);
}
.cart-block--summary__icon,
.cart-block--summary__count {
  display: inline-block;
}
.cart-block--summary__icon {
  vertical-align: middle;
  margin-right: 0.25rem;
}
.cart-block--summary__count,
a.cart-block--link__expand {
  font-size: var(--d-user-account-menu-font-size);
  font-weight: var(--d-font-weight);
  line-height: 1 !important;
  padding: 0;
  margin: 0;
  display: inline-block;
  vertical-align: middle;
}
/* Cart button when no items in cart */
a.cart-block--link__expand {
  background: transparent;
  padding: var(--d-user-account-menu-padding-tb) 1.5rem var(--d-user-account-menu-padding-tb) 0;
  color: var(--d-user-account-menu-color);
  text-decoration: none;
}
a.cart-block--link__expand .cart-block--summary__icon {
  fill: var(--d-user-account-menu-color);
  line-height: 0;
}
a.cart-block--link__expand .cart-block--summary__icon:hover,
a.cart-block--link__expand .cart-block--summary__icon:focus-visible {
  fill: var(--d-user-account-menu-color-hover);
}
a.cart-block--link__expand:before {
  content: '|';
  width: 1rem;
  display: inline-block;
}
/* Cart button when there are items in the cart ('items-in-cart' class added by designit.theme file) */
.items-in-cart a.cart-block--link__expand {
  background-color: var(--d-button-bg);
  color: var(--d-button-color);
  padding-left: 1.2rem;
  margin-left: 0.5rem
}
.items-in-cart a.cart-block--link__expand:hover,
.items-in-cart a.cart-block--link__expand:focus-visible {
  background-color: var(--d-button-bg-hover);
  color: var(--d-button-color-hover);
}
.items-in-cart a.cart-block--link__expand .cart-block--summary__icon {
  fill: var(--d-button-color);
}
.items-in-cart a.cart-block--link__expand .cart-block--summary__icon:hover,
.items-in-cart a.cart-block--link__expand .cart-block--summary__icon:focus-visible{
  fill: var(--d-button-color-hover);
}
.items-in-cart a.cart-block--link__expand:before {
  content: '';
  width: 0;
}
/* Dropdown cart summary box */
.cart-block--contents {
  width: 100% !important;
  right: 0;
  box-shadow: 0 0 3px 3px rgba(0,0,0,0.08);
  top: 5rem;
  z-index: 500;
}
.cart-block--contents__items {
  overflow-y: auto !important;
  max-height: 35rem !important;
}
.cart-block--contents__links {
  margin-top: 1rem;
}
/* Dropdown cart summary box and the cart page */
.view-commerce-cart-block td,
.view-commerce-cart-form:not(.checkout-pane-order-summary) td {
  vertical-align: middle;
}
.view-commerce-cart-block .views-field-total-price__number,
.view-commerce-cart-form .views-field-unit-price__number,
.view-commerce-cart-form .views-field-total-price__number,
.view-commerce-cart-form .order-total-line__subtotal,
.view-commerce-cart-form .order-total-line__total,
.view-commerce-cart-form .order-total-line__adjustment,
.view-commerce-cart-form .form-actions,
.order-information {
  text-align: right;
}
.order-total-line {
  padding: 0 10px;
}
.view-commerce-cart-form .order-total-line__subtotal span,
.view-commerce-cart-form .order-total-line__total span,
.view-commerce-checkout-order-summary .order-total-line span,
.view-commerce-cart-form .order-total-line__adjustment span {
  margin-left: 1rem;
  width: auto;
}
.view-commerce-cart-form .order-total-line__total span,
.view-commerce-checkout-order-summary .order-total-line__total span {
  font-size:var(--d-font-size);
  color:var(--d-color);
  line-height:var(--d-line-height);
  font-family: var(--d-font-family);
  font-weight: calc(var(--d-font-weight) + 200);
}
.view-commerce-cart-form .form-actions input.form-submit {
  margin-right: 0;
  margin-left: var(--d-space-m);
  margin-top: var(--d-space-l);
}
/* Checkout pages */
.checkout-pane legend,
.layout-region-checkout-secondary h3 {
  text-transform: capitalize;
}
.path-checkout fieldset legend {
  padding-top: var(--d-margin-bottom);
}
/*.path-checkout .form-item {
  padding-bottom: 1rem !important;
}*/
/* Reset two column width from Commerce - use my widths below instead */
.layout-region-checkout-main,
.layout-region-checkout-footer {
  float: none !important;
  width: 100% !important;
  padding-right: 0 !important;
}
.layout-region.layout-region-checkout-secondary {
  background-color: var(--color-very-light-grey);
  padding: var(--d-margin-bottom);
  margin-bottom:  var(--d-margin-bottom);
}
/* Commerce login */
#edit-login-returning-customer-submit.form-submit,
#edit-login-register-register.form-submit {
  margin-top: var(--d-margin-bottom);
  margin-right: 1rem;
}
#edit-login-returning-customer-forgot-password {
  margin-top: calc(var(--d-margin-bottom) - 2px);
  vertical-align: middle;
}
#edit-login.checkout-pane-login,
.confirm-parent,
.password-parent {
  overflow: visible;
}
.confirm-parent,
.password-parent {
  max-width: 100%;
}
fieldset.form-wrapper__returning-customer.form-wrapper__login-option,
fieldset.form-wrapper__guest-checkout.form-wrapper__login-option {
  padding-left: 0;
  padding-right: 0;
}
/* Commerce Checkout form */
.view-commerce-cart-form .delete-order-item {
  background-image: url(../../images/icons/bin.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 2rem;
  width: 4.5rem;
  height: 4.5rem;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}
.view-commerce-cart-form .delete-order-item:not(:hover):not(:focus-visible) {
  background-color: transparent !important;
}
.view-commerce-cart-form:not(.checkout-pane-order-summary) tr {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: stretch;
  align-items: center;
  border-bottom: 1px solid var(--d-color-td-border);
}
.view-commerce-cart-form:not(.checkout-pane-order-summary) tbody tr {
  padding: 1rem 0;
}
.view-commerce-cart-form:not(.checkout-pane-order-summary) th,
.view-commerce-cart-form:not(.checkout-pane-order-summary) td {
  flex: 0 1 25%;
  align-self: auto;
  flex-basis: calc(25% - (var(--d-space-s) * 2));
  max-width: calc(25% - (var(--d-space-s) * 2));
  border: none !important;
}
.view-commerce-cart-form.order-details:not(.checkout-pane-order-summary) th,
.view-commerce-cart-form.order-details:not(.checkout-pane-order-summary) td {
  flex: 0 1 33%;
  align-self: auto;
  flex-basis: calc(33.33% - (var(--d-space-s) * 2));
  max-width: calc(33.33% - (var(--d-space-s) * 2));
  border: none !important;
}
.view-commerce-cart-form:not(.checkout-pane-order-summary) th.views-field-purchased-entity,
.view-commerce-cart-form:not(.checkout-pane-order-summary) td.views-field-purchased-entity,
.view-commerce-cart-form:not(.checkout-pane-order-summary) th.views-field-title,
.view-commerce-cart-form:not(.checkout-pane-order-summary) td.views-field-title {
  flex: 0 1 100;
  align-self: auto;
  flex-basis: 100%;
  max-width: 100%;
  border: none !important;
  font-weight: calc(var(--d-font-weight) + 200);
}
.view-commerce-cart-form:not(.checkout-pane-order-summary) th.views-field-purchased-entity,
.view-commerce-cart-form:not(.checkout-pane-order-summary) th.views-field-title {
  display: none;
}
.view-commerce-cart-form:not(.checkout-pane-order-summary) .views-field-edit-quantity,
.view-commerce-cart-form:not(.checkout-pane-order-summary) .views-field-remove-button {
  text-align: center;
}
.view-commerce-cart-form:not(.checkout-pane-order-summary) td.views-field-purchased-entity div {
  display: inline-block;
}
.view-commerce-cart-form:not(.checkout-pane-order-summary) td.views-field-purchased-entity div .field__item {
  font-size: 120%;
  font-weight: calc(var(--d-font-weight) + 200);
}
.view-commerce-cart-form:not(.checkout-pane-order-summary) .views-field-unit-price__number {
  text-align: left;
}
/* Reset table scroll */
.view-commerce-cart-block table,
.view-commerce-cart-form table,
.checkout-pane-order-summary table {
  overflow: auto;
  display: table;
}
.view-commerce-cart-block table:before,
.view-commerce-cart-form table:before,
.checkout-pane-order-summary table:before {
  content: '';
  margin-top: 0;
}
.cart--cart-block .cart-block--contents a {
  color: var(--d-button-color) !important; /* resets from Commerce */
}
/* Message - Your Cart button */
.messages__content a[href^="/cart"] {
  line-height: normal !important;
  padding: var(--d-button-padding-tb) var(--d-button-padding-lr) var(--d-button-padding-tb) calc(var(--d-button-padding-lr) + var(--d-margin-bottom));
  font-weight: calc(var(--d-font-weight) + 200);
  text-shadow: none;
  border-radius: var(--d-button-border-radius);
  cursor: pointer;
  text-decoration: none !important;
  display: inline-block;
  margin: 0;
  background-color: #42a877;
  border-color: #42a877;
  color: var(--color-white);
  margin-top: 1rem;
  background-image: url(../images/icons/cart-icon-white.svg);
  background-size: var(--d-margin-bottom);
  background-repeat: no-repeat;
  text-transform: capitalize;
  background-position-y: center;
  background-position-x: var(--d-margin-bottom);
  margin-left: 1rem;
}
.messages__content a[href^="/cart"]:hover,
.messages__content a[href^="/cart"]:focus-visible {
  background-color: #1d7d48;
  border-color: #1d7d48;
}
/* Colour lists and other rendered attribute */
.product--rendered-attribute .form-item {
  margin: 0 0.5rem 0 0;
}
.product--rendered-attribute .form-item label {
  margin: 0;
}
/* Stripe */
.stripe-form {
  padding-bottom: var(--d-margin-bottom);
}
.given-name {
  margin-right: 4px;
}
p.address {
  margin-top: 0 !important;
}

/* ------------------------------------- RESPONSIVE ADJUSTMENTS ------------------------------------- */
@media all and (min-width: 768px), print {
  /* TABLET - Non-Retina - (768px–1024px) */
  fieldset.form-wrapper__returning-customer.form-wrapper__login-option {
    float: left;
    width: 48%;
    display: block
  }
  fieldset.form-wrapper__guest-checkout.form-wrapper__login-option {
    float: right;
    width: 48%;
    display:block
  }
  .layout-checkout-form .layout-region-checkout-main {
    float: left !important;
    width: calc((100% - var(--inner-padding-lr)) * 0.6666) !important;
    display: block;
  }
  .layout-checkout-form .layout-region-checkout-secondary {
    float: right !important;
    width: calc((100% - var(--inner-padding-lr)) * 0.3333) !important;
    display: block;
  }
  .layout-checkout-form .layout-region-checkout-footer {
    clear: both !important;
  }
  /* Dropdown cart summary box */
  .cart-block--contents {
    width: 35rem !important;
  }
  /* Commerce Checkout form */
  .view-commerce-cart-form:not(.checkout-pane-order-summary) th,
  .view-commerce-cart-form:not(.checkout-pane-order-summary) td,
  .view-commerce-cart-form.order-details:not(.checkout-pane-order-summary) th,
  .view-commerce-cart-form.order-details:not(.checkout-pane-order-summary) td {
    flex: 0 1 16.5%;
    align-self: auto;
    flex-basis: calc(16.5% - (var(--d-space-s) * 2));
    max-width: calc(16.5% - (var(--d-space-s) * 2));
    border: none !important;
  }
  .view-commerce-cart-form:not(.checkout-pane-order-summary) th.views-field-purchased-entity,
  .view-commerce-cart-form:not(.checkout-pane-order-summary) td.views-field-purchased-entity,
  .view-commerce-cart-form.order-details:not(.checkout-pane-order-summary) th.views-field-title,
  .view-commerce-cart-form.order-details:not(.checkout-pane-order-summary) td.views-field-title {
    flex: 0 1 34%;
    align-self: auto;
    flex-basis: calc(34% - (var(--d-space-s) * 2));
    max-width: calc(34% - (var(--d-space-s) * 2));
    border: none !important;
    display: block;
  }
  .view-commerce-cart-form.order-details:not(.checkout-pane-order-summary) th.views-field-title,
  .view-commerce-cart-form.order-details:not(.checkout-pane-order-summary) td.views-field-title {
    flex: 0 1 50.5%;
    flex-basis: calc(50.5% - (var(--d-space-s) * 2));
    max-width: calc(50.5% - (var(--d-space-s) * 2));
  }

}
@media all and (min-width: 1025px), print {
  #page-wrap.header-top-used {
    /* #block-useraccountmenu doesn't add any additional vertial height to #header-wrap on desktop */
    --d-user-account-menu-height: 0rem;
  }
  /* Commerce Checkout form */
  .view-commerce-cart-form tr {
    display: table-row;
  }
  .view-commerce-cart-form th.views-field-purchased-entity {
    display: table-cell;
  }

}