/* ==========================================================================
   nadelani custom overrides — theme-update-safe (NOT style.css).
   Linked from partials/header.blade.php; bump its ?v= when editing this file.
   ========================================================================== */

/* the gallery wrapper (property.blade.php) caps height at 610px + overflow:hidden
   for rounded corners — let it grow so the thumbnails/button below aren't clipped. */
.featured_slick_gallery { max-height: none !important; }

/* ===== property gallery: main image + thumbnails (Zillow/yad2 style) ===== */
.nd-gallery { direction: rtl; }

.nd-gallery-main {
    position: relative;
    width: 100%;
    height: 400px;
    border-radius: 12px;
    overflow: hidden;
    background: #f2f2f2;
}
.nd-main-link { display: block; width: 100%; height: 100%; }
.nd-main-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    cursor: zoom-in;
}
.nd-counter {
    position: absolute; top: 12px; right: 12px; z-index: 3;
    direction: rtl;
    background: rgba(0, 0, 0, 0.6); color: #fff;
    font-size: 13px; font-weight: 600;
    padding: 4px 10px; border-radius: 20px;
    pointer-events: none;
}

/* arrows — white circle (kept), prev=right (points →), next=left (points ←) for RTL */
.nd-arrow {
    position: absolute; top: 50%; transform: translateY(-50%);
    z-index: 4; width: 44px; height: 44px;
    display: flex; align-items: center; justify-content: center;
    background: #fff; border: none; border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    cursor: pointer; transition: background .2s, box-shadow .2s;
    direction: ltr; /* stop RTL bidi-mirroring of the ❯/❮ chevron glyphs */
}
.nd-arrow:hover { background: #f5f5f5; box-shadow: 0 3px 12px rgba(0, 0, 0, 0.22); }
.nd-arrow::before { color: #111; font-size: 20px; line-height: 1; font-weight: 700; }
.nd-prev { right: 16px; }
.nd-next { left: 16px; }
.nd-prev::before { content: "\276F"; } /* ❯ points right = הקודם (ימין) */
.nd-next::before { content: "\276E"; } /* ❮ points left  = הבא (שמאל) */

/* thumbnails strip (horizontal scroll on mobile) */
.nd-thumbs {
    display: flex; gap: 8px; margin-top: 8px;
    overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin;
}
.nd-thumb {
    flex: 0 0 auto; width: 80px; height: 60px; padding: 0;
    border: 2px solid transparent; border-radius: 6px; overflow: hidden;
    background: none; cursor: pointer; opacity: .7;
    transition: opacity .15s, border-color .15s;
}
.nd-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nd-thumb:hover { opacity: 1; }
.nd-thumb.is-active { opacity: 1; border-color: #2563eb; }

/* explicit "show all N images" button (instead of a +N overlay that hides a thumb) */
.nd-show-all {
    display: inline-block; margin-top: 10px;
    background: #fff; color: #111; font-weight: 600; font-size: 14px;
    padding: 8px 16px; border: 1px solid #d1d5db; border-radius: 8px;
    cursor: pointer; transition: background .2s;
}
.nd-show-all:hover { background: #f5f5f5; }

@media (max-width: 767px) {
    .nd-gallery-main { height: 250px; }
    .nd-thumb { width: 64px; height: 48px; }
}

/* ===== lightbox (Magnific Popup): dark backdrop + RTL Hebrew counter ===== */
.mfp-bg { background: rgba(0, 0, 0, 0.9) !important; opacity: 1 !important; }
.mfp-counter { direction: rtl; font-size: 14px; }
.mfp-arrow { z-index: 1046 !important; opacity: .95 !important; }
.mfp-arrow:hover { opacity: 1 !important; }
.mfp-arrow-left  { left: 3% !important; right: auto !important; }
.mfp-arrow-right { right: 3% !important; left: auto !important; }

/* ===== sticky contact — desktop card + mobile bottom bar ===== */

/* desktop: make the EXISTING agent sidebar card sticky (content unchanged).
   top uses --header-h (sticky header) with a 90px fallback — calibrate later. */
@media (min-width: 992px) {
    .nd-sticky-sidebar {
        position: sticky;
        top: calc(var(--header-h, 90px) + 16px);
    }
}

/* mobile: fixed bottom contact bar (WhatsApp primary + phone). Hidden until the
   user scrolls ~300px, then custom.js adds .is-visible and it slides up once. */
.nd-mobile-bar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030;
    background: #fff; border-top: 1px solid #e5e7eb;
    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.08);
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px));
    transform: translateY(115%); transition: transform .35s ease;
}
.nd-mobile-bar.is-visible { transform: translateY(0); }
.nd-mobile-bar-name { font-size: 12px; font-weight: 600; color: #64748b; text-align: center; margin-bottom: 6px; }
.nd-mobile-bar-actions { display: flex; gap: 8px; }
.nd-mbar-wa {
    flex: 1 1 auto; display: flex; align-items: center; justify-content: center; gap: 8px;
    background: linear-gradient(135deg, #16a34a, #22c55e); color: #fff;
    font-weight: 700; font-size: 15px; padding: 13px; border-radius: 12px; text-decoration: none;
}
.nd-mbar-tel {
    flex: 0 0 52px; display: flex; align-items: center; justify-content: center;
    background: #eef2ff; color: #2563eb; font-size: 18px; border-radius: 12px; text-decoration: none;
}

@media (max-width: 991px) {
    #back2Top { display: none !important; }   /* the sticky bar owns the mobile bottom; scroll-btn is a vestige */
    .property-detail { padding-bottom: 84px; } /* spacer so the fixed bar never covers content (scoped, not body) */
}