/* ganjeh-kala-gallery-widget.css */

.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell,
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell * {
    box-sizing: border-box;
}

.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell {
    --gk-thumb-size: 60px;
    --gk-thumb-gap: 8px;
    --gk-thumb-radius: 12px;
}


/* Main image surface: no inset spacing or hover zoom. Native product and
 * Elementor gallery intentionally share this calm, static image behavior. */
.elementor-widget-ganjeh-kala-gallery .gk-featured-image,
.elementor-widget-ganjeh-kala-gallery .img-wrapper,
.elementor-widget-ganjeh-kala-gallery .img-wrapper picture,
.elementor-widget-ganjeh-kala-gallery .featured-image {
    margin: 0 !important;
    padding: 0 !important;
}
.elementor-widget-ganjeh-kala-gallery .featured-image,
.elementor-widget-ganjeh-kala-gallery .img-wrapper:hover .featured-image {
    transform: none !important;
}

/* اسکلت */
.elementor-widget-ganjeh-kala-gallery .img-wrapper{position:relative;display:block;}
.elementor-widget-ganjeh-kala-gallery .skel-overlay{
    position:absolute;inset:0;
    background:linear-gradient(90deg,#ececec 25%,#f5f5f5 37%,#ececec 63%);
    background-size:400% 100%;
    animation:gk-shimmer 1.1s infinite;
    z-index:2;
}
@keyframes gk-shimmer{0%{background-position:0 0}100%{background-position:-400% 0}}
.elementor-widget-ganjeh-kala-gallery .img-loaded .skel-overlay{display:none;}

.elementor-widget-ganjeh-kala-gallery .gk-gallery-wrapper{opacity:0;transition:opacity .25s;}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[data-loaded="true"] .gk-gallery-wrapper{opacity:1;}

.elementor-widget-ganjeh-kala-gallery .skel-thumbs{display:flex;gap:4px;margin-bottom:12px;}
.elementor-widget-ganjeh-kala-gallery .skel-thumb{
    width:var(--gk-thumb-size);
    height:var(--gk-thumb-size);
    border-radius:4px;
    background:linear-gradient(90deg,#ececec 25%,#f5f5f5 37%,#ececec 63%);
    background-size:400% 100%;
    animation:gk-shimmer 1.1s infinite;
}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[data-loaded="true"] .skel-thumbs{display:none;}

/* Layout (مثل قبل) */
.elementor-widget-ganjeh-kala-gallery .gk-gallery-root { display:flex; gap:12px; }
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--bottom .gk-gallery-root { flex-direction: column; }
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--left .gk-gallery-root { flex-direction: row; }
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--right .gk-gallery-root { flex-direction: row-reverse; }

.elementor-widget-ganjeh-kala-gallery .gk-gallery-container { flex:1; min-width:0; }
.elementor-widget-ganjeh-kala-gallery .gk-thumb > a{
    display:block;
    width:100%;
    height:100%;
    box-sizing:border-box;
    border:1px solid #e5e7eb;
    border-radius:var(--gk-thumb-radius, 12px);
    overflow:hidden;
    background:#fff;
    line-height:0;
    transition:border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.elementor-widget-ganjeh-kala-gallery .gk-thumb > a:hover,
.elementor-widget-ganjeh-kala-gallery .gk-thumb.is-active > a{
    border-color:color-mix(in srgb, var(--gk-primary, #ed1944) 72%, #d8dde5);
}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-thumbnail{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    box-sizing:border-box;
    border:0!important;
    border-radius:inherit;
    -webkit-user-drag:none;
    user-drag:none;
    pointer-events:none;
}

/* ---- Swiper thumbs ---- */
.elementor-widget-ganjeh-kala-gallery .gk-gallery-thumbs{ position:relative; }

.elementor-widget-ganjeh-kala-gallery .gk-thumbs-swiper{
    width:100%;
    overflow:hidden; /* swiper استاندارد */
    cursor:grab;
    user-select:none;
}
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-swiper:active{ cursor:grabbing; }

.elementor-widget-ganjeh-kala-gallery .gk-thumbs-track{ /* swiper-wrapper */
    /* مهم: gap را در JS می‌خوانیم و بعد صفر می‌کنیم تا فاصله دوبل نشود */
    gap: var(--gk-thumb-gap);
}

.elementor-widget-ganjeh-kala-gallery .gk-thumb.swiper-slide{
    width: var(--gk-thumb-size);
    height: var(--gk-thumb-size);
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:var(--gk-thumb-radius, 12px);
    overflow:visible;
}

/* حالت عمودی */
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--left .gk-thumbs-swiper,
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--right .gk-thumbs-swiper{
    max-height:480px;
}

/* جلوگیری از کلیک هنگام درگ */
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-swiper.is-dragging a{ pointer-events:none; }

/* ---- Unified thumbnail navigation (Native + Elementor) ---- */
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-next,
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-prev{
    position:absolute;
    z-index:10;
    width:32px;
    height:32px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0;
    border:1px solid #e5e7eb;
    border-radius:10px;
    background:rgba(255,255,255,.96);
    color:#4b5563;
    box-shadow:0 2px 7px rgba(15,23,42,.05);
    cursor:pointer;
    transition:background-color .18s ease,border-color .18s ease,color .18s ease,opacity .18s ease;
}
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-next:hover,
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-prev:hover,
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-next:focus-visible,
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-prev:focus-visible{
    background:#f5f6f8;
    border-color:#d7dce3;
    color:#111827;
}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-nav-icon{
    display:inline-flex;
    width:16px;
    height:16px;
    align-items:center;
    justify-content:center;
    pointer-events:none;
}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-nav-icon svg{
    display:block;
    width:16px;
    height:16px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.9;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-next::before,
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-prev::before{display:none!important;content:none!important;}

.elementor-widget-ganjeh-kala-gallery .gk-thumbs-next.gk-nav-hidden,
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-prev.gk-nav-hidden{display:none!important;}
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-next.is-disabled,
.elementor-widget-ganjeh-kala-gallery .gk-thumbs-prev.is-disabled{opacity:.32;pointer-events:none;}

/* Horizontal thumbnails. */
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--bottom .gk-thumbs-next,
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--bottom .gk-thumbs-prev{
    top:50%;
    transform:translateY(-50%);
}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[dir="rtl"] .gk-thumbs-next{left:-12px;right:auto;}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[dir="rtl"] .gk-thumbs-prev{right:-12px;left:auto;}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[dir="rtl"] .gk-thumbs-next .gk-gallery-nav-icon{transform:rotate(180deg);}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[dir="rtl"] .gk-thumbs-prev .gk-gallery-nav-icon{transform:none;}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[dir="ltr"] .gk-thumbs-next{right:-12px;left:auto;}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[dir="ltr"] .gk-thumbs-prev{left:-12px;right:auto;}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[dir="ltr"] .gk-thumbs-next .gk-gallery-nav-icon{transform:none;}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[dir="ltr"] .gk-thumbs-prev .gk-gallery-nav-icon{transform:rotate(180deg);}

/* Vertical thumbnails. */
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--left .gk-thumbs-next,
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--right .gk-thumbs-next{
    left:50%;right:auto;bottom:-12px;top:auto;transform:translateX(-50%);
}
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--left .gk-thumbs-prev,
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--right .gk-thumbs-prev{
    left:50%;right:auto;top:-12px;bottom:auto;transform:translateX(-50%);
}
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--left .gk-thumbs-next .gk-gallery-nav-icon,
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--right .gk-thumbs-next .gk-gallery-nav-icon{transform:rotate(90deg);}
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--left .gk-thumbs-prev .gk-gallery-nav-icon,
.elementor-widget-ganjeh-kala-gallery.gk-gallery-thumbs--right .gk-thumbs-prev .gk-gallery-nav-icon{transform:rotate(-90deg);}

/* v1.7.9: Elementor editor preview should never stay in skeleton/loading state. */
body.elementor-editor-active .elementor-widget-ganjeh-kala-gallery .gk-gallery-wrapper,
body.elementor-editor-preview .elementor-widget-ganjeh-kala-gallery .gk-gallery-wrapper,
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[data-gk-elementor-preview="1"] .gk-gallery-wrapper{
    opacity:1!important;
}
body.elementor-editor-active .elementor-widget-ganjeh-kala-gallery .skel-overlay,
body.elementor-editor-active .elementor-widget-ganjeh-kala-gallery .skel-thumbs,
body.elementor-editor-preview .elementor-widget-ganjeh-kala-gallery .skel-overlay,
body.elementor-editor-preview .elementor-widget-ganjeh-kala-gallery .skel-thumbs,
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[data-gk-elementor-preview="1"] .skel-overlay,
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell[data-gk-elementor-preview="1"] .skel-thumbs{
    display:none!important;
}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell--editor-placeholder .gk-featured-image{
    min-height:320px;
    display:grid;
    place-items:center;
    background:#f7f8fa;
    border:1px dashed #d7dbe3;
    border-radius:18px;
    overflow:hidden;
}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell--editor-placeholder .img-wrapper{
    width:min(420px,80%);
    max-width:100%;
    opacity:.55;
}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-shell--editor-placeholder .featured-image{
    width:100%;
    height:auto;
    object-fit:contain;
}
.elementor-widget-ganjeh-kala-gallery .gk-gallery-editor-placeholder-note{
    position:absolute;
    inset:auto 18px 18px;
    padding:10px 14px;
    border-radius:12px;
    background:#fff;
    color:#64748b;
    font-size:12px;
    font-weight:700;
    text-align:center;
    box-shadow:0 10px 28px rgba(15,23,42,.08);
}


/* === GK 1.9.124: RTL product-gallery lightbox ==============================
 * Fancybox Carousel itself is configured with rtl:true in JS. These rules only
 * align the surrounding UI and thumbnail strip with the Persian document flow.
 * ========================================================================== */
html[dir="rtl"] .fancybox__container,
html[dir="rtl"] .fancybox__container .f-carousel,
html[dir="rtl"] .fancybox__container .f-thumbs {
    direction: rtl;
}

html[dir="rtl"] .fancybox__container .f-thumbs__slide {
    direction: rtl;
}

/* 1.9.149 — variation image swaps keep one immutable gallery frame. */
.elementor-widget-ganjeh-kala-gallery .gk-featured-image {
    position: relative;
    width: 100%;
    min-height: 340px;
    aspect-ratio: 1 / 1;
    display: grid;
    place-items: center;
    overflow: hidden;
}
.elementor-widget-ganjeh-kala-gallery .gk-featured-image .img-wrapper,
.elementor-widget-ganjeh-kala-gallery .gk-featured-image .img-wrapper picture {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
}
.elementor-widget-ganjeh-kala-gallery .featured-image {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    transform: none !important;
    transition: none !important;
}
.elementor-widget-ganjeh-kala-gallery .featured-image.is-variation-image-loading { opacity: 1 !important; }
@media (max-width: 767px) {
    .elementor-widget-ganjeh-kala-gallery .gk-featured-image { min-height: 285px; }
}
