.collection-chart{margin:2rem 0}.chart-tabs{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.chart-tabs collection-chart-tab{flex:1 1 100%}.chart-tab{display:flex;flex-direction:column;flex-wrap:wrap;gap:2rem}collection-chart-tab:before{content:"";position:absolute;height:10px;width:10px;background:rgba(var(--color-base-background),1);transform:rotate(45deg);left:-1rem;border-radius:10px;transition:all var(--duration-default) ease}collection-chart-tab:after{content:"";z-index:-1;position:absolute;top:0;right:0;bottom:0;left:0;width:120%;height:100%;background-color:rgb(var(--color-button-text));backface-visibility:hidden;will-change:transform;transform:rotate3d(0,0,1,10deg) translate3d(-1.2em,110%,0);transform-origin:0% 100%;transition:transform var(--duration-long) ease}[data-active-tab]{color:rgb(var(--color-button-background));box-shadow:none}[data-active-tab]:before{left:1rem}[data-active-tab]:after{transform:rotate3d(0,0,1,0) translateZ(0)}.chart-products-group{flex:1 1 auto}.chart-products{display:flex;flex:1 1 100%;gap:2rem;justify-content:center;flex-wrap:wrap;margin-bottom:1rem}.chart-product{width:90px}.chart-icon{--bg: rgb(var(--color-button-background));width:50px;height:50px;background-color:var(--bg);color:rgba(var(--color-base-background),1);display:flex;justify-content:center;align-items:center;margin:0 auto 1rem;border-radius:50px}.chart-product svg{display:block;width:25px;height:auto;fill:currentColor}.chart-tab p{font-size:70%;font-weight:700;line-height:1.2;text-align:center;min-width:0!important;max-width:200px;display:block;margin:0 auto}.chart-product a{text-decoration:none;color:rgba(var(--color-base-text),1)}.chart-group-description{position:relative;border-top:1px solid rgb(var(--color-border-strong));padding-top:1rem}.chart-group-description:before{content:"";position:absolute;top:-1rem;left:0;width:1px;height:1rem;background:rgb(var(--color-border-strong))}.chart-group-description:after{content:"";position:absolute;top:-1rem;right:0;width:1px;height:1rem;background:rgb(var(--color-border-strong))}@media screen and (min-width:768px){.chart-tabs{justify-content:space-between;flex-direction:row;gap:2rem;margin-bottom:4rem}.chart-tab{flex-direction:row}.chart-products{height:120px;flex-wrap:nowrap}}
/*# sourceMappingURL=/cdn/shop/t/33/assets/section-collection-chart.css.map */
