/***********************
 * Inline Cart styles  *
 ***********************/
.inline-cart-wrapper { width: 100%; }

.ic-inline { display:flex; align-items:center; gap:12px; }

.ic-inline .ic-price { font-weight:600; }

.ic-variations { display:flex; align-items:center; gap:8px; }
.ic-variations .ic-attr { display:flex; align-items:center; gap:6px; }
.ic-variations .ic-attr-options { display:flex; gap:6px; flex-wrap:wrap; }

/* variant buttons - base styles only, allow Elementor to override */
.ic-variations .ic-var { 
  background: #f5f5f5; 
  border: 1px solid #ddd; 
  border-radius: 8px; 
  padding: 8px 12px; 
  cursor: pointer; 
  transition: transform .12s ease, background-color .12s ease, color .12s ease, border-color .12s ease, box-shadow .12s ease; 
}
.ic-variations .ic-var:hover { transform: translateY(-1px); }
/* Active state with !important to ensure it works */
.ic-variations .ic-var.active { 
  background: #0086FF !important; 
  color: #fff !important; 
  border-color: #0086FF !important; 
  box-shadow: 0 0 0 3px rgba(0,134,255,.24) !important; 
  outline: none !important; 
}
.ic-variations .ic-var:focus-visible { outline: 2px solid #0086FF; outline-offset: 1px; }

/* keep price appearance stable on updates - force inheritance from parent */
.inline-cart-wrapper .ic-price { 
  font-weight: 600; 
}

/* Force WooCommerce price elements to inherit from .ic-price parent */
.inline-cart-wrapper .ic-price *,
.inline-cart-wrapper .ic-price .amount,
.inline-cart-wrapper .ic-price del,
.inline-cart-wrapper .ic-price ins,
.inline-cart-wrapper .ic-price .woocommerce-Price-amount,
.inline-cart-wrapper .ic-price .price { 
  color: inherit !important;
  font-size: inherit !important; 
  line-height: inherit !important; 
  font-family: inherit !important;
  font-weight: inherit !important;
  text-decoration: inherit !important;
}

/* Ensure Elementor controls have higher specificity */
.elementor-widget-inline-cart .ic-price,
.elementor-widget-inline-cart .ic-price *,
.elementor-widget-inline-cart .ic-price .amount,
.elementor-widget-inline-cart .ic-price .woocommerce-Price-amount {
  /* This will be overridden by Elementor's generated CSS which has higher specificity */
}

/* quantity input */
.inline-cart-wrapper .ic-quantity { display: flex; align-items: center; }
.inline-cart-wrapper .ic-quantity input[type="number"] { 
  width: 80px; 
  padding: 8px 12px; 
  border: 1px solid #ddd; 
  border-radius: 4px; 
  text-align: center; 
  font-size: 14px;
  transition: border-color 0.3s ease;
}
.inline-cart-wrapper .ic-quantity input[type="number"]:focus { 
  outline: none; 
  border-color: #0086FF; 
  box-shadow: 0 0 0 2px rgba(0,134,255,.2);
}

/* add to cart button */
.inline-cart-wrapper .ic-add-to-cart { display:inline-flex; align-items:center; justify-content:center; transition: all 0.3s ease; }
.inline-cart-wrapper .ic-add-to-cart:disabled,
.inline-cart-wrapper .ic-add-to-cart[disabled] { opacity:.6; cursor:not-allowed; filter: grayscale(20%); }
.inline-cart-wrapper .ic-add-to-cart.is-loading { 
  opacity: 0.7; 
  position: relative;
}
.inline-cart-wrapper .ic-add-to-cart.is-loading::after {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  margin: auto;
  border: 2px solid transparent;
  border-top-color: currentColor;
  border-radius: 50%;
  animation: ic-spin 1s linear infinite;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
}

@keyframes ic-spin {
  0% { transform: translateY(-50%) rotate(0deg); }
  100% { transform: translateY(-50%) rotate(360deg); }
}
.inline-cart-wrapper .ic-add-to-cart.success { background-color: #28a745 !important; color: #fff !important; }
.inline-cart-wrapper .ic-add-to-cart.error { background-color: #dc3545 !important; color: #fff !important; }
.inline-cart-wrapper .ic-add-to-cart .ic-btn-icon { display: inline-flex; align-items: center; }
.inline-cart-wrapper .ic-add-to-cart .ic-btn-icon.before { margin-right: 8px; }
.inline-cart-wrapper .ic-add-to-cart .ic-btn-icon.after { margin-left: 8px; }

/* Mobile stacking */
@media (max-width: 767px) {
  .ic-inline.ic-stack-mobile { 
    flex-wrap: wrap; 
  }
  
  /* Mobile price - only set width and basic spacing, let Elementor handle typography */
  .ic-inline.ic-stack-mobile .ic-price {
    width: 100%;
  }
  
  /* Mobile button - let Elementor controls handle alignment and margins */
  .ic-inline.ic-stack-mobile .ic-add-to-cart {
    width: 100%;
  }
  
  /* Mobile variations */
  .ic-inline.ic-stack-mobile .ic-variations {
    width: 100%;
    justify-content: center;
  }
  
  /* Mobile quantity */
  .ic-inline.ic-stack-mobile .ic-quantity {
    width: 100%;
    justify-content: center;
  }
}