.planning-card-hidden {
  display: none;
}

.planning-problem-red {
  background: linear-gradient(135deg, rgba(127, 29, 29, 0.6), rgba(91, 33, 33, 0.6)) !important;
  border: 1px solid rgba(220, 38, 38, 0.5) !important;
}

.planning-problem-red .info-text {
  color: #ffffff !important;
  font-weight: 600 !important;
}

.filters-container {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.4), rgba(30, 50, 80, 0.3));
  padding: 1.5rem;
  border-radius: 8px;
  border: 1px solid rgba(100, 120, 150, 0.2);
  backdrop-filter: blur(8px);
}

.filters-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.filter-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.6rem 1rem;
  border-radius: 6px;
  border: 1px solid rgba(100, 120, 150, 0.3);
  background: linear-gradient(135deg, rgba(30, 58, 95, 0.4), rgba(15, 40, 71, 0.3));
  color: #cbd5e1;
  font-weight: 600;
  font-size: 0.85rem;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
}

.filter-btn:hover {
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.5), rgba(29, 78, 137, 0.4));
  border-color: rgba(59, 130, 246, 0.5);
  color: #e5e7eb;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2);
}

.filter-btn.active {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.7), rgba(37, 99, 235, 0.6));
  border-color: rgba(147, 197, 253, 0.6);
  color: #ffffff;
  box-shadow: 0 6px 16px rgba(59, 130, 246, 0.3);
}

.filter-btn-reset {
  background: linear-gradient(135deg, rgba(100, 116, 139, 0.4), rgba(71, 85, 105, 0.3));
}

.filter-btn-reset:hover {
  background: linear-gradient(135deg, rgba(148, 163, 184, 0.5), rgba(100, 116, 139, 0.4));
  border-color: rgba(148, 163, 184, 0.5);
}

.filter-btn-reset.active {
  background: linear-gradient(135deg, rgba(148, 163, 184, 0.7), rgba(100, 116, 139, 0.6));
  border-color: rgba(226, 232, 240, 0.6);
  color: #ffffff;
}

.filter-icon {
  width: 16px;
  height: 16px;
  stroke: currentColor;
}

@media (max-width: 768px) {
  .filters-container {
      padding: 1rem;
  }

  .filter-btn {
      padding: 0.5rem 0.8rem;
      font-size: 0.75rem;
  }
}

/* Height max pour mettre les cartes à la même hauteur */
@media (min-width: 768px) {
  .height-fixe {height:300px;}
}

.selectedRow {
  width:250px;
}