/*============================================================================================

	Theme Name: Doctures
	Description: All in One Admin Theme For Doctures
	Author: Doctures
	Version: 2.0

============================================================================================*/


/*============================================================================================
	1.  THEME BASICS and GENERAL STRUCTURES
	2.  REDESIGNED and DEVELOPED BOOTSTRAP ELEMENTS
	3.  CALENDAR
	4.  PAGES (?)
	5.  EXTRAS

============================================================================================*/


/*===== 1.  THEME BASICS and GENERAL STRUCTURES  =====*/


/* Fonts */

/* Montserrat
font-family: 'Montserrat', sans-serif;
*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


/* Varela
font-family: 'Varela Round', sans-serif;
*/
@import url('https://fonts.googleapis.com/css2?family=Varela+Round&display=swap');


/* Poppins
font-family: 'Poppins', sans-serif;
*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');



/*==============================

	1.  THEME BASISC AND GENERAL STRUCTURES

============================== */

/********** 1.1  Basics */

p {
    margin: 10px 0;
}
a {
    color: #727579;
    text-decoration: none;
    cursor: pointer;
}
a:hover, a:focus {
    text-decoration: none;
    color: #727579;
}

a:not([href]):not([class]), a:not([href]):not([class]):hover {
    color: #727579;
}

