/* =============================================================================
   EL RACO EXPERIENCE
   CÓDIGO N°8
   Estilo visual de páginas de producto y galería de fotos

   Archivo:
   08-estilo-visual-productos-galeria.css

   HTML generado por JS:
   .raco-product-visual-gallery
   .raco-product-visual-gallery-grid
   .raco-product-visual-tile
   .raco-product-visual-lightbox
   .raco-program-buttons-grid
   ============================================================================= */

body.single-product {
	--raco-product-content-width: 66.666666%;
	--raco-product-content-max: 1180px;

	--raco-gallery-radius: 18px;
	--raco-gallery-gap: 8px;
	--raco-gallery-button-radius: 8px;

	--raco-blue: #063f88;
	--raco-teal: #01717a;
	--raco-teal-dark: #005f66;
	--raco-danger: #b94a48;

	--raco-soft-shadow: 0 18px 48px rgba(6, 63, 136, 0.14);
	--raco-hover-shadow: 0 22px 58px rgba(6, 63, 136, 0.20);
}

/* ==========================================================================
   BASE BOTONES E ÍCONOS
   ========================================================================== */

.raco-product-visual-gallery button,
.raco-product-visual-lightbox button,
.raco-program-buttons-grid button,
.raco-program-buttons-grid a {
	appearance: none !important;
	-webkit-appearance: none !important;
	font-family: inherit !important;
	-webkit-tap-highlight-color: transparent !important;
}

.raco-product-visual-gallery button:focus,
.raco-product-visual-lightbox button:focus,
.raco-program-buttons-grid button:focus,
.raco-program-buttons-grid a:focus {
	outline: none !important;
}

.raco-product-visual-gallery button:focus-visible,
.raco-product-visual-lightbox button:focus-visible,
.raco-program-buttons-grid button:focus-visible,
.raco-program-buttons-grid a:focus-visible {
	outline: 3px solid rgba(1, 113, 122, 0.28) !important;
	outline-offset: 4px !important;
}

.raco-product-visual-icon {
	display: block !important;
	width: 1em !important;
	height: 1em !important;

	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 2.2 !important;
	stroke-linecap: round !important;
	stroke-linejoin: round !important;

	pointer-events: none !important;
}

.raco-product-visual-icon-grid {
	fill: none !important;
	stroke-width: 1.8 !important;
}

/* ==========================================================================
   BOTONES DEL PRODUCTO
   Comprar ahora + Reservar + Ver detalle del programa
   ========================================================================== */

body.single-product .raco-program-buttons-grid {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 8px !important;

	width: 100% !important;
	margin-top: 10px !important;

	clear: both !important;
	box-sizing: border-box !important;
}

body.single-product .raco-program-buttons-grid.raco-grid-2-cols {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body.single-product .raco-program-buttons-grid .raco-btn-slot {
	min-width: 0 !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

body.single-product .raco-program-buttons-grid .single_add_to_cart_button,
body.single-product .raco-program-buttons-grid .afrfqbt_single_page,
body.single-product .raco-program-buttons-grid .raco-program-detail-btn {
	width: 100% !important;
	min-width: 0 !important;
	min-height: 0 !important;
	height: auto !important;

	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	float: none !important;
	margin: 0 !important;
	padding: 10px 20px !important;

	border-radius: 2px !important;
	box-shadow: none !important;
	text-shadow: none !important;

	font-family: inherit !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	line-height: 1.15 !important;
	text-align: center !important;
	text-decoration: none !important;
	white-space: nowrap !important;

	box-sizing: border-box !important;
	opacity: 1 !important;

	transition:
		background-color 0.18s ease,
		border-color 0.18s ease,
		color 0.18s ease !important;
}

/* Comprar ahora activo */

body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page):not(.raco-bloqueado):not(.disabled):not(:disabled),
body.single-product form.cart .single_add_to_cart_button:not(.afrfqbt_single_page):not(.raco-bloqueado):not(.disabled):not(:disabled) {
	background-color: #01717a !important;
	border: 1px solid #01717a !important;
	color: #ffffff !important;
	cursor: pointer !important;
}

body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page):not(.raco-bloqueado):not(.disabled):not(:disabled):hover,
body.single-product form.cart .single_add_to_cart_button:not(.afrfqbt_single_page):not(.raco-bloqueado):not(.disabled):not(:disabled):hover {
	background-color: #005f66 !important;
	border-color: #005f66 !important;
	color: #ffffff !important;
	outline: none !important;
}

