/* ======================================================================
   UBD Visual UX · PRODUCT CHOICE CARDS 1.6.9

   Objetivo:
   - Limpiar visualmente los bloques de selección/personalización del producto.
   - Reducir bordes y ruido visual.
   - Usar encabezados cálidos oscuros con texto blanco.
   - Mantener intacta la funcionalidad de selects/radios/inputs.

   Inspiración cromática: tonos cálidos tipo ocre / naranja tostado de las fichas.
   ====================================================================== */

html.ubd-product-ready body#product :is(.product-variants, .product-customization) {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Contenedor de cada grupo (Bebida, Complemento, Postre, etc.) */
html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 0 16px !important;
}

html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item)::before,
html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item)::after {
  box-shadow: none !important;
}

/* Quita líneas/accentos laterales si algún módulo los dibuja */
html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item, .product-variants, .product-customization) {
  outline: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
}

/* Encabezado del grupo: pastilla ocre oscura con texto blanco */
html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item) > :is(label, span.control-label, .control-label:first-child) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 44px !important;
  margin: 0 0 10px !important;
  padding: 10px 14px !important;
  border: 0 !important;
  border-radius: 18px !important;
  background: #B97D3A !important;
  background-color: #B97D3A !important;
  color: #fff !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item) > :is(label, span.control-label, .control-label:first-child) * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: none !important;
}

/* Campo de selección / caja elegida */
html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item)
:is(select, .form-control, .custom-select, .input-group, .selector, .bootstrap-select, .dropdown-toggle) {
  border: 1px solid rgba(24, 51, 58, .10) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  background: #fff !important;
  background-color: #fff !important;
  color: #1c2d33 !important;
}

html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item)
:is(select, input.form-control, textarea.form-control, .custom-select, .dropdown-toggle) {
  min-height: 56px !important;
  padding: 14px 18px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

/* Selects nativos: menos ruido */
html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item) select {
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: none !important;
}

/* Opciones tipo radio/checkbox dentro de esos grupos */
html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item)
:is(.custom-radio, .custom-checkbox, .radio, .checkbox, .input-container) {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item)
:is(.custom-radio label, .custom-checkbox label, .radio label, .checkbox label) {
  border: 1px solid rgba(24, 51, 58, .10) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: none !important;
  padding: 12px 14px !important;
}

/* Móvil: compactar todavía más */
@media (max-width: 767px) {
  html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item) {
    margin-bottom: 14px !important;
  }

  html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item) > :is(label, span.control-label, .control-label:first-child) {
    min-height: 42px !important;
    padding: 9px 12px !important;
    border-radius: 16px !important;
    font-size: 14px !important;
  }

  html.ubd-product-ready body#product :is(.product-variants-item, .product-customization-item)
  :is(select, input.form-control, textarea.form-control, .custom-select, .dropdown-toggle) {
    min-height: 52px !important;
    padding: 13px 16px !important;
    border-radius: 16px !important;
    font-size: 13px !important;
  }
}