html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

/* Custom Bootstrap Primary Color Overrides */
.bg-primary {
  background-color: #05668D !important;
}

.text-primary {
  color: #05668D !important;
}

.border-primary {
  border-color: #05668D !important;
}

.btn-primary {
  background-color: #05668D !important;
  border-color: #045a7a !important;
}

.btn-primary:hover {
  background-color: #045a7a !important;
  border-color: #034a66 !important;
}

.btn-primary:focus {
  background-color: #045a7a !important;
  border-color: #034a66 !important;
  box-shadow: 0 0 0 0.2rem rgba(5, 102, 141, 0.25) !important;
}

.btn-outline-primary {
  color: #05668D !important;
  border-color: #05668D !important;
}

.btn-outline-primary:hover {
  background-color: #05668D !important;
  border-color: #05668D !important;
  color: white !important;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #05668D;
}

/* Removed problematic footer positioning and body margin */

/* Mobile Floating Action Button Styles */
@media (max-width: 767.98px) {
  .position-fixed {
    animation: fadeInUp 0.3s ease-out;
  }
  
  .position-fixed:hover {
    transform: scale(1.1);
    transition: transform 0.2s ease;
  }
  
  .position-fixed:active {
    transform: scale(0.95);
    transition: transform 0.1s ease;
  }
  
  /* Pulsing animation for the floating button */
  .floating-add-btn {
    animation: pulse 2s infinite;
  }
  
  /* Enhanced tooltip with longer visibility */
  .floating-tooltip {
    position: absolute;
    right: 70px;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.9);
    color: white;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 1001;
    animation: tooltipGlow 3s ease-in-out infinite;
  }
  
  /* Glow effect for tooltip */
  @keyframes tooltipGlow {
    0%, 100% {
      box-shadow: 0 0 5px rgba(255, 193, 7, 0.3);
    }
    50% {
      box-shadow: 0 0 15px rgba(255, 193, 7, 0.6);
    }
  }
  
  /* Tooltip styles */
  .floating-tooltip {
    position: absolute;
    right: 70px;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.9);
    color: white;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 1001;
  }
  
  .floating-tooltip::after {
    content: '';
    position: absolute;
    right: -5px;
    top: 50%;
    transform: translateY(-50%);
    border-left: 5px solid rgba(0, 0, 0, 0.9);
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
  }
  
  .floating-tooltip.show {
    opacity: 1;
    visibility: visible;
  }
  
  /* Pulsing animation */
  @keyframes pulse {
    0% {
      box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.7);
    }
    70% {
      box-shadow: 0 0 0 10px rgba(40, 167, 69, 0);
    }
    100% {
      box-shadow: 0 0 0 0 rgba(40, 167, 69, 0);
    }
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Ensure floating buttons don't interfere with content */
@media (max-width: 767.98px) {
  /* Removed body padding-bottom that was causing white space */
}

/* Passed Events Styling */
.passed-event-card {
  opacity: 0.8;
  filter: grayscale(20%);
}

.passed-event-card .card-img-top {
  opacity: 0.7;
}

.passed-event-card .card-title {
  color: #6c757d !important;
}

.passed-event-card .badge {
  background-color: #6c757d !important;
}

.passed-event-card .card-footer {
  background-color: #f8f9fa !important;
  border-top: 1px solid #dee2e6;
}

/* Event Status Indicators */

/* Section Headers */
.events-section-header {
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid;
}

.events-section-header.upcoming {
  border-bottom-color: #05668D;
}

.events-section-header.passed {
  border-bottom-color: #6c757d;
}

/* Footer Styles */
.footer-link {
  transition: all 0.3s ease;
  position: relative;
}

.footer-link:hover {
  color: #ffc107 !important;
  transform: translateX(5px);
}

.social-link {
  transition: all 0.3s ease;
  padding: 8px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
}

.social-link:hover {
  background-color: #ffc107;
  color: #212529 !important;
  transform: translateY(-3px);
  box-shadow: 0 4px 8px rgba(255, 193, 7, 0.3);
}

.footer-link:hover i {
  color: #ffc107;
}

/* Footer Bottom Section */
footer hr {
  border-color: #495057 !important;
  opacity: 0.5;
}

footer .text-light {
  color: #f8f9fa !important;
}