body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page):not(.raco-bloqueado):not(.disabled):not(:disabled):focus:not(:focus-visible),
body.single-product form.cart .single_add_to_cart_button:not(.afrfqbt_single_page):not(.raco-bloqueado):not(.disabled):not(:disabled):focus:not(:focus-visible) {
	background-color: #01717a !important;
	border-color: #01717a !important;
	color: #ffffff !important;
	outline: none !important;
}

/* Comprar ahora desactivado */

body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page).disabled,
body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page):disabled,
body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page)[disabled],
body.single-product .raco-program-buttons-grid .wc-bookings-booking-form-button:not(.afrfqbt_single_page).disabled,
body.single-product .raco-program-buttons-grid .wc-bookings-booking-form-button:not(.afrfqbt_single_page):disabled,
body.single-product .raco-program-buttons-grid .wc-bookings-booking-form-button:not(.afrfqbt_single_page)[disabled],
body.single-product form.cart .single_add_to_cart_button:not(.afrfqbt_single_page).disabled,
body.single-product form.cart .single_add_to_cart_button:not(.afrfqbt_single_page):disabled,
body.single-product form.cart .single_add_to_cart_button:not(.afrfqbt_single_page)[disabled],
body.single-product form.cart .wc-bookings-booking-form-button:not(.afrfqbt_single_page).disabled,
body.single-product form.cart .wc-bookings-booking-form-button:not(.afrfqbt_single_page):disabled,
body.single-product form.cart .wc-bookings-booking-form-button:not(.afrfqbt_single_page)[disabled] {
	background-color: #b94a48 !important;
	border: 1px solid #b94a48 !important;
	color: #ffffff !important;
	opacity: 1 !important;
	cursor: not-allowed !important;
	box-shadow: none !important;
	text-shadow: none !important;
	pointer-events: none !important;
}

body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page).disabled:hover,
body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page):disabled:hover,
body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page)[disabled]:hover,
body.single-product .raco-program-buttons-grid .wc-bookings-booking-form-button:not(.afrfqbt_single_page).disabled:hover,
body.single-product .raco-program-buttons-grid .wc-bookings-booking-form-button:not(.afrfqbt_single_page):disabled:hover,
body.single-product .raco-program-buttons-grid .wc-bookings-booking-form-button:not(.afrfqbt_single_page)[disabled]:hover,
body.single-product form.cart .single_add_to_cart_button:not(.afrfqbt_single_page).disabled:hover,
body.single-product form.cart .single_add_to_cart_button:not(.afrfqbt_single_page):disabled:hover,
body.single-product form.cart .single_add_to_cart_button:not(.afrfqbt_single_page)[disabled]:hover,
body.single-product form.cart .wc-bookings-booking-form-button:not(.afrfqbt_single_page).disabled:hover,
body.single-product form.cart .wc-bookings-booking-form-button:not(.afrfqbt_single_page):disabled:hover,
body.single-product form.cart .wc-bookings-booking-form-button:not(.afrfqbt_single_page)[disabled]:hover {
	background-color: #b94a48 !important;
	border-color: #b94a48 !important;
	color: #ffffff !important;
	opacity: 1 !important;
	outline: none !important;
}

/* Reservar / Request a Quote */

body.single-product .raco-program-buttons-grid .afrfqbt_single_page,
body.single-product .raco-program-buttons-grid .afrfqbt_single_page.disabled,
body.single-product .raco-program-buttons-grid .afrfqbt_single_page:disabled,
body.single-product .raco-program-buttons-grid .afrfqbt_single_page[disabled],
body.single-product form.cart .afrfqbt_single_page,
body.single-product form.cart .afrfqbt_single_page.disabled,
body.single-product form.cart .afrfqbt_single_page:disabled,
body.single-product form.cart .afrfqbt_single_page[disabled] {
	background-color: #01717a !important;
	border: 1px solid #01717a !important;
	color: #ffffff !important;
	opacity: 1 !important;
	cursor: pointer !important;
	box-shadow: none !important;
	text-shadow: none !important;
	pointer-events: auto !important;
}

body.single-product .raco-program-buttons-grid .afrfqbt_single_page:hover,
body.single-product form.cart .afrfqbt_single_page:hover {
	background-color: #005f66 !important;
	border-color: #005f66 !important;
	color: #ffffff !important;
	opacity: 1 !important;
	outline: none !important;
}

