/* Галерея V12 (custom-gallery-overlay) – вынесено из lot_v12.html 07.11.2026 для страницы склада */
.show-debug .cg-gallery-main-wrap { outline: 1px solid #ff00ff !important; outline-offset: -1px; }

.show-debug .cg-swiper-container-wrap { outline: 1px solid #ffff00 !important; outline-offset: -1px; }

.show-debug #cg-media { outline: 1px solid #00ff00 !important; outline-offset: -1px; }

.show-debug #cg-media .swiper-slide { outline: 1px dashed #ff0000 !important; outline-offset: -1px; }

.show-debug .cg-slide-caption { box-shadow: 0 0 0 1px rgba(255,107,53,0.3); }

#cg-media,
        #cg-media .swiper-wrapper,
        #cg-media .swiper-slide {
            touch-action: none;
        }

#custom-gallery-overlay .cg-chip.is-active,
        #custom-gallery-overlay .cg-mchip.is-active {
            background: rgba(255, 255, 255, 0.16) !important;
            border-color: rgba(255, 255, 255, 0.38) !important;
            color: #f1f5f9 !important;
            box-shadow: none !important;
        }

#cg-inspector-rail {
            position: relative;
            height: 100%;
            max-height: calc(100vh - 170px);
            z-index: 20;
            align-items: center;
        }

#cg-inspector-rail.hidden {
            display: none !important;
        }

@media (min-width: 768px) {
#cg-inspector-rail:not(.hidden) {
                display: flex;
            }
}

#cg-side-chips {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-self: center;
            overflow: hidden;
            overscroll-behavior: none;
        }

#cg-inspector-flyout {
            position: relative;
            width: 0;
            margin-left: 0;
            overflow: visible;
            pointer-events: none;
            flex-shrink: 0;
            align-self: center;
        }

#custom-gallery-overlay.cg-inspector-mode #cg-inspector-flyout {
            width: 270px;
            margin-left: 18px;
        }

#cg-inspector-flyout-card {
            width: 270px;
            height: 418px;
            max-height: calc(100vh - 180px);
            box-sizing: border-box;
            background: rgba(15, 23, 42, 0.96);
            border-radius: 16px;
            padding: 16px 16px 16px 18px;
            overflow-x: hidden;
            overflow-y: auto;
            overscroll-behavior: contain;
            color: #f8fafc;
            opacity: 0;
            transform: translateX(-6px);
            transition: opacity 0.22s ease, transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
            scrollbar-width: thin;
            scrollbar-color: rgba(255,255,255,0.2) transparent;
            scrollbar-gutter: stable;
        }

#cg-inspector-flyout-card::-webkit-scrollbar {
            width: 6px;
        }

#cg-inspector-flyout-card::-webkit-scrollbar-track {
            background: transparent;
        }

#cg-inspector-flyout-card::-webkit-scrollbar-thumb {
            background: rgba(255, 255, 255, 0.22);
            border-radius: 999px;
        }

#cg-inspector-flyout.is-open {
            pointer-events: auto;
        }

#cg-inspector-flyout.is-open #cg-inspector-flyout-card {
            opacity: 1;
            transform: translateX(0);
        }

#cg-inspector-connector-svg {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            overflow: visible;
            pointer-events: none;
            z-index: 6;
            opacity: 0;
            transition: opacity 0.2s ease;
        }

#cg-inspector-rail.is-connector-on #cg-inspector-connector-svg {
            opacity: 1;
        }

#cg-inspector-connector-path {
            fill: none;
            stroke: #ea580c;
            stroke-width: 1.5;
            stroke-linecap: round;
            stroke-linejoin: round;
            opacity: 0.85;
        }

.dark #cg-inspector-connector-path {
            stroke: #fd8a36;
            opacity: 0.75;
        }

#cg-inspector-flyout-title {
            font-size: 17px;
            font-weight: 700;
            line-height: 1.25;
            color: #fff;
        }

#cg-inspector-flyout-rank {
            min-width: 2rem;
            height: 2rem;
            border-radius: 0.65rem;
            background: rgba(255,255,255,0.12);
            border: 1px solid rgba(255,255,255,0.18);
            display: none;
            align-items: center;
            justify-content: center;
            font-size: 1rem;
            font-weight: 800;
        }

#cg-inspector-flyout-rank.is-visible {
            display: inline-flex;
        }

#cg-inspector-flyout-comments {
            margin-top: 14px;
            font-size: 15px;
            line-height: 1.5;
            font-weight: 500;
            color: rgba(248, 250, 252, 0.94);
        }

