﻿.component-quantity-list{display:grid;gap:10px;margin-top:16px}
.component-quantity-list:not(:has(>.component-quantity-row:not([hidden]))){display:none}
.component-quantity-row{display:flex;align-items:center;gap:12px;min-width:0;padding:12px;border:1px solid #343640;border-radius:6px;background:#17181f;color:#eee}
.component-quantity-row[hidden]{display:none!important}
.component-quantity-row>label{flex:1;min-width:0;overflow-wrap:anywhere;font-size:14px;line-height:1.5}
.component-quantity-row>small{font-size:13px;color:#a4a6b1}
.component-quantity-control{display:inline-flex;align-items:center;flex:0 0 auto;gap:0;overflow:hidden;border:1px solid #49414d;border-radius:6px;background:#101116}
.component-quantity-control>button{display:grid;place-items:center;width:40px;min-height:44px;padding:0;border:0;background:#211c27;color:#eee;font-family:inherit;font-size:20px!important;line-height:1;cursor:pointer}
.component-quantity-control>button:hover:not(:disabled){background:#382333}
.component-quantity-control>button:disabled{opacity:.35;cursor:default}
.component-quantity-control>input{position:static!important;opacity:1!important;display:block;box-sizing:border-box;width:48px!important;min-width:0;height:44px;margin:0;padding:0 3px!important;border:0!important;outline:0;background:#101116!important;color:#fff;font-family:inherit;font-size:16px!important;line-height:1.4;text-align:center;appearance:textfield}
.component-quantity-control>input::-webkit-inner-spin-button,.component-quantity-control>input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.component-quantity-control:focus-within{outline:2px solid #e789cc;outline-offset:2px}
.component-quantity-control>button:focus-visible{outline:2px solid #e789cc;outline-offset:-3px}
.config-quantity{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:12px}
.config-quantity>span{color:#aaaeb9;font-size:13px}
.config-quantity .component-quantity-control{margin:0}
@media(max-width:600px){.component-quantity-row{flex-wrap:wrap}.component-quantity-row>label{flex-basis:100%}.config-quantity{gap:8px}}
