body > nav {
  background: linear-gradient(to bottom, rgb(64, 110, 167), rgb(71, 118, 174));
}

/* Dashboard Task Status Links */
.hover-bg-light:hover {
  background-color: #f8f9fa !important;
  transition: background-color 0.2s ease;
}

.hover-bg-light {
  transition: background-color 0.2s ease;
}

/* Task Index Summary Cards Hover Effects */
.card.hover-bg-light:hover {
  background-color: #f8f9fa !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  transition: all 0.2s ease;
}

.card.hover-bg-light {
  transition: all 0.2s ease;
  cursor: pointer;
  position: relative;
}

/* Navigation Brand Active State */
#main-nav.navbar-brand.active {
  color: rgba(255, 255, 255, 1) !important; */
  opacity: 1;
}

#main-nav.navbar-brand {
  color: rgba(255, 255, 255, 0.5) !important;
  transition: color 0.15s ease-in-out, opacity 0.15s ease-in-out, border-bottom 0.15s ease-in-out;
}

/* Selected status card styles - only change colors, no size changes */
.card.border-danger.bg-danger-subtle {
  border-color: #dc3545 !important;
}

.card.border-warning.bg-warning-subtle {
  border-color: #ffc107 !important;
}

.card.border-secondary.bg-secondary-subtle {
  border-color: #6c757d !important;
}

.card.border-success.bg-success-subtle {
  border-color: #198754 !important;
}

/* Search input focus styles - prevent overlap with button */
.input-group .form-control:focus {
  border-color: #86b7fe;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075), 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
  z-index: 3;
}

.input-group .form-control:focus + .btn {
  border-left-color: #86b7fe;
}

/* Search input group styling for better appearance */
.input-group-sm .form-control {
  border-right: none;
}

.input-group-sm .btn {
  border-left: 1px solid #dee2e6;
  padding-left: 12px;
  padding-right: 12px;
}

.input-group-sm .form-control:focus + .btn {
  border-color: #86b7fe;
  border-left-color: #86b7fe;
}

/* Sub Navigation Styling */
.sub-nav {
  background-color: #f8f9fa;
  border-bottom: 1px solid #dee2e6;
  margin-bottom: 1.5rem;
}

.sub-nav .container {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.sub-nav .d-flex {
  gap: 1rem;
}

.sub-nav .search-container {
  min-width: 250px;
  max-width: 400px;
  flex: 1 1 auto;
}

/* Responsive adjustments for sub-nav */
@media (max-width: 768px) {
  .sub-nav .d-flex {
    flex-direction: column;
    gap: 0.75rem;
  }

  .sub-nav .search-container {
    min-width: 100%;
    max-width: 100%;
  }
}

/* Mark Complete Button - Simple JavaScript-based icon switching */
.mark-complete-btn .checked-icon {
  display: none;
}
.no-hover-effect.btn-outline-success {
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-color: #198754; /* Default success color */
    --bs-btn-hover-border-color: #198754;
}

/* Mobile Dropdown Menu - Overlay instead of expanding navbar */
.mobile-dropdown-menu {
  top: 100% !important;
  right: 50% !important;
  transform: translateX(50%) !important;
  z-index: 1050;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  min-width: 200px;
}

/* Mobile Hamburger Menu Dropdown */
.mobile-hamburger-menu {
  top: 100% !important;
  left: 0 !important;
  z-index: 1050;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  min-width: 200px;
}

/* Ensure the dropdown parent has position context */
@media (max-width: 991px) {
  .nav-item.dropdown.position-static {
    position: relative !important;
  }
}

#mobile-bottom-nav {
  .nav-link {
    color: rgba(255, 255, 255, 0.5);
  }
  .nav-link.active {
    color: white;
    background-color: rgba(255, 255, 255, 0.1);
 }
}

.main-content {
  padding-bottom: 6.5rem !important; /* mobile nav clearance */
}

@media (min-width: 992px) {
  .main-content {
    padding-bottom: 1rem !important; /* Standard spacing on desktop */
  }
}