/* ===================== Barra de filtros alineada (.filtros.fx) — 08-oct-2026 =====================
   Pedido de Jose: «estiliza todos los filtros de las hojas, los veo algo desordenados (no alineados), eso incluye los
   botones de llamadas salientes, personalizar tarjetas u oportunidades… quizá a un mismo nivel».
   Cada filtro es un .fld (etiqueta arriba, control abajo); todos los controles miden lo mismo (--fx-h) y se alinean por
   abajo. Acciones y herramientas, ver .fx-acc / .fx-tools. Aplica a Diario, Intervalos, Supervisores, Asesores, Horas y
   a las ventanas de Oportunidades y Llamadas salientes (Jose lo pidió el 08-oct-2026). */

.filtros.fx{
  --fx-h:36px;
  display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 14px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:12px 16px 14px;margin-bottom:16px;box-shadow:0 6px 22px rgba(0,0,0,.12);
}
.filtros.fx .fld{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0}
.filtros.fx .fld > label:not(.fx-chk){
  font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--muted);line-height:1;white-space:nowrap;padding-left:2px;
}

/* controles: misma altura, misma letra */
.filtros.fx :is(select.ctl,input.ctl,button.ctl){
  box-sizing:border-box;height:var(--fx-h);padding:0 12px;font-family:var(--sans);font-size:13px;font-weight:500;
  background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:var(--r-md);
  min-width:120px;max-width:240px;
}
.filtros.fx select.ctl{cursor:pointer}
.filtros.fx :is(select.ctl,input.ctl,button.ctl):hover{border-color:color-mix(in srgb,var(--accent) 55%,var(--border))}
.filtros.fx :is(select.ctl,input.ctl,button.ctl):focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.filtros.fx select.ctl.filtro-activo{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.filtros.fx input.inp-tnps-meta{min-width:0;width:84px}
.filtros.fx .fld-buscar input.ctl{width:200px}
.filtros.fx .fecha-multi{min-width:150px}
.filtros.fx button.fecha-multi-btn{width:100%;text-align:left;cursor:pointer}

/* botones segmentados y cápsulas: misma altura que los combos */
.filtros.fx .dias-grp{margin:0;gap:0;height:var(--fx-h);border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;background:var(--surface2)}
.filtros.fx .fx-seg{display:inline-flex;height:var(--fx-h);border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;background:var(--surface2)}
.filtros.fx :is(.dias-grp,.fx-seg) .dias-btn{height:100%;border:0;border-radius:0;padding:0 13px;font-family:var(--sans);font-size:12.5px}
.filtros.fx :is(.dias-grp,.fx-seg) .dias-btn + .dias-btn{border-left:1px solid var(--border)}
.filtros.fx .vista-tgl{box-sizing:border-box;height:var(--fx-h);align-items:center}
.filtros.fx .vista-tgl button{padding:0 14px;height:100%}

/* casillas con aspecto de control */
.filtros.fx .fx-chk{
  box-sizing:border-box;height:var(--fx-h);padding:0 12px;gap:8px;border:1px solid var(--border);border-radius:var(--r-md);
  background:var(--surface2);font-family:var(--sans);font-size:13px;font-weight:500;color:var(--text);white-space:nowrap;
  text-transform:none;letter-spacing:0;
}
.filtros.fx .fx-chk input{width:15px;height:15px;margin:0}

/* chips de filtros activos (Asesores) */
.filtros.fx .fx-chips{display:flex;gap:6px;align-items:center;align-self:center;flex-wrap:wrap}

/* .fx-acc: acciones del filtro (Aplicar, Reset, Restablecer, Actualizar) seguidas del último filtro, a la misma altura.
   .fx-tools: herramientas (Excel, Columnas, Personalizar tarjetas, Oportunidades, Llamadas salientes) en su propia fila,
   abajo a la izquierda (Jose, 08-oct-2026: «en horas después de incluir sin match… aplicar y reset y abajo a la izquierda
   lo restante»). */
.filtros.fx .fx-acc{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end}
.filtros.fx .fx-tools{
  flex-basis:100%;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-start;
  padding-top:2px;   /* sin línea punteada (Jose, 08-oct-2026) */
}
.filtros.fx :is(.fx-acc,.fx-tools) :is(.dias-btn,.btn-export,.btn-excel){
  box-sizing:border-box;height:var(--fx-h);min-height:0;padding:0 14px;display:inline-flex;align-items:center;gap:6px;margin:0;
  font-family:var(--sans);font-size:12.5px;font-weight:600;border-radius:var(--r-md);white-space:nowrap;transform:none;
}
.filtros.fx .fx-tools .xf-chip{align-self:center}

/* tema iOS: sin borde, relleno gris como sus controles */
body.ios .filtros.fx{border:0;box-shadow:0 1px 3px rgba(0,0,0,.06)}
body.ios .filtros.fx .fld > label:not(.fx-chk){font-size:11px;letter-spacing:.04em}
body.ios .filtros.fx :is(select.ctl,input.ctl,button.ctl,.fx-chk,.dias-grp,.fx-seg){border:0;border-radius:10px}
/* tema Neón */
body.neon .filtros.fx{background:rgba(21,18,49,.7);border-color:rgba(var(--neon-c),.25)}
body.neon .filtros.fx .fld > label:not(.fx-chk){color:#5ff3ff}

@media (max-width:760px){
  .filtros.fx{padding:10px 12px 12px;gap:10px}
  .filtros.fx .fld{flex:1 1 130px;align-items:stretch}
  .filtros.fx :is(select.ctl,input.ctl,button.ctl){max-width:none;width:100%}
  .filtros.fx .fld-buscar{flex-basis:100%}
  .filtros.fx .fld-buscar input.ctl{width:100%}
  .filtros.fx .fecha-multi{min-width:0;width:100%}
  .filtros.fx .fx-chk{font-size:12px;padding:0 10px;overflow:hidden}
}