/* DG Variation Pills v1.2.0
 * Estilos de las pills de variaciones.
 * Los colores y medidas se controlan con variables CSS
 * inyectadas desde la página de ajustes del plugin.
 */

/* Ocultar el select nativo (queda en el DOM para que WooCommerce siga funcionando) */
.variations select {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
	padding: 0 !important;
	margin: -1px !important;
}

/* Contenedor de pills */
.dg-pills-wrap {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 4px 0;
}

/* Pill */
.dg-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 6px 16px;
	background: #fff;
	border: 1px solid var(--dg-vp-border, #3a3a3a);
	border-radius: var(--dg-vp-radius, 8px);
	color: var(--dg-vp-text, #3a3a3a);
	font-size: var(--dg-vp-font-size, 13px);
	font-weight: 600;
	line-height: 1.2;
	text-transform: var(--dg-vp-transform, none);
	cursor: pointer;
	user-select: none;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

.dg-pill:hover {
	border-color: var(--dg-vp-active, #9C5B1C);
	color: var(--dg-vp-active, #9C5B1C);
}

/* Pill seleccionada */
.dg-pill.active {
	background: var(--dg-vp-active, #9C5B1C);
	border-color: var(--dg-vp-active, #9C5B1C);
	color: var(--dg-vp-active-text, #fff);
}

/* Pill no disponible (combinación sin stock) */
.dg-pill.disabled {
	opacity: .35;
	pointer-events: none;
	text-decoration: line-through;
}

/* Mensaje "selecciona una opción" */
.dg-vp-choose-msg {
	display: block;
	margin-top: 8px;
	color: var(--dg-vp-choose-color, #9C5B1C);
	font-size: 13px;
	font-weight: 600;
}

/* Limpieza visual de la tabla de variaciones de Woo */
.variations,
.variations td,
.variations th {
	border: 0 !important;
	background: transparent !important;
}

.variations td.value {
	vertical-align: middle;
}