/*
    ****************************
    1. General
    2. Table
    3. Aside Modal
    4. Form
    5. Card
    6. Custom Checkbox collapse
    7. Nav
    8. Custom Menu List
    9. Tab Pane
    10. Aside Menu
    11. Card
    12. Input group
    13. Form Control
    14. Loading
    15. Progress
    16. Color picker
    17. Calendar
    18. Content RGB
    19. Select 2
    20. Filter
    21. Datatables
*/
/*
    1. General
*/
body {
	font-size: 0.9rem;
}
h1, .h1 {
  font-size: 1.75rem;
}

h2, .h2 {
  font-size: 1.60rem;
}

h3, .h3 {
  font-size: 1.45rem;
}

h4, .h4 {
  font-size: 1.3rem;
}

h5, .h5 {
  font-size: 1.15rem;
}

h6, .h6 {
  font-size: 1rem;
}

.w-85{
    width:85%!important;
}

.dropdown-actions a i {
    font-size: .9rem;
    width: 18px;
    text-align: center;
}
.input-group i {
    width: 16px;
}

.loading-status::before {
    content: "";
    position: absolute;
    top: 9px;
    right: 15px;
    content: "\f1ce";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 0.9rem;
    background: transparent;
    z-index: 1;
    -webkit-animation: fa-spin 2s linear infinite;
    animation: fa-spin 2s linear infinite;
}

table.mceLayout, table.mceLayout iframe, textarea.form-control, textarea.tinyMCE {
    width: 100% !important;
    max-width: 100% !important;
}

.content-no-margin * {
    margin: 0 !important;
}
.content-no-padding * {
    padding: 0 !important;
}

@media only screen and (min-width: 1200px) {
    .border-right-xl {
        border-right: 1px solid #dee2e6!important;
    }
}

/*
    2. Table
*/

.table th {
    white-space: nowrap;
}
.table td {
    word-break: break-all;
}
.tb-max {
    width: auto;
    max-width:8.333333%;
}
.tb-col-1 {
    width:8.333333%;
    max-width:8.333333%;
}
.tb-col-2 {
    width:16.666667%;
    max-width:16.666667%;
}
.tb-col-3 {
    width:25%;
    max-width:25%;
}
.tb-col-4 {
    width:33.333333%;
    max-width:33.333333%;
}
.tb-col-5 {
    width:41.666667%;
    max-width:41.666667%;
}
.tb-col-6 {
    width:50%;
    max-width:50%;
}
.tb-col-7 {
    width:58.333333%;
    max-width:58.333333%;
}
.tb-col-8 {
    width:66.666667%;
    max-width:66.666667%;
}
.tb-col-9 {
    width:75%;
    max-width:75%;
}
.tb-col-10 {
    width:83.333333%;
    max-width:83.333333%;
}
.tb-col-11 {
    width:91.666667%;
    max-width:91.666667%;
}
.tb-col-12 {
    width:100%;
    max-width:100%;
}

@media only screen and (max-width: 767px) {
    .table td {
        white-space: nowrap;
    }
}

/*
    3. Aside Modal
*/
.modal .modal-dialog-aside {
    width: 350px;
    max-width: 80%;
    height: 100%;
    margin: 0;
    transform: translate(0);
    transition: transform .2s;
}


.modal .modal-dialog-aside .modal-content {
    height: inherit;
    border: 0;
    border-radius: 0;
}

.modal .modal-dialog-aside .modal-content .modal-body {
    overflow-y: auto
}

.modal.fixed-left .modal-dialog-aside {
    margin-left: auto;
    transform: translateX(100%);
}

.modal.show .modal-dialog-aside {
    transform: translateX(0);
}


/*
    4. Form
*/
div.input>label:not(.form-check-label):not(.custom-file-label) {
    position: absolute;
    top: -11px;
    left: 1.25rem;
    background: #fff;
    padding: 0 5px;
    font-size: 0.9rem;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    z-index: 1;
}

.form-group {
    margin-bottom: 1.5rem;
}

.custom-file {
    position: initial;
}
.custom-file .custom-file-label {
    left: 7.5px;
    right: 7.5px;
    padding-top: .575em;
    white-space: nowrap;
    overflow: hidden;
}
.custom-file .custom-file-label::after {
    content: "\f093";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}
.custom-file .custom-file-label.is-invalid {
    border-color: #dc3545;
}

/*
    5. Card
*/
.card .card-title {
    font-size: 1rem;
}
.card .card-header>.card-title>i {
    font-size: .9rem;
}
.card-custom-tabs {
    box-shadow: none;
    margin-bottom: 0;
}

.card .card-header .btn-tool.btn-tool-dark {
    color: #212529;
}
.card .card-header .btn-tool.btn-tool-dark:hover {
    color: #495057;
}


/*
    6. Custom Checkbox collapse
*/
.cs-collapse .cs-collapse-checkbox {
    margin: 0 0px 2px 6px;
    padding: 5px 0 5px 13px;
    border-left: 2px solid #0e76a8;
}
.cs-collapse .cs-collapse-checkbox > div:first-child {
    padding-top: 5px;
}

/*
    7. Nav
*/
.user-panel .info {
    padding: 5px 10px;
    transition: margin-left .3s linear,opacity .3s ease,visibility .3s ease;
}