#custom-gallery-overlay:not(.cg-inspector-mode) #cg-mobile-inspector {
            display: none !important;
        }

#custom-gallery-overlay.cg-inspector-mode {
            --cg-inspector-handle: 56px;
        }

#custom-gallery-overlay.cg-inspector-mode #cg-bottom-bar {
            z-index: 10200 !important;
        }

#custom-gallery-overlay.cg-inspector-mode #cg-mobile-inspector {
            position: absolute !important;
            left: 0 !important;
            right: 0 !important;
            bottom: 100% !important;
            z-index: 12 !important;
            width: 100% !important;
            max-width: none !important;
            height: var(--cg-inspector-handle) !important;
            min-height: var(--cg-inspector-handle) !important;
            max-height: var(--cg-inspector-handle) !important;
            margin: 0 !important;
            border-radius: 0 !important;
            border: none !important;
            outline: none !important;
            box-shadow: none !important;
            background: #000 !important;
            display: flex !important;
            align-items: center !important;
            box-sizing: border-box !important;
            -webkit-tap-highlight-color: transparent;
        }

#custom-gallery-overlay.cg-inspector-mode #cg-mobile-inspector > div {
            width: 100%;
            min-width: 0;
        }

#custom-gallery-overlay.cg-inspector-mode #cg-mobile-inspector-title {
            line-height: 1.25;
        }

#custom-gallery-overlay.cg-inspector-mode #cg-mobile-inspector-summary {
            height: 1rem;
            line-height: 1rem;
            margin: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

#custom-gallery-overlay.cg-inspector-mode #cg-mobile-inspector:focus,
        #custom-gallery-overlay.cg-inspector-mode #cg-mobile-inspector:focus-visible,
        #custom-gallery-overlay.cg-inspector-mode #cg-mobile-inspector.is-open {
            outline: none !important;
            box-shadow: none !important;
            border: none !important;
        }

#cg-mobile-inspector-body {
            bottom: calc(100% + var(--cg-inspector-handle, 56px)) !important;
            transform: translateY(8px);
            opacity: 0;
            pointer-events: none;
            transition: transform 0.24s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s ease;
            box-shadow: 0 -12px 30px rgba(0, 0, 0, 0.45);
            border: none !important;
            outline: none !important;
            scrollbar-width: thin;
            scrollbar-color: rgba(255,255,255,0.25) transparent;
            max-height: calc(100vh - 118px) !important;
        }

#custom-gallery-overlay.is-mobile-inspector-open #cg-mobile-inspector-body {
            display: block !important;
            transform: translateY(0);
            opacity: 1;
            pointer-events: auto;
        }

#custom-gallery-overlay.is-mobile-inspector-open #cg-mobile-inspector::before {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            height: 1px;
            background: rgba(255, 255, 255, 0.16);
            pointer-events: none;
            z-index: 2;
        }

#custom-gallery-overlay.is-mobile-inspector-open #cg-mobile-inspector-chevron {
            transform: rotate(180deg);
        }

#custom-gallery-overlay .cg-thumb.is-active {
            border-color: rgba(255, 255, 255, 0.45) !important;
            box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.22);
            opacity: 1;
        }

#custom-gallery-overlay .cg-thumb:not(.is-active) {
            opacity: 0.55;
        }

#custom-gallery-overlay {
            display: none;
            touch-action: none;
            overscroll-behavior: none;
        }

#custom-gallery-overlay.active #cg-close {
            touch-action: manipulation;
            -webkit-tap-highlight-color: transparent;
        }

#custom-gallery-overlay.active {
            display: flex;
        }

.cg-nav-bar {
            position: absolute;
            top: 0;
            bottom: 0;
            width: 15%;
            min-width: 60px;
            max-width: 120px;
            z-index: 150;
            cursor: pointer;
            display: none; /* Скрыты на мобилках */
            align-items: center;
            justify-content: center;
            pointer-events: auto;
        }

@media (min-width: 768px) {
.cg-nav-bar {
                display: flex;
            }
}

.cg-nav-bar-prev { left: 0; }

.cg-nav-bar-next { right: 0; }

.cg-gallery-main-wrap > .cg-swiper-prev,
        .cg-gallery-main-wrap > .cg-swiper-next {
            z-index: 160;
            pointer-events: none;
        }

.cg-video-container {
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            background: transparent;
        }

