/* *******************************************************************
  ==== Summary ====
  - 1. IN CART
  - 1.2. CONTENT
  - 1.2.1. EMPTY
  - 1.2.2. PRODUCT IN CART
  - 1.2.2.1. FORM
  - 1.2.2.1.1 ARTICLE
  - 1.2.1.2.2. ACTIONS (COUPONS & UPDATE)
  - 2. CHECKOUT
  - 3. SUMMARY
  - 3.1. SUMMARY CARD
  - 4. SHIPPING
******************************************************************* */


/* ===================================================================
  1.2.1. EMPTY
=================================================================== */

/* ----- Global ----- */
.wg-woo-empty.wg-glass-box {
  width: 100%;
}

.wg-woo-empty .wg-btn {
  max-width: 200px;
  min-width: 120px;
}

.wg-glass-box-content .cart-empty.woocommerce-info,
.wg-glass-box-content .cart-empty {
  display: none;
}

/* ===================================================================
  1.2.2. PRODUCT IN CART
=================================================================== */

/* ----- Global ----- */
.wg-woo-product-in-cart {
  box-sizing: border-box;
  width: 100%;
}

/* ===================================================================
  1.2.2.1. FORM
=================================================================== */

/* ----- Global ----- */
.wg-woo-form.wg-form--product-in-cart {
}

/* ===================================================================
  1.2.2.1.1 ARTICLE
=================================================================== */
/* ---- Summary ----
  - Item
  - Item > Body
  - Item > Label & Value
  - Item > Group - Base
  - Item > Group - Row
  - Item > Group - Col
  - Item > Group - Mobile
  - Item > Group - Responsive
  - Item > Thumbnail
  - Item > Details
  - Item > Details > SKU
  - Item > Details > Name
  - Item > Details > Price
  - Item > Details > Attributes
  - Item > Details > Backorder
  - Item > Details > Quantity
  - Item > Details > Unit Prices
  - Item > Details > Subtotal
  - Item > Remove
*/

/* ----- Item ----- */
.wg-woo-article {
  background-color: #fff;
  box-sizing: border-box;
  margin: 12px 0;
  width: 100%;
}

.wg-woo-article:first-of-type {
  margin-top: 0;
}

.wg-woo-article:last-of-type {
  margin-bottom: 0;
}

/* ----- Item > Body ----- */
.wg-woo-article-body {
  display: flex;
  flex-direction: column;
  padding: 8px;
  width: 100%;
}

/* ----- Item > Label & Value ----- */
.wg-woo-article-label {
  color: #555;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.wg-woo-article-value {
  color: #222;
  font-weight: 500;
}

/* ----- Item > Group - Base ----- */
.wg-woo-article-group {
  display: flex;
  width: 100%;
}

/* ----- Item > Group - Row ----- */
.wg-woo-article-group.group--row {
  align-items: center;
  flex-direction: column;
}

/* ----- Item > Group - Col ----- */
.wg-woo-article-group.group--col {
  flex-direction: column;
}

/* ----- Item > Group - Mobile ----- */
.wg-woo-article-group.row--mobile,
.wg-woo-article-group.col--mobile {
  gap: 5px;
}

/* ----- Item > Group - Responsive ----- */
@media (min-width: 1200px) {
  .wg-woo-article-group.group--row {
    align-items: none;
    flex-direction: row;
  }

  .wg-woo-article-group.group--row.row--mobile {
    gap: 0;
  }

  .wg-woo-article-group.group--row.row--between {
    justify-content: space-between;
    padding: 0 10px;
  }
}

/* ----- Item > Thumbnail ----- */
.wg-woo-article-item-thumb {
  flex: 0 0 100px;
  height: 100px;
  overflow: hidden;
  width: 100px;
}

.wg-woo-article-item-thumb:hover {
  border: 2px solid #007bff !important;
  box-shadow: 0 4px 12px rgba(0, 123, 255, 0.4) !important;
  transform: scale(1.05);
}

