/* ═══ CAR-LIGHTBOX-DESKTOP.CSS — лайтбокс галереи страницы авто (ПК).
   Перенос из modules/gallery/gallery.css (распил 2026-09-27, значения 1:1).
   Мобильный лайтбокс — car-lightbox-mobile.css (префикс lb-). ═══ */
@media (min-width:769px){
.gallery-lightbox{position:fixed;inset:0;z-index:600;opacity:0;transition:opacity 0.3s ease}
.gallery-lightbox:not([hidden]){display:block;opacity:1}
.gallery-lightbox[hidden]{display:none}
.lightbox-overlay{position:absolute;inset:0;background:#0f111a;cursor:pointer}
.lightbox-wrapper{position:absolute;inset:0;display:flex;flex-direction:column;pointer-events:none;overflow:hidden}
.lightbox-header{pointer-events:auto;height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;z-index:20;transition:transform 0.3s ease}
.lightbox-header.is-hidden{transform:translateY(-100%)}
.lightbox-header-left{display:flex;align-items:center;gap:16px}
.lightbox-counter{font-family:var(--font-family);font-size:1.25rem;font-weight:700;color:#fff;letter-spacing:0.1em}
.lightbox-counter-total{color:#4B5563;font-size:1rem}
.lightbox-header-divider{height:16px;width:1px;background:rgba(255,255,255,0.1)}
.lightbox-header-title{font-weight:700;font-size:0.875rem;color:#9CA3AF;display:none}
.lightbox-header-right{display:flex;align-items:center;gap:8px}
.lightbox-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:9999px;border:1px solid #e2e8f0;background:transparent;color:#9CA3AF;cursor:pointer;transition:all 0.15s ease;box-shadow:0 1px 2px rgba(0,0,0,0.05);border-color:transparent}
.lightbox-btn:hover{color:#fff;border-color:transparent;background:rgba(255,255,255,0.1)}
.lightbox-btn:focus{outline:none}
.lightbox-btn-close:hover{color:#ef4444;border-color:#ef4444;background:rgba(239,68,68,0.2)}
.lightbox-btn svg{width:20px;height:20px}
.lightbox-btn .icon-zoom.hidden{display:none}
.lightbox-content{flex:1;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;width:100%;height:100%;pointer-events:auto}
.lightbox-content:hover .lightbox-nav{opacity:1;transform:translateY(-50%) translateX(0)}
.lightbox-loader{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:0;pointer-events:none;opacity:0;transition:opacity 0.3s ease}
.lightbox-loader.is-loading{opacity:1}
.lightbox-loader-spinner{width:40px;height:40px;border:4px solid #e2e8f0;border-top-color:#ffb900;border-radius:9999px;animation:lightbox-spin 1s linear infinite;border-color:#374151}
.lightbox-img{max-width:100%;max-height:100%;object-fit:contain;transition:transform 0.5s cubic-bezier(0,0,0.2,1),opacity 0.3s ease;cursor:zoom-in;user-select:none;position:relative;z-index:10;filter:drop-shadow(0 25px 25px rgba(0,0,0,0.15));opacity:0}
.lightbox-img.is-loaded{opacity:1}
.lightbox-img.is-zoomed{cursor:grab}
.lightbox-img.is-zoomed.is-dragging{cursor:grabbing}
.lightbox-img.is-loading{opacity:0.5;filter:blur(4px) drop-shadow(0 25px 25px rgba(0,0,0,0.15))}
.lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:9999px;border:1px solid #e2e8f0;background:rgba(0,0,0,0.4);color:#fff;cursor:pointer;transition:all 0.3s ease;z-index:20;opacity:0;box-shadow:0 10px 15px -3px rgba(0,0,0,0.1);border-color:rgba(255,255,255,0.1)}
.lightbox-nav:hover{background:#ffb900;color:#000;transform:translateY(-50%) scale(1.1);border-color:transparent}
.lightbox-nav:active{transform:translateY(-50%) scale(0.95)}
.lightbox-nav:focus{outline:none}
.lightbox-nav svg{width:24px;height:24px}
.lightbox-nav-prev{left:24px;transform:translateY(-50%) translateX(-16px)}
.lightbox-nav-next{right:24px;transform:translateY(-50%) translateX(16px)}
.lightbox-footer{pointer-events:auto;height:112px;z-index:20;transition:transform 0.3s ease;display:flex;align-items:center;justify-content:center;padding:8px 0 32px}
.lightbox-footer.is-hidden{transform:translateY(100%)}
.lightbox-thumbs-wrapper{position:relative;max-width:90vw;width:100%;overflow:hidden}
.lightbox-thumbs-gradient{position:absolute;top:0;bottom:0;width:64px;z-index:10;pointer-events:none;border-radius:16px}
.lightbox-thumbs-gradient-left{left:0;background:linear-gradient(to right,#0f111a,rgba(15,17,26,0.8),transparent);border-top-right-radius:0;border-bottom-right-radius:0}
.lightbox-thumbs-gradient-right{right:0;background:linear-gradient(to left,#0f111a,rgba(15,17,26,0.8),transparent);border-top-left-radius:0;border-bottom-right-radius:0}
.lightbox-thumbs-panel{background:rgb(15 17 26);border:1px solid #e2e8f0;border-radius:16px;padding:8px;transition:all 0.3s ease;box-shadow:0 25px 50px -12px rgba(0,0,0,0.5);overflow:hidden;border-color:rgba(255,255,255,0.05)}
.lightbox-thumbs-panel:hover{background:rgb(15 17 26);box-shadow:0 10px 15px -3px rgba(0,0,0,0.1);border-color:rgba(255,255,255,0.2)}
.lightbox-thumbs{display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;max-width:672px;padding:4px 16px;scrollbar-width:none;cursor:grab;user-select:none}
.lightbox-thumbs::-webkit-scrollbar{display:none}
.lightbox-thumbs.is-dragging{cursor:grabbing;scroll-behavior:auto}
.lightbox-thumb{position:relative;flex-shrink:0;width:56px;height:40px;border-radius:4px;overflow:hidden;border:2px solid transparent;transition:all 0.3s ease;opacity:0.4;cursor:pointer;background:none;padding:0}
.lightbox-thumb:hover{opacity:1;transform:scale(1.05)}
.lightbox-thumb.active{border-color:#ffb900;opacity:1;transform:scale(1.1);z-index:10;box-shadow:0 0 12px rgba(255,185,0,0.2)}
.lightbox-thumb img{width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none;user-drag:none}
}
@keyframes lightbox-spin{to{transform:rotate(360deg)}}
@media (min-width:640px) .lightbox-header-title{display:block}
@media (min-width:768px) .lightbox-thumbs-wrapper{width:auto}
@media (max-width:768px) .gallery-lightbox{display:none}