body.single-product .raco-program-buttons-grid .afrfqbt_single_page:focus:not(:focus-visible),
body.single-product form.cart .afrfqbt_single_page:focus:not(:focus-visible) {
	background-color: #01717a !important;
	border-color: #01717a !important;
	color: #ffffff !important;
	opacity: 1 !important;
	outline: none !important;
}

/* Bloqueado manual */

body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page).raco-bloqueado,
body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page).raco-bloqueado:hover,
body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page).raco-bloqueado:focus,
body.single-product .raco-program-buttons-grid .single_add_to_cart_button:not(.afrfqbt_single_page).raco-bloqueado:active {
	background-color: #b94a48 !important;
	border: 1px solid #b94a48 !important;
	color: #ffffff !important;
	cursor: not-allowed !important;
	pointer-events: none !important;
	opacity: 1 !important;
	box-shadow: none !important;
	outline: none !important;
}

/* Ver detalle del programa */

body.single-product .raco-program-buttons-grid .raco-program-detail-btn {
	background-color: #01717a !important;
	border: 1px solid #01717a !important;
	color: #ffffff !important;
	cursor: pointer !important;
}

body.single-product .raco-program-buttons-grid .raco-program-detail-btn:hover {
	background-color: #005f66 !important;
	border-color: #005f66 !important;
	color: #ffffff !important;
	outline: none !important;
}

body.single-product .raco-program-buttons-grid .raco-program-detail-btn:focus:not(:focus-visible) {
	background-color: #01717a !important;
	border-color: #01717a !important;
	color: #ffffff !important;
	outline: none !important;
}

/* ==========================================================================
   OCULTAR GALERÍA NATIVA
   ========================================================================== */

body.single-product .woocommerce-product-gallery.raco-original-gallery-hidden {
	display: none !important;
}

/* ==========================================================================
   CONTENEDOR PRINCIPAL GALERÍA
   ========================================================================== */

body.single-product .raco-product-visual-gallery {
	width: var(--raco-product-content-width) !important;
	max-width: var(--raco-product-content-max) !important;
	margin: 0 auto 34px auto !important;
	box-sizing: border-box !important;
}

/* ==========================================================================
   COLLAGE ESCRITORIO Y TABLET
   ========================================================================== */

body.single-product .raco-product-visual-gallery-grid {
	position: relative !important;

	display: grid !important;
	grid-template-columns: 2fr 1fr 1fr !important;
	grid-template-rows: repeat(2, minmax(190px, 1fr)) !important;
	gap: var(--raco-gallery-gap) !important;

	width: 100% !important;
	height: clamp(460px, 38vw, 620px) !important;

	border-radius: var(--raco-gallery-radius) !important;
	overflow: hidden !important;

	background: #ffffff !important;
	box-shadow: var(--raco-soft-shadow) !important;
	box-sizing: border-box !important;
}

body.single-product .raco-product-visual-gallery-grid::after {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	z-index: 1 !important;
	pointer-events: none !important;

	border: 1px solid rgba(255, 255, 255, 0.72) !important;
	border-radius: inherit !important;
	box-sizing: border-box !important;
}

body.single-product .raco-product-visual-tile {
	position: relative !important;
	z-index: 0 !important;

	display: block !important;
	width: 100% !important;
	height: 100% !important;

	padding: 0 !important;
	margin: 0 !important;

	border: 0 !important;
	border-radius: 0 !important;

	background: #f4f7f8 !important;
	overflow: hidden !important;
	cursor: pointer !important;

	box-shadow: none !important;
	box-sizing: border-box !important;
}

body.single-product .raco-product-visual-tile--main {
	grid-column: 1 / 2 !important;
	grid-row: 1 / 3 !important;
}

body.single-product .raco-product-visual-tile::after {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	z-index: 1 !important;

	background:
		linear-gradient(
			180deg,
			rgba(0, 0, 0, 0.02) 0%,
			rgba(0, 0, 0, 0.00) 48%,
			rgba(0, 0, 0, 0.10) 100%
		) !important;

	opacity: 0.72 !important;
	pointer-events: none !important;
	transition: opacity 0.28s ease !important;
}

body.single-product .raco-product-visual-tile img {
	position: relative !important;
	z-index: 0 !important;

	display: block !important;
	width: 100% !important;
	height: 100% !important;

	object-fit: cover !important;
	object-position: center center !important;

	image-rendering: auto !important;
	backface-visibility: hidden !important;
	transform: translateZ(0) scale(1) !important;

	transition:
		transform 0.42s ease,
		filter 0.42s ease !important;
}

