/**
 * Elementor Senaeb Image Flow Gallery Styles
 */

/* Main Wrapper logic */
.senaeb-gallery-wrapper {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding: 0;
}

/* The horizontal flowing container */
.senaeb-gallery {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: auto; /* Managed by JS for grabbing */
    -webkit-overflow-scrolling: touch; /* smooth mobile scroll */
    align-items: center;
    cursor: grab;
    
    /* Default variables overridden by Elementor setup */
    gap: 24px;
    
    /* Hide scrollbar */
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.senaeb-gallery::-webkit-scrollbar {
    display: none;
}

.senaeb-gallery:active {
    cursor: grabbing;
}

/* The individual cards */
.senaeb-gallery-item {
    position: relative;
    flex: 0 0 300px; /* Overriden natively by elementor responsive control */
    height: 400px;  /* Overriden natively by elementor responsive control */
    border-radius: 24px; 
    overflow: hidden;
    
    /* Prevent image dragging natively so custom grab JS works cleanly */
    user-select: none;
    -webkit-user-drag: none;
    will-change: transform;
}

.senaeb-gallery-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* transition is managed via elementor dynamic selector block */
}

/* Add Overlay using pseudo element */
.senaeb-gallery-item::after {
    content: '';
    position: absolute;
    inset: 0;
    transition: background-color 0.4s ease;
    pointer-events: none;
}

/* Hover scale logic handled natively by Elementor dynamic styling block */

/* A class applied directly specifically while the JS drag is in motion to prevent snapping or hover anomalies */
.senaeb-gallery.is-dragging .senaeb-gallery-item {
    pointer-events: none; /* disables links from triggering while dragging */
}
