.tabs{--color-background-active: var(--color-secondary-background);position:relative;display:block;max-width:100%}.tabs__nav{position:relative;display:flex;flex-wrap:nowrap;max-width:100%;padding-inline-start:15px;border-bottom:1px solid var(--color-line);overflow-x:auto;z-index:var(--layer-flat)}.tabs__nav-wrapper{position:absolute;left:0;top:0;width:100%}.tabs__nav-wrapper custom-scrollbar[data-direction=horizontal]{display:none}.tabs__nav-wrapper:has(.custom-scrollbar--active):before,.tabs__nav-wrapper:has(.custom-scrollbar--active):after{content:"";position:absolute;top:0;width:50px;height:100%;pointer-events:none;z-index:var(--layer-raised);opacity:1}.tabs__nav-wrapper:has(.custom-scrollbar--active):before{left:0;background:linear-gradient(to left,transparent,var(--color-background))}.tabs__nav-wrapper:has(.custom-scrollbar--active):after{right:0;background:linear-gradient(to right,transparent,var(--color-background))}.tabs:has(.custom-scrollbar--start) .tabs__nav-wrapper:before,.tabs:has(.custom-scrollbar--end) .tabs__nav-wrapper:after{opacity:0}.tabs__nav-item{position:relative;padding:14px 15px;cursor:pointer;white-space:nowrap;z-index:var(--layer-flat)}.tabs__nav-item.focus-visible-after:focus-visible:after{border-radius:var(--border-radius-size-5) var(--border-radius-size-5) 0 0}.tabs__content{position:relative;padding-top:45px}.tabs__panel{display:none;padding:30px 0 0;background:var(--color-background)}.tabs__panel--active{display:block}.tabs__indicator{position:absolute;top:0;left:0;height:100%;max-height:44px;background-color:var(--color-background-active);border-radius:var(--border-radius-size-5) var(--border-radius-size-5) 0 0;transition:left var(--duration-default) var(--transition-primary),width var(--duration-default) var(--transition-primary),border-radius var(--duration-default) var(--transition-primary);z-index:var(--layer-base)}.tabs__indicator:before,.tabs__indicator:after{content:"";position:absolute;bottom:0;height:10px;width:20px;opacity:1}.tabs__indicator:before{left:-20px;border-bottom-right-radius:var(--border-radius-size-3);box-shadow:10px 0 0 0 var(--color-background-active)}.tabs__indicator:after{right:-20px;border-bottom-left-radius:var(--border-radius-size-3);box-shadow:-10px 0 0 0 var(--color-background-active)}@media screen and (min-width:1025px){.tabs__indicator:hover{--border-radius: var(--border-radius-size-3)}}
/*# sourceMappingURL=/cdn/shop/t/3363/assets/component-tabs.css.map */