//
// Woocommerce
//
.woocommerce #content div.product .woocommerce-tabs ul.tabs {
  padding: 0;
  margin: 0;
  overflow: inherit;
  &::before,
  &::after {
      display:none;
  }
  li {
    border: none;
    background-color: transparent;
    @extend %tabs-li;
    a {
      @extend .nav-link;
      font-size: 1.2em;
      display: block;
      font-weight: normal;
    }
    &.active a::before {
        @include transform(scale(1));
        @extend %skin-dark-background-color;
    }
    &::before,
    &::after {
      display:none;
    }
  }
}
.woocommerce {
  @include media-breakpoint-down( sm ) {
    &-cart-form {
      // coupon button
      .coupon button[type=submit] {
        font-size: 12px;
        padding-top: 10px;
        padding-bottom: 10px;
      }
    }
  }
  .woocommerce-products-header .page-title {
    @extend .entry-title;
    @extend %content-header-entry-title;
  }
  a.remove {
    margin-left: auto;
    margin-right: auto;
  }

  //buttons
  button.button[type=submit],
  #respond input#submit,
  input#submit,
  input.button,
  a.button,
  .button.add_to_cart_button,
  input#submit.alt.disabled,
  input.button.alt.disabled,
  button.button.alt.disabled,
  a.button.alt.disabled,
  input#submit.alt,
  input.button.alt,
  a.button.alt,
  button.button.alt {
    @extend %btn_base;
  }

  button.button[type=submit],
  #respond input#submit,
  input#submit,
  input.button,
  a.button,
  .button.add_to_cart_button {
    @extend .btn-skin;
  }

  #ship-to-different-address label {
    font: inherit;
    margin: 0;
    letter-spacing: inherit;
    color: inherit;
  }
  #ship-to-different-address-checkbox {
    margin: -3px 0 0;
  }

  input#submit[class*=alt],
  input.button[class*=alt],
  a.button[class*=alt],
  button.button[class*=alt] {
    @extend .btn-skin-dark;
  }

  input#submit.alt.disabled,
  input.button.alt.disabled,
  button.button.alt.disabled,
  a.button.alt.disabled {
    @extend .btn-skin-dark;
  }

  //fix circular on sale labels over woocommerce thumbs
  span.onsale {
    @include box-sizing( content-box );
  }

  //messages
  .woocommerce-message,
  .woocommerce-error-list,
  .woocommerce-info {
      border-width: 2px;
      border-style: solid;
      padding: $base-line-height 0 1em;
      color: $black;
      font-family: $serviceFont;
      @extend .small;
      @extend .thick;
      @extend .letter-spacing-2;
      border-left: 0;
      border-right: 0;
      border-top: 0;
      position: relative;
      background: none;

      &::before {
        content: none;
      }

  }

  //form
  form {
    .form-row-wide {
      width: 100%;
    }
    // select width set to 100% (see https://github.com/presscustomizr/customizr/issues/1636)
    // breaks a little bit the variation selects alignment.
    // The WooCommerce CSS, in fact, sets only the min and the max widths
    .variations select {
      width: auto;
    }
    .form-row {
      margin: 0 0 $base-line-height;
      .input-checkbox {
          display: inline-block;
          margin: -2px 0 0;
      }
    }
    &.checkout_coupon .form-row {
      margin: 0;
    }

    @at-root #add_payment_method #payment input:not([type=submit]),
    .woocommerce-cart #payment input:not([type=submit]),
    .woocommerce-checkout #payment input:not([type=submit]) {
      border-color: $grey;
    }

    #customer_details {
      margin: 0 -15px;
      width: auto;
      h3 {
        margin-bottom: $base-line-height;
      }
    }

    @at-root .woocommerce div.product form.cart .variations {
      td,
      th {
        vertical-align: middle;
      }

      label {
        margin-bottom: 0
      }
    }
  }

  fieldset {
    margin-top: 2*$base-line-height;
  }

  section.up-sells,
  section.related {
    clear: both;
  }

  //cols conflicting with bootstrap
  @at-root .woocommerce #content [class*=col],
            #content .woocommerce [class*=col] {
    max-width: none;
  }

  //fix flex gallery item displaying numbers before
  @at-root .woocommerce-product-gallery ol li:before {
    content: none;
  }
}
.select2-hidden-accessible {
  min-width: 0;
}

