﻿:root {
    --theme-default: #8c1515;
    --theme-first: #1c76bc;
    --theme-second: #FFD365;
    --theme-third: #8c1515;
    --theme-modal: #8c1515;
}

.progress .determinate, .progress .indeterminate {
    background-color: #ff4081;
}


.select2-container--default .select2-selection--multiple .select2-selection__choice {
    white-space: break-spaces;
}

.history img.rounded-pill{
    width: 45px;
    height: 45px;
    object-fit: cover;
}

.modal {
    z-index: 1050 !important;
}

.modal .modal-body {
    background-color: #f0f0f5 !important;
}

.word-break-all {
    word-break: break-all;
    white-space:break-spaces;
}

form input.otp {
    display: inline-block;
    width: 40px;
    height: 40px;
    text-align: center;
}

.field-validation-error {
    color: #e82646;
}

.sp-line-1, .sp-line-2, .sp-line-3, .sp-line-4 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical
}

.image_preview_file{
    object-fit: contain;
}

.sp-line-1 {
    -webkit-line-clamp: 1
}

.sp-line-2 {
    -webkit-line-clamp: 2
}

.sp-line-3 {
    -webkit-line-clamp: 3
}

.sp-line-4 {
    -webkit-line-clamp: 4
}

.w-100px {
    width: 100px;
}

.w-150px {
    width: 150px;
}

.datepicker {
    z-index: 1061 !important;
}

.page-header {
    min-height: 30px;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: #2b74bd;
}

.has-float-label label, .has-float-label > span {
    color: var(--theme-third);
}

.card_upload_file {
    min-height: 150px;
}

.min-w-150 {
    min-width: 150px !important;
}

.min-w-200 {
    min-width: 200px !important;
}

.dataTables_processing {
    z-index: 11000 !important;
}

.dt-button-info {
    background: #0094ff !important;
}

    .dt-button-info h2 {
        background: #44cf9c !important;
    }

.table_custom_pading_1 td {
    padding: 6px;
}

td.details-control {
    background: url('https://www.datatables.net/examples/resources/details_open.png') no-repeat center center;
    cursor: pointer;
}

tr.shown td.details-control {
    background: url('https://www.datatables.net/examples/resources/details_close.png') no-repeat center center;
}

.fade2 {
    transform: scale(0.9);
    opacity: 0;
    -webkit-transition: all .25s linear;
    -o-transition: all .25s linear;
    transition: all .25s linear;
}

    .fade2.show {
        opacity: 1;
        transform: scale(1);
    }

.detail_content img, p, iframe {
    max-width: 100% !important;
}

.list-group li.active {
    background: #f3f7f9 !important;
}

.select2-container--default .select2-selection--single {
    border: 1px solid #ced4da !important;
}

