/**
 * ============================================================================
 * [RUBIK] Producto — migrado desde YellowPencil (bolsa "wt_product_css")
 * ============================================================================
 *
 * NOTA PARA FUTURAS IAs / PROGRAMADORES:
 * Reemplaza el CSS que YellowPencil aplicaba a las páginas de producto individual
 * (plantilla "Product" en su panel). Fuente: `wt_product_css` (NO `wt_product_styles`
 * — ver global.css para la explicación de por qué).
 *
 * ⚠️ REGLA CON HISTORIA — sección 2, `.woocommerce-product-details__short-description h3 strong`:
 * originalmente tenía `top:50px`, que empujaba el título "QUE INCLUYE EL RENTAL" 50px
 * hacia abajo, superponiéndolo con la lista de contenido. Afectaba a 74 productos.
 * Corregido el 2026-07-29 a `top:0px`. Ver NOTAS_PARA_ANTIGRAVITY.md, sección
 * "Bug top:50px", para el análisis completo. **No volver a poner un valor de `top`
 * distinto de 0 aquí sin verificar visualmente contra la lista de abajo.**
 *
 * Este archivo se carga SOLO en páginas de producto (`is_product()`), a diferencia
 * de YellowPencil que lo cargaba en todo el sitio — mejora de rendimiento.
 *
 * @package OceanWP_Child
 * @version 1.0.0
 * @since   2026-07-29
 */

/* ===========================================================================
 * 1. TÍTULO, GALERÍA Y PRECIO
 * ======================================================================== */

#content .product h1 {
	font-size: 50px;
	line-height: 0.8em;
	letter-spacing: -1.2px;
	border-bottom-color: transparent;
}

#content .product .entry-summary {
	margin-top: 85px;
}

#content .product .woocommerce-product-gallery {
	margin-top: 38px;
}

#content .product p.price {
	color: #565656;
	font-size: 33px;
	margin-top: 0px;
	position: relative;
	top: -28px;
	font-weight: 700;
	text-decoration: none;
	word-spacing: 1px;
	letter-spacing: -1px;
}

.entry-summary .price bdi {
	color: #01c3f3;
	font-style: normal;
}

/* ===========================================================================
 * 2. DESCRIPCIÓN CORTA ("QUE INCLUYE EL RENTAL")
 * ======================================================================== */

.woocommerce-product-details__short-description h3 strong {
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	color: rgba(0, 0, 0, 0.5);
	position: relative;
	top: 0px; /* Corregido 2026-07-29 — era 50px, ver nota de cabecera */
}

/* Resto de un caption viejo (probablemente del GIF de delivery que se eliminó
   del contenido de 20 productos el 2026-07-29). Se mantiene oculto por si
   algún producto todavía tiene un <p><strong> residual en su descripción. */
.woocommerce-product-details__short-description p strong {
	color: rgb(153, 153, 153);
	font-weight: 300;
	text-transform: uppercase;
	font-size: 16px;
	position: relative;
	top: -28px;
	visibility: hidden;
}

.woocommerce-product-details__short-description p img {
	display: none;
}

.entry-summary .woocommerce-product-details__short-description h2 {
	font-family: 'roboto';
	font-weight: 300;
	color: rgba(0, 0, 0, 0.5);
	font-size: 15px;
	display: none;
}

.woocommerce-product-details__short-description ul li {
	font-weight: 300;
	line-height: 1.6em;
	font-size: 17px;
	font-family: 'Roboto', sans-serif;
}

.woocommerce-product-details__short-description ul span {
	font-family: 'roboto';
	font-weight: 300 !important;
}

.entry-summary .woocommerce-product-rating a {
	font-family: 'roboto';
	font-weight: 300;
	color: rgba(0, 0, 0, 0.5);
	font-size: 9px;
	text-transform: uppercase;
}

/* ===========================================================================
 * 3. FORMULARIO DE RESERVA (WooCommerce Bookings) — calendario, botón, addons
 * ======================================================================== */

#content .entry-summary form {
	border-top-style: none;
	border-bottom-style: none;
	border-bottom-color: transparent;
}

#wc-bookings-booking-form {
	border-style: none;
}

#wc_bookings_field_resource {
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
	border-width: 5px;
	font-family: 'roboto';
	font-weight: 500;
	color: rgba(0, 0, 0, 0.49);
	text-transform: capitalize;
}

#wc-bookings-booking-form .form-field-wide label {
	font-weight: 700;
	font-size: 21px;
	font-style: italic;
	position: relative;
	top: -6px;
	left: 17px;
	text-transform: uppercase;
}

