/* DataLen - Custom overrides (Tailwind handles base) */
/* Transitions: ~200ms bg/border, ~150ms color per Lighthouse spec */

/* Custom scrollbar */
html {
  scroll-behavior: smooth;
}
::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
::-webkit-scrollbar-track {
  background: rgb(244 244 245);
}
.dark ::-webkit-scrollbar-track {
  background: rgb(24 24 27);
}
::-webkit-scrollbar-thumb {
  background: rgb(212 212 216);
  border-radius: 4px;
}
.dark ::-webkit-scrollbar-thumb {
  background: rgb(63 63 70);
}
::-webkit-scrollbar-thumb:hover {
  background: rgb(161 161 170);
}
.dark ::-webkit-scrollbar-thumb:hover {
  background: rgb(82 82 91);
}

/* Hero carousel */
.hero-slide {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.6s ease, visibility 0.6s;
}
.hero-slide.active {
  opacity: 1;
  visibility: visible;
}

.hero-indicators .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgb(161 161 170);
  cursor: pointer;
  transition: all 0.2s;
}
.dark .hero-indicators .dot {
  background: rgb(82 82 91);
}
.hero-indicators .dot.active {
  background: rgb(24 24 27);
  transform: scale(1.25);
}
.dark .hero-indicators .dot.active {
  background: rgb(244 244 245);
}

/* Page enter animation */
@keyframes fadeSlideUp {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.animate-fade-in {
  animation: fadeSlideUp 0.3s ease-out;
}

/* Lang dropdown */
#lang-menu {
  transform-origin: top right;
  transition: opacity 0.2s, visibility 0.2s;
}
#lang-dropdown.open #lang-menu {
  opacity: 1;
  visibility: visible;
}

/* Mobile nav panel */
#mobile-nav {
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: opacity 0.2s, visibility 0.2s, transform 0.2s;
}
#mobile-nav.open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* RTL adjustments */
[dir="rtl"] .hero-indicators .dot.active {
  transform: scale(1.25);
}
[dir="rtl"] .nav-link::after {
  left: auto;
  right: 0;
  transform-origin: right;
}