/* ============================================================
   custom-nh-slider.css  —  v3
   ============================================================ */

/* ── Wrapper ── */
.custom_nh_slider_wrap {
    width          : 100%;
    max-width      : 100%;
    display        : flex;
    flex-direction : column;
    align-items    : center;
    overflow       : hidden; /* hard containment — never bleeds outside */
    box-sizing     : border-box;
}

/* ── Overflow + track ── */
.custom_nh_slider_overflow {
    overflow   : hidden;
    position   : relative;
    flex-shrink: 0;
    max-width  : 100%;
    box-sizing : border-box;
}

.custom_nh_slider_inner {
    display     : flex;
    align-items : center;
    will-change : transform;
}

/* ── Slide ── */
.custom_nh_slide {
    flex-shrink : 0;
    overflow    : hidden;
    border-radius: 8px;
    position    : relative; /* needed for overlay + caption positioning */
}

.custom_nh_slide img {
    width       : 100%;
    height      : 100%;
    object-fit  : cover;
    display     : block;
    transition  : transform 0.4s ease;
}

.custom_nh_slide:hover img {
    transform: scale(1.03);
}

/* ── Link wrapper — fill slide ── */
.custom_nh_slide_link {
    display  : block;
    width    : 100%;
    height   : 100%;
    position : relative;
}

/* ── Overlay ── */
.custom_nh_overlay {
    position      : absolute;
    inset         : 0;
    pointer-events: none;
}

/* ── Caption ── */
.custom_nh_caption {
    position   : absolute;
    left       : 0;
    right      : 0;
    padding    : 8px 14px;
    color      : #fff;
    background : rgba(0,0,0,.4);
    font-size  : 14px;
    line-height: 1.4;
    z-index    : 2;
    box-sizing : border-box;
}

/* Caption positions */
.custom_nh_cap_bottom .custom_nh_caption { bottom: 0; top: auto; transform: none; }
.custom_nh_cap_top    .custom_nh_caption { top: 0; bottom: auto; transform: none; }
.custom_nh_cap_center .custom_nh_caption {
    top       : 50%;
    bottom    : auto;
    transform : translateY(-50%);
    text-align: center;
}

/* ── NAV BAR ── */
.custom_nh_nav {
    display    : flex;
    align-items: center;
    width      : 370px;
    min-width  : 370px;
    max-width  : 370px;
    height     : 14px;
    margin     : 35px auto 0;
}

/* ── Buttons ── */
.custom_nh_btn {
    background : none;
    border     : none;
    cursor     : pointer;
    padding    : 0;
    flex-shrink: 0;
    display    : flex;
    align-items: center;
    line-height: 1;
    transition : opacity 0.2s;
}

.custom_nh_btn:hover   { opacity: 0.5; }
.custom_nh_btn:disabled{ opacity: 0.2; cursor: default; }

.custom_nh_btn svg {
    display: block;
    width  : 25px;
    height : 15px;
}

/* ── Progress track ── */
.custom_nh_track {
    flex        : 1;
    position    : relative;
    height      : 14px;
    display     : flex;
    align-items : center;
    margin      : 0 15px;
    min-width   : 0;
}

.custom_nh_track_bg {
    position  : absolute;
    left      : 0;
    right     : 0;
    top       : 50%;
    transform : translateY(-50%);
    height    : 2px;
    background: #B5A05A;
}

/* ── Fill pill ── */
.custom_nh_track_fill {
    position  : absolute;
    top       : 50%;
    transform : translateY(-50%);
    height    : 7px;
    background: #B5A05A;
    left      : 0;
    width     : 15%;
    transition: all 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
/* ============================================================
   RTL support (WPML Arabic / Hebrew)
   ============================================================ */

/* Allow fill pill to animate from either side */
.custom_nh_rtl .custom_nh_track_fill {
    transition: left 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                right 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}


.custom_nh_rtl .custom_nh_track_fill {
    left : auto;
}