body.single-product .raco-product-visual-tile:hover img {
	transform: translateZ(0) scale(1.035) !important;
	filter: brightness(0.96) saturate(1.04) !important;
}

body.single-product .raco-product-visual-tile:hover::after {
	opacity: 0.38 !important;
}

/* ==========================================================================
   BOTÓN VER TODAS LAS FOTOS EN ESCRITORIO
   ========================================================================== */

body.single-product .raco-product-visual-view-all {
	position: absolute !important;
	right: 16px !important;
	bottom: 16px !important;
	z-index: 4 !important;

	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;

	min-height: 44px !important;
	padding: 0 17px !important;

	border: 1px solid rgba(1, 113, 122, 0.22) !important;
	border-radius: var(--raco-gallery-button-radius) !important;

	background: rgba(255, 255, 255, 0.96) !important;
	color: #01717a !important;

	backdrop-filter: blur(10px) !important;
	-webkit-backdrop-filter: blur(10px) !important;

	font-size: 14px !important;
	font-weight: 800 !important;
	line-height: 1 !important;

	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16) !important;
	box-sizing: border-box !important;

	transition:
		transform 0.24s ease,
		box-shadow 0.24s ease,
		background-color 0.24s ease,
		color 0.24s ease !important;
}

body.single-product .raco-product-visual-view-all .raco-product-visual-icon {
	width: 17px !important;
	height: 17px !important;
	color: #01717a !important;
	stroke: #01717a !important;
}

body.single-product .raco-product-visual-tile:hover .raco-product-visual-view-all {
	transform: translateY(-2px) !important;
	background: #ffffff !important;
	color: #005f66 !important;
	box-shadow: 0 14px 30px rgba(0, 0, 0, 0.20) !important;
}

body.single-product .raco-product-visual-mobile-button {
	display: none !important;
}

/* ==========================================================================
   LIGHTBOX
   ========================================================================== */

body.raco-product-visual-lightbox-open {
	overflow: hidden !important;
}

.raco-product-visual-lightbox {
	position: fixed !important;
	inset: 0 !important;
	z-index: 999999 !important;

	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	padding: 72px 7vw 120px 7vw !important;

	background:
		radial-gradient(circle at 50% 38%, rgba(1, 113, 122, 0.075), transparent 34%),
		rgba(255, 255, 255, 0.91) !important;

	backdrop-filter: blur(12px) saturate(1.04) !important;
	-webkit-backdrop-filter: blur(12px) saturate(1.04) !important;

	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;

	box-sizing: border-box !important;

	transition:
		opacity 0.26s ease,
		visibility 0.26s ease !important;
}

.raco-product-visual-lightbox.is-open {
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
}

/* ==========================================================================
   IMAGEN PRINCIPAL DEL LIGHTBOX
   ========================================================================== */

.raco-product-visual-lightbox-stage {
	position: relative !important;
	z-index: 2 !important;

	width: min(1120px, 78vw) !important;
	height: min(72vh, 760px) !important;

	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	padding: 0 !important;
	margin: 0 auto !important;

	box-sizing: border-box !important;

	transform: translateY(8px) scale(0.985) !important;
	transition: transform 0.28s ease !important;
	touch-action: pan-y !important;
}

.raco-product-visual-lightbox.is-open .raco-product-visual-lightbox-stage {
	transform: translateY(0) scale(1) !important;
}

.raco-product-visual-lightbox-stage img {
	display: block !important;

	max-width: 100% !important;
	max-height: 100% !important;
	width: auto !important;
	height: auto !important;

	object-fit: contain !important;
	object-position: center center !important;

	border-radius: 18px !important;
	box-shadow:
		0 28px 80px rgba(6, 63, 136, 0.18),
		0 8px 26px rgba(0, 0, 0, 0.12) !important;

	image-rendering: auto !important;
	backface-visibility: hidden !important;

	user-select: none !important;
	-webkit-user-select: none !important;
	-webkit-user-drag: none !important;
}

/* ==========================================================================
   BOTÓN CERRAR LIGHTBOX
   ========================================================================== */

