/*
 * İST Masa Sandalye — Detay Galeri Düzeni V248
 * Ana görsel, başlık, oklar ve küçük görseller tek kompakt kartta düzenlenir.
 */

.no-detail-slider{
    display:block!important;
    width:100%!important;
    margin:0 0 20px!important;
    padding:12px!important;
    overflow:hidden!important;
    border:1px solid #d8e3ed!important;
    border-radius:22px!important;
    background:#fff!important;
    box-shadow:0 14px 36px rgba(15,31,49,.08)!important;
}

.no-detail-slider .no-detail-main-photo{
    position:relative!important;
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    overflow:hidden!important;
    aspect-ratio:16/9!important;
    border:0!important;
    border-radius:17px!important;
    background:#102235!important;
}

.no-detail-slider .no-detail-main-photo>img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    object-fit:cover!important;
    object-position:center!important;
    border:0!important;
    border-radius:17px!important;
}

.no-detail-slider .no-detail-main-photo figcaption{
    position:absolute!important;
    z-index:4!important;
    left:14px!important;
    right:auto!important;
    bottom:14px!important;
    display:inline-flex!important;
    align-items:center!important;
    max-width:calc(100% - 92px)!important;
    margin:0!important;
    padding:8px 13px!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.72)!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.94)!important;
    color:#102235!important;
    box-shadow:0 6px 18px rgba(15,31,49,.16)!important;
    font-size:12px!important;
    font-weight:800!important;
    line-height:1.25!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    backdrop-filter:blur(8px)!important;
}

.no-detail-slider .no-slide-arrow{
    position:absolute!important;
    z-index:5!important;
    top:50%!important;
    display:grid!important;
    place-items:center!important;
    width:42px!important;
    height:42px!important;
    margin:0!important;
    padding:0 0 3px!important;
    transform:translateY(-50%)!important;
    border:1px solid rgba(255,255,255,.72)!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.94)!important;
    color:#102235!important;
    box-shadow:0 7px 20px rgba(15,31,49,.20)!important;
    font-size:27px!important;
    font-weight:700!important;
    line-height:1!important;
    cursor:pointer!important;
    transition:transform .18s ease,background-color .18s ease!important;
}

.no-detail-slider .no-slide-arrow:hover,
.no-detail-slider .no-slide-arrow:focus-visible{
    transform:translateY(-50%) scale(1.06)!important;
    background:#fff!important;
}

.no-detail-slider .no-slide-prev{left:13px!important}
.no-detail-slider .no-slide-next{right:13px!important}

.no-detail-slider .no-detail-thumbs{
    position:relative!important;
    display:grid!important;
    grid-auto-flow:column!important;
    grid-auto-columns:82px!important;
    align-items:center!important;
    gap:9px!important;
    width:100%!important;
    margin:12px 0 0!important;
    padding:9px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    border:1px solid #e0e8f0!important;
    border-radius:14px!important;
    background:#f5f8fb!important;
    scrollbar-color:#aebdca transparent!important;
    scrollbar-width:thin!important;
    scroll-snap-type:x proximity!important;
    overscroll-behavior-inline:contain!important;
}

.no-detail-slider .no-detail-thumbs::-webkit-scrollbar{height:6px!important}
.no-detail-slider .no-detail-thumbs::-webkit-scrollbar-track{background:transparent!important}
.no-detail-slider .no-detail-thumbs::-webkit-scrollbar-thumb{
    border-radius:999px!important;
    background:#aebdca!important;
}

.no-detail-slider .no-detail-thumbs button{
    position:relative!important;
    display:block!important;
    width:82px!important;
    height:61px!important;
    min-width:82px!important;
    margin:0!important;
    padding:3px!important;
    overflow:hidden!important;
    border:2px solid transparent!important;
    border-radius:10px!important;
    background:#fff!important;
    box-shadow:0 2px 8px rgba(15,31,49,.08)!important;
    cursor:pointer!important;
    scroll-snap-align:center!important;
    transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease!important;
}

.no-detail-slider .no-detail-thumbs button:hover{
    transform:translateY(-1px)!important;
    border-color:#aebdca!important;
}

.no-detail-slider .no-detail-thumbs button.is-active{
    border-color:#f47a20!important;
    box-shadow:0 0 0 2px rgba(244,122,32,.14),0 4px 12px rgba(15,31,49,.12)!important;
}

.no-detail-slider .no-detail-thumbs img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    margin:0!important;
    object-fit:cover!important;
    border:0!important;
    border-radius:6px!important;
}

@media(max-width:767px){
    .no-detail-slider{
        margin-bottom:16px!important;
        padding:8px!important;
        border-radius:17px!important;
    }

    .no-detail-slider .no-detail-main-photo{
        aspect-ratio:4/3!important;
        border-radius:13px!important;
    }

    .no-detail-slider .no-detail-main-photo>img{
        border-radius:13px!important;
    }

    .no-detail-slider .no-detail-main-photo figcaption{
        left:10px!important;
        bottom:10px!important;
        max-width:calc(100% - 76px)!important;
        padding:7px 10px!important;
        font-size:11px!important;
    }

    .no-detail-slider .no-slide-arrow{
        width:37px!important;
        height:37px!important;
        font-size:24px!important;
    }

    .no-detail-slider .no-slide-prev{left:9px!important}
    .no-detail-slider .no-slide-next{right:9px!important}

    .no-detail-slider .no-detail-thumbs{
        grid-auto-columns:70px!important;
        gap:7px!important;
        margin-top:8px!important;
        padding:7px!important;
        border-radius:11px!important;
        scrollbar-width:none!important;
    }

    .no-detail-slider .no-detail-thumbs::-webkit-scrollbar{display:none!important}

    .no-detail-slider .no-detail-thumbs button{
        width:70px!important;
        min-width:70px!important;
        height:53px!important;
        border-radius:8px!important;
    }
}