@import url('https://cdn-uicons.flaticon.com/3.0.0/uicons-regular-rounded/css/uicons-regular-rounded.css');
@import url('https://cdn-uicons.flaticon.com/3.0.0/uicons-bold-rounded/css/uicons-bold-rounded.css');

.fi {
  font-size: 20px;
}

/* Navbar avatar sizing */
#user-avatar {
  width: 32px;
  height: 32px;
  object-fit: cover;
  border-radius: 50%;
}

/* Responsive map height */
.responsive-map {
  height: 270px;
}

.responsive-big-map {
  /* Fixed heights per breakpoint: small/medium/large */
  height: 370px; /* small devices */
}

@media (min-width: 768px) {
  .responsive-big-map {
    height: 400px; /* medium devices */
  }
}

@media (min-width: 992px) {
  .responsive-big-map {
    height: 500px; /* large devices and up */
  }

  .responsive-map {
    height: 40vh;
    max-height: 450px;
  }
}

/* Use Bootstrap's expected .nav-link selector so styles are consistent */
.navbar-nav .nav-item .nav-link {
  padding: 0.25rem 0.5rem;
  text-decoration: none;
  color: white;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}


.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #fff;
  background-color: #325d88;
  border-color: #325d88;
}

.nav-pills .nav-link {
  border: 1.5px solid #325d88;
  border-radius: 0.5rem;
  color: #325d88;
  background: transparent;
}

.nav-pills .nav-link:not(.active):hover {
  background-color: #e9f2fb;
  color: #325d88;
  border-color: #325d88;
  
}

/* Pagination im btn-outline-primary Design */
.pagination .page-link {
  border: 1px solid #325d88;
  color: #325d88;
  background: transparent;
  border-radius: 0;
  transition: background-color 0.2s, color 0.2s;
}
.pagination .page-item:first-child .page-link {
  border-top-left-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}
.pagination .page-item:last-child .page-link {
  border-top-right-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}
.pagination .page-item.active .page-link {
  color: #fff;
  background-color: #325d88;
  border-color: #325d88;
}
.pagination .page-link:hover {
  background-color: #e9f2fb;
  color: #325d88;
}
.pagination .page-item.disabled .page-link {
  color: #325d88;
  background: #f8f9fa;
  opacity: 0.6;
  pointer-events: none;
}

/* Auth page styling to match dashboard tone */
.auth-page {
  background: linear-gradient(135deg, #e9f2fb 0%, #f8fbff 60%, #ffffff 100%);
}

.auth-card {
  border: none;
  box-shadow: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.08);
}

.auth-card .btn-primary {
  background-color: #325d88;
  border-color: #325d88;
}

.auth-card .btn-primary:hover {
  background-color: #27476c;
  border-color: #27476c;
}

/* Activity list styles */
.activity-header {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.activity-details .fw-bold {
  font-variant-numeric: tabular-nums;
}

/* Lower z-index for sticky map so dropdowns appear above */
.position-sticky {
  z-index: 100 !important;
}