/*
    8. Custom Menu List
*/
.content-menu-treeview .list-group-item {
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 0;
    margin-bottom: 5px;
    padding: .25rem 5px;
}
.content-menu-treeview .list-group-item.has-children:hover {
    cursor: pointer;
}
.content-menu-treeview .list-group-item:hover {
    border: 1px solid rgba(0,0,0,.225);
}
.content-menu-treeview .list-group-item:focus,
.content-menu-treeview .list-group-item:hover,
.content-menu-treeview .list-group-item.has-children:not(.collapsed) {
    color: #495057;
    text-decoration: none;
    background-color: #f8f9fa;
}
.content-menu-treeview .item-collapse {
    margin-left: 1.25rem;
}
.content-menu-treeview .item-label i {
    width: 25px;
    line-height: 1.5;
    text-align: center;
    margin-left: -5px;
    transition: -webkit-transform ease-in-out .3s;
    transition: transform ease-in-out .3s;
    transition: transform ease-in-out .3s,-webkit-transform ease-in-out .3s;
}
.content-menu-treeview .list-group-item.has-children:not(.collapsed) .item-label i {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}
.error-message {
    color: #dc3545 !important;
}

/*
    9. Tab Pane
*/

.content-tab-pane-clone .content-clone + .content-clone {
    border-top: 1px solid rgba(0,0,0,.125);
    margin-top: 1.5rem;
    padding-top: 1.75em;
}
/* .content-tab-pane-clone .content-clone:first {
    border-top: none;
    padding-top: 0;
}
.card-content-cards .content-tab-pane-clone .content-clone:last-of-type > div:last-of-type  {
    margin-bottom: 0;
} */

/*
    10. Aside Menu
*/
aside.main-sidebar,
aside.main-sidebar>div {
    overflow: hidden;
}

/*
    11. Card
*/
@media only screen and (max-width: 1199px) {
    .card-content-cards {
        background-color: transparent !important;
    }
}
@media only screen and (min-width: 768px) {
    .card-content-cards .card {
        border: none !important;
        box-shadow: none !important;
    }
}
@media only screen and (max-width: 767px) {
    .card-content-cards {
        border: none !important;
        box-shadow: none !important;
    }
}

/*
    12. Input group
*/

.input-group>.form-control:focus {
    z-index: unset;
}

.content-input-groups div:first-of-type .input-group input {
    border-bottom-left-radius: 0;
}
.content-input-groups div:first-of-type .input-group button {
    border-bottom-right-radius: 0;
}
.content-input-groups div:last-of-type .input-group input {
    border-top: none;
    border-top-left-radius: 0;
}
.content-input-groups div:last-of-type .input-group button {
    border-top: none;
    border-top-right-radius: 0;
}

.input-group input.form-control-sm + .input-group-append button {
    padding: 0 10px;
}

/*
    13. Form Control
*/

select.form-control.is-invalid,
.was-validated select.form-control:invalid {
    background-position: right calc(1em + .1875rem) center;
}

/*
    14. Loading
*/

.content-loading {
    cursor: wait;
    position: relative;
}
.content-loading::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #000;
    opacity: .05;
    z-index: 3;
    transition-duration: 1s;
}
.content-ajax-index.content-loading::before {
    top: -1.25rem;
    left: -1.25rem;
    right: -1.25rem;
    bottom: -1.25rem;
}

/*
    15. Progress
*/
.content-progress {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background: #28a745;
    display: block;
    height: 5px;
    text-align: center;
    transition: width .3s;
    width: 1%;
}

/*
    16. Color picker
*/
.content-color-item {
    margin-left: 5px;
    width: 15px;
    height: 15px;
    display: inline-block;
    border-radius: 8px;
    margin-bottom: -3px;
}

/*
    17. Calendar
*/

#content-full-calendar {
    margin-top: 0;
}
#content-full-calendar .fc-header-toolbar {
    padding: 0;
}
#content-full-calendar .fc-event {
    padding: 0 5px;
    /* border: 1px solid transparent; */
}

@media only screen and (max-width: 380px) {
    #content-full-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type {
        text-align: center;
    }
    #content-full-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type > .fc-button-group {
        display: block;
        margin-top: 5px;
        margin-left: 0;
    }
}

/*
    18. Content RGB
*/
.content-rgb {
    color: #FFF;
    border: 1px solid transparent;
    padding: 0 5px;
}
.content-rgb.rgb-light {
    color: #000;
    border-color: #000;;
}

.content-rgb-item {
    width: 15px;
    height: 15px;
    border-radius: 3em;
    float: left;
    margin-top: 3.75px;
    margin-right: 5px;
}

/*
    19. Select 2
*/

.select2-container--bootstrap4 .select2-selection--multiple {
    min-height: calc(2.25rem + 2px);
}

.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__rendered {
    padding: 0 .275rem;
}

.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
    margin-top: calc(.375rem - 0px);
}

.select2-container .select2-selection__rendered .select2-search--inline:first-of-type > .select2-search__field {
    width: 100% !important;
    font-size: 1rem;
    margin-top: 0;
    padding: 0.375rem .75rem 0;
    font-weight: 400;
    line-height: 1.5;
    font-family: inherit;
}

.select2-container--bootstrap4 .select2-selection__clear {
    padding-left: .20em;
    line-height: .9em;
}
.div-select2 div.input label {
    top: -16px !important;
}

/*
    20. Filter
*/
.content-count-filters {
    position: absolute !important;
    top: -2px !important;
    left: -2px;
}

/*
    21. Datatables
*/
table.table-bordered.dataTable {
    width: 100% !important;
}
div.dataTables_wrapper div.dataTables_info {
    padding-top: 0;
}
div.dataTables_wrapper div.dataTables_processing {
    z-index: 1001;
}
div.dataTables_wrapper div.dataTables_filter {
    text-align: left;
}