/* --- Calendario (selector de fechas) --- */

.picker div div div span {
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	font-style: normal;
}

.picker tr a {
	font-family: 'Roboto', sans-serif;
	font-style: normal;
	font-weight: 600 !important;
	transform: translatex(0px) translatey(0px);
}

.picker td span {
	font-family: 'roboto';
	font-weight: 600 !important;
}

.picker tr td {
	font-family: 'Roboto', sans-serif;
	font-weight: 600;
	transform: translatex(0px) translatey(0px);
}

.picker tr td:hover {
	transform: translatex(0px) translatey(0px);
}

.picker tr td:active {
	background-color: #ffffff !important;
}

#content .entry-content .product .entry-summary .cart #wc-bookings-booking-form .wc-bookings-date-picker .picker div table tbody tr td a {
	background-color: rgba(178, 178, 178, 0.92) !important;
}

#content .entry-content .product .entry-summary .cart #wc-bookings-booking-form .wc-bookings-date-picker .picker div table tbody tr .selection-start-date a {
	background-color: #919191 !important;
}

#content .entry-content .product .entry-summary .cart #wc-bookings-booking-form .wc-bookings-date-picker .picker div table tbody tr .selection-end-date a {
	background-color: rgba(130, 130, 130, 0.92) !important;
}

#content .entry-content .product .entry-summary .cart #wc-bookings-booking-form .wc-bookings-date-picker .picker div table tbody tr .bookable-range a {
	background-color: rgba(135, 135, 135, 0.92) !important;
}

/* --- Botón de reservar y costo calculado --- */

.entry-summary .cart .wc-bookings-booking-form-button {
	margin-top: 21px;
	font-family: 'roboto';
	font-weight: 700;
	font-size: 35px;
	font-style: italic;
	margin-left: -1px;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 12px;
	padding-bottom: 11px;
	margin-right: 8px;
}

#wc-bookings-booking-form .wc-bookings-booking-cost {
	background-color: rgba(238, 238, 238, 0.19);
	border-top-style: none;
	font-family: 'roboto';
	font-size: 28px;
	text-transform: uppercase;
	font-weight: 700;
	font-style: normal;
	transform: translatex(0px) translatey(0px);
	color: rgba(0, 0, 0, 0.51);
	word-spacing: -1.5px;
}

/* --- Complementos / Add-ons (WooCommerce Product Add-Ons) --- */

.entry-summary .wc-pao-addon label {
	font-family: 'roboto';
	font-weight: 300;
}

.entry-summary .wc-pao-addon h2 {
	margin-bottom: 31px;
	font-weight: 700;
	font-size: 28px;
	font-family: 'roboto';
}

.entry-summary .wc-pao-addon select {
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
	border-width: 2px;
}

#outer-wrap #wrap #main #content-wrap #primary #content .entry-content .product .entry-summary .cart .wc-pao-addons-container .wc-pao-addon .wc-pao-addon-wrap select {
	width: 89% !important;
}

.product-addon-totals ul li {
	font-family: 'roboto';
	font-weight: 300;
	font-size: 16px;
	line-height: 2.2em;
	border-style: none !important;
	border-bottom-style: none;
	border-bottom-color: transparent;
	border-top-color: transparent !important;
	margin-bottom: 10px;
}

.product-addon-totals ul .wc-pao-row-quantity-based .wc-pao-col1 {
	line-height: 1.8em;
	color: rgb(153, 153, 153);
	font-style: normal;
	text-transform: none;
	letter-spacing: 0.2px;
	margin-right: 19px;
}

.product-addon-totals ul p {
	margin-top: 42px !important;
}

.product-addon-totals ul .wc-pao-subtotal-line {
	border-bottom-width: 0px;
	display: inline-block;
	transform: translatex(0px) translatey(0px) !important;
}

#product-addons-total .product-addon-totals {
	border-bottom-style: solid;
	transform: translatex(0px) translatey(0px);
}

#product-addons-total .product-addon-totals ul {
	border-bottom-color: transparent;
}

/* ===========================================================================
 * 4. PESTAÑA "DESCRIPCIÓN"
 * ======================================================================== */

#tab-description {
	font-family: 'roboto';
	font-weight: 300;
	font-size: 15px;
	transform: translatex(0px) translatey(0px);
}

#tab-description h2 {
	font-family: 'roboto';
	font-weight: 600;
	font-size: 25px;
	color: rgba(0, 0, 0, 0.62);
	font-style: normal;
}

