.component-scroller{position:relative;overflow:hidden;width:100%}.component-scroller>.component-scroller-items{max-width:100%;overflow-x:auto}.component-scroller-items::-webkit-scrollbar{display:none}.component-scroller-items>div{display:flex;gap:25px}.component-scroller-items>div>div{position:relative;flex-basis:1;text-align:center}@media (max-width:1000px){.component-scroller-items-collapse{width:100%;overflow:none}.component-scroller-items-collapse>div{display:grid;grid-template-columns:1fr 1fr;grid-gap:25px}.component-scroller-items-collapse>div>div{width:100%!important;min-width:100%!important}}@media (max-width:500px){.component-scroller-items-collapse>div{grid-template-columns:1fr}}.component-scroller:not(.component-scroller-large)>div>div{white-space:nowrap}.component-scroller-items div.selected:after{content:'';position:absolute;top:100%;left:0;right:0;border:2px solid var(--primary-color);border-radius:10px}.component-scroller-items div[onclick]:hover:after{content:'';position:absolute;top:100%;left:0;right:0;border:2px solid var(--primary-color);border-radius:10px}.component-scroller-left{position:absolute;top:0;left:0;padding:10px;height:100%;opacity:0;transition:opacity .35s}.component-scroller-large:hover:not(.component-scroller-left-hidden) .component-scroller-left{opacity:1}.component-scroller:not(.component-scroller-large,.component-scroller-left-hidden) .component-scroller-left{opacity:1}.component-scroller:not(.component-scroller-arrow-clear) .component-scroller-left{background:#fff;background:linear-gradient(90deg,rgba(255,255,255,1) 25%,rgba(255,255,255,.5) 100%)}.component-scroller-left i{position:relative;top:calc(50% - 15px);width:30px;height:30px;line-height:28px;font-size:28px;text-align:center}.component-scroller:not(.component-scroller-large) .component-scroller-left i{background:rgba(255,255,255);border-radius:100%;border:1px solid var(--border-color);font-size:12px}.component-scroller-left i:hover{cursor:pointer}.component-scroller-left-hidden .component-scroller-left{opacity:0;pointer-events:none}.component-scroller-right{position:absolute;top:0;right:0;padding:10px;height:100%;opacity:0;transition:opacity .35s}.component-scroller-large:hover:not(.component-scroller-right-hidden) .component-scroller-right{opacity:1}.component-scroller:not(.component-scroller-large,.component-scroller-right-hidden) .component-scroller-right{opacity:1}.component-scroller:not(.component-scroller-arrow-clear) .component-scroller-right{background:#fff;background:linear-gradient(270deg,rgba(255,255,255,1) 50%,rgba(255,255,255,.5) 100%)}.component-scroller-right i{position:relative;top:calc(50% - 15px);width:30px;height:30px;line-height:28px;font-size:28px;text-align:center}.component-scroller:not(.component-scroller-large) .component-scroller-right i{background:rgba(255,255,255);border-radius:100%;border:1px solid var(--border-color);font-size:12px}.component-scroller-right i:hover{cursor:pointer}.component-scroller-right-hidden .component-scroller-right{opacity:0;pointer-events:none}.component-scroller-pill .component-scroller-items>div>div{border-radius:var(--element-border-radius-largest);border:1px solid var(--border-color);padding:10px 20px}.component-scroller-pill .component-scroller-items div.selected,.component-scroller-pill .component-scroller-items>div>div:hover{background:var(--secondary-color-lighter);color:#fff}.component-scroller-pill .component-scroller-items div.selected::after,.component-scroller-pill .component-scroller-items div[onclick]:hover:after{display:none}