/* YKPATCH_ODCIENIE_2026_10_05 - ladowane tylko na kategoriach z lakierami */
.fpp_searchers, #content_permanent_mobile_1, .pts.searcher-content { display: none !important; }
/* blok facetedsearch w lewej kolumnie (pokazal sie po dodaniu cechy Kolor) - na tych stronach filtrujemy paskiem */
#search_filters_wrapper, #search_filter_toggler, #search_filter_controls { display: none !important; }

.yk-odc { display: flex; align-items: center; gap: 14px 18px; flex-wrap: wrap; padding: 4px 0 18px; margin: 0 0 18px; border-bottom: 1px solid #ece7e2; }
.yk-odc__label { font-size: 15px; font-weight: 600; color: #1d1c1a; white-space: nowrap; }
.yk-odc__list { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.yk-odc__sw { position: relative; display: block; width: 34px; height: 34px; padding: 3px; border: 1px solid transparent; border-radius: 4px; text-decoration: none !important; transition: border-color .15s; }
.yk-odc__dot { display: block; width: 100%; height: 100%; border-radius: 2px; }
.yk-odc__sw.is-light .yk-odc__dot { box-shadow: inset 0 0 0 1px #d9d2cb; }
.yk-odc__sw:hover { border-color: #c9b8a8; }
.yk-odc__sw.is-active { border-color: #1d1c1a; }
.yk-odc__sw.is-active::after { content: ""; position: absolute; left: 50%; top: 50%; width: 7px; height: 12px; margin: -8px 0 0 -4px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); filter: drop-shadow(0 0 1px rgba(0,0,0,.6)); }
.yk-odc__sw.is-active.is-light::after { border-color: #1d1c1a; filter: none; }
.yk-odc__name { position: absolute; left: 50%; bottom: calc(100% + 6px); transform: translateX(-50%); background: #1d1c1a; color: #fff; font-size: 12px; line-height: 1; padding: 6px 8px; border-radius: 3px; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .15s; z-index: 5; }
.yk-odc__sw:hover .yk-odc__name, .yk-odc__sw:focus-visible .yk-odc__name { opacity: 1; }
.yk-odc__clear { margin-left: 6px; font-size: 13px; color: #a88466; text-decoration: underline; white-space: nowrap; }

@media (max-width: 767px) {
  .yk-odc { gap: 10px; padding-bottom: 14px; }
  .yk-odc__label { width: 100%; font-size: 14px; }
  .yk-odc__list { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding: 2px 2px 4px; margin: 0 -2px; scrollbar-width: none; }
  .yk-odc__list::-webkit-scrollbar { display: none; }
  .yk-odc__sw { flex: 0 0 auto; width: 38px; height: 38px; }
  .yk-odc__name { display: none; }
}