@import "variable.less"; // Variable.less
/*    Widget One
---------------------------*/
.stat-widget-one {
    .stat-icon {
        vertical-align: top;
        i {
            font-size: 30px;
            //        color: @success;
            border-width: 3px;
            border-style: solid;
            border-radius: 100px;
            padding: 15px;
            font-weight: 900;
            display: inline-block;
        }
    }
    .stat-content {
        margin-left: 30px;
        margin-top: 7px;
    }
    .stat-text {
        font-size: 14px;
        color: @text-light;
    }
    .stat-digit {
        font-size: 24px;
        color: @text;
    }
}
/*    Widget Two
---------------------------*/
.stat-widget-two {
    text-align: center;
    .stat-digit {
        font-size: 40px;
        font-weight: 700;
        color: @text;
    }
    .stat-text {
        font-size: 20px;
        margin-bottom: 5px;
        color: @text-light;
    }
    .progress {
        height: 8px;
        margin-bottom: 0;
        margin-top: 20px;
        box-shadow: none;
    }
    .progress-bar {
        box-shadow: none;
    }
}
/*    Widget Three
---------------------------*/
.stat-widget-three {
    .stat-icon {
        display: inline-block;
        //        background: @primary;
        padding: 33px;
        position: absolute;
        line-height: 21px;
        i {
            font-size: 30px;
            color: @white;
        }
    }
    .stat-content {
        //        display: inline-block;
        text-align: center;
        padding: 15px;
        margin-left: 90px;
    }
    .stat-digit {
        font-size: 30px;
    }
    .stat-text {
        padding-top: 7px;
    }
}
.home-widget-three {
    .stat-icon {
        line-height: 19px;
        padding: 27px;
    }
    .stat-digit {
        font-size: 24px;
        font-weight: 300;
        color: @text;
    }
    .stat-content {
        text-align: center;
        margin-left: 60px;
        padding: 13px;
    }
}
//widget four close here
.stat-widget-four {
    position: relative;
    .stat-icon {
        display: inline-block;
        position: absolute;
        top: 5px;
    }
    i {
        display: block;
        font-size: 36px;
    }
    .stat-content {
        margin-left: 40px;
        text-align: center;
    }
    .stat-heading {
        font-size: 20px;
    }
}
//widget five start here
.stat-widget-five {
    .stat-icon {
        border-radius: 100px;
        display: inline-block;
        position: absolute;
    }
    i {
        border-radius: 100px;
        //        color: @white;
        display: block;
        font-size: 36px;
        padding: 30px;
    }
    .stat-content {
        margin-left: 100px;
        padding: 24px 0;
        position: relative;
        text-align: right;
        vertical-align: middle;
    }
    .stat-heading {
        text-align: right;
        padding-left: 80px;
        font-size: 20px;
        //        color: @primary;
        font-weight: 200;
    }
}
//widget six cloe here
.stat-widget-six {
    position: relative;
    .stat-icon {
        display: inline-block;
        position: absolute;
        top: 5px;
    }
    i {
        display: block;
        font-size: 36px;
    }
    .stat-content {
        margin-left: 40px;
        text-align: center;
    }
    .stat-heading {
        font-size: 16px;
        font-weight: 300;
    }
    .stat-text {
        font-size: 12px;
        padding-top: 4px;
    }
}
//widget six start here
.stat-widget-seven {
    //    border: 1px solid @border;
    //    padding: 30px;
    .stat-heading {
        text-align: center; //        margin-top: 30px;
    }
    .gradient-circle {
        text-align: center;
        position: relative;
        margin: 30px auto;
        display: inline-block;
        width: 100%;
        i {
            position: absolute;
            left: 0;
            right: 0;
            text-align: center;
            top: 35px;
            font-size: 30px;
        }
    }
    .stat-footer {
        text-align: center;
        margin-top: 30px;
        .stat-count {
            padding-left: 5px;
        }
    }
    .count-header {
        //        color: #0c6bd8;
        color: @black;
        font-size: 12px;
        font-weight: 400;
        line-height: 30px;
    }
    .stat-count {
        font-size: 18px;
        font-weight: 400;
        color: @black; //        color: #16236c;
        //        color: #2a3e8f;
    }
    .analytic-arrow {
        position: relative;
        i {
            font-size: 12px;
        }
    }
}
/* Stat widget Eight
--------------------------- */
.stat-widget-eight {
    padding: 15px;
    .header-title {
        font-size: 20px;
        font-weight: 300;
    }
    .ti-more-alt {
        color: @default;
        cursor: pointer;
        left: -5px;
        position: absolute;
        transform: rotate(90deg);
    }
    .stat-content {
        margin-top: 50px;
        .ti-arrow-up {
            font-size: 30px;
            color: @success;
        }
        .stat-digit {
            font-size: 24px;
            font-weight: 300;
            margin-left: 15px;
        }
        .progress-stats {
            color: #aaadb2;
            font-weight: 400;
            position: relative;
            top: 10px;
        }
    }
    .progress {
        margin-bottom: 0;
        margin-top: 30px;
        height: 7px;
        background: #EAEAEA;
        box-shadow: none;
    }
}
.stat-widget-nine {
    .all-like {
        float: right;
    }
    .stat-icon {
        i {
            font-size: 22px;
        }
    }
    .stat-text {
        font-size: 14px;
    }
    .stat-digit {
        font-size: 14px;
    }
    .like-count {
        font-size: 30px;
    }
}
.horizontal {
    position: relative;
    &:before {
        background: @white;
        bottom: 0;
        content: "";
        height: 38px;
        left: 0;
        margin: 0 auto;
        position: absolute;
        right: 0;
        width: 1px;
    }
}
.widget-ten {
    span {
        i {
            color: @white;
            opacity: 0.5;
        }
    }
    h5 {
        color: @white;
    }
    p {
        color: @white!important;
        opacity: 0.75;
    }
}
/*
=================================================
    Responsive
=================================================
*/
@media (max-width: 768px) {
    .card {
        display: inline-block;
        width: 100%;
    }
}
@media (max-width: 360px) {
    .stat-widget-five {
        .stat-heading {
            padding-left: 0;
        }
    }
    .stat-widget-two {
        .stat-digit {
            font-size: 16px;
        }
    }
    .stat-widget-two {
        .stat-text {
            font-size: 14px;
        }
    }
    .stat-widget-three {
        .stat-digit {
            font-size: 20px;
        }
    }
    .stat-widget-four {
        .stat-heading {
            font-size: 18px;
        }
    }
    .stat-widget-three {
        .stat-icon {
            padding: 26px;
        }
    }
}
.round-widget {
    border: 1px solid red;
    border-radius: 100px;
    display: inline-block;
    height: 60px;
    line-height: 60px;
    text-align: center;
    width: 60px;
}