/* A local responsive sentinel prevents a parent's scroll mode being inherited. */
.webbo-hscroll-host { --webbo-horizontal-scroll:off; }
.webbo-hscroll-active { min-inline-size:0; max-inline-size:100%; }
.webbo-hscroll-track {
    overflow-x:auto !important;
    overscroll-behavior-x:contain;
    scroll-behavior:auto;
    scrollbar-width:thin;
    max-inline-size:100%;
    min-inline-size:0;
}
.webbo-hscroll-widget > .webbo-hscroll-track,
.webbo-hscroll-widget.webbo-hscroll-track { white-space:nowrap; }
.webbo-hscroll-container > .webbo-hscroll-track,
.webbo-hscroll-container.webbo-hscroll-track {
    display:flex;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    --container-widget-width:initial;
    --container-widget-flex-grow:0;
}
.webbo-hscroll-container > .webbo-hscroll-track > .elementor-element,
.webbo-hscroll-container.webbo-hscroll-track > .elementor-element { flex-shrink:0 !important; }
.webbo-hscroll-widget .webbo-breadcrumbs,
.webbo-hscroll-widget .elementor-icon-list-items {
    display:flex !important; flex-direction:row !important; flex-wrap:nowrap !important;
}
.webbo-hscroll-widget .webbo-breadcrumbs__item { white-space:nowrap; }
.webbo-hscroll-widget .webbo-breadcrumbs > *,
.webbo-hscroll-widget .elementor-icon-list-items > * { flex-shrink:0 !important; }
.webbo-hscroll-widget .elementor-nav-menu,
.webbo-hscroll-widget .elementor-tabs-wrapper,
.webbo-hscroll-widget .e-n-tabs-heading { flex-wrap:nowrap !important; }
.webbo-hscroll-hide-bar { scrollbar-width:none; }
.webbo-hscroll-hide-bar::-webkit-scrollbar { display:none; }
.webbo-hscroll-track:focus-visible { outline:2px solid currentColor; outline-offset:-2px; }

/* Optional, content-aware edge fade. CSS masks fade the rendered content itself,
   so there are no overlays to intercept clicks, and no white/solid background. */
.webbo-hscroll-fade {
    --webbo-hscroll-left-alpha:1;
    --webbo-hscroll-right-alpha:1;
    --webbo-hscroll-effective-width:min(var(--webbo-hscroll-fade-width, 30px), 50%);
    -webkit-mask-image:linear-gradient(to right,
        rgba(0,0,0,var(--webbo-hscroll-left-alpha)) 0%,
        #000 var(--webbo-hscroll-effective-width),
        #000 calc(100% - var(--webbo-hscroll-effective-width)),
        rgba(0,0,0,var(--webbo-hscroll-right-alpha)) 100%);
    mask-image:linear-gradient(to right,
        rgba(0,0,0,var(--webbo-hscroll-left-alpha)) 0%,
        #000 var(--webbo-hscroll-effective-width),
        #000 calc(100% - var(--webbo-hscroll-effective-width)),
        rgba(0,0,0,var(--webbo-hscroll-right-alpha)) 100%);
}
.webbo-hscroll-fade.webbo-hscroll-fade-left {
    --webbo-hscroll-left-alpha:var(--webbo-hscroll-fade-alpha, 0);
}
.webbo-hscroll-fade.webbo-hscroll-fade-right {
    --webbo-hscroll-right-alpha:var(--webbo-hscroll-fade-alpha, 0);
}