.cg-video-container video {
            width: 100%;
            height: 100%;
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
        }

#custom-gallery-overlay.cg-zoom-mode #cg-thumbs,
        #custom-gallery-overlay.cg-zoom-mode #cg-inspector-rail,
        #custom-gallery-overlay.cg-zoom-mode #cg-side-chips,
        #custom-gallery-overlay.cg-zoom-mode #cg-mobile-chips,
        #custom-gallery-overlay.cg-zoom-mode #cg-lot-title-mobile,
        #custom-gallery-overlay.cg-zoom-mode #cg-lot-title-container,
        #custom-gallery-overlay.cg-zoom-mode #cg-lot-title-text {
            display: none !important;
        }

#custom-gallery-overlay.cg-zoom-mode #cg-caption-badge-zoom {
            display: none !important;
        }

#custom-gallery-overlay.is-zoomed > div.absolute.top-0, /* Top bar */
        #custom-gallery-overlay.is-zoomed > div.absolute.bottom-0 /* Bottom bar */,
        #custom-gallery-overlay.is-zoomed #cg-inspector-rail,
        #custom-gallery-overlay.is-zoomed #cg-side-chips {
            opacity: 0 !important;
            visibility: hidden !important;
            pointer-events: none !important;
            transition: opacity 0.2s ease, visibility 0.2s ease;
        }

#custom-gallery-overlay.is-zoomed #cg-media {
            overflow: visible !important;
        }

@media (max-width: 767px) {
/* Крестик всегда поверх PhotoSwipe, даже при зуме */
            #custom-gallery-overlay.active > div.absolute.top-0 {
                z-index: 10100 !important;
            }
/* Как #mobile-lot-back: h-16 / px-3 / w-8 → SVG top≈20px left≈16px */
            #custom-gallery-overlay.active #cg-close {
                position: fixed;
                top: calc(env(safe-area-inset-top, 0px) + 1rem);
                left: 0.75rem;
                width: 2rem;
                height: 2rem;
                justify-content: center;
                gap: 0;
                z-index: 10101 !important;
                pointer-events: auto !important;
            }
#custom-gallery-overlay.is-zoomed > div.absolute.top-0 {
                opacity: 1 !important;
                visibility: visible !important;
                pointer-events: none !important;
            }
#custom-gallery-overlay.is-zoomed #cg-close {
                opacity: 1 !important;
                visibility: visible !important;
                pointer-events: auto !important;
            }
#custom-gallery-overlay.is-zoomed #cg-lot-title-container {
                opacity: 0 !important;
                visibility: hidden !important;
                pointer-events: none !important;
            }
/* Не поднимать z-index при зуме – иначе мигают соседние слайды */
            #custom-gallery-overlay.is-zoomed .cg-gallery-main-wrap,
            #custom-gallery-overlay.is-zoomed #cg-photo-container {
                z-index: 10 !important;
            }
#custom-gallery-overlay.active #cg-photo-container { align-items: stretch !important; }
#custom-gallery-overlay.active .cg-swiper-container-wrap {
                align-self: stretch !important;
                height: 100% !important;
                justify-content: center !important;
            }
#custom-gallery-overlay.active #cg-media {
                flex: 1 1 auto !important;
                min-height: 0 !important;
                height: 100% !important;
            }
#custom-gallery-overlay.active > div.absolute.top-0 { pointer-events: none; }
#custom-gallery-overlay.active > div.absolute.top-0 .pointer-events-auto { pointer-events: auto !important; }
#custom-gallery-overlay.active > div.absolute.bottom-0 { z-index: 400 !important; }
#custom-gallery-overlay #cg-media { overflow: hidden !important; isolation: isolate; }
#custom-gallery-overlay #cg-media > .pswp.cg-pswp-embedded {
                position: absolute !important; inset: 0 !important;
                top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important;
                width: 100% !important; height: 100% !important;
                max-width: 100% !important; max-height: 100% !important;
                z-index: 1 !important; --pswp-root-z-index: 1 !important;
            }
#custom-gallery-overlay #cg-media > .pswp.cg-pswp-embedded .pswp__scroll-wrap,
            #custom-gallery-overlay #cg-media > .pswp.cg-pswp-embedded .pswp__bg,
            #custom-gallery-overlay #cg-media > .pswp.cg-pswp-embedded .pswp__container {
                position: absolute !important; inset: 0 !important;
                width: 100% !important; height: 100% !important;
            }