/* ===========================================================================
 * 5. PRODUCTOS RELACIONADOS / "UP-SELLS"
 * ======================================================================== */

#content .up-sells h2 {
	font-family: 'Roboto', sans-serif;
	font-size: 20px;
	font-weight: 600;
	font-style: italic;
}

.up-sells .grid .price {
	font-weight: 700;
	font-family: 'roboto';
	text-transform: uppercase;
	color: #474747 !important;
}

.up-sells h2 a {
	font-size: 16px !important;
	font-weight: 700;
}

.up-sells .category a {
	visibility: hidden; /* oculta la categoría duplicada en la tarjeta de producto */
}

.up-sells .btn-wrap a {
	border-top-style: none !important;
	border-right-style: none !important;
	border-bottom-style: none !important;
	border-left-style: none !important;
	font-weight: 700 !important;
	font-style: italic !important;
	color: #3a3a3a !important;
	border-top-left-radius: 3px !important;
	border-top-right-radius: 3px !important;
	border-bottom-left-radius: 3px !important;
	border-bottom-right-radius: 3px !important;
	text-transform: uppercase !important;
	letter-spacing: 0.4px;
	word-spacing: -0.5px;
	font-size: 19px !important;
}

.related .grid .price {
	color: #000000 !important;
	font-weight: 700;
	text-transform: uppercase;
}

.related h2 a {
	font-size: 20px !important;
	font-weight: 700;
	color: rgba(27, 27, 27, 0.79) !important;
}

.related .category a {
	visibility: hidden; /* misma razón que .up-sells .category a */
}

.related .btn-wrap a {
	transform: translatex(0px) translatey(0px);
	font-weight: 700 !important;
	font-style: italic !important;
	font-size: 19px !important;
	line-height: 1.3em !important;
	color: #353535 !important;
	border-top-left-radius: 3px !important;
	border-top-right-radius: 3px !important;
	border-bottom-left-radius: 3px !important;
	border-bottom-right-radius: 3px !important;
	border-top-style: none !important;
	border-right-style: none !important;
	border-bottom-style: none !important;
	border-left-style: none !important;
	border-left-color: transparent !important;
	border-bottom-color: transparent !important;
	border-top-color: transparent !important;
	border-right-color: transparent !important;
	text-transform: uppercase !important;
	letter-spacing: 0.3px;
}

/* ===========================================================================
 * 6. RESPONSIVE
 * ======================================================================== */

@media (max-width: 660px) {
	#main {
		position: relative;
		top: -44px;
		padding-top: 28px;
		display: inline-block;
		transform: translatex(0px) translatey(0px);
	}
	#wc-bookings-booking-form {
		transform: translatex(0px) translatey(0px);
	}
	.entry-summary .cart .wc-bookings-booking-form-button {
		margin-right: 120px;
		padding-top: 10px;
		padding-bottom: 10px;
		position: relative;
		left: 10px;
	}
	#content .entry-summary form {
		transform: translatex(0px) translatey(0px);
	}
}

@media (max-width: 479px) {
	.entry-summary .wc-pao-addon select {
		border-width: 3px !important;
		border-top-left-radius: 1px !important;
		border-top-right-radius: 1px !important;
		border-bottom-left-radius: 1px !important;
		border-bottom-right-radius: 1px !important;
		width: 341px !important;
		color: rgba(0, 0, 0, 0.55);
	}
	.entry-summary .cart .wc-bookings-booking-form-button {
		margin-top: 40px;
		margin-left: 0px;
		line-height: 1em;
		font-size: 40px;
		letter-spacing: -0.1px;
		word-spacing: 3.1px;
		margin-right: 0px;
		position: relative;
		left: 10px;
	}
	#wc-bookings-booking-form .wc-bookings-booking-cost {
		font-size: 31px;
		display: inline-block;
		transform: translatex(0px) translatey(0px) !important;
		word-spacing: 0px;
		letter-spacing: -1px;
		column-count: 1;
		line-height: 1em;
	}
	#content .product p.price {
		line-height: 1em;
		font-size: 33px;
	}
	#content .product .entry-summary {
		margin-top: 38px;
	}
	#content .woocommerce-product-gallery ol {
		opacity: 0.62;
		display: none;
	}
	#submit {
		font-family: 'Roboto', sans-serif;
		font-weight: 700;
		font-size: 18px;
		letter-spacing: 0.6px;
		font-style: italic;
	}
}
