/* Custom Stylesheet for Sintonia Painel WebApp */
body {
  font-family: 'Inter', sans-serif;
  -webkit-tap-highlight-color: transparent;
  background-color: #080808; /* Default background from screenshot */
}

/* Custom Scrollbar */
.scrollbar-none::-webkit-scrollbar {
  display: none;
}
.scrollbar-none {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Animations */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in {
  animation: fadeIn 0.3s ease forwards;
}

/* Bottom Nav Button States */
.nav-btn {
  transition: all 0.2s;
}

.nav-btn:not(.active) .nav-icon-wrapper {
  background-color: transparent !important;
}

.nav-btn.active .nav-icon-wrapper {
  background-color: #2a3014 !important; /* dark lime bg */
  color: #d4f84c !important; /* lime color */
}
.nav-btn.active span {
  color: #d4f84c !important;
}

/* Color Circle buttons */
.color-btn {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform 0.2s, border-color 0.2s;
}

.color-btn:hover {
  transform: scale(1.1);
}

.color-btn.active {
  border-color: #ffffff;
  transform: scale(1.2);
  box-shadow: 0 0 15px rgba(255, 255, 255, 0.2);
}

/* Range Slider Custom Styling (If needed in future) */
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #d4f84c;
  cursor: pointer;
  box-shadow: 0 0 10px rgba(212, 248, 76, 0.5);
  transition: transform 0.1s;
}

input[type="range"]::-webkit-slider-thumb:hover {
  transform: scale(1.1);
}