.raco-product-visual-lightbox-close {
	position: fixed !important;
	top: 24px !important;
	right: 28px !important;
	z-index: 1000002 !important;

	width: 48px !important;
	height: 48px !important;
	min-width: 48px !important;
	min-height: 48px !important;

	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	padding: 0 !important;
	margin: 0 !important;

	border: 1px solid rgba(255, 255, 255, 0.28) !important;
	border-radius: var(--raco-gallery-button-radius) !important;

	background: #01717a !important;
	background-color: #01717a !important;
	background-image: none !important;

	color: #ffffff !important;

	cursor: pointer !important;

	opacity: 1 !important;
	filter: none !important;
	mix-blend-mode: normal !important;

	box-shadow: 0 10px 26px rgba(0, 0, 0, 0.22) !important;
	box-sizing: border-box !important;
	transform: none !important;

	transition:
		background-color 0.18s ease,
		box-shadow 0.18s ease,
		transform 0.18s ease !important;
}

.raco-product-visual-lightbox-close .raco-product-visual-icon {
	width: 22px !important;
	height: 22px !important;
	color: #ffffff !important;
	stroke: #ffffff !important;
	stroke-width: 2.5 !important;
}

.raco-product-visual-lightbox-close:hover,
.raco-product-visual-lightbox-close:focus-visible {
	background: #005f66 !important;
	background-color: #005f66 !important;
	background-image: none !important;
	color: #ffffff !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.26) !important;
}

.raco-product-visual-lightbox-close:focus:not(:focus-visible) {
	background: #01717a !important;
	background-color: #01717a !important;
	background-image: none !important;
	color: #ffffff !important;
	transform: none !important;
	box-shadow: 0 10px 26px rgba(0, 0, 0, 0.22) !important;
}

.raco-product-visual-lightbox-close:active {
	transform: scale(0.98) !important;
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.20) !important;
}

/* ==========================================================================
   FLECHAS LIGHTBOX EN ORDENADOR
   Mismo estilo visual de reseñas y productos relacionados.
   ========================================================================== */

.raco-product-visual-lightbox-arrow {
	position: fixed !important;
	top: 50% !important;
	z-index: 1000002 !important;

	width: 46px !important;
	height: 58px !important;
	min-width: 46px !important;
	min-height: 58px !important;

	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	margin: 0 !important;
	padding: 0 0 5px 0 !important;

	background: #01717a !important;
	background-color: #01717a !important;
	background-image: none !important;

	color: #ffffff !important;

	border: 1px solid rgba(255, 255, 255, 0.28) !important;
	border-radius: 0 !important;

	box-shadow: 0 10px 26px rgba(0, 0, 0, 0.22) !important;
	cursor: pointer !important;

	opacity: 1 !important;
	filter: none !important;
	mix-blend-mode: normal !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;

	transform: translateY(-50%) !important;
	box-sizing: border-box !important;

	transition:
		background-color 0.18s ease,
		border-color 0.18s ease,
		box-shadow 0.18s ease,
		transform 0.18s ease !important;
}

.raco-product-visual-lightbox-arrow .raco-product-visual-icon {
	position: relative !important;
	z-index: 2 !important;
	display: block !important;
	width: 28px !important;
	height: 28px !important;
	color: #ffffff !important;
	stroke: #ffffff !important;
	stroke-width: 2.5 !important;
}

.raco-product-visual-lightbox-arrow::before {
	display: none !important;
	content: none !important;
}

.raco-product-visual-lightbox-arrow::after {
	content: "" !important;
	position: absolute !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	width: 0 !important;
	height: 0 !important;
	z-index: 1 !important;
}

/* Flecha izquierda */

.raco-product-visual-lightbox-prev {
	left: 0 !important;
	right: auto !important;
	border-radius: 0 14px 14px 0 !important;
	padding-right: 4px !important;
}

.raco-product-visual-lightbox-prev::after {
	right: -10px !important;
	border-top: 12px solid transparent !important;
	border-bottom: 12px solid transparent !important;
	border-left: 10px solid #01717a !important;
}

/* Flecha derecha */

.raco-product-visual-lightbox-next {
	right: 0 !important;
	left: auto !important;
	border-radius: 14px 0 0 14px !important;
	padding-left: 4px !important;
}

.raco-product-visual-lightbox-next::after {
	left: -10px !important;
	border-top: 12px solid transparent !important;
	border-bottom: 12px solid transparent !important;
	border-right: 10px solid #01717a !important;
}

/* Hover y focus visible */

