/* SAS Finanzas · Panel · reacción al pasar el mouse.
   Cada componente responde cuando el mouse está encima, para que siempre se note dónde está; los espacios en
   blanco no cambian. Solo en equipos con mouse (en celular no hay "pasar encima"). Tres niveles:
     · tarjetas chicas (números, citas, datos): se levantan un poco y ganan sombra y borde de color;
     · paneles grandes (lista, conversación, tablas, gráficas): borde de color y sombra suave, sin moverse;
     · renglones y burbujas: se ilumina el fondo o aparece una sombra ligera. */

@media (hover:hover) and (pointer:fine){
  /* transiciones comunes */
  .bd-metrica,.kpi,.bd-tarjeta,.bd-sabe,.bd-lista,.bd-chat,.tarjeta,.filtros,.tabla-caja,.explica,
  .bd-burbuja,.bd-evento,.bd-dato,.bd-actividad li,.bd-cita,.embudo .paso,.btn,.bd-filtro,.entrada,.bd-buscar{
    transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,border-color .2s ease,background-color .2s ease}

  /* 1. Tarjetas chicas: se levantan */
  .bd-metrica:hover,.kpi:hover,.bd-tarjeta:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--t,var(--color,var(--acento))) 45%,var(--borde));
    box-shadow:0 14px 28px -18px rgba(22,35,63,.45)}
  .bd-metrica:hover::before,.kpi:hover::before{width:56px;transition:width .3s cubic-bezier(.2,.8,.2,1)}
  .bd-metrica::before,.kpi::before{transition:width .3s cubic-bezier(.2,.8,.2,1)}
  .bd-sabe:hover{transform:translateY(-3px);box-shadow:0 18px 34px -18px rgba(22,35,63,.75)}

  /* 2. Paneles grandes: borde de color y sombra, sin moverse */
  .bd-lista:hover,.bd-chat:hover,.tarjeta:hover,.tabla-caja:hover,.filtros:hover{border-color:#B9D7CF;box-shadow:0 12px 30px -22px rgba(22,35,63,.5)}
  .explica:hover{box-shadow:0 10px 24px -20px rgba(15,107,92,.6)}

  /* 3. Renglones y burbujas */
  .bd-burbuja:hover{box-shadow:0 6px 16px -10px rgba(22,35,63,.45);transform:translateY(-1px)}
  .bd-evento:hover{border-color:var(--borde-fuerte);background:var(--panel-2)}
  .bd-dato{margin:0 -8px;padding-left:8px;padding-right:8px;border-radius:6px}
  .bd-dato:hover{background:rgba(255,255,255,.08)}
  .bd-actividad li:hover b{color:var(--acento)}
  .bd-cita:hover .bd-cal{background:var(--acento);color:#fff}
  .bd-cal{transition:background .2s ease,color .2s ease}
  .embudo .paso{border-radius:6px;padding:2px 6px;margin:0 -6px}
  .embudo .paso:hover{background:var(--panel-2)}
  .bd-item:hover .bd-avatar{transform:scale(1.06)}
  .bd-avatar{transition:transform .2s cubic-bezier(.2,.8,.2,1)}

  /* Controles: botones, filtros y campos */
  .btn:not(:disabled):hover{transform:translateY(-1px)}
  .btn:not(:disabled):active{transform:scale(.98)}
  .bd-filtro:not(.activo):hover{border-color:var(--borde-fuerte);transform:translateY(-1px)}
  .entrada:hover,.bd-buscar:hover{border-color:var(--borde-fuerte)}
  .bd-tomar:not(:disabled):hover,.bd-enviar:not(:disabled):hover{box-shadow:0 8px 18px -8px rgba(15,107,92,.7)}
}

@media (prefers-reduced-motion:reduce){
  .bd-metrica:hover,.kpi:hover,.bd-tarjeta:hover,.bd-sabe:hover,.bd-burbuja:hover,.btn:hover,.bd-filtro:hover{transform:none!important}
}