.front-linki .view-content {
    grid-template-columns: 1fr;
    gap: 10px
}
.front-linki .view-content a {
    color: blue;
    font-size: 1rem;
}


.views-exposed-form-recipes-all {
	
	
}


/* 1. Kontener listy - usunięcie domyślnych kropek i marginesów, układ w rzędzie */
#views-exposed-form-recipes-all {
	justify-content: center;
}
.bef-links-use-ajax ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* 2. Domyślny wygląd pojedynczego przycisku */
.bef-links-use-ajax ul li a {
  display: inline-block;
  padding: 8px 18px;
  background-color: #f5f2eb;
  color: #3b302a;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  border: 1px solid #e2dbce;
  border-radius: 9999px; /* Tworzy idealne zaokrąglenie w kształcie pigułki */
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  line-height: 1.2;
}

/* 3. Efekt najechania myszką (Hover) */
.bef-links-use-ajax ul li a:hover {
  background-color: #e8e1d5;
  border-color: #cbbeab;
}

/* 4. Stan aktywny / zaznaczony (klasy nadawane dynamicznie przez Drupal i BEF) */
.bef-links-use-ajax ul li a.bef-link--selected,
.bef-links-use-ajax ul li a.is-active {
  background-color: #8c5332;
  color: #ffffff;
  border-color: #8c5332;
  box-shadow: 0 2px 6px rgba(140, 83, 50, 0.25);
}