*,:before,:after{box-sizing:border-box;-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none}body{margin:0;padding:20px;font-family:Arial,sans-serif}.mb-10{margin-bottom:10px}.input{border:1px solid #e2e2d9;border-radius:8px;padding:13.5px 14px;font-size:14px;display:block}.flex{display:flex}.align-items-center{align-items:center}.gap-5{gap:5px}.gap-10{gap:10px}.label-input{color:#797b70;margin-bottom:7px;font-size:12px;display:block}.justify-content-between{justify-content:space-between}.wrapper{margin:0 auto;padding:40px}.fold{overflow:hidden}.fold__name{cursor:pointer;border-radius:8px;padding:10px 20px;font-size:14px;font-weight:600;position:relative}.fold__name:after{content:"";background:url(https://constructor.julvbot.tech/icons/down-chevron.svg) 50%/contain no-repeat;width:14px;height:14px;transition-duration:.2s;position:absolute;top:50%;right:5px;transform:translateY(-50%)}.fold.opened .fold__name:after{transform:translateY(-50%)rotate(180deg)}.fold__content{grid-template-rows:0fr;transition-duration:.2s;display:grid;overflow:hidden}.fold__inner{padding:0 20px;transition-duration:.2s;overflow:hidden}.fold.opened .fold__content{grid-template-rows:1fr}.fold--shapes .form__buttons-list .form__button{flex:1;min-width:max-content}.form{flex-direction:column;gap:20px;display:flex}.form__input{flex-direction:column;gap:5px;display:flex}.form__section{padding:0 20px}.form__inputs{grid-template-columns:1fr 1fr;gap:10px;display:grid}.form__button{text-align:center;cursor:pointer;border:1px solid #e2e2d9;border-radius:8px;justify-content:center;align-items:center;padding:12.5px 30px;font-size:14px;transition-duration:.2s;display:flex}.form__button:hover,.form__button.active{color:#ef3f8d;background:#fce7f0;border-color:#ef3f8d;font-weight:500}.form__button-image,.form__button-icon{justify-content:center;align-items:center;width:21px;height:21px;margin-right:10px;display:flex}.form__button-image img,.form__button-icon img{object-fit:contain;width:100%;height:100%;transition-duration:.2s}.form__button:hover .form__button-icon img,.form__button.active .form__button-icon img{filter:invert(19%)sepia(42%)saturate(692%)hue-rotate(281deg)brightness(215%)contrast(147%)}.tabs{width:max-content;margin-bottom:10px;font-size:12px;display:flex;overflow:auto}.tabs__item{cursor:pointer;border-bottom:2px solid #0000;padding:5px 10px;transition-duration:.2s}.tabs__item:hover,.tabs__item.active{border-bottom-color:#ef3f8d}.color-preview{color:#777;text-align:right;margin-bottom:5px;margin-left:auto;font-size:12px;font-weight:700}.no-color{opacity:.5;cursor:pointer;background:url(https://constructor.julvbot.tech/icons/times.svg) 50%/20px 20px no-repeat;border:2px solid #0000;border-radius:10px;width:36px;height:36px;transition-duration:.2s}.no-color.active{opacity:1;border-color:#000}.input[name=cord-length]{width:100px}.font-selector{display:block;position:relative}.font-selector__preview-style{cursor:pointer;font-size:18px;line-height:1}.font-selector__preview-font-family{color:#aaa;margin-left:auto;font-size:10px;font-weight:700}.font-selector__preview{cursor:pointer;border:1px solid #e2e2d9;border-radius:8px;align-items:flex-end;gap:10px;padding:13.5px 14px;font-size:14px;line-height:1;display:flex}.font-selector__styles{grid-template-columns:repeat(3,1fr);gap:10px;padding:10px;display:grid}.font-selector__dropdown{z-index:2;background:#fff;border:1px solid #e2e2d9;border-radius:0 0 8px 8px;width:100%;height:max-content;max-height:300px;display:none;position:absolute;top:100%;left:0;overflow:scroll}.font-selector.active .font-selector__dropdown{display:block}.font-selector.active .font-selector__preview{border-bottom:#0000;border-radius:8px 8px 0 0}.font-selector__style{text-align:center;cursor:pointer;border-bottom:1px solid #0000;padding-bottom:3px;font-size:16px;transition-duration:.2s}.font-selector__style--bold{font-weight:800}.font-selector__style--italic{font-style:italic}.font-selector__style--underline{text-decoration:underline}.font-selector__style.active{border-bottom:1px solid #000}.fonts-list{flex-direction:column;gap:5px;display:flex}.fonts-list__item{cursor:pointer;align-items:center;gap:10px;padding:10px;transition-duration:.2s;display:flex}.fonts-list__item.active,.fonts-list__item:hover{background:#fce7f0}.form__section-title{font-size:14px;font-weight:700}.fonts-list__item-supports{color:#aaa;gap:5px;font-size:12px;font-weight:700;display:flex}.color{cursor:pointer;background:#fff;border:6px solid #fff;border-radius:50%;width:38px;height:38px;position:relative}.color[data-color=Белый],.color[data-color=Прозрачный]{border-width:1px}.color.active{border-width:0}.color.active:before{content:"";border:4px solid #fff;border-radius:50%;width:calc(100% - 4px);height:calc(100% - 4px);position:absolute;top:2px;left:2px}.color:after{content:"";opacity:0;background:url(https://constructor.julvbot.tech/icons/white-check.svg) 50%/contain no-repeat;width:12px;height:12px;transition-duration:.2s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.color.invert:after{filter:invert(10)}.color.active:after{opacity:1}.color[data-color=Прозрачный].active,.color[data-color=Белый].active{border-width:1px;border-color:#ccc;width:38px;height:38px}.color[data-color=Прозрачный]:before,.color[data-color=Белый]:before{content:"";border:1px solid #ccc;border-radius:50%;width:26px;height:26px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.color[data-color=Белый].active:before,.color[data-color=Прозрачный].active:before{border:1px solid #ccc}.toggler{align-items:center;gap:5px;display:flex}.toggler__inner{cursor:pointer;background:#eee;border:2px solid #fff;border-radius:80px;width:47px;height:29px;transition-duration:.2s;display:block;position:relative}.toggler__inner:before{content:"";background:#fff;border-radius:50%;width:19px;height:19px;transition-duration:.2s;position:absolute;top:3px;left:3px}.toggler.active .toggler__inner:before{left:calc(100% - 22px)}.toggler.active .toggler__inner{background:#ef3f8d}.toggler__label{color:#797b70;font-size:12px;display:block}.items-list{flex-wrap:wrap;align-items:center;gap:5px;display:flex}.items-list__show-more{cursor:pointer;color:#777;padding:5px 0;font-size:12px;font-weight:700;text-decoration:underline}.badge-configurator{grid-template-columns:auto 500px;column-gap:50px;padding:20px;display:grid}
