/* ============================================================
   10-woocommerce.css
   WooCommerce-specific styling: cart, checkout, mini-cart,
   shipping methods, reviews, loading overlay.
   ============================================================ */

/* ------------------------------------------------------------
   Cart table
   ------------------------------------------------------------ */
table.cart {
  & td {
    padding: var(--dm-space-2xs);
  }

  & td.actions {
    padding-block: var(--dm-space-xl);
  }

  & .product-name a {
    transition: color var(--dm-transition-m);
  }

  & .variation {
    font-family: "Code", monospace;
    font-weight: 400;
    font-size: var(--text-s);
    line-height: var(--line-height-s);
    color: var(--dm-muted);
  }

  & a.remove {
    color: var(--dm-danger);
    transition: color var(--dm-transition-m);

    &:hover {
      color: var(--dm-danger-l-1);
    }
  }
}

/* Shipping totals row label alignment */
table.shop_table_responsive tr.woocommerce-shipping-totals th {
  vertical-align: top;
  padding-top: var(--dm-space-2xs);
}

/* ------------------------------------------------------------
   Mini cart (header trigger + offcanvas)
   ------------------------------------------------------------ */

/* Header trigger icon */
.brxe-woocommerce-mini-cart .cart-icon {
  color: var(--dm-accent);
  transition: color var(--dm-transition-m);

  &:hover {
    color: var(--dm-primary);
  }
}

/* Offcanvas close button */
.brxe-woocommerce-mini-cart .bricks-mini-cart-close {
  color: var(--dm-dark);
  transition: color var(--dm-transition-m)after-white-space;

  &:hover {
    color: var(--dm-primary);
  }
}

/* Per-item remove button inside mini cart */
.brxe-woocommerce-mini-cart .remove {
  font-size: var(--text-l);
  color: var(--dm-danger);
  opacity: 1;
  transition: color var(--dm-transition-m);

  &:hover {
    color: var(--dm-danger-l-1);
  }
}

/* ------------------------------------------------------------
   Shipping methods list
   ------------------------------------------------------------ */
.woocommerce-shipping-methods {
  list-style: none;
  padding: 0;
  margin: 0;

  & li {
    margin-bottom: var(--dm-space-2xs);
  }
}

/* ------------------------------------------------------------
   Checkout — order review
   ------------------------------------------------------------ */
#order_review {
  & td dl.variation {
    color: var(--dm-muted);
  }

  & .woocommerce-Price-amount {
    color: var(--dm-primary);
  }

  & tfoot {
    font-family: "Code", monospace;
    text-transform: inherit;
  }
}

/* Order Notes */
#order_comments_field label {
  font-family: "Code", monospace;
  color: var(--dm-muted);
}

/* Checkout discount code banner */
form.woocommerce-form-coupon  {
	background-color: inherit;
	border-bottom: var(--dm-border-m) solid var(--dm-border);
	padding-bottom: var(--dm-space-xl);
	display: flex;
	flex-direction: row;
	
	& button {
		height: 100%;
		font-family: "Heading", sans-serif;
		font-size: var(--text-m);
		text-transform: uppercase;
		letter-spacing: var(--dm-letter-space-m);
	}
}

/* Proceed to checkout button */
div.wc-proceed-to-checkout a.checkout-button {
  margin-bottom: var(--dm-space-l);
  padding: 0.2rem;
}

/* ------------------------------------------------------------
   Product reviews
   ------------------------------------------------------------ */
.brxe-product-reviews {
  & .required {
    color: var(--dm-danger);
    opacity: 1;
  }

  /* Submit button — uses Header font instead of body Code font */
  & .form-submit input[type="submit"] {
    background-color: var(--dm-primary);
    color: var(--dm-dark-l-1);
    border: none;
    padding: var(--dm-space-3xs) var(--dm-space-xl);
    font-family: "Header", sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color var(--dm-transition-m);

    &:hover {
      background-color: var(--dm-primary-l-1);
    }
  }

  /* Review textarea overrides body font (inherits other styles
     from the universal textarea rule in 04-form-inputs.css) */
  & textarea#comment {
    font-family: inherit;
    padding: var(--dm-space-s);
  }
}

/* ------------------------------------------------------------
   blockUI loading overlay
   !important is required because blockUI uses inline styles
   that only !important can override.
   ------------------------------------------------------------ */
.blockUI.blockOverlay {
  background-color: var(--dm-light-t-1) !important;
  background-image: none !important;
  opacity: 0.7 !important;
  border: none !important;
  cursor: wait !important;
}

/* Custom spinner replaces WooCommerce's default loading icon */
.blockUI.blockOverlay::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 32px;
  height: 32px;
  margin: -16px 0 0 -16px;
  border: 3px solid var(--dm-border);
  border-top-color: var(--dm-primary);
  border-radius: 50%;
  animation: dm-spin 0.8s linear infinite;
}

@keyframes dm-spin {
  to {
    transform: rotate(360deg);
  }
}