.app-chart{width:100%;display:flex;flex-direction:column;align-items:flex-start;background:#f9faff;border-radius:12px;overflow:hidden;--category-color: $color-black}.app-chart__tabs{width:100%;display:flex;flex-direction:row;align-items:center;gap:15px;padding:32px;border-bottom:8px solid #FFFFFF}.app-chart__tabs .app-button{border-radius:2px;height:40px;background:#fff;border:1px solid #F1F1F1}.app-chart__tabs .app-button--text{font-size:16px;line-height:150%;font-weight:400;color:#0d0e12}.app-chart__tabs .app-button:hover{border:1px solid #1B1E4E}.app-chart__tabs .app-button.active{background:#1b1e4e;border:1px solid #1B1E4E}.app-chart__tabs .app-button.active span{color:#fff}.app-chart__years{width:100%;display:flex;flex-direction:row;align-items:center;gap:15px;padding:32px;border-radius:12px 12px 0 0}.app-chart__years .app-button{border-radius:2px;height:40px;background:#84a3ff1f;border:1px solid #F1F1F1}.app-chart__years .app-button--text{font-size:16px;line-height:150%;font-weight:400;color:#0d0e12}.app-chart__years .app-button:hover{border:1px solid #84A3FF}.app-chart__years .app-button.active{background:#84a3ff;border:1px solid #84A3FF}.app-chart__years .app-button.active span{color:#fff}.app-chart__main{padding:0 32px 32px;width:100%;margin-top:40px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:16px}.app-chart__main-list{max-width:694px;width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:32px}.app-chart__main-item{width:100%;display:flex;flex-direction:row;align-items:center;gap:25px}.app-chart__main-item--color{flex-shrink:0;width:26px;height:26px;border-radius:2px;background:var(--category-color)}.app-chart__main-item--info{display:flex;flex-direction:column;align-items:flex-start;gap:12px;text-align:left}.app-chart__main-item--info h3{font-size:18px;line-height:130%;font-weight:600}.app-chart__main-item--info p{color:#525252;font-size:16px;line-height:24px;font-weight:400}.app-chart__main-body{width:371px;height:371px}.app-chart__main-body canvas{width:100%!important;height:100%!important}@media screen and (max-width: 1280px){.app-chart__tabs{flex-wrap:wrap;justify-content:center}.app-chart__tabs .app-button{max-width:calc((100% - 45px)/4)}.app-chart__years{flex-wrap:wrap;justify-content:center}.app-chart__years .app-button{max-width:calc((100% - 45px)/4)}}@media screen and (max-width: 1024px){.app-chart__tabs .app-button,.app-chart__years .app-button{max-width:calc((100% - 30px) / 3)}.app-chart__main{margin-top:8px;flex-direction:column;gap:40px}.app-chart__main-list{max-width:100%}.app-chart__main-body{width:301px;height:301px}.app-chart__main-item{flex-direction:column;align-items:flex-start;gap:26px}}@media screen and (max-width: 768px){.app-chart__tabs{gap:12px}.app-chart__tabs .app-button{max-width:100%}.app-chart__years{gap:8px}.app-chart__years .app-button{max-width:calc((100% - 15px)/2)}.app-chart__years .app-button:last-child{max-width:100%}}
