/*
Theme Name: Avada Child - Orlando Comercial
Theme URI: https://orlandocomercial.com
Description: Child theme para Avada. Visor 360, ficha producto y cotizaciones.
Author: Orlando Comercial
Template: Avada
Version: 1.0.0
Text Domain: avada-child
*/

/* Visor 360 — contenedor (estilos base; ampliar en frontend.css del plugin) */
.oc360-product-layout .oc360-viewer-wrap {
	margin-bottom: 1.5rem;
}

/* Fondo del visor: lo define el plugin (blanco). Evitar franja oscura bajo el canvas. */
.oc360-viewer-box {
	background: #ffffff;
	border: none;
	border-radius: 0;
	overflow: visible;
	min-height: 0;
	position: relative;
}

.oc360-viewer-hint {
	font-size: 0.75rem;
	color: #888;
	text-align: center;
	margin-top: 0.5rem;
}

.oc360-cotiza-cta {
	margin-top: 1rem;
}

.oc360-cotiza-cta .button {
	background: #e30613;
	border-color: #e30613;
}

.oc360-cotiza-cta .button:hover {
	background: #c00510;
	border-color: #c00510;
}

/* Columna de imágenes Avada — ancho completo para layout 360 */
.single-product.oc360-product-layout .avada-single-product-gallery-wrapper {
	width: 100%;
	max-width: 100%;
}

.single-product.oc360-product-layout .oc360-product-stage {
	max-width: 100%;
}

/* ============================================================
   Hero / Banner — Responsive Fix
   ============================================================ */

/* Avada JS pone max-height inline calculado por viewport; lo quitamos */
.fusion-fullwidth:has(.awb-background-slider) {
	max-height: none !important;
}

/* Imágenes en cover para que llenen el slide (Fusion Builder las pone en contain) */
.awb-background-slider__image {
	object-fit: cover !important;
	width: 100% !important;
	height: 100% !important;
}

/* ----------------------------------------------------------
   HOME — slider 1920×700 (ratio ~36.5% del ancho)
   ---------------------------------------------------------- */
@media only screen and (max-width: 1280px) {
	body.home .fusion-fullwidth:has(.awb-background-slider) {
		min-height: 450px !important;
	}
}

@media only screen and (max-width: 1024px) {
	body.home .fusion-fullwidth:has(.awb-background-slider) {
		min-height: 380px !important;
	}
}

@media only screen and (max-width: 768px) {
	body.home .fusion-fullwidth:has(.awb-background-slider) {
		min-height: 300px !important;
	}
}

@media only screen and (max-width: 640px) {
	body.home .fusion-fullwidth:has(.awb-background-slider) {
		min-height: 240px !important;
		display: block !important;
		visibility: visible !important;
	}
}

@media only screen and (max-width: 480px) {
	body.home .fusion-fullwidth:has(.awb-background-slider) {
		min-height: 180px !important;
	}
}

/* ----------------------------------------------------------
   SINGLE PRODUCT — banner 1920×380 (ratio ~19.8% del ancho)
   Escala proporcional con clamp: mínimo 110px, ideal 19.8vw,
   máximo 380px (tamaño nativo del banner)
   ---------------------------------------------------------- */
body.single-product .fusion-fullwidth:has(.awb-background-slider) {
	min-height: clamp(110px, 19.8vw, 380px) !important;
}