/* iAgentic Dashboard - Common Styles */

/* Custom Scrollbar Styles */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #171717;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb {
  background: #404040;
  border-radius: 4px;
  border: 2px solid #171717;
}

::-webkit-scrollbar-thumb:hover {
  background: #525252;
}

::-webkit-scrollbar-thumb:active {
  background: #A3DF18;
}

/* Firefox scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: #404040 #171717;
}

/* Material Symbols Fix */
.material-symbols-outlined {
  font-size: 20px !important;
  width: 20px !important;
  height: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 20 !important;
}

/* Navigation Active State */
.nav-active {
  background: rgba(163, 223, 24, 0.2) !important;
  color: #A3DF18 !important;
  font-weight: 700 !important;
}

.nav-active span {
  color: #A3DF18 !important;
}

/* UX/UI Improvements */
.skeleton {
  background: linear-gradient(90deg, #2a2a2a 25%, #404040 50%, #2a2a2a 75%);
  background-size: 200% 100%;
  animation: loading 1.5s infinite;
  border-radius: 0.5rem;
  height: 1rem;
}

@keyframes loading {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.text-improved-muted {
  color: #E5E5E5;
}

.text-improved-secondary {
  color: #A3A3A3;
}

.card-elevated {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
  transition: all 0.2s ease;
}

.card-elevated:hover {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
  transform: translateY(-2px);
}

.btn-enhanced {
  transition: all 0.15s ease;
  transform: scale(1);
}

.btn-enhanced:hover {
  transform: scale(1.02);
  box-shadow: 0 8px 25px rgba(163, 223, 24, 0.3);
}

.btn-enhanced:active {
  transform: scale(0.98);
}