.accessories-widget{border:1px solid #d1d5db;border-radius:10px;max-width:500px}
.accessories-widget-title{margin:18px 16px;font-size:16px;font-weight:600}
.accessory-item-wrap{padding:8px 0;user-select:none}
.accessory-item{font-size:14px;}
.accessory-item.hidden.show{display:block}
.accessory-item-content{padding:2px 16px}
.accessory-item-checkbox{display:flex;padding:0 20px 0 10px;position: relative;z-index: 1;}
.accessory-item-checkbox input{width:18px;height:18px;cursor:pointer;padding:0}
.accessory-item-checkbox input:checked{background:#ff4b00;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-color:#ff4b00;border-radius:2px;background-repeat:no-repeat;background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e")}
.accessory-item-image{width:50px;height:50px}
.accessory-item-image responsive-image{--image-width:50px}
.mx-2{margin-left:.5rem;margin-right:.5rem}
.flex-grow-1{flex-grow:1}
.justify-end{justify-content:flex-end}
.accessory-item-variant{color:#6b7280;word-break:break-all}
span.free{color:#dc3545}
.dividing_line{border-bottom:1px solid #ddd}
.w-90{width:93%}
.text-primary{color:#ff4b00}
.mr-1{margin-right:3px}
.ml-1{margin-left:3px}
.accessory-widget-more{transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.5s;transition-property:all;color:#ff4b00;font-size:14px;line-height:21px;padding:12px 15px;border-bottom-right-radius:10px;border-bottom-left-radius:10px;display:flex;align-items:center;justify-content:space-between}
.accessory-widget-more.added{background-color:#ff4b001f}
.accessory-widget-more_text{font-weight:600;color:var(--color-body-text)}
.accessory-widget-more .sf__tooltip-content{min-width:200px;width:200px;background-color:#121826;padding:8px 10px}
.accessory-item .adding.active{display:flex;align-items:center;justify-content:end;position:absolute;top:0;height:100%;width:100%;background:linear-gradient(90deg,#534eaf00,#ff6f32 50%);background-position:500px 0;opacity:0;background-repeat:no-repeat;animation:slide-in-overlay 1.25s ease-in-out .2ms 1 forwards}
.accessory-item .adding span{font-weight:600;font-size:18px;line-height:27px;margin-right:24px;display:block;color:#fff}
@keyframes slide-in-overlay{0%{background-position:500px 0;opacity:0}
30%{background-position:0 0;opacity:1}
70%{background-position:0 0;opacity:1}
100%{background-position:500px 0;opacity:0}
}