/* ============================================================
   DEPORTES JIMMY — PARCHE 12.8.7
   SOLO estandariza selectores de variaciones en la ficha de producto.
   ============================================================ */

:root {
  --dj-selection-red: var(--dj-red, #ef3323);
}

/* ------------------------------------------------------------
   A. CUADROS UNIVERSALES: palabras completas + simetría
   ------------------------------------------------------------ */
.single-product .dj-vgrid__options {
  align-items: stretch;
  grid-auto-rows: 1fr;
}

.single-product .dj-vgrid__item {
  height: 100%;
}

.single-product .dj-vgrid__name {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  max-width: 100%;
  max-height: none;
  overflow: visible;
  white-space: normal !important;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
  text-wrap: balance;
}

/* BLACK, ROYAL, PURPLE, etc. no se parten en mitad de una palabra. */
.single-product .dj-vgrid__section--color .dj-vgrid__name,
.single-product .dj-vgrid__item--color .dj-vgrid__name {
  word-break: keep-all;
  overflow-wrap: normal;
  hyphens: none;
}

/* ------------------------------------------------------------
   B. UN SOLO LENGUAJE VISUAL:
      hover = rojo marca + blanco
      seleccionado = rojo marca + blanco
   ------------------------------------------------------------ */
.single-product .dj-vgrid__item:not(:disabled):not(.is-disabled):hover,
.single-product .dj-vgrid__item.is-active,
.single-product .dj-color-producto__item:not(:disabled):not(.is-disabled):hover,
.single-product .dj-color-producto__item.is-active,
.single-product .dj-tallas__row:not(:disabled):not(.is-disabled):hover,
.single-product .dj-tallas__row.is-active {
  background: var(--dj-selection-red) !important;
  border-color: var(--dj-selection-red) !important;
  color: #fff !important;
  opacity: 1 !important;
  box-shadow: 0 4px 12px rgba(239, 51, 35, .18) !important;
}

.single-product .dj-vgrid__item:not(:disabled):not(.is-disabled):hover .dj-vgrid__name,
.single-product .dj-vgrid__item.is-active .dj-vgrid__name,
.single-product .dj-vgrid__item:not(:disabled):not(.is-disabled):hover .dj-vgrid__soldout,
.single-product .dj-vgrid__item.is-active .dj-vgrid__soldout,
.single-product .dj-color-producto__item:not(:disabled):not(.is-disabled):hover .dj-color-producto__name,
.single-product .dj-color-producto__item.is-active .dj-color-producto__name,
.single-product .dj-color-producto__item:not(:disabled):not(.is-disabled):hover .dj-color-producto__price,
.single-product .dj-color-producto__item:not(:disabled):not(.is-disabled):hover .dj-color-producto__price *,
.single-product .dj-color-producto__item.is-active .dj-color-producto__price,
.single-product .dj-color-producto__item.is-active .dj-color-producto__price *,
.single-product .dj-tallas__row:not(:disabled):not(.is-disabled):hover .dj-tallas__cell,
.single-product .dj-tallas__row.is-active .dj-tallas__cell,
.single-product .dj-tallas__row.is-active .dj-tallas__cell.is-empty {
  color: #fff !important;
}

/* La imagen/miniatura conserva fondo blanco para no teñir el producto. */
.single-product .dj-vgrid__item:hover .dj-vgrid__visual img,
.single-product .dj-vgrid__item.is-active .dj-vgrid__visual img,
.single-product .dj-color-producto__item:hover .dj-color-producto__visual,
.single-product .dj-color-producto__item.is-active .dj-color-producto__visual {
  background: #fff;
}

/* Tabla internacional: selección roja limpia y legible incluso si Woo
   recalcula estados después de seleccionar una variación. */
.single-product .dj-tallas__row.is-active {
  box-shadow: inset 4px 0 0 rgba(0,0,0,.14), 0 4px 12px rgba(239,51,35,.16) !important;
}

.single-product .dj-tallas__row.is-active .dj-tallas__cell + .dj-tallas__cell,
.single-product .dj-tallas__row:not(:disabled):not(.is-disabled):hover .dj-tallas__cell + .dj-tallas__cell {
  border-left-color: rgba(255,255,255,.20);
}

.single-product .dj-tallas__row.is-active .dj-tallas__cell:first-child::before {
  background: #fff !important;
  color: var(--dj-selection-red) !important;
}

/* Un activo nunca debe quedar lavado por una regla de disabled posterior. */
.single-product .dj-tallas__row.is-active.is-disabled,
.single-product .dj-tallas__row.is-active:disabled,
.single-product .dj-vgrid__item.is-active.is-disabled,
.single-product .dj-vgrid__item.is-active:disabled,
.single-product .dj-color-producto__item.is-active.is-disabled,
.single-product .dj-color-producto__item.is-active:disabled {
  background: var(--dj-selection-red) !important;
  border-color: var(--dj-selection-red) !important;
  color: #fff !important;
  opacity: 1 !important;
}

/* Tallas compactas: el texto sigue centrado y completo. */
.single-product .dj-vgrid.dj-vgrid--color-talla .dj-vgrid__section--talla .dj-vgrid__name {
  width: auto;
  white-space: nowrap !important;
  overflow: visible;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
}

/* Selector de color independiente, por si aparece en algún producto legado. */
.single-product .dj-color-producto__name {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

@media (max-width: 760px) {
  .single-product .dj-vgrid__item--color .dj-vgrid__name,
  .single-product .dj-color-producto__name {
    font-size: .84rem;
    line-height: 1.12;
  }
}