.wg-woo-article-item-thumb > a {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    border 0.2s ease;
}

.wg-woo-article-item-thumb > img,
.wg-woo-article-item-thumb > a > img {
  display: block;
  height: 100%;
  width: 100%;
}

/* ----- Item > Details ----- */
.wg-woo-article-item-details {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 5px;
  width: 100%;
}

@media (min-width: 1200px) {
  .wg-woo-article-item-details {
    min-height: 100px;
  }
}

/* ----- Item > Details > SKU ----- */
.wg-woo-article-item-details-sku {
  font-size: 0.8rem;
  font-style: oblique;
  margin-bottom: 4px;
  text-align: center;
}

.wg-woo-article-item-details-sku > .wg-woo-article-value {
  display: inline !important;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  margin-top: 0 !important;
}

@media (min-width: 1200px) {
  .wg-woo-article-item-details-sku {
    text-align: left;
  }
}

/* ----- Item > Details > Name ----- */
.wg-woo-article-item-details-name {
}

.wg-title.wg-woo-article-name {
  color: #ff6f00;
  display: -webkit-box;
  font-size: 1rem !important;
  font-weight: 800;
  line-height: 1.2;
  margin: 6px 0 !important;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.wg-title.wg-woo-article-name:hover {
  color: #007bff;
}

.wg-woo-article-name > a {
  color: #ff6f00;
  text-decoration: none;
  text-transform: capitalize !important;
}

.wg-woo-article-name > a:hover {
  color: #007bff;
}

@media (min-width: 1200px) {
  .wg-title.wg-woo-article-name {
    text-align: left;
  }
}

/* ----- Item > Details > Price ----- */
.wg-woo-article-item-details-price {
  font-weight: 600;
  text-align: center;
}

.wg-woo-article-item-details-price .price {
  align-items: center;
  display: flex;
  justify-content: center;
}

.wg-woo-article-item-details-price .electron-price {
  color: #4caf50 !important;
  font-size: 1rem !important;
  text-transform: none !important;
}

.wg-woo-article-item-details-price .regular-price.price-is-on-sale {
  color: #66bb6a;
  font-size: 0.85rem;
  font-style: italic;
  margin-right: 10px;
  text-decoration: 2px line-through solid #e53935;
}

.wg-woo-article-item-details-price .sale-price {
  font-weight: 600;
}

@media (min-width: 1200px) {
  .wg-woo-article-item-details-price .price {
    justify-content: start;
  }
}

/* ----- Item > Details > Attributes ----- */
.wg-woo-article-item-details-attrs {
  display: flex;
  justify-content: center;
  margin: 5px 0;
}

.wg-woo-article-item-details-attr {
  align-items: center;
  display: flex;
  font-size: 0.9rem;
  gap: 10px;
  justify-content: center;
  margin-bottom: 6px;
  width: 100%;
}

.wg-woo-article-item-details-attr:last-of-type {
  margin-bottom: 0;
}

.wg-woo-article-item-details-attr > .wg-woo-article-label {
  min-width: 80px;
  text-transform: capitalize;
}

.wg-woo-article-item-details-attr > .wg-woo-article-value {
  background-color: #ff6f00;
  border: 1px solid #ff6f00;
  border-radius: 4px;
  color: #fff;
  display: inline-block;
  font-weight: 700;
  padding: 2px 6px;
}

@media (min-width: 1200px) {
  .wg-woo-article-item-details-attr {
    justify-content: start;
  }
}

/* ----- Item > Details > Backorder ----- */
.wg-woo-article-item-details-backorder {
  color: #e53935;
  font-style: oblique;
  font-weight: 600;
  text-align: center;
}

@media (min-width: 1200px) {
  .wg-woo-article-item-details-backorder {
    text-align: left;
  }
}

/* ----- Item > Details > Quantity ----- */
.wg-woo-article-item-quantity {
}

.wg-woo-article-quantity .quantity {
  border-color: #ff6f00 !important;
}

.wg-woo-article-quantity .quantity .qty {
  color: #000 !important;
}

.wg-woo-article-quantity .quantity-button.plus,
.wg-woo-article-quantity .quantity-button.minus {
  color: #ff6f00 !important;
}

.wg-woo-article-quantity .quantity-button.plus:hover,
.wg-woo-article-quantity .quantity-button.minus:hover {
  background-color: #ff6f00 !important;
  color: #fff !important;
}

/* ----- Item > Details > Unit Prices ----- */
.wg-woo-article-item-unit-price {
}

.wg-woo-article-unit-price {
  align-self: center;
  font-style: oblique;
  font-weight: 500;
}

/* ----- Item > Details > Subtotal ----- */
.wg-woo-article-item-subtotal {
}

.wg-woo-article-subtotal {
  align-self: center;
  color: #4caf50;
  font-weight: 600;
}

/* ----- Item > Remove ----- */
.wg-woo-article-item-remove {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: center;
  padding: 6px 0;
  width: 100%;
}

.wg-woo-article-remove {
  max-width: 20%;
}

@media (min-width: 1200px) {
  .wg-woo-article-item-remove {
    justify-content: flex-end;
  }
}

/* ===================================================================
  1.2.1.2.2. ACTIONS (COUPONS & UPDATE)
=================================================================== */

/* ----- Global ----- */
.wg-woo-product-in-cart-actions {
  width: 100%;
  background-color: #fff;
  margin: 10px 0;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.wg-woo-product-in-cart-actions.actions--mobile {
  flex-direction: column;
}

@media (min-width: 1200px) {
  .wg-woo-product-in-cart-actions.actions--mobile {
    flex-direction: row;
  }
}

/* ----- Coupons & Update ----- */
.wg-woo-product-in-cart-action .wg-btn {
  padding: 12px 14px !important;
}

/* ----- Coupons ----- */
.wg-woo-product-in-cart-actions input#coupon_code {
  background-color: #fff;
  border: 1px solid #ff6f00;
  border-radius: 6px;
  min-width: 200px;
  max-width: 50%;
  flex: 1;
  font-size: 0.9rem;
  padding: 12px 14px;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.wg-woo-product-in-cart-actions input#coupon_code:focus {
  border-color: #ff6f00 !important;
  box-shadow: 0 0 0 1px #ff6f00;
  outline: none;
}

/* ===================================================================
  2. CHECKOUT
=================================================================== */

/* ===================================================================
  3. SUMMARY
=================================================================== */

/* ----- Global ----- */
.wg-woo-summary {
  box-sizing: border-box;
  width: 100%;
}

/* ----- Global > Body ----- */
.wg-woo-summary-body {
}

/* ===================================================================
  1.2.2.1 SUMMARY CARD
=================================================================== */

/* ----- Item ----- */
.wg-woo-summary-card {
  background-color: #fff;
  box-sizing: border-box;
  margin: 12px 0;
  width: 100%;
}

.wg-woo-summary-card:first-of-type {
  margin-top: 0;
}

.wg-woo-summary-card:last-of-type {
  margin-bottom: 0;
}

/* ----- Item > Separator ----- */
.wg-woo-separator {
  border-bottom: 2px dotted #000;
}

/* ----- Item > Group - Base ----- */
.wg-woo-summary-card-group {
  display: flex;
  padding: 0 10px;
  width: 100%;
}

.wg-woo-summary-card-group > * {
  padding: 10px;
}

/* ----- Item > Group - Row ----- */
.wg-woo-summary-card-group.group--row {
  align-items: center;
  flex-direction: column;
}

/* ----- Item > Group - Col ----- */
.wg-woo-summary-card-group.group--col {
  flex-direction: column;
}

/* ----- Item > Group - Mobile ----- */
.wg-woo-summary-card-group.row--mobile,
.wg-woo-summary-card-group.col--mobile {
  gap: 5px;
}

/* ----- Item > Group - Responsive ----- */
@media (min-width: 1200px) {
  .wg-woo-summary-card-group.group--row {
    align-items: none;
    flex-direction: row;
  }

  .wg-woo-summary-card-group.group--row.row--mobile {
    gap: 0;
  }

  .wg-woo-summary-card-group.group--row.row--between {
    justify-content: space-between;
    padding: 0 10px;
  }
}

/* ----- Item > Label & Value ----- */
.wg-woo-summary-label {
  color: #555;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.wg-woo-summary-value {
  color: #222;
  font-weight: 500;
}

/* ----- Item > Amount ----- */
.wg-woo-summary-amount {
  display: flex;
  font-size: 1rem;
  justify-content: space-between;
  width: 100%;
}

.wg-woo-summary-amount > * {
  text-transform: none;
}

/* ----- Item > Shipping ----- */
.wg-woo-summary-shipping {
  box-sizing: border-box;
  width: 100%;
}

/* ----- Item > Coupon ----- */
.wg-woo-summary-coupon,
.wg-woo-summary-coupon-main {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.wg-woo-summary-coupon-form {
  display: flex;
  gap: 10px;
  margin: 10px 0;
}

/* ----- Item > Coupon > Input ----- */
.wg-woo-summary-coupon-form input#coupon_code {
  background-color: #fff;
  border: 1px solid #ff6f00;
  border-radius: 6px;
  flex: 1;
  font-size: 0.9rem;
  padding: 12px 14px;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.wg-woo-summary-coupon-form input#coupon_code:focus {
  border-color: #ff6f00 !important;
  box-shadow: 0 0 0 1px #ff6f00;
  outline: none;
}

/* ----- Item > Coupon > Message ----- */
.wg-woo-summary-coupon-message .woocommerce-info,
.wg-woo-summary-coupon-message .woocommerce-message,
.wg-woo-summary-coupon-message .woocommerce-error {
  margin-top: 12px;
  position: relative;
}

.wg-woo-summary-coupon-message .woocommerce-info,
.wg-woo-summary-coupon-message .woocommerce-message,
.wg-woo-summary-coupon-message .woocommerce-error {
  border-radius: 6px;
  font-size: 14px;
  line-height: 1.4;
  padding: 12px 14px;
  position: relative;
}

/* ----- Item > Coupon > List ----- */
.wg-woo-summary-coupon-content {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.wg-woo-summary-coupon-list {
  box-sizing: border-box;
  margin-top: 10px;
  width: 100%;
}

/* ----- Item > Coupon > List > Coupon ----- */
.wg-woo-summary-coupon-used {
  align-items: center;
  border: 2px dashed #ff6f00;
  display: flex;
  font-size: 0.8rem;
  justify-content: space-between;
  margin: 5px 0;
  padding: 5px;
}

.wg-woo-summary-coupon-used:last-of-type {
  margin-bottom: 0;
}

.wg-woo-summary-coupon-used-code,
.wg-woo-summary-coupon-used-value {
  font-style: italic;
}

.wg-woo-summary-coupon-used-code {
  font-weight: 600;
}

/* ----- Item > Totals ----- */
.wg-woo-summary-totals {
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 100%;
}

.wg-woo-summary-totals-ttc,
.wg-woo-summary-totals-tax {
  display: flex;
  justify-content: space-between;
}

.wg-woo-summary-totals-ttc > * {
  font-size: 1rem;
  font-weight: 700;
}

.wg-woo-summary-totals-ttc > *,
.wg-woo-summary-totals-tax > * {
  text-transform: none;
}

.wg-woo-summary-totals-ttc > .wg-woo-summary-value {
  color: #4caf50;
}

.wg-woo-summary-totals-tax {
  padding: 0 20px;
}

/* ----- Item > Go to Checkout ----- */
.wg-woo-summary-go-checkout {
  display: flex;
  align-items: center;
  padding: 5px 10px;
}


.wg-woo-summary-go-checkout .wg-btn{
  padding: 12px 14px !important;
  width: 100% !important;
  text-align: center !important;
}