#custom-gallery-overlay #cg-media > .pswp.cg-pswp-embedded,
            #custom-gallery-overlay #cg-media > .pswp.cg-pswp-embedded.pswp--open {
                display: block !important;
                opacity: 1 !important;
            }
#custom-gallery-overlay .pswp__top-bar,
            #custom-gallery-overlay .pswp__button--zoom,
            #custom-gallery-overlay .pswp__button--arrow,
            #custom-gallery-overlay .pswp__button--close,
            #custom-gallery-overlay .pswp__counter,
            #custom-gallery-overlay .pswp__preloader {
                display: none !important; visibility: hidden !important; pointer-events: none !important;
            }
}

#custom-gallery-overlay.is-zoomed .cg-gallery-main-wrap {
            z-index: 9999 !important;
        }

#custom-gallery-overlay.is-zoomed #cg-photo-container {
            z-index: 9999 !important;
        }

#custom-gallery-overlay > div.absolute.top-0, 
        #custom-gallery-overlay > div.absolute.bottom-0 {
            transition: opacity 0.2s ease;
        }

#custom-gallery-overlay.is-zoomed #cg-caption-badge-desktop {
            opacity: 0 !important;
        }

#cg-caption-badge-desktop {
            transition: none;
            /* Не мелькать у чипсов: видна только после JS-позиционирования */
            opacity: 0;
        }

#cg-caption-badge-desktop.is-placed {
            opacity: 1;
        }

#custom-gallery-overlay.cg-inspector-mode #cg-caption-badge-desktop {
            display: none !important;
            opacity: 0 !important;
            visibility: hidden !important;
        }

#custom-gallery-overlay.cg-zoom-mode .cg-gallery-main-wrap {
            padding: 0 !important;
            gap: 0 !important;
            justify-content: center !important;
            align-items: center !important;
        }

#custom-gallery-overlay.cg-zoom-mode #cg-photo-container {
            max-height: 100vh !important;
            height: 100vh !important;
            width: 100vw !important;
            gap: 0px !important;
            padding: 0 !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
        }

#custom-gallery-overlay.cg-zoom-mode .cg-swiper-container-wrap {
            max-width: 100vw !important;
            width: 100vw !important;
            height: 100vh !important;
            display: flex !important;
            flex-direction: column !important;
            align-items: center !important;
            justify-content: center !important;
            padding-top: 0 !important;
        }

#custom-gallery-overlay.cg-zoom-mode #cg-media {
            border-radius: 0 !important;
            height: 100vh !important;
            width: 100vw !important;
            max-height: 100vh !important;
            aspect-ratio: auto !important;
        }

@media (max-width: 767px) {
#custom-gallery-overlay.cg-zoom-mode #cg-caption-badge-desktop {
                display: flex !important;
                position: absolute !important;
                top: 2rem !important;
                bottom: auto !important;
                left: 50% !important;
                transform: translateX(-50%) !important;
                margin-top: 0 !important;
                z-index: 100;
            }
}

#cg-counter-wrap {
            background: transparent;
            box-shadow: none;
        }

.cg-gallery-main-wrap {
            transition: none; /* Убираем transition, который может мешать Swiper'у */
        }

#custom-gallery-overlay.cg-zoom-mode .cg-swiper-prev,
        #custom-gallery-overlay.cg-zoom-mode .cg-swiper-next {
            opacity: 1;
            pointer-events: auto;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            z-index: 200;
            transition: transform 0.3s ease, background-color 0.3s ease;
            display: none; /* Hide by default */
        }

@media (min-width: 768px) {
#custom-gallery-overlay.cg-zoom-mode .cg-swiper-prev,
            #custom-gallery-overlay.cg-zoom-mode .cg-swiper-next {
                display: flex; /* Show on tablet+ */
            }
}

#custom-gallery-overlay.cg-zoom-mode .cg-swiper-prev:hover,
        #custom-gallery-overlay.cg-zoom-mode .cg-swiper-next:hover {
            transform: translateY(-50%) scale(1.1);
            background-color: rgba(255,255,255,0.2);
        }

#custom-gallery-overlay.cg-zoom-mode .cg-swiper-prev:active,
        #custom-gallery-overlay.cg-zoom-mode .cg-swiper-next:active {
            transform: translateY(-50%) scale(0.95);
        }

#custom-gallery-overlay.cg-zoom-mode .cg-swiper-prev { left: 2rem; }

#custom-gallery-overlay.cg-zoom-mode .cg-swiper-next { right: 2rem; }