a, a:hover, a:before,  li, li:before, li:after, img, figure, figure figcaption, .btn, .btn:before, .btn:after, div, div:hover, div:hover a  {
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

img {
    max-width: 100%;
    height: auto;
}
ul li, ol li {
    list-style-type: none;
}
ol, ul{
    margin: auto;
    padding: initial;
}
.prev-next .btn:first-child i {
    margin-left: 15px;
    margin-right: 0;
}
.prev-next .btn:last-child i {
    margin-right: 15px;
    margin-left: 0;
}

@media (max-width: 767px) {
    .prev-next .btn {
        width: 100%;
        margin-bottom: 10px;
    }
    .prev-next .btn:last-child {
        margin-bottom: 0;
    }
}

/********** 1.2  General margin sections */

.margin-30 {
    margin: 30px 0;
}
.margin-60 {
    margin: 60px 0;
}
.margin-0-15 {
    margin-bottom: 15px;
}
.margin-0-30 {
    margin-bottom: 30px;
}
.margin-0-60 {
    margin-bottom: 60px;
}
.margin-60-30 {
    margin: 60px 0 30px 0;
}
.margin-15-0 {
    margin-top: 15px;
}
.margin-30-0 {
    margin-top: 30px;
}
.margin-30-10 {
    margin: 30px 0 10px 0;
}
.margin-30-60 {
    margin: 30px 0 60px 0;
}
.margin-60-0 {
    margin-top: 60px;
}
.margin-90-0 {
    margin-top: 90px;
}
.margin-120-0 {
    margin-top: 120px;
}
.margin-0-120 {
    margin-bottom: 120px;
}
.margin-120-60 {
    margin-top: 120px;
    margin-bottom: 60px;
}


/********** 1.3  General structures */

body {
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    line-height: 21px;
    background-color: #f4f5f6;
    color: #000000;
    -webkit-font-smoothing: antialiased !important;
    overflow-x: hidden;
    font-weight: 400;
}

main {
    margin: 0;
}

.display-none{
    display: none !important;
    opacity: 0;
    height: 0;
}

.border-none{
    border:none !important;
}

/* TODO delete right and left aligns, after change start end (new bootstrap) aligns */

.text-right{
    text-align: right;
}

.text-left{
    text-align: left;
}

/* The page widens (with margin value) to be competible with 1170px page width. */

@media (min-width: 1200px) {
    .container {
        width: 1200px;
    }
}

/********** 1.4  Typography */

h1, h2, h3, h4, h5, h6 {
    color: #727579;
    padding: 0;
    font-weight: 700;
    font-family: 'Varela Round', sans-serif;
    letter-spacing: 0;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
    color: #000000;
}

h1 {
    font-size: 46px;
    line-height: 54px;
}
h2 {
    font-size: 40px;
    line-height: 48px;
}
h3 {
    font-size: 34px;
    line-height: 42px;
}
h4 {
    font-size: 28px;
    line-height: 36px;
}
h5 {
    font-size: 22px;
    line-height: 30px;
}
h6 {
    font-size: 16px;
    line-height: 24px;
}

@media (max-width: 991px) {
    h1 {
        font-size: 34px;
        line-height: 40px;
    }
    h2 {
        font-size: 30px;
        line-height: 36px;
    }
    h3 {
        font-size: 26px;
        line-height: 32px;
    }
    h4 {
        font-size: 22px;
        line-height: 28px;
    }
    h5 {
        font-size: 18px;
        line-height: 24px;
    }
    h6 {
        font-size: 14px;
        line-height: 20px;
    }
}

/*===== 2.  REDESIGNED and DEVELOPED BOOTSTRAP ELEMENTS  =====*/

/********** 2.1  Form  */

.form-label {
    font-size: 12px;
    font-weight: 600;
    margin: 3px 0;
    width: 100%;
}
.form-control::placeholder {
    letter-spacing:.5px;
    font-weight:500;
}

.form-control::-webkit-input-placeholder {
    letter-spacing:.5px;
    font-weight:500;
}

.form-control:-moz-placeholder{
    letter-spacing:.5px;
    font-weight:500;
}

.form-control:-ms-input-placeholder {
    letter-spacing:.5px;
    font-weight:500;
}

.form-control, .has-success .form-control, .has-warning .form-control, .has-error .form-control {
    border-radius: 0;
    border: none;
    font-size: 12px;
    letter-spacing: .5px;
    color: #727579;
    font-weight: 600;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
}
/* general styles */

.form-control {
    border: 1px solid #727579;
    border-radius: 5px;
    font-size: 13px;
    padding: 15px;
    color: #727579;
    margin-bottom: 15px;
}
.has-success .form-control {
    border-bottom: 1px solid #b2dba1;
}
.has-warning .form-control {
    border-bottom: 1px solid #f5e79e;
}
.has-error .form-control {
    border-bottom: 1px solid #dca7a7;
}
/* addon styles */

.input-group-addon {
    padding: 0;
    border-radius: 0;
    border: none;
    background-color: #dfe1e5;
    border-bottom: 1px solid #dfe1e5;
}
.input-group-addon i {
    width: 38px;
    height: 38px;
    line-height: 40px;
    text-align: center;
    color: #c5c9cf;
}
.input-group-addon i:hover {
    background-color: transparent !important;
    color: #c5c9cf !important;
}
/* TODO following three color preferences will change with rgba alternatives of the main colors. */

.has-success .input-group-addon {
    border-radius: 0;
    border: none;
    border-bottom: 1px solid #b2dba1;
}
.has-warning .input-group-addon {
    border-radius: 0;
    border: none;
    border-bottom: 1px solid #f5e79e;
}
.has-error .input-group-addon {
    border-radius: 0;
    border: none;
    border-bottom: 1px solid #dca7a7;
}
/* focus styles */

.form-control:focus,
.form-select:focus {
    border: 1px solid #dfe1e5;
    box-shadow: none;
}
.has-success .form-control:focus {
    border-bottom: 1px solid #5cb85c;
    box-shadow: none;
}
.has-warning .form-control:focus {
    border-bottom: 1px solid #f0ad4e;
    box-shadow: none;
}
.has-error .form-control:focus {
    border-bottom: 1px solid #d9534f;
    box-shadow: none;
}
/* select */

.form-select{
    font-size: 13px;
    letter-spacing: .5px;
    color: #727579;
    border: 1px solid #727579;
    border-radius: 5px;
    padding: 15px;
    font-weight: 600;
    margin-bottom: 15px;
}

.select2-container{
    display: block !important;
}

.select2-results__option{
    display: block !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered,
.select2-container .select2-selection--single
{
    width: 100% !important;
    min-height: 52px !important;
    padding: 15px;
    font-size: 13px;
    letter-spacing: .5px;
    color: #727579;
    border: 1px solid #727579;
    border-radius: 5px;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: none !important;
}

.select2-container--default .select2-selection--multiple {
    border: none !important;
    border-radius: 5px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 52px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered{
    width: 100% !important;
}

.select2-container--default .select2-search--inline .select2-search__field {
    width: 100% !important;
}

/* extras */

.form-help-block{
    font-size: 13px;
    color: #727579;
    letter-spacing: .5px;
    opacity: .7px;
}


/********** 2.2  Buttons & Links */

/*
	The common features of all the buttons,
	The theme has many new bottons style, button names descripe it's styles
*/

.btn {
    border-radius: 4px;
    border: none;
    font-size: 13px;
    background-image: none;
    text-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    position: relative;
    padding: 10px 20px;
    letter-spacing: .5px;
    font-weight: 600;
    color: #FFFFFF;
}
@media (max-width: 991px) {
    .btn {
        font-size: 10px;
    }
}

.btn-danger:hover:before,
.btn-default:hover:before,
.btn-info:hover:before,
.btn-primary:hover:before,
.btn-secondary:hover:before,
.btn-success:hover:before,
.btn-warning:hover:before {
    color: #FFFFFF;
    margin-left: -6px;
}
.btn i {
    margin-right: 10px;
}

.btn-icon i{
    margin-right: 0;
}

.btn-check:focus+.btn-primary, .btn-primary:focus,
.btn-check:focus+.btn-secondary, .btn-secondary:focus,
.btn-check:focus+.btn-default, .btn-default:focus,
.btn-check:focus+.btn-success, .btn-success:focus,
.btn-check:focus+.btn-info, .btn-info:focus,
.btn-check:focus+.btn-warning, .btn-warning:focus,
.btn-check:focus+.btn-danger, .btn-danger:focus {
    border: none;
    box-shadow: none;
}


.btn-default{
    background-color:#c5c9cf;
    color: #727579;
}

.btn-default:hover{
    background-color:#727579;
}

.btn-info{
    background-color:#1781ee;
}

.btn-info:hover{
    background-color:#116bc7;
}

.btn-success{
    background-color:#71d233;
}

.btn-success:hover{
    background-color:#61b62b;
}

.btn-warning{
    background-color:#f5e33d;
}

.btn-warning:hover{
    background-color:#f5cc3d;
}

.btn-danger{
    background-color:#fe483b;
}

.btn-danger:hover{
    background-color:#e43528;
}



@media (max-width: 768px) {

    .btn-mobile-text-hide {
        font-size: 0;
    }

    .btn-mobile-text-hide i {
        font-size: 13px;
        margin-right: 0;
    }
}

/**/
.btn-outline-danger,
.btn-outline-default,
.btn-outline-info,
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-warning{
    padding: 8px 18px;
}



.btn-outline-danger:hover,
.btn-outline-default:hover,
.btn-outline-info:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-success:hover,
.btn-outline-warning:hover{
    background-color: transparent;
}

.btn-outline-danger:hover:before,
.btn-outline-default:hover:before,
.btn-outline-info:hover:before,
.btn-outline-primary:hover:before,
.btn-outline-secondary:hover:before,
.btn-outline-success:hover:before,
.btn-outline-warning:hover:before {
    color: #FFFFFF;
    margin-left: -6px;
}


.btn-outline-primary, .btn-check:focus+.btn-outline-primary, .btn-primary:focus,
.btn-outline-secondary, .btn-check:focus+.btn-outline-secondary, .btn-outline-secondary:focus,
.btn-outline-default, .btn-check:focus+.btn-outline-default, .btn-outline-default:focus,
.btn-outline-success,.btn-check:focus+.btn-outline-success, .btn-outline-success:focus,
.btn-outline-info, .btn-check:focus+.btn-outline-info, .btn-outline-info:focus,
.btn-outline-warning, .btn-check:focus+.btn-outline-warning, .btn-outline-warning:focus,
.btn-outline-danger, .btn-check:focus+.btn-outline-danger, .btn-outline-danger:focus {
    border-style: solid;
    border-width: 2px;
    box-shadow: none;
}


.btn-outline-default{
    border-color:#c5c9cf;
    color: #727579;
}

.btn-outline-default:hover{
    border-color:#727579;
    color: #727579;
}

.btn-outline-info{
    border-color:#1781ee;
    color:#116bc7;
}

.btn-outline-info:hover{
    border-color:#116bc7;
    color:#116bc7;
}

.btn-outline-success{
    border-color:#71d233;
    color:#61b62b;
}

.btn-outline-success:hover{
    border-color:#61b62b;
    color:#61b62b;
}

.btn-outline-warning{
    border-color:#f5e33d;
    color:#f5cc3d;
}

.btn-outline-warning:hover{
    border-color:#f5cc3d;
    color:#f5cc3d;
}

.btn-outline-danger{
    border-color:#fe483b;
    color:#e43528;
}

.btn-outline-danger:hover{
    border-color:#e43528;
    color:#e43528;
}

/***** Specific text styles *****/

.text-info{
    color:#116bc7;
}

.text-success{
    color:#61b62b;
}

.text-warning{
    color:#f5cc3d;
}

.text-danger{
    color:#e43528;
}

/********** Modal */

.modal-content {
    border: none;
    border-radius: 10px !important;
    -webkit-border-radius: 10px !important;
    -moz-border-radius: 10px !important;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.modal-backdrop {
    background-color: #000000;
    opacity: .8 !important;
}

.modal-header,
.modal-footer {
    background-color: #c5c9cf;
}

.modal-header .btn-close {
    padding: 12px;
    margin: 0;
    position: absolute;
    right: -60px;
    background-color: #e43528;
    opacity: 1;
    border-radius: 50%;
}

@media (max-width: 768px) {
    .modal-header .btn-close {
        right: 10px;
    }
}

.modal-body .modal-content-part{
    padding:12px;
    border-radius: 10px;
}

.modal-body .modal-content-part:nth-child(even) {
    background-color: #ebecf0;
}

.modal-header .head.tabs a{
    font-size: 14px;
    font-weight: 600;
    padding: 8px 15px;
    margin-right: 10px;
    border-radius: 4px;
    border: 1px solid rgba(255, 255, 255, 0);
}

.modal-header .head.tabs a i{
    margin-right: 10px;
    opacity: .8;
}

@media (max-width: 768px) {
    .modal-header .head.tabs a{
        font-size: 11px;
        padding: 8px 5px;
        margin-right: 5px;
    }

    .modal-header .head.tabs a i{
        margin-right: 5px;
        opacity: .8;
    }
}

.modal-header .head.tabs a.active{
    background-color: #c5c9cf;
    color: #FFFFFF;
    border: 1px solid #FFFFFF;
}

.modal-header h6{
    margin-bottom: 0;
}

/* footer mobile menu ..etc */
.modal-header h6 img{
    width: 24px;
    height: auto;
    margin: 0 15px 0 12px;
}

/* there is none modal footer in form modals, so we use this */
.modal-bottom-btn{
    background-color:#c5c9cf;
    padding: 10px 15px;
    margin: 15px -15px -15px -15px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}


/********** Pagination */

@media (min-width: 768px) {
    nav.cat {
        text-align: right;
    }
}
.pagination {
    margin: 0;
}
.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>li,
.pagination>.active>li:focus,
.pagination>.active>li:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover {
    background-color: #1781ee !important;

}
.pagination>li>a, .pagination>li>span {
    color: #93979d;
    border-color: #c5c9cf !important;
}
.pagination>li>a:hover, .pagination>li>span:hover {
    color: #ffffff;
    background-color: #c5c9cf;
}
.pagination>li:first-child>a, .pagination>li:first-child>span, .pagination>li:last-child>a, .pagination>li:last-child>span {
    border-radius: 0;
}
.pagination>li>a, .pagination>li>span {
    width: 40px;
    height: 40px;
    padding: 0;
    line-height: 40px;
    text-align: center;
}
/********** Alerts & Callout & Progressbar */

/********** alert */

.alert, .alert-success, .alert-info, .alert-warning, .alert-danger {
    border-radius: 5px;
    background-image: none;
    text-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border:1px solid;
    position: relative;
    padding-left: 75px;
}
.alert-success {
    border-color: #61b62b;
    background-color: #71d233;
    color: #ffffff;
}
.alert-info {
    border-color: #116bc7;
    background-color: #1781ee;
    color: #ffffff;
}
.alert-warning {
    border-color: #f5cc3d;
    background-color: #f5e33d;
}
.alert-danger {
    border-color: #e43528;
    background-color: #fe483b;
    color: #ffffff;
}

.alert:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 60px;
    height: 100%;
    font-family: "Font Awesome 5 Free";
    font-size: 18px;
    padding-right: 3px;
    font-weight: 900;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.alert-success:before{
    content: "\f058";
    background-color: #61b62b;
    color: #71d233;
}

.alert-info:before{
    content: "\f05a";
    background-color: #116bc7;
    color: #1781ee;
}

.alert-warning:before {
    content: "\f06a";
    background-color: #f5cc3d;
    color: #f5e33d;
}

.alert-danger:before{
    content: "\f06a";
    background-color: #e43528;
    color: #fe483b;
}

/********** progress-bar */

.progress {
    margin-bottom: 0;
    height: 40px;
    background-image: none;
    border-radius: 0;
    background-color: #c5c9cf;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.progress-bar {
    background-color: #dfe1e5;
    background-image: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    line-height: 40px;
}
.progress-bar-success {
    background-color: #61b62b;
}
.progress-bar-info {
    background-color: #116bc7;
}
.progress-bar-warning {
    background-color: #f5cc3d;
}
.progress-bar-danger {
    background-color: #e43528;
}
.progress-bar-striped, .progress-striped .progress-bar {
    background-image: -webkit-linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
    -webkit-background-size: 80px 80px;
    background-size: 80px 80px;
}

/********** 2.9  Table */
.table{
    font-size: 13px;
}

.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th, .table-bordered>tbody>tr>td, .table-bordered>tbody>tr>th, .table-bordered>tfoot>tr>td, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>td, .table-bordered>thead>tr>th {
    border-color: #c5c9cf;
}
.table-striped>tbody>tr:nth-of-type(odd), .table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
    background-color: #f4f5f6;
}

.table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th, .table-bordered>tfoot>tr>td, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>td, .table-bordered>thead>tr>th {
    font-weight: 700;
}

tbody, td, tfoot, th, thead, tr{
    border-color: #c5c9cf;
}

/*===== 3.  EXTRAS  =====*/

.empty-box{
    padding: 15px;
    background-color: #FFFFFF;
    border-radius: 5px;
    border:1px solid #c5c9cf;
}

.empty-box .head{
    padding: 10px 15px;
    margin: -15px -15px 15px -15px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    font-weight: 600;
    letter-spacing: .5px;
    font-size: 13px;
}

.empty-box .head.default{
    background-color: #c5c9cf;
    color: #727579;
}

.empty-box .head.primary{
    color: #FFFFFF;
}

.empty-box .head.secondary{
    color: #FFFFFF;
}

.empty-box .head.info{
    color: #FFFFFF;
    background-color: #1781ee;
}

/**/

.empty-box .head.tabs .tab{
    padding-right: 15px;
    margin-right: 15px;
    border-right: 1px solid rgba(255, 255, 255, .5);
    cursor: pointer;
    color: rgba(255, 255, 255, .5);
}

.empty-box .head.tabs .tab.active{
    color: #FFFFFF;
}


.empty-box .head.tabs .tab:last-child {
    border:none;
}

/**/

.empty-box .list-cover{
    margin:0 -15px;
}

.empty-box .list{
    padding: 5px 15px 4px 15px;
    margin: 3px 6px;
    border-radius: 5px;
}


@media (max-width: 991px){
    .empty-box .list .row div{
        margin: 5px 0;
    }

    .empty-box .list .row .col-md-1.text-end{
        position: absolute;
        right: 30px;
    }

}

.empty-box .list:nth-child(even) {
    background-color: #ebecf0;
}
/* TODO change standard grey color */

.empty-box .list:hover{
    background-color: #fb8b2e;
}

.empty-box .list .color{
    width: 24px;
    height: 24px;
    border-radius: 50%;
}

.empty-box .head .icon i,
.empty-box .list .icon i
{
    margin-right: 10px;
    opacity: .5;
    font-size: 12px;
}

.empty-box .dropup .dropdown-toggle::after{
    display: none;
}

.empty-box .btn-group-vertical>.btn,
.empty-box .btn-group>.btn {
    background-color: #fb8b2e;
    padding:3px 6px;
    text-align: center;
    border-radius: 50%;
    margin-right: 15px;
    margin-top: -1px;
    border: none;
    box-shadow: none;
    font-size: 11px;
}

.empty-box .btn-group-vertical>.btn i,
.empty-box .btn-group>.btn i{
    margin-right: 0;
}

.empty-box .btn-group-vertical>.btn:hover,
.empty-box .btn-group>.btn:hover{
    background-color: #f1760f;
}

.empty-box ul.dropdown-menu{
    padding: 0;
}

.empty-box ul.dropdown-menu li a{
    font-size: 13px;
    margin:0;
    padding: 8px 5px;
    color: #000000;
    display: block;
}

.empty-box ul.dropdown-menu li a:hover{
    background-color: #f1760f;
    color: #ffffff;
}

.empty-box ul.dropdown-menu li a i{
    margin: 0 10px;
    width: 12px;
    opacity: .8;
    font-size: 10px;
}