/* KonterKas - dark mode styles */
[x-cloak] { display: none !important; }

/* Smooth transitions */
.fade-enter { animation: fadeIn .25s ease-out both; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* Loading skeleton */
.skeleton { background: linear-gradient(90deg, #1f2937 25%, #374151 50%, #1f2937 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; border-radius: 8px; }
@keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* Autocomplete */
.autocomplete-list { position: absolute; z-index: 20; width: 100%; background: #1f2937; border: 1px solid #374151; border-radius: 10px; margin-top: 4px; box-shadow: 0 8px 24px rgba(0,0,0,0.4); max-height: 180px; overflow-y: auto; }
.autocomplete-list li { padding: 12px 16px; font-size: 14px; cursor: pointer; transition: background .1s; color: #d1d5db; }
.autocomplete-list li:hover { background: #374151; color: white; }
.autocomplete-list::-webkit-scrollbar { width: 4px; }
.autocomplete-list::-webkit-scrollbar-thumb { background: #4f46e5; border-radius: 2px; }

/* Hide number spinners */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; }

/* Nav visibility */
@media (max-width: 767px) {
  .desktop-nav { display: none !important; }
  .mobile-nav { display: flex !important; }
  .page-content { padding-bottom: 80px; }
}
@media (min-width: 768px) {
  .mobile-nav { display: none !important; }
  .desktop-nav { display: flex !important; }
}

/* Touch targets */
@media (max-width: 767px) {
  input, select, button, textarea { font-size: 16px !important; }
}