/* Wyszukiwarka noclegów (/noclegi/): filtry i lista wyników.
   Pola, przyciski i zakładki dziedziczą z kalkulator-wycena.css (.wf-pole) i styl.css (.wycena, .przycisk).
   Na telefonie odległości w jednej kolumnie, daty i goście po dwa; od 640 px odległości w trzech, od 900 px daty i goście w czterech. */

/* ---------------------------------------------------------------- filters */

.nc-pola { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.8rem; align-items: end; }
.nc-pola[hidden] { display: none; }
.nc-wieki, .nc-pola-4 { margin-top: 0.8rem; }
/* daty i goście po dwa w rzędzie już na telefonie, żeby nie wydłużać formularza */
.nc-pola-4, .nc-wieki { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 640px) {
  .nc-pola-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
  .nc-pola-4, .nc-wieki { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.nc .wf-pole input[type="date"] { font-variant-numeric: tabular-nums; }
@media (max-width: 639px) { .nc .wf-pole input[type="date"] { padding-left: 0.55rem; padding-right: 0.4rem; } }
.nc-podp { margin: 0.5rem 0 0; font-size: 0.85rem; color: var(--tekst-2); }

.nc-opcje { display: flex; flex-wrap: wrap; gap: 0 1.6rem; margin: 0.8rem 0 0; padding: 0; border: 0; min-width: 0; }
.nc-opcja { display: inline-flex; align-items: center; gap: 0.6rem; min-height: 44px; cursor: pointer; }
.nc-opcja input { flex: none; width: 22px; height: 22px; margin: 0; accent-color: var(--akcent); cursor: pointer; }
.nc-opcja input:focus-visible { outline: 3px solid var(--fokus); outline-offset: 2px; }

.nc-caly { width: 100%; margin-top: 0.8rem; }
@media (min-width: 640px) { .nc-caly { width: auto; } }

/* ---------------------------------------------------------------- results */

.nc-wynik { margin-top: 1.4rem; }
.nc-licznik { margin: 0 0 0.7rem; font-weight: 650; }
.nc-zaslepka { display: block; margin-top: 0.2rem; font-weight: 400; font-size: 0.9rem; color: var(--akcent-2); }

.nc-lista { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--linia); }
.nc-pusto { padding: 1rem 0; border-bottom: 1px solid var(--linia); }
.nc-pusto .przycisk { width: 100%; }
@media (min-width: 640px) { .nc-pusto .przycisk { width: auto; } }

.nc-wiersz { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.8rem; padding: 1rem 0; border-bottom: 1px solid var(--linia); }
@media (min-width: 720px) {
  .nc-wiersz { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1.5rem; }
}
.nc-ulica { margin: 0; font-size: 1.15rem; line-height: 1.25; }
.nc-numery { margin: 0.15rem 0 0.55rem; font-size: 0.93rem; color: var(--tekst-2); }
.nc-chipy { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0; padding: 0; list-style: none; }
.nc-chip {
  padding: 0.25rem 0.7rem; font-size: 0.88rem; font-variant-numeric: tabular-nums;
  background: var(--tlo); border: 1px solid var(--linia); border-radius: 999px;
}

.nc-akcje { display: flex; flex-direction: column; align-items: stretch; gap: 0.2rem; min-width: 0; }
@media (min-width: 720px) { .nc-akcje { align-items: flex-end; } }
.nc-ceny {
  display: inline-flex; align-items: center; justify-content: center; min-height: 44px;
  font-size: 0.93rem; color: var(--akcent);
}
.nc-ceny:hover { color: var(--akcent-mocny); }

.nc-wiecej { width: 100%; margin-top: 1rem; }
.nc-wiecej[hidden] { display: none; }
@media (min-width: 640px) { .nc-wiecej { width: auto; } }

.nc-partner { margin: 0.8rem 0 0; font-size: 0.85rem; color: var(--tekst-2); }