/* Wyszukiwarka pelnoekranowa (dev2) - nakladka z podpowiedziami produktow */
html.trk-so-open, html.trk-so-open body { overflow: hidden; }
.trk-so[hidden] { display: none !important; }
.trk-so {
  position: fixed; inset: 0; z-index: 100000; overflow-y: auto; -webkit-overflow-scrolling: touch;
  background: rgba(255, 255, 255, .98); font-family: Sora, system-ui, sans-serif; color: #183030;
  animation: trk-so-in .18s ease-out;
}
@keyframes trk-so-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.trk-so__panel { position: relative; max-width: 960px; margin: 0 auto; padding: 0 24px 48px; }
.trk-so__top { position: sticky; top: 0; z-index: 3; background: #fff; padding: 88px 0 0; margin-bottom: 20px; }
.trk-so__close {
  position: absolute; top: 24px; right: 0; width: 48px; height: 48px; border: 0; border-radius: 50%;
  background: #f3efea; color: #183030; display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.trk-so__close:hover, .trk-so__close:focus-visible { background: #e4fd71; outline: 0; }
.trk-so__form { display: flex; align-items: center; border-bottom: 2px solid #183030; margin-bottom: 0; }
.trk-so__input {
  flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; padding: 14px 0;
  font: inherit; font-size: 28px; line-height: 1.2; color: #183030; -webkit-appearance: none; appearance: none;
}
.trk-so__input::placeholder { color: #8a9594; }
.trk-so__input::-webkit-search-cancel-button { display: none; }
.trk-so__submit { border: 0; background: transparent; color: #183030; padding: 8px; cursor: pointer; display: flex; }
.trk-so__label { margin: 0 0 8px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #6b6b6b; }
.trk-so__status { margin: 0 0 12px; font-size: 15px; color: #4d5a59; }
.trk-so__list { list-style: none; margin: 0; padding: 0; }
.trk-so__li + .trk-so__li { border-top: 1px solid #ece7e0; }
.trk-so__item {
  display: flex; align-items: center; gap: 16px; padding: 12px 8px; color: inherit; text-decoration: none; border-radius: 8px;
}
.trk-so__item:hover, .trk-so__item:focus-visible { background: #f7f4ef; outline: 0; }
.trk-so__thumb { flex: 0 0 64px; width: 64px; height: 64px; border-radius: 8px; background: #f3efea; overflow: hidden; display: block; }
.trk-so__thumb img { width: 100%; height: 100%; object-fit: contain; display: block; }
.trk-so__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.trk-so__name { font-size: 15px; line-height: 1.35; font-weight: 600; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.trk-so__ref { font-size: 12px; color: #6b6b6b; }
.trk-so__price { flex: 0 0 auto; font-size: 15px; white-space: nowrap; text-align: right; }
.trk-so__old { color: #8a9594; font-size: 13px; }
.trk-so__all {
  display: inline-block; margin-top: 20px; padding: 14px 24px; border-radius: 999px; background: #183030; color: #fff;
  text-decoration: none; font-weight: 600; font-size: 15px;
}
.trk-so__all:hover, .trk-so__all:focus-visible { background: #e4fd71; color: #183030; outline: 0; }
@media (prefers-reduced-motion: reduce) { .trk-so { animation: none; } }

.trk-so--typing .trk-so__label--sugg { display: block; }
.trk-so__label--sugg { display: none; }
.trk-so__group { margin-bottom: 24px; }
.trk-so__group .trk-so__label { display: flex; align-items: center; justify-content: space-between; }
.trk-so__clear { border: 0; background: transparent; color: #4d5a59; font: inherit; font-size: 12px; text-transform: none; letter-spacing: 0; text-decoration: underline; cursor: pointer; padding: 0; }
.trk-so__clear:hover { color: #183030; }
.trk-so__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.trk-so__chip {
  border: 1px solid #d9d2c7; background: #fff; color: #183030; border-radius: 999px; padding: 9px 16px;
  font: inherit; font-size: 14px; cursor: pointer;
}
.trk-so__chip:hover, .trk-so__chip:focus-visible { background: #e4fd71; border-color: #183030; outline: 0; }

.trk-so__feat { margin-bottom: 8px; }
.trk-so__cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.trk-so__card { display: flex; flex-direction: column; gap: 6px; padding: 10px; border: 1px solid #ece7e0; border-radius: 12px; color: inherit; text-decoration: none; background: #fff; }
.trk-so__card:hover, .trk-so__card:focus-visible { border-color: #183030; outline: 0; }
.trk-so__cardimg { display: block; aspect-ratio: 1 / 1; border-radius: 8px; background: #f3efea; overflow: hidden; }
.trk-so__cardimg img { width: 100%; height: 100%; object-fit: contain; display: block; }
.trk-so__cardname { font-size: 13px; line-height: 1.35; font-weight: 600; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.trk-so__cardprice { font-size: 14px; }
@media (max-width: 767px) { .trk-so__cards { grid-template-columns: repeat(2, 1fr); } }

.trk-so__cats { margin-bottom: 24px; }
.trk-so__catgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.trk-so__cat {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 14px 16px; border-radius: 12px;
  background: #f3efea; color: #183030; text-decoration: none; font-size: 14px; font-weight: 600;
}
.trk-so__cat:hover, .trk-so__cat:focus-visible { background: #e4fd71; outline: 0; }
.trk-so__cat svg { flex: 0 0 auto; }
@media (max-width: 767px) { .trk-so__catgrid { grid-template-columns: repeat(2, 1fr); } }
.trk-so__card { padding: 12px; transition: box-shadow .15s, border-color .15s; }
.trk-so__card:hover { box-shadow: 0 6px 18px rgba(24, 48, 48, .10); }
.trk-so__cardimg { background: #fff; }

.trk-so { overscroll-behavior: contain; }
@media (max-width: 767px) {
  .trk-so { padding-bottom: env(safe-area-inset-bottom); }
  .trk-so__panel { padding: 0 16px 32px; }
  .trk-so__top {
    display: flex; align-items: center; gap: 8px; margin: 0 -16px 16px; padding: calc(10px + env(safe-area-inset-top)) 16px 10px;
    border-bottom: 1px solid #ece7e0;
  }
  .trk-so__close { position: static; order: 2; flex: 0 0 44px; width: 44px; height: 44px; }
  .trk-so__form { flex: 1; min-width: 0; }
  .trk-so__input { font-size: 18px; padding: 10px 0; }
  .trk-so__submit { min-width: 44px; min-height: 44px; justify-content: center; align-items: center; }
  .trk-so__group { margin-bottom: 16px; }
  .trk-so__chips { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 0 16px 4px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .trk-so__chips::-webkit-scrollbar { display: none; }
  .trk-so__chip { flex: 0 0 auto; white-space: nowrap; min-height: 40px; }
  .trk-so__catgrid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .trk-so__cat { min-height: 48px; padding: 10px 12px; font-size: 13px; }
  .trk-so__cards {
    display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 -16px; padding: 0 16px 8px;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .trk-so__cards::-webkit-scrollbar { display: none; }
  .trk-so__card { flex: 0 0 58%; max-width: 230px; scroll-snap-align: start; }
  .trk-so__item { gap: 12px; padding: 10px 4px; min-height: 64px; }
  .trk-so__thumb { flex-basis: 56px; width: 56px; height: 56px; }
  .trk-so__name { font-size: 14px; }
  .trk-so__price { font-size: 14px; }
  .trk-so__old { display: block; }
  .trk-so__all { display: block; text-align: center; margin-top: 16px; }
}

/* v1.5: przewijane rzedy (kategorie z miniaturami, karty produktow) na desktopie i mobile */
.trk-so__scroll { position: relative; }
.trk-so__catgrid, .trk-so__cards {
  display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  grid-template-columns: none; margin: 0; padding: 2px 2px 8px;
}
.trk-so__catgrid::-webkit-scrollbar, .trk-so__cards::-webkit-scrollbar { display: none; }
.trk-so__cat {
  flex: 0 0 200px; display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 8px; padding: 0 0 10px;
  border-radius: 12px; background: #f3efea; overflow: hidden; scroll-snap-align: start; min-height: 0; font-size: 14px;
}
.trk-so__catimg { display: block; aspect-ratio: 240 / 88; background: #e8e1d6; overflow: hidden; }
.trk-so__catimg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.trk-so__catname { padding: 0 12px; font-weight: 600; line-height: 1.3; }
.trk-so__card { flex: 0 0 190px; max-width: none; scroll-snap-align: start; }
.trk-so__arrow {
  position: absolute; top: 40%; transform: translateY(-50%); z-index: 2; width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid #d9d2c7; background: #fff; color: #183030; display: flex; align-items: center; justify-content: center;
  cursor: pointer; box-shadow: 0 4px 12px rgba(24, 48, 48, .15);
}
.trk-so__arrow[hidden] { display: none; }
.trk-so__arrow:hover { background: #e4fd71; }
.trk-so__arrow--prev { left: -12px; }
.trk-so__arrow--next { right: -12px; }
@media (max-width: 767px) {
  .trk-so__catgrid, .trk-so__cards { margin: 0 -16px; padding: 2px 16px 8px; gap: 10px; scroll-snap-type: x mandatory; }
  .trk-so__cat { flex-basis: 150px; font-size: 13px; }
  .trk-so__card { flex-basis: 56%; max-width: 220px; }
  .trk-so__arrow { display: none; }
}
@media (pointer: coarse) { .trk-so__arrow { display: none; } }