.highlight_1 {
    background-image: linear-gradient(to right, #F27121cc, #E94057cc, #8A2387cc);
    border-radius: 6px;
    padding: 3px 6px;
}

.highlight_2 {
    background-image: linear-gradient(to right, #28a745, #57b50d, #9ee505);
    border-radius: 6px;
    padding: 3px 6px;
}

.highlight_3 {
    background-image: linear-gradient(to right, #e57a06, #F2DF3A, #fee19e);
    border-radius: 6px;
    padding: 3px 6px;
}

.breadcrumb-item.active {
    color: var(--theme-default) !important;
}

.breadcrumb-item .home:hover {
    color: var(--theme-third) !important;
}

.dropify-wrapper {
    border: 2px dashed #ced4da !important;
}

.dropzone {
    border: 2px dashed #ced4da !important;
}

.color-default {
    color: var(--theme-default);
}

.image_avatar_history {
    object-fit: cover;
    border: 2px solid var(--theme-default);
    margin-right: 0.375rem;
    height: 42px;
    width: 42px;
}

.thead_custom {
    color: #fff;
    background-color: var(--theme-first);
}

.tfoot_custom {
    color: #fff;
    background-color: var(--theme-first);
}

label {
    font-weight: 500;
}

input:read-only {
    background-color: #dee2e6 !important;
}

select:disabled {
    background-color: #dee2e6 !important;
}

.modal_header {
    background-color: var(--theme-modal);
    padding: 10px;
}

    .modal_header .modal-title {
        width: 100%;
        text-align: center;
        color: #fff;
    }

    .modal_header [data-dismiss] {
        color: #fff;
        opacity: 1;
    }

        .modal_header [data-dismiss]:hover {
            color: #FF0000;
        }

.tap-top {
    width: 38px;
    height: 38px;
    border-radius: 100%;
    position: fixed;
    bottom: 30px;
    right: 14px;
    z-index: 8;
    display: none;
    color: #fff;
    text-align: center;
    background: var(--theme-default);
    border: 0;
    font-size: 18px;
    padding: 6px;
    cursor: pointer;
}

.navbar_title {
    background-color: var(--theme-first);
    position: fixed;
    border-radius: 4px;
    top: -50px;
    width: 72%;
    display: block;
    transition: top 0.3s;
    z-index: 99;
}

@media only screen and (max-width: 991px) {
    .navbar_title {
        width: 100%;
    }
}

.card_background_detail {
    background: #d7f6ff;
}

.header_title {
    color: var(--theme-third);
}

.table_a_href {
    color: var(--theme-default);
}

    .table_a_href:hover {
        color: #44cf9c;
        font-weight: bold;
    }

.card-body {
    padding: 0.7rem;
}

/*style switch button*/
.custom-control-input-success:checked ~ .custom-control-label::before {
    background-color: #28a745 !important;
    border-color: #28a745 !important;
}

.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show > .nav-link {
    color: var(--theme-default);
}

.usr-disable {
    background-color: #EEEEEE !important;
}

.center {
    margin: auto;
    width: 70%;
    /*   border: 3px solid green;
    padding: 10px;*/
}

.usr-article-title {
    background-color: #209aa5 !important;
    color: #ffffff !important;
}

.usr-article-title-clear {
    background-color: #ffffff !important;
    color: #ff6a00 !important;
    border-bottom: 1px solid #ffd800;
}

.usr-article-title-clear2 {
    background-color: #ffffff !important;
    color: #ff6a00 !important;
    border-bottom: 0px solid #dee2e6;
}

.navbar-custom {
    background-color: var(--theme-default) !important; /*#3c4854 default*/
}

.usr-card {
    display: compact !important;
    width: 100% !important;
}

.usr-card-body {
    padding: 0px 0px 0px 0px !important;
}

.usr-card-body-lr5 {
    padding-top: 0px !important;
    padding-right: 5px !important;
    padding-bottom: 0px !important;
    padding-left: 5px !important;
}

.usr-card-body-lrt5 {
    padding-top: 5px !important;
    padding-right: 5px !important;
    padding-bottom: 0px !important;
    padding-left: 5px !important;
}

.usr-card-body-lr10 {
    padding-top: 0px !important;
    padding-right: 10px !important;
    padding-bottom: 0px !important;
    padding-left: 10px !important;
}

.usr-card-body-lrt10 {
    padding-top: 10px !important;
    padding-right: 10px !important;
    padding-bottom: 0px !important;
    padding-left: 10px !important;
}

.usr-col-padding-0 {
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}

.usr-col-padding-lr-0 {
    padding-left: 0px;
    padding-right: 0px;
}

.usr-col-padding-lr-5 {
    padding-left: 5px;
    padding-right: 5px;
}



span.add-data:hover {
    color: var(--theme-first) !important;
}

.nav-item a#def-a.active {
    background-color: #ffffff !important;
    color: var(--theme-default);
    border-bottom: 1px solid var(--theme-default);
    font-weight: normal;
}

/* Bỏ đi một đường kẻ của cell bên TRÁI*/
.table-bordered tr td.usr-th-border-l0, table-striped tr td .usr-th-border-l0 {
    border: 0px solid #dee2e6;
    border-top-color: rgb(222, 226, 230);
    border-top-style: solid;
    border-top-width: 1px;
    border-right-color: rgb(222, 226, 230);
    border-right-style: solid;
    border-right-width: 0px;
    border-bottom-color: rgb(222, 226, 230);
    border-bottom-style: solid;
    border-bottom-width: 1px;
    /*    border-left-color: rgb(222, 226, 230);
    border-left-style: solid;
    border-left-width: 0px;*/
    border-image-outset: 0;
    border-image-repeat: stretch;
    border-image-slice: 100%;
    border-image-source: none;
    border-image-width: 0;
    border-left-color: rgb(222, 226, 230);
    border-left-style: solid;
    border-left-width: 0px;
}

.usr-number {
    font-weight: bolder;
}

.usr-number-color-red {
    color: #ff0000;
}


/* ----------- Modal ------------- */
.usr-modal-header-add {
    background-color: #209aa5;
    color: #ffffff !important;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.usr-modal-header-del {
    background-color: #ff6a00;
    color: #ffffff;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.usr-modal-footer {
    padding-top: 0rem;
    padding-bottom: 0rem;
}

/* ----------- span ------------- */
.usr-span-color {
    color: #209aa5;
}



.select2-container {
    width: 100% !important;
}

.modal .select2-container {
    z-index: 1060;
}

.select2-results__option {
    color: #000;
}

.select2-results__group {
    font-weight: 700;
}

.select2-container--default .select2-selection--single {
    color: #8c1515 !important;
    background-color: transparent !important;
}

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        color: #8c1515 !important;
    }

.side-bar-height {
    height: 36px !important;
}