/* ===== Chhap redesign: soft gradient look + calmer hovers ===== */
:root {
  --ch-navy: #0f1b4d;
  --ch-orange: #f97316;
  --ch-primary: #8358ff;
  --ch-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* Soft peach -> lavender background with blurred blobs (light mode only) */
body:not(.dark) {
  background: linear-gradient(
    180deg,
    #fdf3ec 0%,
    #f3f1fd 45%,
    #eaf0fd 100%
  ) !important;
}
body:not(.dark)::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(
      520px 420px at 8% 12%,
      rgba(255, 190, 150, 0.45),
      transparent 70%
    ),
    radial-gradient(
      560px 460px at 95% 25%,
      rgba(150, 175, 255, 0.4),
      transparent 70%
    ),
    radial-gradient(
      480px 400px at 50% 105%,
      rgba(190, 170, 255, 0.3),
      transparent 70%
    );
}

/* Header: clean white bar instead of the glass pill */
.header-floating-bar {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(15, 27, 77, 0.06);
  border-radius: 16px;
  box-shadow: 0 4px 20px rgba(15, 27, 77, 0.06);
}

/* Nav links: subtle color shift, no scale/tilt/heavy shadow */
.menu-link {
  transition:
    color 0.2s var(--ch-ease),
    background-color 0.2s var(--ch-ease);
}
.menu-link:hover {
  background: rgba(131, 88, 255, 0.08);
  color: var(--ch-primary) !important;
  transform: none;
  box-shadow: none;
  border-radius: 10px;
}

/* Header icon buttons: tiny lift only */
.header-floating-bar .group.ml-2.flex.h-10.w-10:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(131, 88, 255, 0.25);
}

/* Cards: gentle lift + soft shadow */
.trending-card-item,
.search-result-card {
  transition:
    transform 0.25s var(--ch-ease),
    box-shadow 0.25s var(--ch-ease);
}
.trending-card-item {
  transform: scale(0.97);
}
.trending-card-item:hover {
  transform: translateY(-6px) scale(1);
  box-shadow: 0 14px 30px rgba(15, 27, 77, 0.15);
  border: 1px solid rgba(0, 0, 0, 0.05);
}
.search-result-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(15, 27, 77, 0.1);
}

/* Floating buttons: remove the spin/rotate */
.settings-fab:hover {
  transform: translateY(-50%) scale(1.05);
}
.demo-video-fab:hover {
  transform: scale(1.06);
}

@media (prefers-reduced-motion: reduce) {
  * {
    transition-duration: 0.01ms !important;
  }
}
