.twp-sizing-tabs{padding-bottom:5.4rem}.twp-sizing-chart-wrap{display:flex;flex-direction:column;gap:var(--spacing-sm)}.twp-sizing-chart-wrap .h3{position:sticky;left:0}.twp-sizing-chart-wrap .sizing-chart{--sizing-chart-label-width: 90px;--sizing-chart-bar-height: 24px;--sizing-chart-border-color: var(--color-neutral-10);--sizing-chart-bar-color: var(--color-neutral-70);--sizing-chart-header-bg: var(--color-neutral-5);width:100%;border:1px solid var(--sizing-chart-border-color);font-size:14px;line-height:1.4;position:relative;min-width:700px;font-family:Arial,sans-serif}.twp-sizing-chart-wrap .sizing-chart>.sizing-chart__bar-icon{display:none}.twp-sizing-chart-wrap .sizing-chart__header{min-height:var(--size-chart-header-row-height, 36px);background-color:var(--sizing-chart-header-bg);border-bottom:1px solid var(--sizing-chart-border-color);font-weight:700;position:sticky;top:0;z-index:1}.twp-sizing-chart-wrap .sizing-chart__header-cell{padding:var(--spacing-xs) calc(var(--spacing-xs) / 2);border-left:none;flex-shrink:0;position:relative}.twp-sizing-chart-wrap .sizing-chart__header-cell--label{flex-basis:var(--sizing-chart-label-width);flex-grow:0;border-left:none;position:sticky;left:-1px;background-color:var(--sizing-chart-header-bg);z-index:4;text-align:center}.twp-sizing-chart-wrap .sizing-chart__header-cell--value{flex-grow:1}.twp-sizing-chart-wrap .sizing-chart__header-cell--label+.sizing-chart__header-cell--value .sizing-chart__header-label{display:none}.twp-sizing-chart-wrap .sizing-chart__header-label{position:absolute;top:50%;left:0;transform:translate(-50%,-50%);background:var(--sizing-chart-header-bg);padding:0 4px;font-family:var(--font-body-family);font-weight:var(--font-body-weight);font-size:11px;line-height:1.4;z-index:5}.twp-sizing-chart-wrap .sizing-chart__lines-overlay{position:absolute;top:0;left:var(--sizing-chart-label-width);right:0;bottom:0;overflow:hidden;pointer-events:none;z-index:0}.twp-sizing-chart-wrap .sizing-chart__vertical-line{position:absolute;top:0;bottom:0;width:1px;background-color:var(--sizing-chart-border-color);z-index:0;pointer-events:none}.twp-sizing-chart-wrap .sizing-chart__row{min-height:var(--size-chart-row-height, 36px);border-bottom:1px solid var(--sizing-chart-border-color);position:relative;z-index:1}.twp-sizing-chart-wrap .sizing-chart__row--last{border-bottom:none}.twp-sizing-chart-wrap .sizing-chart__size-label{flex-basis:calc(var(--sizing-chart-label-width) + 1px);flex-shrink:0;flex-grow:0;padding:8px;font-weight:500;line-height:1.1875;text-align:center;border-right:1px solid var(--sizing-chart-border-color);display:flex;align-items:center;justify-content:center;position:sticky;left:0;background-color:var(--sizing-chart-header-bg);z-index:2}.twp-sizing-chart-wrap .sizing-chart__row-head{padding:10px 8px;font-weight:700;text-align:center;position:sticky;left:-1px;background-color:#fff;z-index:2}.twp-sizing-chart-wrap .sizing-chart__bar-container{flex-grow:1;position:relative}.twp-sizing-chart-wrap .sizing-chart__bar{position:absolute;top:50%;transform:translateY(-50%);height:var(--sizing-chart-bar-height);background-color:var(--sizing-chart-bar-color);transition:all .3s ease;z-index:1;border-radius:2.4rem}.twp-sizing-chart-wrap .sizing-chart__bar:hover{color:var(--color-white);background-color:var(--color-black)}.twp-sizing-chart-wrap .sizing-chart__bar--main{font-family:var(--font-heading-family);font-weight:700;font-size:14px;line-height:1;color:var(--color-white);padding:0 2px 0 8px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;left:var(--desktop-left-position);width:var(--desktop-width)}.twp-sizing-chart-wrap .sizing-chart__bar--disabled{color:var(--color-neutral-50);background-color:var(--color-neutral-10)}.twp-sizing-chart-wrap .sizing-chart__bar--selected,.twp-sizing-chart-wrap .sizing-chart__bar--selected:hover{color:var(--color-white);background-color:var(--color-red)}.twp-sizing-chart-wrap .sizing-chart__bar-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center;color:var(--color-red);background-color:var(--color-white);border-radius:50%}.twp-sizing-chart-wrap .sizing-chart__header-cell:after{content:"";position:absolute;top:calc(var(--size-chart-header-row-height, 36px) - 1px);right:-1px;display:block;width:1px;height:calc(var(--size-chart-row-count) * var(--size-chart-row-height));background-color:var(--sizing-chart-border-color)}.twp-sizing-chart-wrap .sizing-chart__cell{text-align:center;padding:10px 8px}.twp-sizing-chart-wrap .sizing-chart--table{table-layout:fixed}.twp-sizing-chart-wrap .sizing-chart--table td{border:1px solid var(--sizing-chart-border-color)}.twp-sizing-chart-wrap .sizing-chart--table td:first-child:after{content:"";position:absolute;top:0;right:-1px;width:2px;height:100%;background-color:var(--sizing-chart-border-color);z-index:2}.twp-sizing-chart-wrap--ranges .sizing-chart__header,.twp-sizing-chart-wrap--ranges .sizing-chart__row{display:flex}.sizing-chart-container{display:flex;flex-direction:column;gap:var(--spacing-lg)}.sizing-chart__marker{position:absolute;top:50%;left:0%;z-index:1;transform:translateY(-50%);height:100%;margin-top:calc(var(--size-chart-header-row-height, 36px) / 2);pointer-events:none}.sizing-chart__marker:before{content:"";width:calc(var(--size-chart-row-count) * var(--size-chart-row-height));height:1px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(90deg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='1' viewBox='0 0 8 1'%3E%3Cpath d='M0.5 0.5H5.5' stroke='%2319622B' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E");background-size:8px 1px;background-position:calc(50% - 3px)}.sizing-chart__marker-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-90deg) translateZ(0);transform-origin:center center;color:var(--color-white);background-color:var(--functional-dark-green);border-radius:2.4rem;display:flex;align-items:center;gap:6px;padding:3px 9px 3px 3px;font-family:var(--font-heading-family);font-weight:700;font-size:14px;line-height:1}.sizing-chart__marker-content p{margin:0;white-space:nowrap}.sizing-chart__marker-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:var(--functional-dark-green);background-color:var(--color-white);border-radius:50%}.sizing-chart__marker-icon svg{width:14px;height:14px}.twp-sizing-chart-bottom{margin-top:var(--spacing-md)}.twp-sizing-chart-bottom .twp-sizing-tool{margin-top:0}@media(min-width:768px){.twp-sizing-chart-bottom{display:flex;gap:var(--spacing-md)}.twp-sizing-chart-bottom bike-sizing-tool{flex-basis:calc(50% - var(--spacing-md) / 2)}.twp-sizing-chart-bottom bike-sizing-tool .container{height:100%}.twp-sizing-chart-bottom .twp-sizing-tool,.twp-sizing-chart-bottom .twp-sizing-tool__container{height:100%}}.sizing-chart-legend__wrapper{flex-basis:calc(50% - var(--spacing-md) / 2);border:1px solid var(--color-neutral-10);padding:var(--spacing-sm)}.sizing-chart-legend__selected-size{color:var(--color-red);margin-left:var(--spacing-xxs)}.sizing-chart-legend__list{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-top:1.2rem}.sizing-chart-legend__item{display:flex;align-items:center;gap:var(--spacing-xs);white-space:nowrap}.sizing-chart-legend__title{margin-right:var(--spacing-sm)}.sizing-chart__legend-label{font-size:12px;line-height:1}.sizing-chart__legend-indicator{display:inline-block;width:40px;height:16px;border-radius:16px;background-color:var(--background-color)}.sizing-chart__legend-indicator--recommended{position:relative;background-color:transparent;display:grid;align-items:center}.sizing-chart__legend-indicator--recommended:before{content:"";width:100%;height:1px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='1' viewBox='0 0 6 1'%3E%3Cpath d='M0.5 0.5H4.5' stroke='%2319622B' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E");background-size:6px 1px;background-position:calc(50% - 2px);grid-column:1;grid-row:1}.sizing-chart__legend-indicator--recommended:after{content:"";width:16px;height:16px;border-radius:50%;background-color:var(--background-color);grid-column:1;grid-row:1;margin:auto}@media(max-width:768px){.twp-sizing-chart-wrap:has(table){overflow-x:scroll}.twp-sizing-tabs .tabs__nav-wrap{justify-content:flex-start}.twp-sizing-chart-wrap .sizing-chart--ranges{display:flex;min-width:unset}.twp-sizing-chart-wrap .sizing-chart__header,.twp-sizing-chart-wrap .sizing-chart__row{flex-direction:column;flex:1;border-right:1px solid var(--sizing-chart-border-color);border-bottom:none;min-height:unset}.twp-sizing-chart-wrap .sizing-chart__row--last{border-right:none}.twp-sizing-chart-wrap .sizing-chart__row--last .sizing-chart__size-label{border-right:none}.twp-sizing-chart-wrap .sizing-chart__header-cell--label,.twp-sizing-chart-wrap .sizing-chart__size-label{flex-basis:auto}.twp-sizing-chart-wrap .sizing-chart__size-label{border-bottom:1px solid var(--sizing-chart-border-color)}.twp-sizing-chart-wrap .sizing-chart__header-label{width:100%;top:0;transform:translateY(-50%);background-color:var(--sizing-chart-header-bg);text-align:center}.twp-sizing-chart-wrap .sizing-chart__header-cell:after{left:0;right:unset;width:calc(100% * var(--size-chart-column-count-mobile) + 1px * var(--size-chart-column-count-mobile));height:1px}.twp-sizing-chart-wrap .sizing-chart__header-cell:last-child:after{content:none}.twp-sizing-chart-wrap .sizing-chart__header-cell--value{flex-basis:var(--size-chart-header-row-height)}.twp-sizing-chart-wrap .sizing-chart__bar--main{left:50%!important;width:24px!important;top:var(--mobile-top-position);height:var(--mobile-height);transform:translate(-50%);flex-direction:column-reverse;padding:2px 2px 8px;text-align:center}.twp-sizing-chart-wrap .sizing-chart__marker{height:auto;left:calc(100% / var(--size-chart-column-count-mobile));right:0;margin-top:-1px}.twp-sizing-chart-wrap .sizing-chart__marker:before{width:100%;left:0;transform:none}.twp-sizing-chart-wrap .sizing-chart__marker-content{position:relative;left:unset;top:unset;transform:none;width:fit-content;margin:0 auto}.sizing-chart-legend__title{flex-basis:100%;margin-right:0}}
/*# sourceMappingURL=/cdn/shop/t/783/assets/99-sizing-chart.css.map */
