/* ============================================
   NOVA Performance Optimizations
   Reduces GPU-intensive CSS properties.
   
   Applied AFTER styles.css to override heavy rules.
   ============================================ */

/* ── Reduce backdrop-filter (GPU killer) ──
   Keep only essential ones, remove from small elements */
.prompt-button,
#orb-settings-btn {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.prompt-card,
.prompt-area {
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

/* ── Reduce box-shadow on frequently animated elements ──
   Keep shadows on static elements, remove from animated */
.nav-item {
  box-shadow: none !important;
}

.menu-item:hover {
  box-shadow: 0 0 10px rgba(169, 102, 255, 0.2) !important;
}

/* ── Add will-change for smoother animations ── */
.nova-container,
.menu-list,
.chat-area,
.orb-container,
.auth-overlay,
.auth-modal {
  will-change: transform;
}

/* ── Pause heavy animations when tab not visible ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ── Optimize particle animations ── */
.particle {
  will-change: transform, opacity;
}

.orb-core,
.orb-glow,
.orb-ring {
  will-change: transform;
}

/* ── Reduce paint complexity ── */
.nova-container {
  contain: layout style;
}

.chat-area {
  contain: layout;
}

/* ── Optimize scrollable areas ── */
.menu-list,
.chat-messages,
.prompt-area {
  will-change: scroll-position;
}

/* ── Remove redundant text-shadow on small text ── */
.menu-list p,
.nav-item span,
.prompt-card p {
  text-shadow: none !important;
}

/* ── Reduce box-shadow on animated/interactive elements ── */
.sidebar__item:hover,
.topbar__btn:hover,
.settings-btn:hover,
.btn:hover {
  box-shadow: none !important;
}

/* ── Containment for page sections ── */
.dash-card,
.dash-section,
.settings-card,
.review-card,
.agent-card {
  contain: layout style;
}