/* Plugin Calzado - Override CSS para asegurar diseño perfecto */

/* Ocultar completamente el input de cantidad por defecto y botón original */
.single-product .quantity,
.single-product .cart .quantity,
form.cart .quantity,
.single_add_to_cart_button,
button[name="add-to-cart"],
button.single_add_to_cart_button,
.button.single_add_to_cart_button,
.single_add_to_cart_button.button,
.single_add_to_cart_button.button.alt {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  position: absolute !important;
  left: -9999px !important;
}

/* Asegurar que el selector de talles esté visible */
#calzado-size-selector {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Nuestro botón personalizado de agregar al carrito */
#calzado-add-to-cart {
  width: 100% !important;
  margin-top: 1rem !important;
  padding: 12px 24px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  border: none !important;
  cursor: pointer !important;
}

#calzado-add-to-cart:disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  background-color: #6b7280 !important;
}

/* Prevenir override de Tailwind por el tema */
#calzado-size-selector .bg-gray-50 {
  background-color: #f9fafb !important;
}

#calzado-size-selector .bg-green-50 {
  background-color: #f0fdf4 !important;
}

#calzado-size-selector .border-gray-200 {
  border-color: #e5e7eb !important;
}

#calzado-size-selector .border-green-400 {
  border-color: #4ade80 !important;
}

#calzado-size-selector .text-green-600 {
  color: #16a34a !important;
}

#calzado-size-selector .text-red-600 {
  color: #dc2626 !important;
}

/* Asegurar que los botones funcionen */
.calzado-increment,
.calzado-decrement {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* Input readonly pero visible */
.calzado-size-input[readonly] {
  pointer-events: none !important;
  background-color: #ffffff !important;
  color: #1f2937 !important;
  font-weight: bold !important;
}

/* Grid responsive mejorado */
@media (max-width: 768px) {
  #calzado-size-selector .grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.75rem !important;
  }
}

@media (max-width: 480px) {
  #calzado-size-selector .grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.5rem !important;
  }

  .calzado-size-item {
    padding: 0.75rem 0.5rem !important;
  }
}

/* Asegurar visibilidad del total */
#calzado-total-pairs {
  font-size: 2rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

/* Regla adicional ultra-específica para ocultar el botón original */
body.single-product .single_add_to_cart_button,
body .single_add_to_cart_button[name="add-to-cart"],
body button[value][name="add-to-cart"].single_add_to_cart_button,
body form.cart button[type="submit"][name="add-to-cart"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  -webkit-clip-path: inset(50%) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}
