body {
  background-color: #f8f9fa;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

.navbar-brand {
  font-weight: bold;
  color: #0d6efd !important;
}

.card {
  border: none;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s;
}

.card:hover {
  transform: translateY(-5px);
}

.notice-img {
  height: 200px;
  object-fit: cover;
}

.profile-img-small {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  object-fit: cover;
}

.status-active {
  background-color: #198754;
  color: white;
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
  font-size: 0.8rem;
}

.status-completed {
  background-color: #6c757d;
  color: white;
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
  font-size: 0.8rem;
}

.hero-section {
  background: linear-gradient(135deg, #0d6efd 0%, #0dcaf0 100%);
  color: white;
  padding: 4rem 0;
  margin-bottom: 2rem;
}

/* Ensure buttons are always visible */
.btn {
  opacity: 1 !important;
  visibility: visible !important;
  display: inline-block !important;
  color: inherit !important;
}

.btn-sm {
  opacity: 1 !important;
  visibility: visible !important;
  display: inline-block !important;
}

.d-inline {
  display: inline !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.d-grid {
  opacity: 1 !important;
  visibility: visible !important;
}

.list-group-item div.d-flex {
  opacity: 1 !important;
  visibility: visible !important;
}

/* Override Bootstrap list-group-item-action hover behavior */
.list-group-item.list-group-item-action {
  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.list-group-item.list-group-item-action:hover {
  background-color: rgba(0, 0, 0, 0.03) !important;
  color: inherit !important;
  z-index: 1;
}

.list-group-item.list-group-item-action:focus {
  background-color: rgba(0, 0, 0, 0.03) !important;
  color: inherit !important;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
  z-index: 1;
}

/* Ensure button containers are accessible */
.list-group-item > div {
  position: relative;
  z-index: 2;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Form buttons in list items */
.list-group-item form {
  display: inline !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.list-group-item form button {
  opacity: 1 !important;
  visibility: visible !important;
  display: inline-block !important;
  z-index: 10 !important;
  position: relative !important;
  pointer-events: auto !important;
}

/* Link buttons */
.list-group-item .btn-info {
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 10 !important;
}