footer .text-light.fw-bold {
  color: #ffffff !important;
}

/* Related Events Slider */
.related-events-container {
  position: relative;
  width: 100%;
  overflow: hidden; /* Ensure no overflow on desktop */
}

.related-events-slider {
  transition: transform 0.3s ease;
  display: flex;
  flex-wrap: nowrap; /* Prevent wrapping on desktop */
}

.related-events-slide {
  flex-shrink: 0;
  display: flex;
  flex-wrap: nowrap; /* Ensure cards don't wrap to new line */
  gap: 1rem;
}

.related-events-slide .card {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  flex-shrink: 0; /* Prevent cards from shrinking */
  min-width: 300px; /* Ensure consistent card width */
  max-width: 300px; /* Prevent cards from expanding */
}

.related-events-slide .card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
}

/* Navigation buttons */
#prevSlide:disabled,
#nextSlide:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .related-events-slide .card {
    min-width: 280px !important;
  }
  
  /* Mobile touch scrolling - modify container behavior */
  .related-events-container {
    overflow-x: auto !important;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    padding-bottom: 10px; /* Space for scrollbar if needed */
  }
  
  .related-events-slider {
    scroll-snap-type: x mandatory;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE and Edge */
    display: flex !important;
    flex-wrap: nowrap !important;
  }
  
  .related-events-slider::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
  }
  
  .related-events-slide {
    scroll-snap-align: start;
    flex-shrink: 0;
    min-width: auto !important;
    display: flex !important;
    flex-direction: row !important;
  }
  
  /* Hide navigation buttons on mobile */
  #prevSlide, #nextSlide {
    display: none !important;
  }
}

.event-card:hover .btn-outline-primary.btn-sm,
.event-card:hover .btn-outline-secondary.btn-sm {
  animation: subtlePulse 2s ease-in-out infinite;
}

/* Clickable Photo and Title Styles */
.event-card .card-img-top {
  transition: all 0.3s ease;
}

.event-card:hover .card-img-top {
  transform: scale(1.02);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.event-card .card-title a {
  transition: all 0.3s ease;
}

.event-card .card-title a:hover {
  color: #05668D !important;
  text-decoration: none;
}

/* Enhanced hover effects for clickable elements */
.event-card .card-img-top:hover {
  opacity: 0.9;
}

.event-card .card-title a:hover {
  transform: translateX(3px);
}

/* Ensure proper cursor for clickable elements */
.event-card a {
  cursor: pointer;
}

/* Smooth transitions for all interactive elements */
.event-card * {
  transition: all 0.3s ease;
}

/* Admin Dashboard User Management Styles */
.user-search-input {
  border-radius: 0.375rem 0 0 0.375rem;
}

.user-search-btn {
  border-radius: 0 0.375rem 0.375rem 0;
}

.user-table th {
  font-weight: 600;
  color: #495057;
  border-bottom: 2px solid #dee2e6;
}

.user-table td {
  vertical-align: middle;
}

.user-table .badge {
  font-size: 0.75rem;
  padding: 0.375rem 0.75rem;
}

.remove-user-btn {
  transition: all 0.2s ease;
}

.remove-user-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(220, 53, 69, 0.3);
}

