zon-carousel{--_z-carousel-button-fg: var(--z-ds-color-general-white-100);--_z-carousel-button-bg: var(--z-ds-color-general-black-100);--_z-carousel-button-bg-hover: var(--z-ds-color-text-55);--_z-carousel-button-size: 2.625rem;--_z-carousel-icon-size: 1.125rem;--_z-carousel-padding-inline: var(--z-ds-space-m);--_z-carousel-button-gradient-color: var(--z-ds-color-background-0)}zon-carousel[variant=kiosk]{--_z-carousel-padding-block-end: var(--z-ds-space-24);--_z-carousel-slide-width: 12.25rem;--_z-carousel-heading-font-size: var(--z-ds-fontsize-16);--_z-carousel-heading-chevron-arrow-display: none;--_z-carousel-empty-slide-aspect-ratio: 3 / 4}zon-carousel[variant=shop]{--_z-carousel-slide-width: 20rem;--_z-carousel-button-gradient-color: var(--z-ds-color-background-10)}zon-carousel[variant=shop] .zon-carousel__scroll-container{padding-bottom:var(--z-ds-space-16)}zon-carousel[view-mode=single]{--_z-carousel-slide-width: 100%;--_z-carousel-slide-gap: 0;--_z-carousel-padding-block-end: 0}zon-carousel[view-mode=single] .zon-carousel__slide-control-wrapper::before,zon-carousel[view-mode=single] .zon-carousel__slide-control-wrapper::after{background:none}.zon-carousel{display:grid;grid-template:"left middle right"/var(--_z-carousel-padding-inline) 1fr var(--_z-carousel-padding-inline)}zon-carousel .zon-carousel__slide-control-wrapper{display:none}.zon-carousel__scroll-container{grid-area:1/left/1/right;overflow:auto hidden;padding-bottom:var(--_z-carousel-padding-block-end, var(--z-ds-space-32));position:relative;scroll-behavior:smooth;scroll-padding-left:var(--_z-carousel-padding-inline);scroll-snap-type:x mandatory}zon-carousel .zon-carousel__slide-wrapper{display:flex}zon-carousel .zon-carousel__slide-wrapper::before,zon-carousel .zon-carousel__slide-wrapper::after{content:"";flex:0 0 var(--_z-carousel-padding-inline)}zon-carousel .zon-carousel__slide{flex:0 0 var(--_z-carousel-slide-width, 85.3333333333%);scroll-snap-align:start}zon-carousel .zon-carousel__slide+.zon-carousel__slide{margin-left:var(--_z-carousel-slide-gap, var(--z-ds-space-16))}zon-carousel .zon-carousel__slide:empty{aspect-ratio:var(--_z-carousel-empty-slide-aspect-ratio, 1);background-color:var(--_z-carousel-empty-slide-background-color, #eee)}zon-carousel .zon-carousel__slide:empty::after{content:attr(aria-label)}.zon-carousel:has(.zon-carousel__tabpanel-control-wrapper) .zon-carousel__scroll-container{overflow-x:scroll;-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none}.zon-carousel:has(.zon-carousel__tabpanel-control-wrapper) .zon-carousel__scroll-container::-webkit-scrollbar{display:none}.zon-carousel__tabpanel-control-wrapper{align-items:center;display:flex;justify-content:center;margin:0;padding:var(--z-ds-space-16) 0}.zon-carousel__playcontrol-button{flex:0 0 auto}.zon-carousel__dots-wrapper{border:none;display:flex;justify-content:center;margin:0;overflow:hidden;padding:0}.zon-carousel__dot{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;cursor:pointer;flex:0 0 auto}.zon-carousel__dot:focus-visible,.zon-carousel__dot:checked:focus-visible{outline:2px solid var(--z-ds-color-focus-100)}@media screen and (min-width: 48em){zon-carousel{--_z-carousel-padding-inline: 3.375rem;--_z-carousel-slide-width: calc(320 / 1000 * 100%)}zon-carousel:hover .zon-carousel__direction-button:not(:disabled),zon-carousel:focus-within .zon-carousel__direction-button:not(:disabled){opacity:1}@supports(--_z-carousel-padding-inline: clamp(1rem, 5vw, 3rem)){.zon-carousel__scroll-container{--_z-carousel-padding-inline: clamp( var(--z-ds-space-m), calc(50% - 55.75rem / 2), 3.375rem )}}zon-carousel[variant=kiosk]{--_z-carousel-slide-width: 12.25rem;--_z-carousel-heading-font-size: var(--z-ds-fontsize-20)}zon-carousel:not([view-mode=single])[data-carousel-counter="3"]{--_z-carousel-slide-width: 33%}zon-carousel:not([view-mode=single])[data-carousel-counter="3"] .zon-carousel__slide{flex-shrink:1}zon-carousel:not([view-mode=single])[data-carousel-counter="3"] .zon-carousel__slide-control-wrapper::before,zon-carousel:not([view-mode=single])[data-carousel-counter="3"] .zon-carousel__slide-control-wrapper::after{content:unset}zon-carousel .zon-carousel__slide-control-wrapper,zon-carousel .zon-carousel__direction-button,zon-carousel .zon-carousel__tabpanel-control-wrapper{z-index:10}zon-carousel .zon-carousel__slide-control-wrapper{display:grid;grid-area:1/left/1/right;grid-template:inherit;pointer-events:none}zon-carousel .zon-carousel__slide-control-wrapper::before,zon-carousel .zon-carousel__slide-control-wrapper::after{background:linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, var(--_z-carousel-button-gradient-color) 100%);content:"";margin-top:-1px}zon-carousel:has(.zon-carousel__direction-button--previous:disabled) .zon-carousel__slide-control-wrapper::before{content:none}zon-carousel:has(.zon-carousel__direction-button--next:disabled) .zon-carousel__slide-control-wrapper::after{content:none}zon-carousel .zon-carousel__slide-control-wrapper::after{transform:rotate(180deg)}zon-carousel .zon-carousel__direction-button{background:var(--_z-carousel-button-bg);border:none;border-radius:50%;color:var(--_z-carousel-button-fg);cursor:pointer;height:var(--_z-carousel-button-size);margin:auto;opacity:0;transition:opacity 100ms ease;width:var(--_z-carousel-button-size)}zon-carousel .zon-carousel__direction-button:hover,zon-carousel .zon-carousel__direction-button:active,zon-carousel .zon-carousel__direction-button:focus-visible{background:var(--_z-carousel-button-bg-hover)}zon-carousel .zon-carousel__direction-button:not(:disabled){pointer-events:all}zon-carousel .zon-carousel__direction-button:focus-visible{outline:2px solid var(--z-ds-color-focus-100);outline-offset:2px}.zon-carousel__direction-icon{display:block;height:var(--_z-carousel-icon-size);margin:auto;width:var(--_z-carousel-icon-size)}zon-carousel .zon-carousel__slide-control-wrapper::before,zon-carousel .zon-carousel__direction-button--previous{grid-area:1/left}zon-carousel .zon-carousel__slide-control-wrapper::after,zon-carousel .zon-carousel__direction-button--next{grid-area:1/right}}@media screen and (min-width: 48em)and (prefers-reduced-motion: reduce){zon-carousel .zon-carousel__scroll-container{scroll-behavior:initial}}
