/* =============================================
   BSV ANIMATIONS V3 — spectrsiz.by
   ============================================= */

/* =============================================
   SCROLL-АНИМАЦИИ
   Только на страницах /catalog/ (JS не добавляет
   bsv-animate на главной/каруселях)
   ============================================= */
.bsv-animate {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.46s ease, transform 0.46s ease;
}
.bsv-animate.bsv-visible {
  opacity: 1;
  transform: translateY(0);
}
.bsv-animate:nth-child(2) { transition-delay: 0.06s; }
.bsv-animate:nth-child(3) { transition-delay: 0.12s; }
.bsv-animate:nth-child(4) { transition-delay: 0.18s; }
.bsv-animate:nth-child(5) { transition-delay: 0.24s; }
.bsv-animate:nth-child(6) { transition-delay: 0.30s; }

/* =============================================
   ZOOM ФОТО — плавное увеличение без артефактов
   Работает через item__images (не через img напрямую),
   transform-origin строго центр
   ============================================= */
.item__image_container {
  overflow: hidden !important;
}
.item__images {
  transition: transform 0.40s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  transform-origin: center center !important;
  will-change: transform;
}
.item:hover .item__images {
  transform: scale(1.06) !important;
}

/* =============================================
   STICKY ШАПКА — CSS sticky, без JS-хэндлера
   position:sticky не вызывает layout jump
   ============================================= */
/* Sticky убран — шапка скроллится вместе со страницей
   (position:sticky + absolute logo вызывали прыжки) */
.header_desctop {
  box-shadow: 0 2px 10px rgba(27,42,59,0.08) !important;
}

/* =============================================
   SKELETON SHIMMER
   ============================================= */
@keyframes bsvShimmer {
  0%   { background-position: -600px 0; }
  100% { background-position: 600px 0; }
}
.item__image_container:not(.bsv-img-loaded) {
  background: linear-gradient(
    90deg,
    #edebe6 25%, #f4f1ec 50%, #edebe6 75%
  ) !important;
  background-size: 600px 100% !important;
  animation: bsvShimmer 1.6s infinite linear !important;
}
.item__image_container.bsv-img-loaded {
  background: #f8f5f0 !important;
  animation: none !important;
}

/* =============================================
   МЕГАМЕНЮ — плавное появление
   ============================================= */
.bsv-mega-nav__panel {
  opacity: 0;
  transform: translateY(-5px);
  transition: opacity 0.20s ease, transform 0.20s ease, visibility 0.20s !important;
  visibility: hidden;
  pointer-events: none;
}
.bsv-mega-nav__item.has-drop:hover .bsv-mega-nav__panel {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
}
.bsv-mega-nav__col {
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.18s ease, transform 0.18s ease;
}
.bsv-mega-nav__item.has-drop:hover .bsv-mega-nav__col { opacity: 1; transform: translateY(0); }
.bsv-mega-nav__item.has-drop:hover .bsv-mega-nav__col:nth-child(1) { transition-delay: 0.03s; }
.bsv-mega-nav__item.has-drop:hover .bsv-mega-nav__col:nth-child(2) { transition-delay: 0.07s; }
.bsv-mega-nav__item.has-drop:hover .bsv-mega-nav__col:nth-child(3) { transition-delay: 0.11s; }
.bsv-mega-nav__item.has-drop:hover .bsv-mega-nav__col:nth-child(4) { transition-delay: 0.15s; }
.bsv-mega-nav__item.has-drop:hover .bsv-mega-nav__col:nth-child(5) { transition-delay: 0.19s; }

/* =============================================
   КНОПКА "НАВЕРХ"
   ============================================= */
#bsv-top-btn {
  position: fixed;
  right: 26px;
  bottom: 30px;
  width: 46px;
  height: 46px;
  background: var(--nv, #1B2A3B);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 9998;
  opacity: 0;
  transform: translateY(16px) scale(0.82);
  transition: opacity 0.28s ease, transform 0.28s ease, background 0.2s ease;
  box-shadow: 0 4px 20px rgba(27,42,59,0.28);
  pointer-events: none;
}
#bsv-top-btn.bsv-show {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
#bsv-top-btn:hover {
  background: var(--or, #f07b1d) !important;
  transform: translateY(-3px) scale(1.06) !important;
  box-shadow: 0 8px 24px rgba(240,123,29,0.38) !important;
}
#bsv-top-btn svg {
  width: 22px; height: 22px;
  fill: none; stroke: #fff;
  stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round;
  pointer-events: none;
}

/* =============================================
   ПРОГРЕСС-БАР СЛАЙДЕРА
   ============================================= */
@keyframes bsvSlideBar {
  from { width: 0%; }
  to   { width: 100%; }
}
.bsv-slide-bar {
  position: absolute;
  bottom: 0; left: 0;
  height: 3px;
  background: var(--or, #f07b1d);
  border-radius: 0 2px 2px 0;
  z-index: 50;
  animation: bsvSlideBar 5s linear infinite;
  pointer-events: none;
}

/* =============================================
   АКТИВНАЯ ССЫЛКА НАВИГАЦИИ
   ============================================= */
.nav_link.active,
.nav_li.active .nav_link,
.nav_li.current .nav_link {
  color: var(--or, #f07b1d) !important;
}
.nav_link.active::after,
.nav_li.active .nav_link::after,
.nav_li.current .nav_link::after {
  width: 100% !important;
}

/* =============================================
   HOVER НА ФИЛЬТРАХ
   ============================================= */
.catalog_filter .filter_value label,
.filter_item label {
  transition: color 0.16s, background 0.16s !important;
  cursor: pointer !important;
  border-radius: 4px !important;
  padding: 2px 5px !important;
}
.catalog_filter .filter_value label:hover,
.filter_item label:hover {
  color: var(--or, #f07b1d) !important;
  background: var(--or-lt, #fff4e8) !important;
}
.catalog_filter .filter_apply,
.catalog_filter .apply_filter_btn {
  background: var(--or, #f07b1d) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 9px 18px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background 0.18s, transform 0.14s !important;
}
.catalog_filter .filter_apply:hover,
.catalog_filter .apply_filter_btn:hover {
  background: var(--or-dk, #d96810) !important;
  transform: translateY(-1px) !important;
}

/* =============================================
   FOCUS-VISIBLE
   ============================================= */
a:focus-visible,
button:focus-visible,
input:focus-visible {
  outline: 2px solid var(--or, #f07b1d) !important;
  outline-offset: 3px !important;
  border-radius: 4px !important;
}

/* =============================================
   МОБАЙЛ
   ============================================= */
@media (max-width: 768px) {
  .bsv-animate { transition-delay: 0s !important; }
  .item:hover .item__images { transform: none !important; }
  #bsv-top-btn { right: 14px; bottom: 70px; width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .bsv-animate { transition: none !important; opacity: 1 !important; transform: none !important; }
  .item__images { transition: none !important; }
  .item__image_container { animation: none !important; }
  .bsv-slide-bar { animation: none !important; }
}