.hover-glow {
  transition: text-shadow 0.3s ease-in-out, color 0.3s ease-in-out;
}

.group:hover .hover-glow {
  text-shadow: 0 0 6px #d279ff, 0 0 12px #ffb3ff;
  color: #fff;
}

.glow-button {
  box-shadow: 0 0 10px #bd65ff88, 0 0 20px #7c3aed44;
}

@keyframes shapeBlinker {
  0% {
    opacity: 0;
    transform: scale(0.95);
  }
  50% {
    opacity: 1;
    transform: scale(1.05);
  }
  100% {
    opacity: 0;
    transform: scale(0.95);
  }
}

.animate-shapeBlinker {
  animation: shapeBlinker 2.5s linear infinite;
}

.notyf__toast {
  font-family: "Barlow", sans-serif;
  transition: all 0.3s ease;
}

/* Mensaje general */
.notyf__message {
  color: #fff;
  font-size: 13px;
}

.octagon {
  clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
}

.pagination {
  text-align: center;
  margin: 20px 0;
}

.pagination li {
  display: inline-block;
  margin: 0 4px;
}

.pagination li a {
  padding: 6px 12px;
  background: rgba(255, 255, 255, 0.05); /* fondo sutil */
  border-radius: 6px;
  color: rgba(255, 255, 255, 0.7); /* texto claro */
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, 0.1);
  transition: all 0.2s ease;
}

.pagination li a:hover {
  background: rgba(189, 101, 255, 0.15); /* violeta suave */
  color: #ffffff;
  box-shadow: 0 0 8px rgba(189, 101, 255, 0.4);
}

.pagination li.active a {
  background-color: #bd65ff; /* violeta principal */
  color: white;
  border-color: #bd65ff;
  box-shadow: 0 0 10px rgba(189, 101, 255, 0.6);
}

/* ========================================
   RESPONSIVE COMPONENTS CSS
   ======================================== */

/* Mobile menu visibility */
.mobile-menu-button {
  display: none !important;
}

@media (max-width: 1023px) {
  .mobile-menu-button {
    display: flex !important;
  }
}

@media (min-width: 1024px) {
  .mobile-menu-dropdown {
    display: none !important;
  }
}

/* Mobile menu dropdown positioning */
.mobile-menu-dropdown {
  position: fixed !important;
  top: 120px !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 60 !important;
  max-height: calc(100vh - 120px) !important;
  overflow-y: auto !important;
}

/* Home slider image visibility */
.home-slider-image {
  display: none !important;
}

@media (min-width: 1024px) {
  .home-slider-image {
    display: block !important;
  }
}

/* Profile modal responsive layout */
.profile-section {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.profile-content {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex: 1 !important;
  min-width: 0 !important;
}

.profile-button {
  width: 100% !important;
}

@media (min-width: 1024px) {
  .profile-section {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
  }

  .profile-button {
    width: auto !important;
    flex-shrink: 0 !important;
  }
}