//woocommerce forms can use themeform style
// .variations_form.cart,
// .woocommerce-checkout {
//   @extend .themeform
// }


//table
#add_payment_method .cart-collaterals .cart_totals table,
.woocommerce-cart .cart-collaterals .cart_totals table,
.woocommerce-checkout .cart-collaterals .cart_totals table,
.woocommerce table.shop_table {
    @extend %table-base;
    @extend %table-style;
}

//make woocommerce single product tabs appear like singular wp the content
//e.g. for lists, see #
.woocommerce-Tabs-panel.entry-content,
.woocommerce-product-details__short-description {
  @extend .czr-wp-the-content;
}
//the above should not be applied to the commentlist in the review tab
.woocommerce-Tabs-panel.entry-content .commentlist {
  padding: 0;
}

// WooCart
.nav__woocart {
  position: relative;
  .product_list_widget {
    min-height: 3em;
    max-height: 30vh;
    overflow-y: auto;
    .mCustomScrollBox {
      min-height: inherit;
    }
  }
  ul li {
    display: block !important;
    width: 100%;
    padding: $base-line-height/2 !important;
    margin-left: 0 !important;
    white-space: normal;
    position: relative;
    &::before {
      content: none !important;
    }
  }
  .widget_shopping_cart {
    min-width: 320px;
    max-width: 50vw;
    li,
    p.buttons,
    p.total {
      padding: 1em $base-line-height;

    }
    li a {
      padding: 0;
      margin: 0;
      white-space: normal;
      display: block !important;
      &::before {
        content: none !important;
      }
    }

    p.buttons,
    p.total {
      margin: 0 $base-line-height/2;
      text-align: center;
      .button {
        display: block !important;
        padding: 1em 15px;
         &:nth-child(odd) {
            margin-bottom: .6180469716em;
        }
      }
    }
    .product_list_widget li a.remove {
      position: relative;
      float: left;
      top: auto;
      display: block;
      line-height: 1.15;
      left: -.25em;
      z-index: 9;
    }
    .product_list_widget img {
      margin-left: 1em;
      float: right;
    }
  }
}
.widget_shopping_cart dl,
.woocommerce-cart-form dl{
  @extend %dl_reset;
}

//wpcf7 forms can use themeform style
.wpcf7-form {
  @extend .themeform;
}

//force fpu background to white if fpu bg set to default color
//TODO: change default color for czr4 in FPU
.fpc-container[data-bgcolor="#fafafa"] {
  background-color: #fff !important;
  .fpc-widget-front .czr-link-mask {
    border-color: #fff !important;
  }
}
//when in #content reset fpc-containet padding and tune margin-bottom for a better alignment
#content[class*=col-] > .fpc-container {
  padding: 0;
  margin-bottom: 3em;
}
//learndash ol li fix:
//remove ol li counter items
.czr-wp-the-content .learndash ol li::before {
    display: none;
}

//
// Nimble Builder
// Reduce the default spacing for Customizr custom locations
//
.is-customizing .sektion-wrapper[data-sek-id="__before_main_wrapper"] {
  min-height: inherit;
  margin-top: 0;
}
.is-customizing .sektion-wrapper[data-sek-id="__after_header"] {
  min-height: 20px;
  margin-top: 10px;
}
.is-customizing .sektion-wrapper[data-sek-id="__after_header"] .sek-empty-location-placeholder, .is-customizing .sektion-wrapper[data-sek-id="__before_main_wrapper"] .sek-empty-location-placeholder {
  min-height:inherit;
  margin: 0;
}
// fix for https://github.com/presscustomizr/nimble-builder/issues/186
.sek-dragging .sektion-wrapper[data-sek-id="__after_header"] {
    z-index: 1000;
    position: relative;
}
//
// BuddyPress
//
.buddypress-wrap .select-wrap select {
  display: inline-block;
}
//event tickets
.czr-wp-the-content .tribe-rsvp-list {
  list-style: none;
  padding: 0;
}
.czr-wp-the-content .tribe-rsvp-list > .tribe-item {
  overflow: auto;
}