.user-search-results {
  animation: fadeInUp 0.3s ease-out;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Loading state for search button */
.search-loading {
  pointer-events: none;
}

/* User status indicators */
.user-status-active {
  background: linear-gradient(135deg, #05668D 0%, #427AA1 100%);
}

.user-status-inactive {
  background: linear-gradient(135deg, #dc3545 0%, #fd7e14 100%);
}

/* Event count badges */
.event-count-warning {
  background: linear-gradient(135deg, #ffc107 0%, #fd7e14 100%);
  color: #212529;
}

.event-count-success {
  background: linear-gradient(135deg, #05668D 0%, #427AA1 100%);
}

/* Admin Dashboard Event Search Styles */
.event-search-input {
  border-radius: 0.375rem 0 0 0.375rem;
}

.event-search-btn {
  border-radius: 0 0.375rem 0.375rem 0;
}

.event-table th {
  font-weight: 600;
  color: #495057;
  border-bottom: 2px solid #dee2e6;
}

.event-table td {
  vertical-align: middle;
}

.event-table .badge {
  font-size: 0.75rem;
  padding: 0.375rem 0.75rem;
}

.remove-event-btn {
  transition: all 0.2s ease;
}

.remove-event-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(220, 53, 69, 0.3);
}

.event-search-results {
  animation: fadeInUp 0.3s ease-out;
}

/* Creator info styling */
.creator-info {
  line-height: 1.2;
}

.creator-name {
  font-weight: 600;
  color: #495057;
}

.creator-email {
  color: #6c757d;
  font-size: 0.875rem;
}

/* Event status indicators */
.event-status-passed {
  color: #dc3545;
  font-weight: 600;
}

.event-status-upcoming {
  color: #05668D;
  font-weight: 600;
}

.event-status-featured {
  background: linear-gradient(135deg, #ffc107 0%, #fd7e14 100%);
  color: #212529;
}

/* User Events Display Styles */
.user-events-container {
  background: #f8f9fa;
  border-left: 4px solid #05668D;
}

.user-events-list {
  background: white;
  border-top: 1px solid #dee2e6;
}

.user-events-list .table {
  margin-bottom: 0;
}

.user-events-list .table th {
  font-size: 0.875rem;
  font-weight: 600;
  color: #495057;
  border-bottom: 2px solid #dee2e6;
}

.user-events-list .table td {
  font-size: 0.875rem;
  vertical-align: middle;
}

.user-events-list .badge {
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
}

.toggle-events {
  transition: all 0.2s ease;
}

.toggle-events:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0, 123, 255, 0.3);
}

/* Professional Interactive Map Styles */
.map-controls-panel {
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
  border-bottom: 1px solid #dee2e6;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Custom Event Markers */
.custom-event-marker {
  border: none;
  background: transparent;
}

.event-marker-regular {
  width: 30px;
  height: 30px;
  background: linear-gradient(135deg, #05668D 0%, #427AA1 100%);
  border: 3px solid white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 14px;
  box-shadow: 0 2px 8px rgba(5,102,141,0.4);
  transition: all 0.3s ease;
}

.event-marker-featured {
  width: 30px;
  height: 30px;
  background: linear-gradient(135deg, #ffc107 0%, #fd7e14 100%);
  border: 3px solid white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #212529;
  font-size: 14px;
  box-shadow: 0 2px 8px rgba(255,193,7,0.4);
  animation: pulse 2s infinite;
  transition: all 0.3s ease;
}

@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); }
}

/* User Location Marker */
.user-location-marker {
  border: none;
  background: transparent;
}

.user-location-icon {
  width: 30px;
  height: 30px;
  background: linear-gradient(135deg, #05668D 0%, #427AA1 100%);
  border: 3px solid white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 16px;
  box-shadow: 0 2px 8px rgba(5,102,141,0.4);
  animation: userLocationPulse 3s infinite;
}

@keyframes userLocationPulse {
  0% { box-shadow: 0 2px 8px rgba(5,102,141,0.4); }
  50% { box-shadow: 0 2px 15px rgba(5,102,141,0.7); }
  100% { box-shadow: 0 2px 8px rgba(5,102,141,0.4); }
}

/* Custom Cluster Icons */
.custom-cluster {
  border: none;
  background: transparent;
}

.custom-cluster-icon {
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  color: white;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
  border: 3px solid white;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
}

.custom-cluster-icon.small {
  width: 30px;
  height: 30px;
  font-size: 12px;
}

.custom-cluster-icon.medium {
  width: 35px;
  height: 35px;
  font-size: 14px;
}

.custom-cluster-icon.large {
  width: 40px;
  height: 40px;
  font-size: 16px;
}

.custom-cluster-icon.blue {
  background: linear-gradient(135deg, #05668D 0%, #427AA1 100%);
}

.custom-cluster-icon.orange {
  background: linear-gradient(135deg, #fd7e14 0%, #e67e22 100%);
}

.custom-cluster-icon.red {
  background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
}

/* Event Popup Styles */
.leaflet-popup-content {
  margin: 0;
  padding: 0;
}

.event-popup {
  padding: 15px;
  min-width: 200px;
}

.event-popup h6 {
  color: #495057;
  margin-bottom: 10px;
  font-weight: 600;
}

.event-popup .text-muted {
  color: #6c757d !important;
  line-height: 1.4;
}

.event-popup .btn {
  font-size: 0.875rem;
  padding: 0.375rem 0.75rem;
}

.event-popup .btn-primary {
  color: white !important;
}

/* Event Cards in Sidebar */
.event-card {
  transition: all 0.3s ease;
  cursor: pointer;
}

.event-card:hover {
  background-color: #f8f9fa;
  transform: translateX(3px);
}

.event-card .event-name {
  color: #495057;
  font-weight: 600;
}

.event-card .event-location {
  font-weight: 500;
}

.zoom-to-event {
  transition: all 0.2s ease;
}

.zoom-to-event:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(5,102,141,0.3);
}

/* Event Details Page - Enhanced Contrast */
.event-details-section h6 {
  color: #495057 !important;
  font-weight: 600;
  margin-bottom: 0.5rem;
}

.event-details-section .text-muted {
  color: #6c757d !important;
  font-weight: 500;
}

.event-details-section .bg-light {
  background-color: #f8f9fa !important;
  border: 1px solid #e9ecef;
}

.event-details-section .card {
  border: 1px solid #dee2e6;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.event-details-section .card-header {
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
  border-bottom: 2px solid #dee2e6;
  font-weight: 600;
}

.event-details-section .list-unstyled li {
  padding: 0.5rem 0;
  border-bottom: 1px solid #f1f3f4;
}

.event-details-section .list-unstyled li:last-child {
  border-bottom: none;
}

.event-details-section .list-unstyled strong {
  color: #495057;
  font-weight: 600;
}

.event-details-section .list-unstyled i {
  color: #05668D;
  margin-right: 0.5rem;
  width: 20px;
  text-align: center;
}

/* Enhanced Event Details Typography */
.event-details-section .card-title {
  color: #212529;
  font-weight: 700;
  line-height: 1.2;
}

.event-details-section .fs-5 {
  color: #495057;
  font-weight: 500;
}

.event-details-section .fs-6 {
  color: #6c757d;
  line-height: 1.6;
}

/* Category Badge Enhanced Contrast */
.event-details-section .badge.bg-primary {
  background: #05668D !important;
  color: white !important;
  font-weight: 600;
  text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

/* Related Events Enhanced */
.related-events-section h3 {
  color: #212529;
  font-weight: 700;
}

.related-events-section .text-muted {
  color: #6c757d !important;
  font-weight: 500;
}

/* Responsive Design */
@media (max-width: 991.98px) {
  .map-controls-panel .container-fluid {
    padding: 0.5rem 1rem;
  }
  
  .map-controls-panel .row > div {
    margin-bottom: 0.5rem;
  }
  
  #mapContainer {
    height: 50vh !important;
  }
  
  .event-card {
    border-radius: 0.375rem;
    margin-bottom: 0.5rem;
    background: white;
    border: 1px solid #dee2e6;
  }
}

@media (max-width: 767.98px) {
  .map-controls-panel .d-flex {
    flex-direction: column;
    gap: 0.5rem;
  }
  
  .map-controls-panel .input-group {
    width: 100%;
  }
}

/* Duplicate Detection Styles */
.duplicate-detection-status {
  padding: 1rem;
  border-radius: 0.5rem;
}

.duplicate-detection-status i {
  opacity: 0.8;
}

.duplicate-detection-status p {
  font-weight: 600;
  margin-bottom: 0.25rem;
}

.duplicate-detection-status small {
  font-size: 0.75rem;
  opacity: 0.7;
}

/* Duplicate Detection Button States */
.btn-danger:disabled {
  background-color: #6c757d;
  border-color: #6c757d;
  opacity: 0.65;
}

.btn-danger:disabled:hover {
  background-color: #6c757d;
  border-color: #6c757d;
}

/* Duplicate Detection Card Enhancements */
.card-header.bg-danger {
  background: linear-gradient(135deg, #dc3545 0%, #c82333 100%) !important;
  border-bottom: 2px solid #bd2130;
}

.card-header.bg-danger h5 {
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

/* Duplicate Detection Button Hover Effects */
.btn-danger:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
  transition: all 0.2s ease;
}

.btn-outline-danger:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(220, 53, 69, 0.2);
  transition: all 0.2s ease;
}

/* Loading Animation for Duplicate Detection */
@keyframes scanning {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.bi-hourglass-split {
  animation: scanning 1s linear infinite;
}