.raco-product-visual-lightbox-arrow:hover,
.raco-product-visual-lightbox-arrow:focus-visible {
	background: #005f66 !important;
	background-color: #005f66 !important;
	background-image: none !important;

	color: #ffffff !important;
	border-color: rgba(255, 255, 255, 0.38) !important;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.26) !important;
}

.raco-product-visual-lightbox-prev:hover,
.raco-product-visual-lightbox-prev:focus-visible {
	transform: translateY(-50%) translateX(-2px) !important;
}

.raco-product-visual-lightbox-next:hover,
.raco-product-visual-lightbox-next:focus-visible {
	transform: translateY(-50%) translateX(2px) !important;
}

.raco-product-visual-lightbox-prev:hover::after,
.raco-product-visual-lightbox-prev:focus-visible::after {
	border-left-color: #005f66 !important;
}

.raco-product-visual-lightbox-next:hover::after,
.raco-product-visual-lightbox-next:focus-visible::after {
	border-right-color: #005f66 !important;
}

/* Reset del focus por clic */

.raco-product-visual-lightbox-arrow:focus:not(:focus-visible) {
	background: #01717a !important;
	background-color: #01717a !important;
	background-image: none !important;

	color: #ffffff !important;
	border-color: rgba(255, 255, 255, 0.28) !important;
	box-shadow: 0 10px 26px rgba(0, 0, 0, 0.22) !important;
	transform: translateY(-50%) !important;
}

.raco-product-visual-lightbox-prev:focus:not(:focus-visible)::after {
	border-left-color: #01717a !important;
}

.raco-product-visual-lightbox-next:focus:not(:focus-visible)::after {
	border-right-color: #01717a !important;
}

.raco-product-visual-lightbox-arrow:active {
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.20) !important;
}

.raco-product-visual-lightbox-prev:active {
	transform: translateY(-50%) translateX(0) scale(0.98) !important;
}

.raco-product-visual-lightbox-next:active {
	transform: translateY(-50%) translateX(0) scale(0.98) !important;
}

/* ==========================================================================
   MINIATURAS
   ========================================================================== */

.raco-product-visual-lightbox-thumbs-outer {
	position: fixed !important;
	left: 50% !important;
	bottom: 30px !important;
	z-index: 1000002 !important;

	width: min(920px, calc(100vw - 90px)) !important;

	padding: 10px !important;

	border: 1px solid rgba(255, 255, 255, 0.70) !important;
	border-radius: 16px !important;

	background: rgba(255, 255, 255, 0.72) !important;

	backdrop-filter: blur(14px) saturate(1.06) !important;
	-webkit-backdrop-filter: blur(14px) saturate(1.06) !important;

	box-shadow:
		0 18px 44px rgba(6, 63, 136, 0.12),
		0 4px 16px rgba(0, 0, 0, 0.06) !important;

	box-sizing: border-box !important;

	transform: translateX(-50%) translateY(8px) !important;
	transition: transform 0.28s ease !important;
}

.raco-product-visual-lightbox.is-open .raco-product-visual-lightbox-thumbs-outer {
	transform: translateX(-50%) translateY(0) !important;
}

.raco-product-visual-lightbox-thumbs {
	width: 100% !important;

	display: flex !important;
	gap: 10px !important;

	overflow-x: auto !important;
	overflow-y: hidden !important;

	padding: 0 !important;
	margin: 0 !important;

	scroll-snap-type: x mandatory !important;
	-webkit-overflow-scrolling: touch !important;
	scrollbar-width: none !important;

	box-sizing: border-box !important;
}

.raco-product-visual-lightbox-thumbs::-webkit-scrollbar {
	display: none !important;
}

.raco-product-visual-lightbox-thumb {
	position: relative !important;

	flex: 0 0 82px !important;
	width: 82px !important;
	height: 58px !important;

	display: block !important;

	padding: 0 !important;
	margin: 0 !important;

	border: 2px solid transparent !important;
	border-radius: 10px !important;

	background: #ffffff !important;
	overflow: hidden !important;
	cursor: pointer !important;

	opacity: 0.70 !important;

	scroll-snap-align: start !important;

	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06) !important;
	box-sizing: border-box !important;

	transition:
		opacity 0.22s ease,
		border-color 0.22s ease,
		transform 0.22s ease,
		box-shadow 0.22s ease !important;
}

.raco-product-visual-lightbox-thumb:hover {
	opacity: 0.95 !important;
	transform: translateY(-1px) !important;
}

