/* ==========================================================================
   dt_feedback.css — Respuesta al TACTO para TODA la app (HOM/DOP-01).
   Se carga EL ÚLTIMO (después de dt_tokens.css) para ganar la cascada sin
   necesitar !important. Solo toca transform / filter / box-shadow / outline
   (propiedades aditivas y seguras): jamás layout, color de fondo ni tamaño.

   El problema que resuelve: el usuario pulsa un botón y no pasa NADA visible.
   Con esto, CUALQUIER botón de la app (primario, gris, outline, icono, chip,
   y enlaces que actúan como botón):
     · se levanta un poco al pasar el ratón (:hover)
     · SE HUNDE de forma clara al pulsarlo (:active)  ← la señal que faltaba
     · muestra un anillo de foco con teclado (:focus-visible)

   Nota: el press se hace NOTABLE (scale .96 + oscurecido) para que también se
   sienta en los botones planos (gris/outline), no solo en los de degradado que
   ya tienen sombra grande.
   ========================================================================== */

/* --- Lista única de "cosas pulsables" de DianaTool. Incluye el <button> a
       secas (cubre el 95%) + las clases reales del proyecto + enlaces/divs que
       funcionan como botón (campana, idioma, chips…). --- */
button:not([disabled]):not([aria-disabled="true"]),
[role="button"]:not([aria-disabled="true"]),
.btn, .btn-primary, .btn-secondary, .btn-crear, .btn-sm,
.button, .primary-button, .gray-button, .outline-button, .gradient-button,
.icon-button, .config-button, .filter-btn, .stat-card-menu,
.aa-btn, .aa-primary, .dt-btn, .gmb-opt, .flow-node-btn, .wc-btn,
.ch-chip, .filter-btn, .preview-remove, .btnCierre, .btnCancel,
a.btn, a.button, a.dt-btn, a.btn-crear, a.icon-button,
input[type="submit"]:not([disabled]),
input[type="button"]:not([disabled]){
  transition: transform 120ms cubic-bezier(.2,.8,.2,1),
              filter    120ms cubic-bezier(.2,.8,.2,1),
              box-shadow 120ms cubic-bezier(.2,.8,.2,1) !important;
}

/* Hover: sube y se ilumina un pelín. */
button:not([disabled]):not([aria-disabled="true"]):hover,
[role="button"]:not([aria-disabled="true"]):hover,
.btn:hover, .btn-primary:hover, .btn-secondary:hover, .btn-crear:hover, .btn-sm:hover,
.button:hover, .primary-button:hover, .gray-button:hover, .outline-button:hover, .gradient-button:hover,
.icon-button:hover, .config-button:hover, .filter-btn:hover, .stat-card-menu:hover,
.aa-btn:hover, .aa-primary:hover, .dt-btn:hover, .gmb-opt:hover, .flow-node-btn:hover, .wc-btn:hover,
.ch-chip:hover, .preview-remove:hover, .btnCierre:hover, .btnCancel:hover,
a.btn:hover, a.button:hover, a.dt-btn:hover, a.btn-crear:hover, a.icon-button:hover,
input[type="submit"]:not([disabled]):hover,
input[type="button"]:not([disabled]):hover{
  transform: translateY(-1px);
  filter: brightness(1.04);
}

/* Active: SE HUNDE, CLARO. scale .96 + oscurecido para que se note también en
   los botones planos. Duración corta para que se sienta inmediato. */
button:not([disabled]):not([aria-disabled="true"]):active,
[role="button"]:not([aria-disabled="true"]):active,
.btn:active, .btn-primary:active, .btn-secondary:active, .btn-crear:active, .btn-sm:active,
.button:active, .primary-button:active, .gray-button:active, .outline-button:active, .gradient-button:active,
.icon-button:active, .config-button:active, .filter-btn:active, .stat-card-menu:active,
.aa-btn:active, .aa-primary:active, .dt-btn:active, .gmb-opt:active, .flow-node-btn:active, .wc-btn:active,
.ch-chip:active, .preview-remove:active, .btnCierre:active, .btnCancel:active,
a.btn:active, a.button:active, a.dt-btn:active, a.btn-crear:active, a.icon-button:active,
input[type="submit"]:not([disabled]):active,
input[type="button"]:not([disabled]):active{
  transform: translateY(1px) scale(.96) !important;
  filter: brightness(.92);
  transition-duration: 60ms !important;
}

/* Foco por teclado: un anillo homogéneo en toda la app. */
button:focus-visible,
[role="button"]:focus-visible,
.btn:focus-visible, .button:focus-visible, .primary-button:focus-visible,
.gray-button:focus-visible, .outline-button:focus-visible, .gradient-button:focus-visible,
.icon-button:focus-visible, .config-button:focus-visible, .filter-btn:focus-visible,
.aa-btn:focus-visible, .dt-btn:focus-visible, .btn-crear:focus-visible,
a.btn:focus-visible, a.button:focus-visible, a.dt-btn:focus-visible, a.icon-button:focus-visible,
input[type="submit"]:focus-visible,
input[type="button"]:focus-visible{
  outline: 2px solid var(--dt-link, #0C7C99);
  outline-offset: 2px;
}

/* Botón ocupado (lo pone dtBusy): cursor de progreso y sin más pulsaciones. */
[aria-busy="true"]{ cursor: progress !important; pointer-events: none; }

/* Spinner reutilizable para el estado "Cargando…". */
.dt-spinner{
  display:inline-block; width:15px; height:15px; vertical-align:-2px;
  margin-right:2px; border-radius:50%;
  border:2px solid currentColor; border-right-color:transparent;
  animation: dtSpin .7s linear infinite;
}
@keyframes dtSpin{ to{ transform: rotate(360deg); } }

/* Accesibilidad: quien pide menos movimiento, no recibe saltos. */
@media (prefers-reduced-motion: reduce){
  button, [role="button"], .btn, .button, .primary-button, .gray-button,
  .outline-button, .gradient-button, .icon-button, .config-button, .filter-btn,
  .aa-btn, .dt-btn, .btn-crear, .ch-chip, a.btn, a.button, a.dt-btn{
    transition: none !important;
  }
  button:hover, button:active, [role="button"]:hover, [role="button"]:active,
  .gray-button:active, .outline-button:active, .button:active, .icon-button:active{
    transform: none !important;
  }
  .dt-spinner{ animation-duration: 1.8s; }
}