/**
 * Estilos del Generador de tonos + ruido + barrido + prueba de altavoz.
 * Hereda tokens y componentes (theme-agnostic) de iat-core.css.
 * Las pestañas usan el componente compartido .iat-tabs/.iat-tab del core.
 */

/* Con 4 pestañas, permitir que envuelvan en pantallas estrechas */
.iat-gen .iat-tabs { flex-wrap: wrap; }
.iat-gen .iat-tab { min-width: 5.5rem; }

/* Fila de frecuencia */
.iat-gen__freqrow { display: flex; align-items: center; gap: .5rem; margin-bottom: .6rem; }
.iat-gen__freqrow .iat-input { max-width: 9rem; }
.iat-gen__freqrow .iat-range { margin-bottom: 0; }
.iat-gen__unit { color: var(--iat-muted); font-weight: 600; white-space: nowrap; }
.iat-gen__presets { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .6rem; }

/* Barrido: dos campos en paralelo (desde/hasta, escala/repetición) */
.iat-gen__range2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.25rem; }
@media (max-width: 480px) { .iat-gen__range2 { grid-template-columns: 1fr; } }

/* Barrido: display de frecuencia en vivo + barra de progreso */
.iat-gen__swdisplay {
	margin: 1rem 0 .4rem;
	padding: 1rem 1.2rem;
	border-radius: var(--iat-radius-sm);
	background: var(--iat-surface);
}
.iat-gen__swfreq {
	font-size: 2rem;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
	line-height: 1.1;
	color: var(--iat-accent);
	text-align: center;
}
.iat-gen__swbar {
	margin-top: .7rem;
	height: 10px;
	border-radius: 999px;
	background: var(--iat-surface-2);
	overflow: hidden;
}
.iat-gen__swbar-fill {
	height: 100%;
	width: 0;
	border-radius: 999px;
	background: var(--iat-accent);
	transition: width .08s linear;
}

/* Prueba de altavoz: rejillas de botones */
.iat-gen__spgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin-bottom: .35rem; }
.iat-gen__spgrid--2 { grid-template-columns: repeat(2, 1fr); }
.iat-gen__spbtn { width: 100%; }

/* Botón de altavoz activo: resaltado con el acento (blindado frente al theme) */
.iat .iat-gen__spbtn.is-active,
.iat .iat-gen__spbtn.is-active:hover,
.iat .iat-gen__spbtn.is-active:focus {
	background-color: var(--iat-accent) !important;
	color: #fff !important;
	border-color: var(--iat-accent) !important;
}

/* Presets guardados («Mis ajustes») */
.iat-gen__presetwrap { display: inline-flex; align-items: stretch; }
.iat-gen__presetwrap .iat-chip:first-child { border-radius: 999px 0 0 999px; }
.iat-gen__presetdel { border-radius: 0 999px 999px 0 !important; border-left: 0; padding: .4em .7em; }