.raco-product-visual-lightbox-thumb:focus-visible {
	opacity: 1 !important;
	transform: none !important;
	outline: 3px solid rgba(1, 113, 122, 0.24) !important;
	outline-offset: 3px !important;
}

.raco-product-visual-lightbox-thumb.is-active {
	opacity: 1 !important;
	border-color: #01717a !important;
	box-shadow:
		0 8px 18px rgba(1, 113, 122, 0.20),
		0 3px 10px rgba(0, 0, 0, 0.08) !important;
}

.raco-product-visual-lightbox-thumb img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;

	object-fit: cover !important;
	object-position: center center !important;

	image-rendering: auto !important;
	backface-visibility: hidden !important;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media (min-width: 768px) and (max-width: 921px) {
	body.single-product {
		--raco-product-content-width: 88%;
	}

	body.single-product .raco-product-visual-gallery {
		margin-bottom: 30px !important;
	}

	body.single-product .raco-product-visual-gallery-grid {
		height: clamp(420px, 54vw, 560px) !important;
	}

	.raco-product-visual-lightbox {
		padding-left: 6vw !important;
		padding-right: 6vw !important;
	}

	.raco-product-visual-lightbox-stage {
		width: 82vw !important;
		height: 70vh !important;
	}
}

/* ==========================================================================
   DISPOSITIVOS TÁCTILES
   ========================================================================== */

@media (hover: none), (pointer: coarse) {
	.raco-product-visual-lightbox-arrow {
		display: none !important;
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}

	.raco-product-visual-lightbox-stage {
		cursor: grab !important;
	}

	body.single-product .raco-product-visual-mobile-button:hover,
	body.single-product .raco-product-visual-mobile-button:focus,
	body.single-product .raco-product-visual-mobile-button:active {
		background: #01717a !important;
		background-color: #01717a !important;
		background-image: none !important;

		border-color: #01717a !important;
		color: #ffffff !important;

		box-shadow: none !important;
		transform: none !important;
	}
}

/* ==========================================================================
   MÓVIL
   ========================================================================== */

@media (max-width: 768px) {
	body.single-product .raco-program-buttons-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 8px !important;
	}

	body.single-product .raco-program-buttons-grid .raco-btn-slot--detail {
		grid-column: 1 / -1 !important;
	}

	body.single-product .raco-program-buttons-grid .single_add_to_cart_button,
	body.single-product .raco-program-buttons-grid .afrfqbt_single_page,
	body.single-product .raco-program-buttons-grid .raco-program-detail-btn {
		padding: 10px 12px !important;
		font-size: 14px !important;
		text-align: center !important;
	}

	body.single-product .raco-program-buttons-grid .raco-btn-slot--buy .single_add_to_cart_button {
		white-space: nowrap !important;
	}

	body.single-product .raco-program-buttons-grid .raco-btn-slot--detail .raco-program-detail-btn {
		width: 100% !important;
	}
}

