/* =========================================================
   SS DECO - PRODUCTO / FASE 3
   Pulido final + accesibilidad + consistencia claro/oscuro
   ========================================================= */

/* ---------------------------------------------------------
   1. RITMO GENERAL
   --------------------------------------------------------- */

html[data-ss-theme] body.single-product .summary.entry-summary {
	color: var(--ss-text);
}

html[data-ss-theme] body.single-product .summary .product_title {
	text-wrap: balance;
}

html[data-ss-theme] body.single-product .woocommerce-product-details__short-description {
	max-width: 62ch;
}

html[data-ss-theme] body.single-product .product_meta {
	border-color: var(--ss-line) !important;
}

/* ---------------------------------------------------------
   2. GALERIA
   --------------------------------------------------------- */

html[data-ss-theme] body.single-product .woocommerce-product-gallery__image img {
	transition:
		opacity 220ms ease,
		transform 260ms ease;
}

html[data-ss-theme] body.single-product .flex-control-thumbs img {
	border: 1px solid transparent !important;
	opacity: 0.72;
	cursor: pointer;
}

html[data-ss-theme] body.single-product .flex-control-thumbs img:hover {
	opacity: 1;
}

html[data-ss-theme] body.single-product .flex-control-thumbs img.flex-active {
	opacity: 1;
	border-color: var(--ss-accent) !important;
}

/* ---------------------------------------------------------
   3. VARIACIONES Y CONTROLES
   --------------------------------------------------------- */

html[data-ss-theme] body.single-product table.variations label {
	letter-spacing: 0.01em;
}

html[data-ss-theme] body.single-product table.variations select,
html[data-ss-theme] body.single-product .summary .quantity,
html[data-ss-theme] body.single-product .single_add_to_cart_button {
	transition:
		border-color 180ms ease,
		background-color 180ms ease,
		color 180ms ease,
		box-shadow 180ms ease,
		transform 180ms ease;
}

html[data-ss-theme] body.single-product table.variations select:hover {
	border-color: color-mix(in srgb, var(--ss-accent) 55%, var(--ss-line)) !important;
}

html[data-ss-theme] body.single-product table.variations select:focus,
html[data-ss-theme] body.single-product table.variations select:focus-visible {
	border-color: var(--ss-accent) !important;
	outline: 2px solid color-mix(in srgb, var(--ss-accent) 35%, transparent) !important;
	outline-offset: 2px;
}

html[data-ss-theme] body.single-product .summary .quantity:focus-within {
	border-color: var(--ss-accent) !important;
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--ss-accent) 22%, transparent);
}

/* Boton activo */
html[data-ss-theme] body.single-product .single_add_to_cart_button:not(.disabled):not(:disabled) {
	background: var(--ss-accent) !important;
	border-color: var(--ss-accent) !important;
	color: #fff !important;
}

html[data-ss-theme] body.single-product .single_add_to_cart_button:not(.disabled):not(:disabled):hover {
	transform: translateY(-1px);
	filter: brightness(1.04);
}

