/*
 * Sportiva Sidebar Area — CSS
 * Caricato on-demand: solo quando il widget o lo shortcode vengono usati.
 *
 * Classi:
 *   .spv-sidebar-area                  — wrapper base
 *   .spv-sidebar-area--template-{id}   — classe con ID template
 *   .spv-sidebar-area--sticky          — sticky attivato
 *   .spv-sidebar-area--sticky-tablet-off — disattiva sticky ≤1024px
 *   .spv-sidebar-area--sticky-mobile-off — disattiva sticky ≤767px
 *   .spv-sidebar-area--editor-placeholder — placeholder editor
 */

/* ── Base ───────────────────────────────────────────────────────── */

.spv-sidebar-area {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	overflow-x: hidden;
}

/* Immagini interne non escono dal wrapper */
.spv-sidebar-area img,
.spv-sidebar-area video,
.spv-sidebar-area iframe {
	max-width: 100%;
	height: auto;
}

/* Widget Elementor interni contenuti nella larghezza */
.spv-sidebar-area .elementor-widget-wrap {
	max-width: 100%;
}

/* ── Sticky ─────────────────────────────────────────────────────── */

.spv-sidebar-area--sticky {
	position: sticky;
	top: var(--spv-sidebar-sticky-top, 100px);
	z-index: var(--spv-sidebar-z-index, 10);
	/* Align-self stretch evita che la sidebar si "sganci" dal suo grid cell */
	align-self: flex-start;
}

/*
 * Disattivazione sticky responsive.
 * Tablet (≤1024px): se classe --sticky-tablet-off presente.
 * Mobile (≤767px) : se classe --sticky-mobile-off presente.
 */
@media (max-width: 1024px) {
	.spv-sidebar-area--sticky.spv-sidebar-area--sticky-tablet-off {
		position: static;
		top: auto;
		z-index: auto;
	}
}

@media (max-width: 767px) {
	.spv-sidebar-area--sticky.spv-sidebar-area--sticky-mobile-off {
		position: static;
		top: auto;
		z-index: auto;
	}
}

/* ── Placeholder editor ─────────────────────────────────────────── */

.spv-sidebar-area--editor-placeholder {
	background: #f9f9f9;
	border: 2px dashed #2271b1;
	border-radius: 6px;
	padding: 16px 20px;
	color: #2271b1;
	font-size: 13px;
	font-style: italic;
	text-align: center;
	min-height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
}