/* barrilete · Venezuela y Colombia
 * El diseño llega con estilos en línea; aquí van solo las reglas base del
 * diseño, los estados (hover/focus) y lo que hace funcionar vistas,
 * acordeón, menú y reproductores. Todo va bajo .bve para no chocar con el
 * tema activo de WordPress.
 */

/* ------------------------------------------------------ base del diseño */
.bve {
	font-family: 'Figtree', system-ui, sans-serif;
	color: #23252B;
	background: #ffffff;
	min-height: 100vh;
	-webkit-font-smoothing: antialiased;
}
.bve *, .bve *::before, .bve *::after { box-sizing: border-box; }
.bve img { max-width: 100%; }
.bve a { color: #2F3DBB; }
.bve a:hover { color: #1A2782; }
.bve :focus-visible { outline: 3px solid #2F3DBB; outline-offset: 2px; border-radius: 4px; }
.bve button:focus-visible, .bve a:focus-visible { outline: 3px solid #2F3DBB; outline-offset: 2px; }
.bve ::selection { background: #FFD24A; color: #17205A; }
.bve textarea { font-family: 'Figtree', sans-serif; }
.bve [data-printonly] { display: none; }

@media (prefers-reduced-motion: reduce) {
	.bve * { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

@keyframes waveBar { 0%, 100% { transform: scaleY(0.3); } 50% { transform: scaleY(1); } }
@keyframes spin { to { transform: rotate(360deg); } }

/* ------------------------------------------------------------- vistas */
.bve-view { display: none; }
.bve-view.is-active { display: block; }

/* ---------------------------------------------------------- acordeón */
.bve-acc-panel { display: none; }
.bve [aria-expanded="true"] + .bve-acc-panel { display: block; }
.bve-acc-open { display: none; }
.bve [aria-expanded="true"] .bve-acc-open { display: inline; }
.bve [aria-expanded="true"] .bve-acc-closed { display: none; }

/* ---------------------------------------------------- iconos de audio */
.bve [data-audio-card] .bve-ic-pause,
.bve [data-audio-card] .bve-ic-spin { display: none; }
.bve [data-audio-card][data-state="playing"] .bve-ic-play,
.bve [data-audio-card][data-state="loading"] .bve-ic-play { display: none; }
.bve [data-audio-card][data-state="playing"] .bve-ic-pause { display: block; }
.bve [data-audio-card][data-state="loading"] .bve-ic-spin { display: block; }

/* -------------------------------------------------- menú adaptable */
/* El botón conserva ambos iconos y se alternan por CSS: si se reemplazara
   el contenido al hacer clic, el nodo pulsado se desprendería y el cierre
   por clic-fuera dispararía de inmediato. */
.bve [data-menu-btn] .bve-ic-close { display: none; }
.bve [data-menu-btn][aria-expanded="true"] .bve-ic-menu { display: none; }
.bve [data-menu-btn][aria-expanded="true"] .bve-ic-close { display: block; }

@media (max-width: 640px) {
	.bve [data-hide-mobile] { display: none !important; }
	.bve [data-sticky-desktop] { position: static !important; top: auto !important; }
}

@media (max-width: 899px) {
	.bve [data-menu-btn] { display: flex !important; }
	.bve [data-nav-mobile] {
		position: absolute; left: 0; right: 0; top: 100%;
		flex-direction: column; align-items: stretch; gap: 4px !important;
		background: #fff; border-bottom: 1px solid #ECE7DC;
		box-shadow: 0 14px 24px -18px rgba(23,32,90,0.5);
		padding: 8px clamp(18px,5vw,28px) 14px; margin-left: 0 !important;
	}
	.bve [data-nav-mobile] button { width: 100%; text-align: left; min-height: 48px; font-size: 17px; padding: 12px 12px !important; }
	.bve [data-nav-mobile][data-open="false"] { display: none !important; }
}

/* ------------------------------------------------------- impresión */
@media print {
	body { background: #fff !important; }
	.bve [data-noprint] { display: none !important; }
	.bve [data-printonly] { display: block !important; }
	.bve [data-print-area] { border: none !important; box-shadow: none !important; background: #fff !important; padding: 0 !important; }
	.bve [data-audio-card] { display: none !important; }
	/* al imprimir, el acordeón se abre completo para no perder contenido */
	.bve .bve-acc-panel { display: block !important; }
}
