/**
 * Estilos frontend del banner NubeAds.
 *
 * @package NubeAds
 * @version 1.2.0
 */

.nubeads-banner-wrap {
	box-sizing: border-box;
	clear: both;
	container-name: nubeads;
	container-type: inline-size;
	display: flow-root;
	isolation: isolate;
	margin-block: 1.5rem;
	overflow: visible;
	padding-inline: 1rem;
	position: relative;
	width: 100%;
}

.nubeads-banner {
	box-sizing: border-box;
	display: block;
	max-width: 100%;
	position: static;
	width: 100%;
}

.nubeads-banner__label {
	color: #6b7280;
	display: block;
	font-size: 0.75rem;
	letter-spacing: 0.02em;
	line-height: 1.4;
	margin-bottom: 0.35rem;
	padding-inline: 0;
	text-align: left;
}

.nubeads-banner-wrap .nubeads-banner__media {
	display: block;
	position: relative;
	width: 100%;
}

.nubeads-banner__media {
	line-height: 0;
	overflow: hidden;
}

.nubeads-banner__media a {
	display: block;
	position: relative;
	text-decoration: none;
}

.nubeads-banner-wrap .nubeads-banner__image {
	float: none !important;
	height: auto !important;
	max-width: 100%;
	object-fit: contain !important;
	position: relative !important;
	transform: none !important;
	width: 100%;
}

/* Layout auto: desktop por defecto, mobile si el contenedor es estrecho */
.nubeads-banner-wrap.nubeads-banner-wrap--layout-auto .nubeads-banner__image--desktop {
	display: block;
}

.nubeads-banner-wrap.nubeads-banner-wrap--layout-auto .nubeads-banner__image--mobile {
	display: none !important;
}

@container nubeads (max-width: 767px) {
	.nubeads-banner-wrap.nubeads-banner-wrap--layout-auto .nubeads-banner__image--desktop {
		display: none !important;
	}

	.nubeads-banner-wrap.nubeads-banner-wrap--layout-auto .nubeads-banner__image--mobile {
		display: block !important;
	}
}

@supports not (container-type: inline-size) {
	@media (max-width: 767px) {
		.nubeads-banner-wrap.nubeads-banner-wrap--layout-auto .nubeads-banner__image--desktop {
			display: none !important;
		}

		.nubeads-banner-wrap.nubeads-banner-wrap--layout-auto .nubeads-banner__image--mobile {
			display: block !important;
		}
	}
}

/* Layout desktop: siempre imagen desktop */
.nubeads-banner-wrap.nubeads-banner-wrap--layout-desktop .nubeads-banner__image--desktop {
	display: block !important;
}

.nubeads-banner-wrap.nubeads-banner-wrap--layout-desktop .nubeads-banner__image--mobile {
	display: none !important;
}

/* Layout compact: siempre imagen mobile (sidebar, widgets estrechos) */
.nubeads-banner-wrap.nubeads-banner-wrap--layout-compact .nubeads-banner__image--desktop {
	display: none !important;
}

.nubeads-banner-wrap.nubeads-banner-wrap--layout-compact .nubeads-banner__image--mobile {
	display: block !important;
}

.elementor-widget-shortcode .nubeads-banner-wrap,
.elementor-element .nubeads-banner-wrap {
	float: none !important;
	min-height: 0;
	position: relative !important;
}

@media (max-width: 767px) {
	.elementor-widget-shortcode .elementor-widget-container,
	.elementor-element .elementor-widget-container {
		height: auto !important;
		min-height: 0 !important;
		overflow: visible !important;
		position: relative !important;
	}

	.elementor-widget-shortcode.nubeads-has-banner,
	.elementor-widget-shortcode.nubeads-has-banner .elementor-widget-container {
		height: auto !important;
		margin-bottom: 1rem !important;
		overflow: visible !important;
	}

	.nubeads-banner-wrap {
		contain: none !important;
		display: block !important;
		margin-block: 1.25rem 2rem !important;
		overflow: visible !important;
		padding-inline: 1rem;
		position: relative !important;
		z-index: 1;
	}

	.nubeads-banner__media {
		line-height: normal !important;
		min-height: 1px;
		overflow: visible !important;
	}

	.nubeads-banner__image {
		height: auto !important;
		inset: auto !important;
		left: auto !important;
		max-height: none !important;
		object-fit: contain !important;
		position: static !important;
		top: auto !important;
		width: 100% !important;
	}
}
