/* Bima Nivaran - Core Custom Styles */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&family=Outfit:wght@400;500;600;700;800;900&display=swap');

:root {
  --bn-navy: #0A2540;
  --bn-navy-dark: #06182B;
  --bn-blue: #0056B3;
  --bn-blue-light: #EBF3FF;
  --bn-gold: #D4AF37;
  --bn-gold-dark: #B38E22;
  --bn-gold-light: #FFF8E7;
  --bn-amber: #F59E0B;
  --bn-emerald: #10B981;
  --bn-gray-50: #F8FAFC;
  --bn-gray-100: #F1F5F9;
  --bn-gray-200: #E2E8F0;
  --bn-gray-600: #475569;
  --bn-gray-800: #1E293B;
}

body {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--bn-gray-800);
  background-color: #FAFAFA;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6, .font-heading {
  font-family: 'Outfit', sans-serif;
}

/* Custom Gradient Utilities */
.bg-gradient-navy {
  background: linear-gradient(135deg, #0A2540 0%, #003B73 50%, #004B87 100%);
}

.bg-gradient-gold {
  background: linear-gradient(135deg, #D4AF37 0%, #F5A623 100%);
}

.bg-gradient-hero {
  background: radial-gradient(circle at 80% 20%, rgba(212, 175, 55, 0.15) 0%, transparent 40%),
              linear-gradient(135deg, #06182B 0%, #0A2540 60%, #003B73 100%);
}

.text-gradient-gold {
  background: linear-gradient(135deg, #FDE68A 0%, #F59E0B 50%, #D97706 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.text-gradient-navy {
  background: linear-gradient(135deg, #0A2540 0%, #0056B3 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Shadows & Glassmorphism */
.shadow-premium {
  box-shadow: 0 10px 30px -5px rgba(10, 37, 64, 0.08), 0 4px 6px -2px rgba(10, 37, 64, 0.04);
}

.shadow-premium-hover:hover {
  box-shadow: 0 20px 40px -10px rgba(10, 37, 64, 0.15), 0 8px 12px -4px rgba(10, 37, 64, 0.08);
  transform: translateY(-3px);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.glass-card {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(226, 232, 240, 0.8);
}

.glass-dark {
  background: rgba(10, 37, 64, 0.85);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Brand CTA Buttons */
.btn-gold {
  background: linear-gradient(135deg, #E6B800 0%, #D4AF37 50%, #C8963E 100%);
  color: #06182B;
  font-weight: 700;
  transition: all 0.25s ease;
  box-shadow: 0 4px 14px rgba(212, 175, 55, 0.4);
}

.btn-gold:hover {
  background: linear-gradient(135deg, #F5CA1A 0%, #E6B800 50%, #D4AF37 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(212, 175, 55, 0.55);
}

.btn-navy {
  background: #0A2540;
  color: #FFFFFF;
  font-weight: 600;
  transition: all 0.25s ease;
}

.btn-navy:hover {
  background: #003B73;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(10, 37, 64, 0.3);
}

/* Multi-Step Wizard Styling */
.wizard-step-circle {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1rem;
  transition: all 0.3s ease;
}

.wizard-step-active {
  background: #0A2540;
  color: #FFFFFF;
  box-shadow: 0 0 0 4px rgba(10, 37, 64, 0.2);
}

.wizard-step-completed {
  background: #10B981;
  color: #FFFFFF;
}

.wizard-step-inactive {
  background: #E2E8F0;
  color: #64748B;
}

/* Timeline component for Track Complaint */
.track-timeline-item {
  position: relative;
  padding-left: 2.5rem;
  padding-bottom: 2rem;
}

.track-timeline-item:last-child {
  padding-bottom: 0;
}

.track-timeline-item::before {
  content: '';
  position: absolute;
  left: 0.75rem;
  top: 1.5rem;
  bottom: 0;
  width: 2px;
  background-color: #E2E8F0;
}

.track-timeline-item:last-child::before {
  display: none;
}

.track-timeline-marker {
  position: absolute;
  left: 0;
  top: 0;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
}

/* Pulse animation for Live tracking badge */
@keyframes pulse-ring {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); }
  70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(16, 185, 129, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}

.pulse-badge {
  animation: pulse-ring 2s infinite;
}

/* Floating WhatsApp / Phone Widget */
.floating-actions {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 999;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.floating-btn-whatsapp {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #25D366;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  box-shadow: 0 4px 16px rgba(37, 211, 102, 0.4);
  transition: all 0.3s ease;
}

.floating-btn-whatsapp:hover {
  transform: scale(1.08);
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.6);
}

.floating-btn-call {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #0A2540;
  color: #F5A623;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  box-shadow: 0 4px 16px rgba(10, 37, 64, 0.35);
  transition: all 0.3s ease;
}

.floating-btn-call:hover {
  transform: scale(1.08);
  box-shadow: 0 6px 20px rgba(10, 37, 64, 0.5);
}

/* Service Card Hover */
.service-card {
  transition: all 0.3s ease;
  border-left: 4px solid transparent;
}

.service-card:hover {
  border-left-color: #D4AF37;
  transform: translateY(-4px);
  background-color: #FFFFFF;
}

/* Custom Form Select & Input */
.bn-input {
  width: 100%;
  border: 1.5px solid #E2E8F0;
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  font-size: 0.95rem;
  transition: all 0.2s ease;
  background-color: #FFFFFF;
}

.bn-input:focus {
  outline: none;
  border-color: #0056B3;
  box-shadow: 0 0 0 3px rgba(0, 86, 179, 0.12);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #F1F5F9;
}
::-webkit-scrollbar-thumb {
  background: #CBD5E1;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94A3B8;
}

/* Navbar Whitespace & Single Line Protection */
header nav a {
  white-space: nowrap !important;
  display: inline-flex;
  align-items: center;
}

header a span {
  white-space: nowrap !important;
}

header .btn-gold, header .btn-navy {
  white-space: nowrap !important;
}

/* Services Dropdown Hover Bridge - prevents closing on slow cursor movement */
.dropdown-menu {
  transition: opacity 0.2s ease, visibility 0.2s ease;
}

.group:hover .dropdown-menu,
.dropdown-menu:hover {
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}

.dropdown-menu::before {
  content: '';
  position: absolute;
  top: -14px;
  left: 0;
  right: 0;
  height: 18px;
  background: transparent;
  z-index: 10;
}