/* ══════════════════════════════════════════════════════════════
   Adaptive Projects — Custom styles
   Tailwind CDN handles utility classes; this file covers what
   @apply can't or shouldn't handle.
   ══════════════════════════════════════════════════════════════ */

/* ── Custom scrollbar ── */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background-color: rgba(156, 163, 175, 0.5);
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background-color: rgba(107, 114, 128, 0.7);
}

/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(156, 163, 175, 0.5) transparent;
}

/* ── HTMX loading indicators ── */
.htmx-indicator {
  display: none;
  opacity: 0;
  transition: opacity 200ms ease-in;
}
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
  display: inline-flex;
  opacity: 1;
}

/* Pulsing dot indicator */
.htmx-indicator-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #6366f1;
  animation: htmx-pulse 1s ease-in-out infinite;
}

@keyframes htmx-pulse {
  0%, 100% { opacity: 0.3; transform: scale(0.8); }
  50% { opacity: 1; transform: scale(1.2); }
}

/* Spinner indicator */
.htmx-indicator-spinner {
  width: 16px;
  height: 16px;
  border: 2px solid #e5e7eb;
  border-top-color: #6366f1;
  border-radius: 50%;
  animation: htmx-spin 0.6s linear infinite;
}

@keyframes htmx-spin {
  to { transform: rotate(360deg); }
}

/* Skeleton loading bar (for table rows) */
.htmx-request tr td {
  position: relative;
  overflow: hidden;
}
.htmx-request tr td::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(99, 102, 241, 0.05), transparent);
  animation: htmx-shimmer 1.5s infinite;
}

@keyframes htmx-shimmer {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

/* ── Dark mode overrides ── */
html.dark {
  color-scheme: dark;
}
html.dark body {
  background-color: #111827;
  color: #f3f4f6;
}
html.dark .bg-white {
  background-color: #1f2937;
}
html.dark .bg-gray-50 {
  background-color: #111827;
}
html.dark .border-gray-200 {
  border-color: #374151;
}
html.dark .text-gray-900 {
  color: #f9fafb;
}
html.dark .text-gray-700 {
  color: #d1d5db;
}
html.dark .text-gray-800 {
  color: #e5e7eb;
}
html.dark .text-gray-600 {
  color: #d1d5db;
}
html.dark .text-gray-400 {
  color: #9ca3af;
}
html.dark .text-gray-500 {
  color: #9ca3af;
}
html.dark .shadow-sm {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
}

/* ── Print styles ── */
@media print {
  /* Hide navigation and interactive elements */
  nav, .lg\:fixed, .sticky, button, .htmx-indicator,
  [x-data], [hx-post], [hx-get] {
    display: none !important;
  }

  /* Reset layout */
  .lg\:pl-64 {
    padding-left: 0 !important;
  }

  /* Clean backgrounds */
  body, .bg-white, .bg-gray-50 {
    background: white !important;
    color: black !important;
  }

  /* Show links */
  a[href]::after {
    content: ' (' attr(href) ')';
    font-size: 0.75em;
    color: #666;
  }
  a[href^="/"]::after,
  a[href^="#"]::after {
    content: '';
  }

  /* Prevent page breaks inside elements */
  tr, .rounded-lg {
    page-break-inside: avoid;
  }
}