/* Boton deshabilitado: sigue legible */
html[data-ss-theme] body.single-product .single_add_to_cart_button.disabled,
html[data-ss-theme] body.single-product .single_add_to_cart_button:disabled {
	background: color-mix(in srgb, var(--ss-accent) 55%, var(--ss-surface)) !important;
	border-color: transparent !important;
	color: color-mix(in srgb, #fff 72%, transparent) !important;
	opacity: 0.72 !important;
}

/* ---------------------------------------------------------
   4. TABS / RECUADROS
   --------------------------------------------------------- */

html[data-ss-theme] body.single-product .woocommerce-tabs ul.tabs,
html[data-ss-theme] body.single-product .woocommerce-tabs ul.wc-tabs {
	justify-content: center !important;
}

html[data-ss-theme] body.single-product .woocommerce-tabs ul.tabs li a,
html[data-ss-theme] body.single-product .woocommerce-tabs ul.wc-tabs li a {
	min-width: 0;
	transition:
		background-color 180ms ease,
		border-color 180ms ease,
		color 180ms ease,
		transform 180ms ease;
}

html[data-ss-theme] body.single-product .woocommerce-tabs ul.tabs li a:focus-visible,
html[data-ss-theme] body.single-product .woocommerce-tabs ul.wc-tabs li a:focus-visible {
	outline: 2px solid var(--ss-accent) !important;
	outline-offset: 3px;
}

html[data-ss-theme] body.single-product .woocommerce-Tabs-panel {
	text-wrap: pretty;
}

/* ---------------------------------------------------------
   5. RELACIONADOS
   --------------------------------------------------------- */

html[data-ss-theme] body.single-product .related.products > h2,
html[data-ss-theme] body.single-product .up-sells.products > h2 {
	text-wrap: balance;
}

html[data-ss-theme] body.single-product .related ul.products li.product,
html[data-ss-theme] body.single-product .up-sells ul.products li.product,
html[data-ss-theme] body.single-product .related .product-entry-wrapper,
html[data-ss-theme] body.single-product .up-sells .product-entry-wrapper,
html[data-ss-theme] body.single-product .related .ct-image-container,
html[data-ss-theme] body.single-product .up-sells .ct-image-container {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

html[data-ss-theme] body.single-product .related ul.products li.product img,
html[data-ss-theme] body.single-product .up-sells ul.products li.product img {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

html[data-ss-theme] body.single-product .related ul.products li.product .woocommerce-loop-product__title,
html[data-ss-theme] body.single-product .up-sells ul.products li.product .woocommerce-loop-product__title {
	color: var(--ss-text) !important;
	text-wrap: balance;
}

html[data-ss-theme] body.single-product .related ul.products li.product .price,
html[data-ss-theme] body.single-product .up-sells ul.products li.product .price,
html[data-ss-theme] body.single-product .related ul.products li.product .price .amount,
html[data-ss-theme] body.single-product .up-sells ul.products li.product .price .amount {
	color: var(--ss-text) !important;
}

/* ---------------------------------------------------------
   6. FOCUS GLOBAL DE LA FICHA
   --------------------------------------------------------- */

html[data-ss-theme] body.single-product a:focus-visible,
html[data-ss-theme] body.single-product button:focus-visible {
	outline: 2px solid var(--ss-accent) !important;
	outline-offset: 3px;
}

/* El toggle del tema no recupera lineas/bordes */
.ss-theme-toggle,
.ss-theme-toggle:hover,
.ss-theme-toggle:focus,
.ss-theme-toggle:active {
	border: 0 !important;
	box-shadow: none !important;
}

/* ---------------------------------------------------------
   7. MOBILE
   --------------------------------------------------------- */

@media (max-width: 767px) {

	html[data-ss-theme] body.single-product .woocommerce-product-gallery {
		margin-bottom: 0 !important;
	}

	html[data-ss-theme] body.single-product .summary.entry-summary {
		padding-top: 20px !important;
	}

	html[data-ss-theme] body.single-product .summary .product_title {
		margin-top: 0 !important;
	}

	html[data-ss-theme] body.single-product .woocommerce-product-details__short-description {
		max-width: none;
	}

	/* Tabs centradas visualmente; si no caben, scroll horizontal */
	html[data-ss-theme] body.single-product .woocommerce-tabs ul.tabs,
	html[data-ss-theme] body.single-product .woocommerce-tabs ul.wc-tabs {
		justify-content: flex-start !important;
		scroll-padding-inline: 12px;
	}

	html[data-ss-theme] body.single-product .woocommerce-tabs ul.tabs::after,
	html[data-ss-theme] body.single-product .woocommerce-tabs ul.wc-tabs::after {
		content: "";
		flex: 0 0 1px;
	}

	html[data-ss-theme] body.single-product .woocommerce-Tabs-panel {
		padding-inline: 0 !important;
	}

	/* Cantidad + carrito permanecen juntos */
	html[data-ss-theme] body.single-product .woocommerce-variation-add-to-cart {
		align-items: stretch !important;
	}

	html[data-ss-theme] body.single-product .woocommerce-variation-add-to-cart .single_add_to_cart_button {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		text-align: center !important;
	}
}

/* En telefonos realmente estrechos priorizamos usabilidad */
@media (max-width: 359px) {
	html[data-ss-theme] body.single-product .woocommerce-variation-add-to-cart {
		display: grid !important;
		grid-template-columns: 1fr !important;
	}
}

/* ---------------------------------------------------------
   8. REDUCED MOTION
   --------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	html[data-ss-theme] body.single-product *,
	html[data-ss-theme] body.single-product *::before,
	html[data-ss-theme] body.single-product *::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}
