.charts{align-items:center;background-color:#fff;border-radius:14px;box-shadow:0 10px 40px 0 rgba(109,141,173,.4);display:flex;flex-direction:column;gap:28px;padding:30px 30px 40px;&.is-admin{& .charts__wrapper{grid-template-columns:auto 1fr auto auto}}& .chart__connected-bonuses{display:flex;flex-direction:column;gap:5px;margin-top:5px}& .chart__connected-bonus{align-items:center;border-radius:20px;display:flex;font-size:12px;gap:5px;padding-left:10px;&:hover{background-color:#f0f4ff}& a{&:first-of-type{margin-left:auto}}}& .charts__wrapper{display:grid;grid-template-columns:auto 1fr auto;grid-row-gap:14px;grid-column-gap:8px;align-items:center;width:100%}& .chart{display:contents}& .chart__image{align-items:center;border-radius:10px;display:flex;flex-shrink:0;height:44px;justify-content:center;overflow:hidden;width:44px;& img{height:100%;-o-object-fit:contain;object-fit:contain;width:100%}}& .chart__progress{display:flex;flex-direction:column;justify-content:center;padding:0 20px;position:relative;width:100%;&:after,&:before{border-radius:50px;content:"";height:32px;left:0;position:absolute;top:0}&:after{background-color:#e1effc;z-index:1}&:before{background-image:linear-gradient(90deg,#fff,#1bafff);z-index:2}& span{align-items:center;color:#151515;display:flex;font-family:Roboto,sans-serif;font-size:14px;font-weight:700;height:32px;line-height:normal;position:relative;text-overflow:ellipsis;z-index:3}}& .chart__count{align-items:center;background-color:#fff;border:2px solid #e1effc;border-radius:14px;color:#151515;display:flex;flex-shrink:0;font-family:Roboto,sans-serif;font-size:14px;gap:4px;padding:6px 10px;white-space:nowrap;& img{height:14px;-o-object-fit:contain;object-fit:contain;width:14px}}& .chart__icon{align-items:center;background-color:#fff;border:2px solid #e1effc;border-radius:50%;cursor:pointer;display:flex;height:32px;justify-content:center;text-decoration:none;width:32px;&.small{font-size:12px;height:24px;width:24px}}}@media screen and (min-width:1024px){.charts{gap:24px;& .charts__wrapper{grid-column-gap:12px}& .chart__image{border-radius:14px;height:62px;width:62px}& .chart__progress{& span,&:after,&:before{height:34px}& span{font-size:16px}}& .chart__count{font-size:16px;gap:8px;padding:7px 14px;& img{height:16px;width:16px}& span{&:after{content:" " attr(data-label)}}}}}.bonusify-button{align-items:center;background-color:var(--color-primary);border:none;border-radius:200px;color:#fff;cursor:pointer;display:flex;font-family:Roboto,sans-serif;font-size:16px;font-style:normal;font-weight:500;justify-content:center;line-height:normal;padding:10px 30px;text-align:center;&:hover:not(:disabled,.loading){opacity:.8}&:disabled{background-color:#b2bec3}&.loading,&:disabled{cursor:not-allowed}&.secondary{align-self:center;background-color:#b2bec3;&.loading{background-color:#d9d9d9}}}.bonusify-dump{background-color:#f0f0f0!important;border:none!important;border-radius:15px!important;color:#333;font-family:monospace;font-size:14px;margin:20px 0!important;padding:10px 15px!important;white-space:pre-wrap}