/* =========================================================
   Efecto hover dinámico para íconos y botones
   ========================================================= */
.hover-dark {
  transition:
    background-color 0.25s ease,
    transform 0.25s ease,
    filter 0.25s ease;
}

.hover-dark:hover {
  background-color: rgb(63 63 70); /* zinc-700 */
  transform: scale(1.08);
  filter: brightness(1.15);
}

.hover-dark:active {
  transform: scale(0.96);
  filter: brightness(0.95);
}

/* =========================================================
   Efecto hover-pop para botones principales
   ========================================================= */
.hover-pop {
  transition:
    background-color 0.25s ease,
    transform 0.25s ease,
    filter 0.25s ease;
}

.hover-pop:hover {
  background-color: rgb(63 63 70); /* zinc-700 */
  transform: scale(1.05);
  filter: brightness(1.1);
}

.hover-pop:active {
  transform: scale(0.97);
  filter: brightness(0.95);
}