/** Content area main titles etc **/
.content-area h1 {
    padding-bottom: 25px;
    font-family: SegoeUiBlack;
}
.content-area h3 {
    padding-bottom: 15px;
    font-family: SegoeUiBlack;
}
/** Meta block **/
.meta {
    display: flex;
}

/** Ibox **/
.ibox {
    border-radius: 10px;
}

.swiper-slide{
    width:auto;
}
/** Bubble **/
.bubble {
    width: 48px;
    height: 48px;
    background: #B7C8F3;
    border-radius: 50px;
    text-align: center;
    vertical-align: middle;
    justify-content: center;
    margin-right: 10px;
}
.bubble-black{
    background:#000;
    color:#FFF !important;
}
.bubble-inner {
    padding-top: 10px;
    color: #86A0E2;
    font-weight: bold;
}

.bubble.active {
    background: #4D7BF4;
}

.bubble.active > .bubble-inner {
    color: #fff;
}

.bubble-badge {
    width: 16px;
    height: 16px;
    background: #F21A1A;
    border-radius: 50px;
    position: absolute;
}


/** Progress line **/
.progress-line {
    background: #EDEDED;
    width: 100%;
    height: 10px;
    border-radius: 10px;
}

.progress-line-inner {
    background: #4D7BF4 !important;
    width: 100%;
    height: 10px;
    border-radius: 10px;
}

/** progress circular **
 */
.progress-ring {
    width: 80px;
    height: 80px;
    position: relative;
    --size: 80px;
    --thickness: 6px;
    --progress: 0; /* 0 to 100 */
}

.circle {
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    background: conic-gradient(#86A0E2 calc(var(--progress) * 1%), #eee 0);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.inside-circle {
    position: absolute;
    width: calc(var(--size) - 2 * var(--thickness));
    height: calc(var(--size) - 2 * var(--thickness));
    background: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}


/** Form

 */
.notification-banner{
    padding:10px;
    border-radius:10px;
    margin-bottom:20px;
}
.banner-error{
    background:#D45050;
}
.notification-banner .text{
    font-weight:bold;
    font-size:15px;

}
.notification-banner .subtitle{
    font-size:13px;
}


/** metas **/
.side-meta {
    display:flex;
}
.side-meta .meta{
    margin-right:15px;
}


/** inputs **/
input,textarea,select{
    border:1px solid #cfcccc;
    padding:10px;
}
.tabs-content-wrapper{
    margin-top:20px;
}
.tabs-container a{
    margin-right:20px;
    text-decoration:none;
    color:#000;
}
.tabs-container a.active{
    margin-right:20px;
    text-decoration:none;
    color:#677DB7;
    font-weight:bold;
}
.actions{
    margin-bottom:20px;
}
/** Table **/
table{
    background:#fff;
    border-radius:5px;
}

tbody, td, tfoot, th, thead, tr {
    border-color:#ededed !important;
    border-style:solid !important;
    border-width:1px !important;
}
thead tr th{
    font-weight:bold;
    font-size:14px;
}
.dataTables_wrapper {
    background:#fff;
    padding:10px;
    border-radius:10px;
}
.dataTables_length,.dataTables_filter{
    padding-top:10px !important;
    padding-bottom:10px !important;
    font-size:13px !important;
}
.dataTables_filter input, .dataTables_length select{
    border:1px solid #ededed !important;
    border-radius:10px !important;
}
/** Indicators **/
.indicator{
    background:#fff;
    padding:25px;
    border-radius:10px;
}
.indicator label{
    font-weight:bold;
    font-size:14px;
}
.indicator h3{
    padding:0;
    margin:0;
    font-weight:bold;
    font-size:25px;
    margin-top:10px;
    margin-bottom:10px;
}
.indicator small{font-size:12px;color: #b3b3b3;}
.calendar-widget .event .meta .title{
    margin-left:20px;
    border-left:2px solid #dbdbdb;
    padding-left:20px;
}
.calendar-widget .event{
    margin-bottom:20px;
}
.calendar-widget .event-active .meta > .title{
    border-left:2px solid #dbdbdb;
}
.calendar-widget .event-active .meta > .title{
    border-left:2px solid #4D7BF4 !important;
}
.calendar-widget .meta .time{
    padding-top:10px;
}
.calendar-widget .event .meta label{
    font-size:14px;
    color: #939393;
}
.calendar-widget .day{
    margin-bottom:20px;
}
.calendar-wrapper h3{
    margin-top:0;
}

/** Messages **/
.message{margin-top:10px; margin-bottom:10px; display:flex;padding:10px;}
.message-icon{
    margin-right:10px;
}
.message-success{
    background:#EDF7E7 !important;
    color: #424242;
}
.message-error{
    background: #f6cbc6 !important;
    color: #bc6055;
}
.message-text{
    font-size:14px;
    font-weight:bold;
}


.badge-success{
    background:#EDF6EB !important;
    color: #599134 !important;
}
.badge-grey{
    background: #acacac !important;
    color: #333333 !important;
}
.swiper-wrapper{
    height:80px !important;
}
.swiper-scrollbar{
    top:60px;
}