:root {
    --primary: #38b792;
    --primary-hover: #359e7f;
}

/* ----------------------------- */

.border-radius-50 {
    border-radius: 50%;
}

/* border upload  */
.border-upload {
    border: 2px dashed #bdbdbd;
    background-color: #f1f0ef;
    cursor: pointer;
    border-radius: 16px
}

.border-radius-16 {
    border-radius: 16px !important;
}

.border-radius-bottom {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}

/* select 2 border-radius */
.js-example-basic-single+.select2-container .select2-selection {
    border-radius: 16px;
}

.border-radius-left {
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
}

.border-radius-right {
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

.border-pills {
    border-radius: 15px;
}

.btn-pills {
    border-radius: 15px;
}

.text-primary {
    color: var(--primary) !important;
}

.text-warning {
    color: #dca84a !important;
}

.text-danger {
    color: #dc4a4a !important;
}

.bg-primary {
    background-color: var(--primary) !important;
}

.bg-blue {
    background-color: #008cff !important;
}

/* card */
.card {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #F8FAF9;
    background-clip: border-box;
    border: 0 solid rgba(0, 0, 0, 0.125);
    border-radius: 16px;
}

.widget-user .widget-user-header {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    height: 135px;
    padding: 1rem;
    text-align: center;
}

/* navbar background-color */
.navbar-light .navbar-nav .nav-link {
    color: #6a6a6a;
}

/* navbar:hover  */
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus {
    color: #3f3e3e;
}

/* navbar:active  */
.navbar-light .navbar-nav .show>.nav-link,
.navbar-light .navbar-nav .active>.nav-link,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .nav-link.active {
    color: #3f3e3e;
}

/* brand-link bakcground-color */
/* [class*="sidebar-light"] .brand-link,
[class*="sidebar-light"] .brand-link .pushmenu {
    background-color: #0d1028 !important;
    color: var(--primary);
} */

/*  brand-link:hover  */
/* [class*="sidebar-light"] .brand-link:hover,
[class*="sidebar-light"] .brand-link .pushmenu:hover {
    color: #53f7c5;
} */

/* brand-link not show border bottom  */
[class*="sidebar-light"] .brand-link {
    border-bottom: 1px solid #dee2e6;
}

/* aside > nav-pill rounded */
.nav-pills .nav-link {
    border-radius: 1.25rem !important;
}

/* checked background-color */
.custom-control-input:checked~.custom-control-label::before {
    background-color: var(--primary) !important;
    color: #F8FAF9 !important;
    border-color: var(--primary);
    box-shadow: none;
}

/* btn-primary custom */
.btn-primary {
    color: #fff;
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: none;
    font-weight: bold;
}

/* btn-primary:hover */
.btn-primary:hover {
    color: #fff !important;
    background-color: var(--primary-hover) !important;
    border-color: var(--primary-hover) !important;
}

/* btn-primary:focus */
.btn-primary:focus,
.btn-primary.focus {
    color: #fff;
    background-color: var(--primary-hover);
    border-color: var(--primary-hover);
    /* box-shadow: var(--primary-hover); */
}

/* btn-warning */
.btn-warning {
    color: #0d1028;
    background-color: #dca84a;
    box-shadow: none;
}

/* btn-warning:hover */
.btn-warning:hover {
    color: #0d1028;
    background-color: #dca94a88;
    border-color: #dca94ae1;
}

/* badge-primary */
.badge-primary {
    color: rgb(31 98 78) !important;
    background-color: rgb(74 220 177 / 29%) !important;
}

/* badge-danger */
.badge-danger {
    color: rgb(94 34 34);
    background-color: rgb(220 74 74 / 29%);
}

/* badge-warning */
.badge-warning {
    color: rgb(98 74 31);
    background-color: rgb(220 168 74 / 29%);
}

.alert-warning {
    color: rgb(98 74 31);
    background-color: rgb(220 168 74 / 29%);
    border-color: rgb(220 168 74);
}

/* form-control:focus border*/
.form-control:focus {
    color: #0d1028;
    background-color: #fff;
    border-color: var(--primary);
    outline: 0;
    box-shadow: inset 0 0 0 rgb(0 0 0 / 0%);
}

/* paginate-active */
.page-item.active .page-link {
    z-index: 3;
    color: #fff;
    background-color: var(--primary);
    border-color: var(--primary);
}

/* bredcrumb */
.breadcrumb {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    list-style: none;
    background-color: #0C102C;
    border-radius: 16px;
}

.material-textfield {
    position: relative;
}

.material-textfield>label {
    position: absolute;
    font-size: 1rem;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background-color: #F8FAF9;
    color: #797A7A;
    padding: 0 0.3rem;
    margin: 0 0.5rem;
    transition: .1s ease-out;
    transform-origin: left top;
    pointer-events: none;

}

.material-textfield>input {
    font-size: 1rem;
    outline: none;
    border: 1px solid #797A7A;
    border-radius: 16px;
    padding: 1rem 0.7rem;
    color: #797A7A;
    transition: 0.1s ease-out;
    background-color: #F8FAF9;
}

.material-textfield>input:focus {
    border-color: var(--primary);
}

.material-textfield>input:focus+label {
    color: var(--primary);
    top: 0;
    transform: translateY(-50%) scale(.9);
}

.material-textfield>input:not(:placeholder-shown)+label {
    top: 0;
    transform: translateY(-50%) scale(.9);
}

/* navbar dropdown */
.dropdown-item.active,
.dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: var(--primary);
}

/* header patient */
.info-box {
    /* box-shadow: 0 0 1px rgb(0 0 0 / 13%), 0 1px 3px rgb(0 0 0 / 20%); */
    box-shadow: unset;
    border-radius: 0.25rem;
    background-color: unset;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: unset;
    min-height: 80px;
    padding: 0.5rem;
    position: relative;
    width: 100%;
}

.info-box .info-box-number {
    display: block;
    margin-top: 0.25rem;
    font-weight: unset;
}

/* style select 2 */
.select2-container--bootstrap4 .select2-results__option--highlighted,
.select2-container--bootstrap4 .select2-results__option--highlighted.select2-results__option[aria-selected="true"] {
    color: #fff;
    background-color: var(--primary)
}

/* border */
.select2-container--bootstrap4.select2-container--focus .select2-selection {
    border-color: var(--primary);
    -webkit-box-shadow: var(--primary-hover);
    box-shadow: var(--primary-hover);
}

/* fix postion scroll consent */
.fixed-content {
    flex: 1;
    padding: 2rem;
    border: 1px solid #ddd;
    overflow-y: auto;
    border-right: unset;
    height: 600px;
}

.layout-fixed .brand-link {
    width: 230px;
}

/* placeholder loader boostrap 4 */
.placeholder {
    display: inline-block;
    min-height: 1em;
    vertical-align: middle;
    cursor: wait;
    background-color: currentColor;
    opacity: .5;
}

.placeholder-glow .placeholder {
    -webkit-animation: placeholder-glow 2s ease-in-out infinite;
    animation: placeholder-glow 2s ease-in-out infinite;
}

@keyframes placeholder-glow {
    0% {
        opacity: 0.5;
    }

    50% {
        opacity: 0.2;
    }

    100% {
        opacity: 0.5;
    }
}

@-webkit-keyframes placeholder-glow {
    0% {
        opacity: 0.5;
    }

    50% {
        opacity: 0.2;
    }

    100% {
        opacity: 0.5;
    }
}