@media (max-width: 767px) {
	body.single-product {
		--raco-product-content-width: 100%;
	}

	body.single-product .raco-product-visual-gallery {
		width: 100% !important;
		max-width: 100% !important;

		padding: 0 18px !important;
		margin: 0 auto 26px auto !important;

		box-sizing: border-box !important;
	}

	body.single-product .raco-product-visual-gallery-grid {
		display: block !important;
		width: 100% !important;
		height: auto !important;

		border-radius: 14px !important;
		box-shadow: 0 14px 32px rgba(6, 63, 136, 0.12) !important;
		overflow: hidden !important;
	}

	body.single-product .raco-product-visual-tile {
		display: none !important;
	}

	body.single-product .raco-product-visual-tile--main {
		display: block !important;
		width: 100% !important;
		height: auto !important;

		aspect-ratio: auto !important;

		border-radius: 14px !important;
		background: #ffffff !important;
		overflow: hidden !important;
	}

	body.single-product .raco-product-visual-tile--main::after {
		display: none !important;
	}

	body.single-product .raco-product-visual-tile--main img {
		display: block !important;
		width: 100% !important;
		height: auto !important;
		max-width: 100% !important;

		object-fit: contain !important;
		object-position: center center !important;

		border-radius: 14px !important;
		transform: none !important;
	}

	body.single-product .raco-product-visual-tile:hover img {
		transform: none !important;
		filter: none !important;
	}

	body.single-product .raco-product-visual-view-all {
		display: none !important;
	}

	body.single-product .raco-product-visual-mobile-button {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 9px !important;

		width: 100% !important;
		min-height: 48px !important;

		margin: 13px 0 0 0 !important;
		padding: 0 16px !important;

		border: 1px solid #01717a !important;
		border-radius: var(--raco-gallery-button-radius) !important;

		background: #01717a !important;
		background-color: #01717a !important;
		background-image: none !important;

		color: #ffffff !important;

		font-size: 15px !important;
		font-weight: 800 !important;
		line-height: 1.2 !important;
		text-align: center !important;

		cursor: pointer !important;

		opacity: 1 !important;
		filter: none !important;
		mix-blend-mode: normal !important;
		box-shadow: none !important;
		box-sizing: border-box !important;
		transform: none !important;

		transition:
			background-color 0.18s ease,
			border-color 0.18s ease,
			color 0.18s ease !important;
	}

	body.single-product .raco-product-visual-mobile-button .raco-product-visual-icon {
		width: 18px !important;
		height: 18px !important;
		color: #ffffff !important;
		stroke: #ffffff !important;
	}

	body.single-product .raco-product-visual-mobile-button:hover,
	body.single-product .raco-product-visual-mobile-button:focus-visible {
		background: #005f66 !important;
		background-color: #005f66 !important;
		background-image: none !important;

		border-color: #005f66 !important;
		color: #ffffff !important;
	}

	body.single-product .raco-product-visual-mobile-button:focus:not(:focus-visible),
	body.single-product .raco-product-visual-mobile-button:active {
		background: #01717a !important;
		background-color: #01717a !important;
		background-image: none !important;

		border-color: #01717a !important;
		color: #ffffff !important;

		box-shadow: none !important;
		transform: none !important;
	}

	.raco-product-visual-lightbox {
		padding: 70px 14px 112px 14px !important;
		background:
			radial-gradient(circle at 50% 34%, rgba(1, 113, 122, 0.07), transparent 42%),
			rgba(255, 255, 255, 0.94) !important;
	}

	.raco-product-visual-lightbox-stage {
		width: 100% !important;
		height: 66vh !important;
	}

	.raco-product-visual-lightbox-stage img {
		border-radius: 14px !important;
		box-shadow:
			0 20px 52px rgba(6, 63, 136, 0.16),
			0 6px 20px rgba(0, 0, 0, 0.10) !important;
	}

	.raco-product-visual-lightbox-close {
		top: 16px !important;
		right: 16px !important;

		width: 44px !important;
		height: 44px !important;
		min-width: 44px !important;
		min-height: 44px !important;

		border-radius: var(--raco-gallery-button-radius) !important;

		background: #01717a !important;
		background-color: #01717a !important;
		background-image: none !important;

		color: #ffffff !important;
		box-shadow: 0 8px 22px rgba(0, 0, 0, 0.20) !important;
		transform: none !important;
	}

	.raco-product-visual-lightbox-close .raco-product-visual-icon {
		width: 20px !important;
		height: 20px !important;
		color: #ffffff !important;
		stroke: #ffffff !important;
	}

	.raco-product-visual-lightbox-close:hover,
	.raco-product-visual-lightbox-close:focus-visible {
		background: #005f66 !important;
		background-color: #005f66 !important;
		background-image: none !important;

		color: #ffffff !important;
		box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22) !important;
		transform: translateY(-1px) !important;
	}

	.raco-product-visual-lightbox-close:focus:not(:focus-visible) {
		background: #01717a !important;
		background-color: #01717a !important;
		background-image: none !important;

		color: #ffffff !important;
		transform: none !important;
		box-shadow: 0 8px 22px rgba(0, 0, 0, 0.20) !important;
	}

	.raco-product-visual-lightbox-thumbs-outer {
		width: calc(100vw - 28px) !important;
		bottom: 22px !important;

		padding: 8px !important;
		border-radius: 14px !important;
	}

	.raco-product-visual-lightbox-thumb {
		flex-basis: 70px !important;
		width: 70px !important;
		height: 50px !important;
		border-radius: 9px !important;
	}
}

@media (max-width: 480px) {
	body.single-product .raco-program-buttons-grid .single_add_to_cart_button,
	body.single-product .raco-program-buttons-grid .afrfqbt_single_page,
	body.single-product .raco-program-buttons-grid .raco-program-detail-btn {
		font-size: 13px !important;
		padding: 10px 10px !important;
	}
}