.roll-selector{--roll-green:#007e63;box-sizing:border-box;width:100%;max-width:520px;margin:22px 0 20px;padding:20px;border:1px solid #e6e1d6;border-radius:12px;background:#fffdf8;color:#202723;font-size:15px;line-height:1.35}
.roll-selector *{box-sizing:border-box}.roll-selector__heading,.roll-selector__controls{display:flex;align-items:center;justify-content:space-between;gap:16px}.roll-selector__title{font-weight:600}.roll-selector__unit-price{font-size:22px;font-weight:700;white-space:nowrap}.roll-selector__unit-price small{font-size:13px;font-weight:400;color:#69706b}.roll-selector__controls{margin-top:18px}.roll-selector__stepper{display:flex;align-items:center;height:48px;flex:1;max-width:260px;border:1px solid #d9dfd7;background:#fff;border-radius:8px;overflow:hidden}.roll-selector__step{flex:0 0 45px;height:46px;border:0;background:transparent;color:var(--roll-green);font:inherit;font-size:24px;cursor:pointer;transition:background .18s}.roll-selector__step:hover{background:#eaf3ee}.roll-selector__step:disabled{opacity:.35;cursor:default}.roll-selector__input-wrap{display:flex;align-items:center;justify-content:center;flex:1;min-width:0;gap:4px;margin:0;font-weight:600}.roll-selector__input{width:48px!important;min-width:0;padding:0!important;height:42px;border:0!important;box-shadow:none!important;background:transparent!important;text-align:center;font:inherit;font-size:18px;border-radius:0;appearance:textfield;-moz-appearance:textfield}.roll-selector__input::-webkit-inner-spin-button,.roll-selector__input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.roll-selector__step:focus-visible,.roll-selector__input:focus-visible{outline:2px solid var(--roll-green);outline-offset:-3px}.roll-selector__limit{font-size:12px;color:#70776f}.roll-selector__preview{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px;padding:12px 15px;background:#f2eddd;border-radius:8px}.roll-selector__drawing{flex:0 0 120px;color:var(--roll-green);text-align:center}.roll-selector__drawing svg{display:block;width:115px;height:68px;margin:auto}.roll-selector__dimensions{display:block;font-size:13px;color:#4c5b50}.roll-selector__dimensions b{font-weight:400}.roll-selector__result{text-align:right;min-width:0}.roll-selector__result-label{display:block;color:#657062;font-size:12px}.roll-selector__result strong{display:block;margin-top:4px;font-size:25px;line-height:1.2;white-space:nowrap;color:#173f32}.roll-selector__saving{display:block;margin-top:5px;font-size:12px;color:var(--roll-green)}.roll-selector__tiers{display:flex;gap:8px;margin-top:12px;font-size:12px}.roll-selector__tiers span{flex:1;padding:7px 8px;border-radius:5px;background:#f3f5ef;color:#667164}.roll-selector__tiers b{float:right;color:var(--roll-green)}
.roll-selector--basket{max-width:410px;margin:16px 0 0;padding:14px;font-size:14px}.roll-selector--basket .roll-selector__unit-price{font-size:18px}.roll-selector--basket .roll-selector__controls{margin-top:12px}.roll-selector--basket .roll-selector__result strong{font-size:22px}.roll-selector--basket .roll-selector__drawing{flex-basis:100px}.roll-selector--basket .roll-selector__drawing svg{width:95px;height:57px}.roll-selector--basket .roll-selector__preview{padding:10px;margin-top:12px}
@media(max-width:600px){.basket-items-list-item-container.basket-item--roll{grid-template-columns:minmax(0,120px) minmax(0,1fr)}.basket-item--roll .basket-items-list-item-descriptions,.basket-item--roll .basket-items-list-item-descriptions-inner,.basket-item--roll .basket-item-block-info{display:contents}.basket-item--roll .basket-item-block-wrapper{grid-row:2;grid-column:2;min-width:0}.basket-item--roll .roll-selector--basket{grid-row:3;grid-column:1/-1;margin:8px 0 0;min-width:0}.basket-item--roll .basket-item-block-price{flex-wrap:wrap;gap:4px 8px}.basket-item--roll .basket-items-image-wrapper{align-self:start}.basket-item--roll .basket-items-list-item-remove{top:auto;bottom:20px}}
@media(max-width:600px){.roll-selector{padding:15px;margin-top:16px}.roll-selector__heading{align-items:flex-start;gap:10px}.roll-selector__unit-price{font-size:20px}.roll-selector__unit-price small{font-size:12px}.roll-selector__result strong{font-size:22px}.roll-selector__drawing{flex-basis:100px}.roll-selector__drawing svg{width:95px;height:58px}.roll-selector__preview{padding:12px 10px;gap:8px}.roll-selector--basket{padding:12px;max-width:none}.roll-selector--basket .roll-selector__heading{flex-wrap:wrap}.roll-selector--basket .roll-selector__unit-price{font-size:17px}.roll-selector--basket .roll-selector__drawing{flex-basis:80px}.roll-selector--basket .roll-selector__drawing svg{width:80px;height:50px}.roll-selector--basket .roll-selector__result strong{font-size:20px}.roll-selector__step{flex-basis:40px}}

/* Keep the roll diagram readable, while reserving room for longer totals. */
.roll-selector__drawing{flex:0 1 148px;min-width:0}
.roll-selector__drawing svg{width:148px;max-width:100%;height:76px}
.roll-selector__result{flex:0 0 auto}
.roll-selector--basket .roll-selector__drawing{flex:0 1 120px}
.roll-selector--basket .roll-selector__drawing svg{width:120px;max-width:100%;height:60px}