/* ==========================================================================
   RENTRO REAL ESTATE - CUSTOM STYLES & TAILWIND EXTENSIONS
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,500;0,600;0,700;0,800;1,600&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Outfit:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  --font-serif: 'Playfair Display', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-numbers: 'Outfit', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
}

body {
  font-family: var(--font-sans);
  -webkit-tap-highlight-color: transparent;
}

.font-serif {
  font-family: var(--font-serif);
}

.font-numbers {
  font-family: var(--font-numbers);
}

.font-mono {
  font-family: var(--font-mono);
}

/* Remove default number input spinner arrows across all browsers */
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;
  appearance: textfield;
}

/* Hide scrollbar utility */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Precise Section Scroll Offsets */
#citiesSection {
  scroll-margin-top: 85px;
}

#propertiesSection {
  scroll-margin-top: 85px;
}

#emiSection {
  scroll-margin-top: 85px;
}

/* Custom Range Slider */
.custom-range {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  background: #E2E8F0;
  border-radius: 9999px;
  cursor: pointer;
}

.dark .custom-range {
  background: #334155;
}

.custom-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  border-radius: 9999px;
  background: #2563EB;
  box-shadow: 0 0 10px rgba(37, 99, 235, 0.4);
  cursor: pointer;
  transition: transform 0.15s ease;
}

.custom-range::-webkit-slider-thumb:hover {
  transform: scale(1.2);
}

/* Modal and Drawer Animations */
@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.96); }
  to { opacity: 1; transform: scale(1); }
}

.animate-modal-in {
  animation: fadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Subtle scrollbar */
::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: #CBD5E1;
  border-radius: 9999px;
}

.dark ::-webkit-scrollbar-thumb {
  background: #334155;
}