@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;400;500;600&display=swap');

* {margin:0; padding:0; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
*:before, *:after {box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
html {-webkit-text-size-adjust:100%}
body {font:normal 14px/20px 'Inter', sans-serif; color:#000;}
ul, ol {list-style:none;}
img {border:0; max-width:100%}
a, a:focus, a:active {color:#6800ff; text-decoration:none; outline:none;}
a:hover {color:#883ef4; text-decoration:none;}
button {border:0; cursor:pointer;}
.clearfix {clear:both;}
.clearfix:after {content:""; display:block; clear:both;}
.btn {font-size:15px; border-radius:5px; text-align:center; line-height:1; padding:10px 15px; display:inline-block; vertical-align:top; text-transform:capitalize;}
.btn:hover {color:#191919;}
.btn:focus, .btn:active, .btn:active:focus, input[type=file]:focus, select:focus {outline:none; box-shadow:none; -webkit-box-shadow:none;}
.btn-small, .btn.btn-small {padding:10px 11px; font-size:14px;}
.btn-primary {background:#44ce4b; border-color:#44ce4b; color:#fff;}
.btn-primary:hover, .btn-primary.focus, .btn-primary:focus, .btn-primary:active:focus {color:#fff; background-color:#4ce954; border-color:#4ce954; outline:none;}
.btn-secondary {background:#fff; color:#6800ff; border-color:#6800ff;}
.btn-secondary:hover {background:#fff; color:#883ef4; border-color:#883ef4;}
.btn-tertiary, .btn-tertiary:hover {background:#fff; color:#CF451C; border-color:#1E1E1E;}
h1, h2 {font-size:50px; font-weight:600; color:#000; text-transform:capitalize; line-height:1; margin:0 0 40px;}
h3 {font-size:25px; font-weight:600; color:#000; line-height:23px; margin:0 0 14px; text-transform:capitalize;}
h4 {font-size:20px; color:#000; line-height:1;}
h6 {font-size:15px; margin:0 0 5px; line-height:1;}
p {line-height:22px;}
input[type="number"] {-moz-appearance:textfield;}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {-webkit-appearance:none;}
textarea {resize:none;}
.dashboard-wrapper {width:100%; height:100%; display:flex; flex-flow:row wrap;}
.dashboard-wrapper .left-section {display:flex;}
.dashboard-wrapper .left-section .primary-sidebar {display:flex; flex-direction:column; width:64px; flex-shrink:0; position:relative; border-right:1px solid #f1f5f8; height:100vh;}
.dashboard-wrapper .logo {padding:15px;}
.dashboard-wrapper .logo img {width:32px; height:32px; -o-object-fit:cover; object-fit:cover; -o-object-position:left center; object-position:left center;}
.primary-sidebar .menu {align-items:center; display:flex; margin-top:25px;}
.dashboard-wrapper .primary-sidebar .menu a {width:4rem; padding:1rem 0; line-height:1; border-radius:8px; justify-content:center; margin:8px 0;}
.dashboard-wrapper .left-section .menu.vertical {flex-wrap:nowrap; flex-direction:column;}
.dashboard-wrapper .menu a {display:inline-flex; border-radius:2px; color:#446888; padding:16px;}
.main-nav .menu a:hover {background-color:#f8fafc; color:#446888;}
.dashboard-wrapper .primary-sidebar .menu .active, .dashboard-wrapper .primary-sidebar .menu a:hover, .dashboard-wrapper .main-nav .menu .active {background-color:#ebf5ff; color:#1f93ff;}
.dashboard-wrapper .left-section .main-nav {border-right:1px solid #f1f5f8; padding:10px; width:19rem; height:100vh;}
.dashboard-wrapper .left-section .main-nav li {margin-top:5px;}
.dashboard-wrapper .left-section .main-nav li a {display:flex; padding:8px; align-items:center; font-weight:500;}
.dashboard-wrapper .left-section .main-nav li a svg {margin-right:6px;}
.dashboard-wrapper .right-section {display:flex; height:100%; overflow:hidden; flex:1 1; background-color:#f8fafc;}
.right-section .header-section {padding:8px 16px; border-bottom:1px solid #f1f5f8; background-color:#fff;}
.right-section .header-section .btn {float:right;}
.dashboard-wrapper .right-section .right-section-content {display:flex; flex-direction:column; height:100vh; width:100%;}
.dashboard-wrapper .right-section .report-data {padding:16px; overflow:auto;}
.right-section .header-section h1 {float:left; font-size:24px; line-height:1.4; color:#1f2d3d; font-weight:500; margin:0;}
.right-section .header-section .btn svg {vertical-align:top;}
.dashboard-wrapper .right-section .report-data.report-data-top select { width: 100%;}
.dashboard-wrapper .right-section .report-data.report-data-top input { appearance: none;
    border: 1px solid #f1f5f8;
    padding: 10px 15px 10px 10px;
    min-width: 200px;
    font-size: 16px;
    margin-bottom: 15px; width: 100%;}
.dashboard-wrapper .right-section .report-data select {-webkit-appearance:none; -moz-appearance:none; appearance:none; border:1px solid #f1f5f8; background:#fff url(../img/down-arrow.png) no-repeat 95% 50%; padding:10px 25px 10px 10px; min-width:200px; font-size:16px; margin-bottom:15px;}
.report-tabs-section {}
.report-tabs-section .nav-tabs {display:flex; flex-flow:row wrap; border-bottom:0;}
.report-tabs-section .nav-tabs li {flex:0 0 16.6666666667%; max-width:16.6666666667%; padding:1.6rem .8rem 1.6rem 2rem; border-top:3px solid transparent; cursor:pointer;}
.report-tabs-section .nav-tabs li.active {background-color:#fff; border-color:#1f93ff;}
.report-tabs-section .nav-tabs h3 {font-size:15px; color:#1f2d3d; font-weight:500;}
.report-tabs-section .nav-tabs h4 {color:#1f2d3d; font-size:29px; font-weight:100;}
.report-tabs-section .nav-tabs p {margin-bottom:0;}
.report-tabs-section .nav-tabs li.active h3, .report-tabs-section .nav-tabs li.active h4 {color:#1f93ff;}
.report-tabs-section .tab-content {background-color:#fff; padding:15px 24px;}
.report-tabs-section .tab-content .table tr > th:first-child {width:80px;}

.mb-1{margin-bottom: 10px!important;}
.mb-2{margin-bottom: 15px!important;}
.mb-3{margin-bottom: 20px!important;}

.p-1{padding-left: 10px!important;}
.p-2{padding-left: 15px!important;}
.p-3{padding-left: 20px!important;}

 /* chart */
 .progressChart {
    margin: 3px;
    width: 488px;
    height: 8px;
  }

  .font-1{
      font-size: 25px!important;
  }

  .font-2{
    font-size: 35px!important;
}

.active  .font-2{
    color:#FF9B04!important;
}

.csatRating{
    width: 28px!important;
    height: 28px!important;
}

.red{background-color: red!important;}
.orange{background-color: orange!important;}
.yellow{background-color: yellow!important;}
.green{background-color: green!important;}
.purple{background-color: purple!important;}
.m-1{margin: 10px !important;}
.m-2{margin: 20px !important;}
.ml-3{margin: 30px !important;}
.m-4{margin: 40px !important;}
.m-5{margin: 50px !important;}

.ml-1{margin-left: 10px !important;}
.ml-2{margin-left: 20px !important;}
.ml-3{margin-left: 30px !important;}
.ml-4{margin-left: 40px !important;}
.ml-5{margin-left: 50px !important;}

.mr-1{margin-right: 10px !important;}
.mr-2{margin-right: 20px !important;}
.mr-3{margin-right: 30px !important;}
.mr-4{margin-right: 40px !important;}
.mr-5{margin-right: 50px !important;}

.mt-1{margin-top: 10px !important;}
.mt-2{margin-top: 20px !important;}
.mt-3{margin-top: 30px !important;}
.mt-4{margin-top: 40px !important;}
.mt-5{margin-top: 50px !important;}

.mb-1{margin-bottom: 10px !important;}
.mb-2{margin-bottom: 20px !important;}
.mb-3{margin-bottom: 30px !important;}
.mb-4{margin-bottom: 40px !important;}
.mb-5{margin-bottom: 50px !important;}