/* ==========================================================================
   Bottom Sheet Pro — v2.3
   No trigger button. No close button.
   Handle is the sole interaction surface.
   ========================================================================== */

/* ==========================================================================
   Overlay — dims background as sheet rises
   ========================================================================== */

.bs-overlay {
    position: fixed;
    inset: 0;
    /* Color overridden by Elementor color control */
    background: rgba( 0, 0, 0, 0.5 );
    opacity: 0;
    pointer-events: none;       /* never blocks clicks — handle-only UX */
    z-index: 9998;
}

/* ==========================================================================
   Sheet container — fixed to bottom, height controlled by JS
   ========================================================================== */

.bs-container {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    /* Default height — JS overrides immediately on init */
    height: 20vh;
    background: #fff;
    border-radius: 20px 20px 0 0;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* Default shadow — overridden by data attribute / Elementor custom */
    box-shadow: 0 -4px 24px rgba( 0, 0, 0, 0.14 );
    will-change: height;
    /* Transition set/cleared by JS for drag vs snap */
}

/* ==========================================================================
   Handle bar area — the only interactive surface
   ========================================================================== */

.bs-header {
    flex-shrink: 0;
    background: inherit;
    padding: 10px 16px 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: ns-resize;          /* north-south resize cursor = drag affordance */
    -webkit-user-select: none;
    user-select: none;
    touch-action: none;         /* prevent browser swipe navigation on handle */
    /* Focus ring for keyboard users */
    outline: none;
}

.bs-header:focus-visible {
    box-shadow: inset 0 0 0 2px rgba( 0, 120, 255, 0.5 );
}

/* Cursor changes during active drag */
.bs-header.bs-dragging {
    cursor: grabbing;
}

/* ==========================================================================
   Handle pill
   ========================================================================== */

.bs-handle {
    width: 48px;
    height: 5px;
    background: #d0d0d0;
    border-radius: 99px;
    pointer-events: none;       /* passes events up to .bs-header */
    flex-shrink: 0;
    transition: background 0.2s ease, transform 0.2s ease;
}

/* Subtle "active" feedback while dragging */
.bs-header.bs-dragging .bs-handle {
    background: #aaa;
    transform: scaleX( 1.1 );
}

/* ==========================================================================
   Scrollable content area
   ========================================================================== */

.bs-content {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 12px 20px 16px;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;   /* stop scroll from bleeding to page */
}

/* Prevent content scroll from triggering drag on header */
.bs-content * {
    touch-action: auto;
}

/* ==========================================================================
   State: sheet is expanded (at least one snap above initial)
   ========================================================================== */

.bs-wrapper.bs-is-expanded .bs-handle {
    background: #b0b0b0;
}

/* ==========================================================================
   Prevent page scroll while dragging handle
   ========================================================================== */

body.bs-no-select {
    -webkit-user-select: none;
    user-select: none;
    /* Do NOT set overflow:hidden here — that would jump the page layout */
}

/* ==========================================================================
   Elementor editor mode — render sheet visible for comfortable design
   ========================================================================== */

.elementor-editor-active .bs-container {
    position: relative !important;
    height: auto !important;
    min-height: 180px;
    box-shadow: 0 0 0 2px #93b1e9 inset !important;
    border-radius: 20px !important;
}

.elementor-editor-active .bs-overlay {
    display: none !important;
}

/* ==========================================================================
   Accessibility: reduced motion
   ========================================================================== */

@media ( prefers-reduced-motion: reduce ) {
    .bs-container {
        transition: none !important;
    }
    .bs-overlay {
        transition: none !important;
    }
}

/* ==========================================================================
   Responsive: on very small screens, limit max width so sheet looks native
   ========================================================================== */

@media ( min-width: 600px ) {
    .bs-container {
        /* Optional: uncomment to centre sheet like a bottom drawer on desktop */
        /* max-width: 480px; left: 50%; transform: translateX(-50%); */
    }
}

/* ==========================================================================
   Dismissed state — sheet fully hidden after dragging off bottom
   Triggered by JS when height reaches 0 after a downward dismiss drag.
   Re-opened via external trigger (data-bs-open / trigger class).
   ========================================================================== */

.bs-wrapper.bs-dismissed {
    /* Hide completely — no pointer events, no layout space for the container */
    pointer-events: none;
}

.bs-wrapper.bs-dismissed .bs-container {
    height: 0 !important;
    overflow: hidden;
    transition: none !important;
    box-shadow: none !important;
}

.bs-wrapper.bs-dismissed .bs-overlay {
    opacity: 0 !important;
    pointer-events: none !important;
}

/* When an external trigger re-opens a dismissed sheet,
   JS removes .bs-dismissed before animating back up */