/**{
    margin: 0;
    padding: 0;
}*/
#htmlTableau {
    text-align: center;
}

tableau-viz {
    display: block !important;
}

.page-item.active .page-link {
    z-index: 3;
    color: #fff;
    background-color: #AF1FBA;
    border-color: #AF1FBA;
}

div.dataTables_wrapper div.dataTables_filter input {
    margin-left: 0.5em;
    display: inline-block;
    width: 300px;
    height: 40px;
    border-radius: 20px;
}

.page-link {
    position: relative;
    display: block;
    padding: 0.5rem 0.75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #000;
    background-color: #fff;
    border: 1px solid #dddfeb;
}

.multiselect-container {
    width: 100% !important;
}

body {
    font-family: db_helvethaica_mon_x,sans-serif;
}

.font-system {
    font-family: db_helvethaica_mon_x,sans-serif;
}

@font-face {
    font-family: 'db_helvethaica_mon_x';
    src: url('../front/db helvethaica X v3.2.ttf') format('truetype');
}
@font-face {
    font-family: 'db_helvethaica_mon_x';
    src: url('../front/DB HelvethaicaMon X v3.2.ttf') format('truetype');
}

.font-menu {
    font-size: 26px !important;
}

.font-header {
    font-size: 41px !important;
    font-weight: bold;
}

.font-content {
    font-size: 35px !important;
}

.font-header-user {
    font-size: 37px !important;
    font-weight: bold;
}

.font-layout {
    font-size: 26px;
    color: #000;
    line-height: 0.5;
}

.font-login-header {
    font-size: 46px;
    font-weight: bold;
    color: black;
}


.font-login-sub-header {
    font-size: 36px;
    font-weight: bold;
    color: black;
}

input[type=file]::file-selector-button {
    margin: 0 20px;
    border: none;
    background: #c7d6e3;
    padding: 1px 10px;
    border-radius: 10px;
    color: #fff;
    cursor: pointer;
    transition: background .2s ease-in-out;
}

    input[type=file]::file-selector-button:hover {
        background: #0d45a5;
    }

.drop-container {
    border-radius: 10px;
    padding: 10px;
    border: 2px dashed #555;
}

.form-control {
    color: #000000;
}

input.form-control {
    font-size: 35px;
}

.spinner-border {
    display: inline-block;
    width: 4rem;
    height: 4rem;
    vertical-align: text-bottom;
    border: 0.5em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: .75s linear infinite spinner-border;
    animation: .75s linear infinite spinner-border;
}

.model-spinner {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    text-align: center;
    background-color: rgb(242,246,249);
    z-index: 9;
}

    .model-spinner > .loader, .model-spinner-tableau > .loader, .model-spinner > .spinner-border, .model-spinner-tableau > .spinner-border {
        position: absolute;
        bottom: 0;
        top: 0;
        margin: auto;
    }

.model-spinner-tableau {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    text-align: center;
    background-color: rgb(242,246,249);
    z-index: 8;
}

/*-------------------------------------------------------------------*/
.img-thumbnail {
    border-radius: 2.35rem;
}

.modal-content {
    background-color: transparent;
    border: none;
}

.img-spiner-load {
    width: 10%;
    height: 10%;
}

.bg-light {
    background-color: #fff !important;
}

.btn-light {
    border: 1px solid;
}

.btn-cancel {
    position: absolute;
    bottom: 50px;
    margin-right: 200px !important;
    width: 134.34px !important;
    color: black !important;
    background-color: #E9EFF4 !important;
    border-radius: 30px !important;
    height: 53.37px !important;
    font-size: 28px;
}

.btn-cancel-edit {
    margin-right: 10px !important;
    width: 150.13px !important;
    color: white !important;
    background-color: #676C6F !important;
    border-radius: 30px !important;
    height: 53.38px !important;
    font-size: 28px;
}

.btn-close {
    margin-right: 20px !important;
    width: 134.3px !important;
    height: 53.38px !important;
    color: #000 !important;
    background-color: #E9EFF4 !important;
    border-radius: 30px !important;
    font-size: 26px;
}

.btn-reset {
    position: absolute;
    bottom: 50px;
    width: 134.34px !important;
    color: white !important;
    background-color: #AF1FBA !important;
    border-radius: 30px !important;
    height: 53.37px !important;
    font-size: 28px;
    margin-right: 50px !important;
}

.btn-save {
    width: 150.13px !important;
    height: 53.38px !important;
    color: white !important;
    background-color: #AF1FBA !important;
    border-radius: 30px !important;
    font-size: 26px;
}

.btn-save-secondary {
    width: 134.3px !important;
    height: 53.38px !important;
    color: white !important;
    background-color: #808285 !important;
    border-radius: 30px !important;
    font-size: 26px;
}

.btn-register {
    margin-left: 10px !important;
    width: 15% !important;
    color: white !important;
    background-color: #AF1FBA !important;
    border-radius: 30px !important;
    font-size: 26px;
}

.btn-submit {
    /*width: 15% !important;*/
    background: #AF1FBA;
    color: white !important;
    border-radius: 20px;
    padding: 5px 25px;
    width: 161px;
    height: 40px;
    font-size: 16px;
}

.btn-black {
    color: white !important;
    background-color: #F1408A !important;
    border-radius: 20px !important;
    display: flex;
    align-items: center;
    width: 221.54px;
    height: 49.34px;
    font-size: 28px;
    justify-content: center;
}

.btn-report {
    max-width: 100%;
    background-color: transparent;
}

.fullscreen-block {
    background: #f2f6f9 no-repeat;
    background-size: cover;
    position: relative;
}

.fullscreen-block-user {
    background: #f2f6f9 no-repeat;
    background-size: cover;
    position: relative;
}

.fullscreen-block-100 {
    background: #f2f6f9 no-repeat;
    background-size: cover;
}

.bg-light {
    background-color: #fff !important;
}

.modal-content-forget {
    height: 587.6px;
    background-color: #fff;
    border: none;
}

.modal-header {
    border-bottom: 0px none;
    padding-bottom: 0px;
}

.modal-body {
    padding-top: 0px;
}

.modal-footer {
    border-top: 0px none;
}
/*------------------------- Layout User --------------------------------*/
.topnav {
    /*overflow: hidden;*/
    background-color: #fff;
    /*    color: aquamarine;
    width: 100%;
    min-height: 100vh;*/
}

.nav-user {
    font-family: 'db_helvethaica_mon_x',sans-serif !important;
    max-width: 100%;
    height: 80px;
    padding: 2%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    border-bottom: 0.5px solid #dcdede;
}

.user-pic {
    width: 35px;
    border-radius: 50%;
    cursor: pointer;
    margin-left: 30px;
}

.submenu-pic {
    width: 25px;
    border-radius: 50%;
    margin-right: 15px;
}

.nav-user > ul {
    list-style: none;
    width: 100%;
    text-align: right;
}

.nav-user > ul li {
    display: inline-grid;
    margin: 30px 10px 10px 10px;
    justify-items: end;
}

.nav-user > ul li a {
    color: #AF1FBA;
    text-decoration: none;
    padding-right: 15px;
    border-right: 2.5px solid #000;
}

.nav-user > .submenu-wrapper {
    position: absolute;
    top: 100%;
    z-index: 9;
    right: 1%;
    width: 348.93px;
    max-height: 0px;
    overflow: hidden;
    transition: max-height 0.5s;
}

.submenu-wrapper.openMenu {
    max-height: 400px;
}

.submenu {
    background-color: #fff;
    padding: 1.2rem;
    margin: 10px;
    border-radius: 15px;
    border: 0.1px solid #00000029;
}

.user-info {
    display: flex;
    align-items: center;
}

/*    .user-info h4 {
        font-weight: bold;
        font-size: 20px;
        margin: 0;
        color: #000;
    }*/

.user-info-submenu-name {
    display: grid;
}

.submenu hr {
    border: 0;
    height: 1px;
    width: 100%;
    margin: 15px 0 10px;
    background-color: #ccc;
}

.submenu-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #AF1FBA;
    margin: 0;
}

    .submenu-link p {
        margin: 0;
        transition: 0.5s;
    }
    /*.submenu-link span{
    font-size: 22px;
    color: #333;
    transition: 0.5s;
}
.submenu-link:hover span{
    font-weight: 600;
}*/
    .submenu-link:hover p {
        transform: translateX(5px);
    }

.container-header-user {
    width: 500px;
}

.header-reports {
    text-align: center;
    color: #63b461;
}

.sub-header-reports {
    text-align: center;
    color: black;
    font-size: 36px;
}

hr.line-header {
    border: 1px solid #63b461;
    width: 50%;
}

hr.line-end {
    border: 3px solid #63b461;
    width: 50%;
}

.button-group-user {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row;
}

hr.line-group-user {
    position: relative;
}

.grid-container {
    display: grid;
    grid: 150px / auto auto auto;
    column-gap: 20px;
    row-gap: 20px;
    justify-items: center;
    padding: 10px;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}

.float-label-wrapper {
    position: relative;
}

    .float-label-wrapper > .header-reports {
        position: absolute;
        z-index: 9;
        top: -14px;
        left: 42%;
        font-size: 18px;
        background-color: #f1f1f1;
        padding-left: 4px;
        padding-right: 4px;
    }

.btn-group-user {
    color: black;
    background-color: #E9EFF4 !important;
    /*    border-color: #E9EFF4 !important;*/
    width: 175px;
    height: 40px;
    border-radius: 25px;
    font-size: 16px;
    padding: 0;
    font-weight: bold;
    margin-bottom: 5px;
    white-space: nowrap;
    overflow: hidden;
}

.btn-group-user:hover {
    color: #ffffff;
    background-image: linear-gradient(to right, #EE1973, #7000BB);
    /*        border-color: #ffffff;*/
}    

    .btn-group-user:focus {
        color: #3a3b45;
        background-color: #5FB045;
        /*        border-color: #d4daed;*/
        box-shadow: 0 0 0 0.2rem rgba(220,221,225,.5);
    }

.btn-group-user-active {
    color: white !important;
    background-image: linear-gradient(to right, #EE1973, #7000BB) !important;
    /*    border-color: #ffffff;*/
    width: 175px;
    height: 40px;
    border-radius: 25px;
}


.btn-report-user {
    width: 330px;
    height: 250px;
}

.openbtn-left {
    position: absolute;
    z-index: 999;
    top: 50vh;
    left: 130px;
    border: none;
    font-size: 150%;
    color: #000;
    background-color: #fff0;
}

.openbtn-right {
    position: absolute;
    z-index: 999;
    top: 50vh;
    left: 0;
    border: none;
    font-size: 150%;
    color: #000;
    background-color: #fff0;
}


/*------------------------- Layout ------------------------------------*/
.bg-gradient-primary {
    background-color: #fff;
    background-image: linear-gradient(180deg,#fff 10%,#fff 100%);
    background-size: cover;
}

.shadow {
    box-shadow: 0 0 0 0;
    border-bottom: 5px;
}

#wrapper #content-wrapper #content {
    flex: 1 0 auto;
    background-color: #fff !important;
}

#wrapper #content-wrapper {
    overflow-x: unset;
}

.img-layout {
    width: 170px;
    height: 80px;
    margin: 0 auto;
}

.sidebar, .sidebar .nav-item .nav-link {
    width: max-content !important;
    margin-left: 5px !important;
}

.sidebar-dark .nav-item .nav-link {
    color: #000;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.sidebar-dark .nav-item.active .nav-link {
    color: gray !important;
    background-color: #e9eff4;
    font-size: 14px;
    border-radius: 25px;
    width: 100% !important;
}

.sidebar-dark .nav-item .nav-link i {
    color: #000;
    font-size: 14px;
}

.sidebar-dark .nav-item .nav-link:hover i {
    color: gray;
    font-size: 14px;
}

.sidebar-dark .nav-item.active .nav-link i {
    color: gray;
    font-size: 14px;
}

.nav-link:hover {
    color: gray !important;
    font-size: 14px;
}

span.layout_circle {
    position: relative;
    background-color: #e9eff4;
    font-size: 46px;
    padding: 2.2rem;
    border-radius: 100%;
    font-weight: bold;
    cursor: pointer;
}
span.U {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: auto;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
}

.view-page {
    width: 100%;
    /*font-weight: bold;*/
    color: #000;
}
/*------------------------ Login -------------------------------------*/
.login-bg {
    background-image: url('../img/bg-login.svg');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    height: 100vh;
}

#card-login {
    border-radius: 25px;
}

.img-logo {
    width: 418.42px;
    height: auto;
}

.login-header {
    text-transform: uppercase;
    font-size: 32px;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    color: black !important;
}

.form-control:focus {
    border-color: #AF1FBA;
    box-shadow: 0 0 0 0.2rem rgb(177 69 175 / 25%);
}

.input-group > .form-control:focus {
    background-color: #fff;
    border-left-color: #AF1FBA;
    border-top-color: #AF1FBA;
    border-bottom-color: #AF1FBA;
    border-right: none;
    outline: 0;
    box-shadow: none;
}

    .input-group > .form-control:focus + .input-group-append > .input-group-text, .input-group > .form-control:focus + span + .input-group-append > .input-group-text {
        background-color: #fff;
        border-left-color: #AF1FBA;
        border-top-color: #AF1FBA;
        border-bottom-color: #AF1FBA;
        outline: 0;
        box-shadow: none;
    }

.input-group:has(.form-control:focus) {
    border-radius: 0.5rem;
    box-shadow: 0 0 0 0.2rem rgb(177 69 175 / 25%);
}

form.user .form-control-user {
    border-radius: 0.5rem;
    font-size: 30px;
    background-color: white;
}

form.user .input-group > .form-control-user {
    border-right: none;
    height: 74.78px;
}

form.user .input-group > .form-readonly {
    border-right: 1px solid #d1d3e2 !important;
    border-top-right-radius: 0.5rem !important;
    border-bottom-right-radius: 0.5rem !important;
}

.user .input-group-text {
    background-color: transparent;
    border-left: none;
}

.btn-login {
    /*background-color: #B8BBB2;*/
    background-image: linear-gradient(to right, #EE1973, #7000BB) !important;
    border-radius: 2rem;
    height: 74.87px !important;
    font-size: 47px;
    color: white;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-direction: column-reverse;
}

.text-black {
    color: black !important;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

#eye-password {
    cursor: pointer;
}

.float-label-wrapper {
    position: relative;
}

    .input-group > .float-label, .float-label-wrapper > .float-label {
        position: absolute;
        z-index: 9;
        top: -21px !important;
        left: 13px;
        font-size: 28px;
        background-color: #ffffff !important;
        padding-left: 5px;
        padding-right: 5px;
        height: 28px;
    }

.pull-right {
    color: #AF1FBA;
    font-size: 30px;
    text-decoration: underline;
    cursor: default;
}

.modal-forget {
    text-align: center;
    width: 928px !important;
}
/*---------------my profile-------------------*/
.icon-email {
    padding-right: 10px !important;
}

.pf-username{
    font-size: 26px;
}

.pf-username > b {
    color: #000;
    margin-bottom: 0px;
    margin-top: 0px;
}

.rounded {
    border-radius: 6rem !important;
    border: 5px solid;
}

.pf-content {
    margin: 10px;
    margin-bottom: 0px;
}

.pf-row {
    min-height: 30px;
    height: auto;
}

.btn-circle:hover i {
    transform: translateX(1.5px);
}

.p-profile {
    color: #787876;
    font-size: 27px;
    margin: 0 !important
}

.p-texr-profile {
    font-size: 27px;
    color: #000;
    margin: 0 !important
}

.ml-3.w-100 {
    font-size: 20px;
}

.circle {
    position: relative;
    background-color: #e9eff4;
    font-size: 70px;
    padding: 0rem 2.7rem;
    border-radius: 100%;
    font-weight: bold;
}
.rounded-u {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center;
}
/*----------------Customer Group-------------------*/
/*.float-label-wrapper{
    position: relative;
}*/
/*.input-group > .float-label, .float-label-wrapper > .float-label{
    position: absolute;
    z-index: 9;
    top: -11px;
    left: 13px;
    font-size: 14px;
    background-color: #fff;
    padding-left: 5px;
    padding-right: 5px;
}*/
.h2-mcg {
    padding-left: 60px;
    color: #000;
}

.form-control-gn {
    padding: 2.3rem 1rem;
    border-radius: 1rem !important;
    font-size: 35px;
}

.c-mcg {
    margin-left: 50px;
}

.p-mcg {
    padding: 10px 0px;
}

.btn-update {
    background-color: #AF1FBA;
    border-radius: 30px;
    padding: 5px 25px;
    color: white;
    width: 200px;
    height: 49.74px;
    font-size: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn-update-tableau-sheet {
    background-color: #AF1FBA;
    border-radius: 30px;
    padding: 5px 25px;
    color: white;
    width: 260px;
    height: 49.74px;
    font-size: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.a-add {
    background-color: #AF1FBA;
    border-radius: 30px;
    padding: 5px 25px;
    color: white;
    width: 158.22px;
    height: 49.74px;
    font-size: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.a-add:hover {
    color: #fff;
    text-decoration: none;
}

.btn-light:hover {
    color: #3a3b45;
    background-color: #5FB045;
    border-color: #d4daed;
}

.btn-light:focus {
    color: #3a3b45;
    background-color: #5FB045;
    border-color: #d4daed;
    box-shadow: 0 0 0 0.2rem rgba(220,221,225,.5);
}
/*-------------------home-------------------------*/
.p-home {
    padding-top: 1%;
    width: 33%;
    font-weight: 600;
}

.f-home {
    margin: 0px 1%;
    border-radius: 20px
}

.a-home {
    color: #5fb045;
    font-size: 40px;
    margin-right: 10%;
}

.r-btn-re-admin {
    padding: 1% 0 3% 0;
    background-color: #F2F6F9;
}

.img-report-admin {
    border-radius: 40px;
    /*width: 100%;*/
    width: 331px;
    max-width: 95%;
    height: 270px;
    margin: auto;
    border: 1px solid #dcdede;
}

.btn-group {
    width: 100%;
    justify-content: center;
    font-weight: 700;
    border-radius: 20px;
}

.text-report-admin {
    margin: auto;
    text-align: center;
    font-size: 26px;
}

.pu-user {
    padding-left: 0 !important;
    height: 15px !important;
}
/*-------------------table------------------*/
.table {
    color: #000;
    background-color: white;
    font-size: 23px;
}

.table-responsive {
    font-size: 27px;
}

td, th {
    border-bottom: 0.5px solid #f2f6f9;
}

.btn-edit {
    border: 0.5px solid #000;
    border-radius: 9px;
    padding: 9px;
    display: inline-grid;
    align-items: center;
}

.btn-eyeview {
    border: 0.5px solid #000;
    border-radius: 9px;
    padding: 9px;
    display: inline-grid;
    align-items: center;
}

.btn-del-enabled {
    border: 0.5px solid #000;
    border-radius: 9px;
    padding: 9px;
    display: inline-grid;
    align-items: center;
}

.btn-del-disabled {
    border: 0.5px solid #000;
    border-radius: 9px;
    padding: 9px;
    display: inline-grid;
    align-items: center;
}

.btn-delete {
    border: 0.5px solid #000;
    border-radius: 9px;
    padding: 9px;
    display: inline-grid;
    align-items: center;
}

.btn-manageReport {
    border: 0.5px solid #000;
    border-radius: 9px;
    padding: 9px;
    display: inline-grid;
    align-items: center;
}

i.fa.fa-times {
    width: 18px;
}

input.form-control.form-control-sm {
    width: 500px !important;
    max-width: 100%;
}
/*----------------------spinner--------------------*/
.text-success {
    color: rgb(124,252,0) !important;
}

.spiner-loader {
    border: 8px solid;
    border-radius: 50%;
    /* border-top: 8px solid #5FB045;
    border-bottom: 8px solid #5FB045;*/
    border-left: 8px solid #66FF33;
    width: 70px;
    height: 70px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/*------------------swal-----------------------*/

button.swal2-confirm.swal2-styled.swal2-default-outline {
    color: #fff;
    border-radius: 20px;
    width: 134.3px;
    height: 53.37px;
    font-size: 28px;
    display: flex !important;
    justify-content: center;
    align-items: center;
}

button.swal2-cancel.swal2-styled.swal2-default-outline {
    border-radius: 20px;
    width: 134.3px;
    height: 53.37px;
    font-size: 28px;
    display: flex !important;
    justify-content: center;
    align-items: center;
    
}

.swal2-actions {
    display: flex;
    flex-wrap: nowrap;
}

pre {
    font-family: db_helvethaica_mon_x,sans-serif !important;
    font-size: 28px;
}
.swal2-title {
    font-family: db_helvethaica_mon_x,sans-serif !important;
    font-size: 30px;
    color: black;
}
/*----------------------ChangePassword---------------------------*/
.arrow-password {
    display: flex;
    justify-items: center;
    color: #000;
    font-size: 26px !important;
    align-items: baseline;
}

.fa-arrow-left {
    padding: 10px;
}

.arrow-password:hover {
    color: #000;
    text-decoration: none;
}

/*--------------------------------manageReport-------------------------*/
.text-header-report {
    color: #000;
    font-size: 22px;
}

/*---------------------------------form--------------------------------*/
.multiselect.dropdown-toggle.form-control {
    padding: 1.5rem 1rem;
    text-align: center;
    align-items: center;
    display: inline-flex;
    justify-content: center;
    font-size: 35px;
    border-radius: 20px;
}

.select-height {
    min-height: 50px;
    font-size: 35px;
    border-radius: 20px;
}

.multiselect-container.dropdown-menu.show {
    font-size: 25px;
}

@media screen and (min-width: 576px) {
/*    .btn-report {
        height: 195px;
    }*/

    .img-thumbnail {
        border-radius: 1.35rem;
    }
}

@media screen and (min-width: 768px) {
/*    .btn-report {
        height: 280px;
    }*/

    .img-thumbnail {
        border-radius: 2.35rem;
    }
}

@media screen and (min-width: 992px) {
/*    .btn-report {
        height: 340px;
    }*/

    .img-thumbnail {
        border-radius: 2.35rem;
    }
}

@media screen and (min-width: 1200px) {
/*    .btn-report {
        height: 445px;
    }*/

    .img-thumbnail {
        border-radius: 2.35rem;
    }
}

/*----------------------spinner--------------------*/
.custom-loader {
    width: 302.43px;
    height: 28.22px;
    border-radius: 20px;
    color: white;
    border: 2px solid;
    position: relative;
}

    .custom-loader::before {
        content: "";
        position: absolute;
        margin: 2px;
        inset: 0 100% 0 0;
        border-radius: inherit;
        background: linear-gradient(45deg, #00C6BC, #41C898,#A6CC62,#E6CF40,#FFD033,#FEC837,#FCB343,#F89258,#F46374,#F1408A,#CA2CA6,#AF1FBA);
        animation: p6 2s infinite;
    }

@keyframes p6 {
    100% {
        inset: 0
    }
}

.text-loader {
    font-size: 30px;
    margin: 0;
    color: white;
}

.loader {
    display: inline-grid;
    width: 302.22px;
    height: 4rem;
    justify-items: center;
}

.text-forget {
    font-size: 28px;
}

.form-forget {
    margin: 50px;
}

.img-header-logo {
    margin: 35px 0;
}

.input-group-text {
    font-size: 1.5rem !important;
}

.change-password-text {
    font-size: 22px;
    font-family: db_helvethaica_mon_x,sans-serif;
    width: 588px;
}
.card-change-password {
    width: 892.92px;
}
.form-group{
    margin-bottom:2rem !important;
}
/*.float-label-wrapper > .float-input {
    background-color: #f8f9fc !important;
}*/
.swal-wide-mail {
    width: 690px !important;
}
.swal-wide-lock {
    width: 595px !important;
}
.custom-select-sm {
    width: 79.5px !important;
    height: 36.94px;
    font-size: 20px;
}
.card-profile {
    width: 892.92px;
}

.submenu-name {
    font-size: 27px;
    color: #000;
    font-weight: bold;
    line-height: 1 !important;
}
.submenu-rolename {
    font-size: 21px;
    line-height: 1 !important;
}
.submenu-email {
    font-size: 21px;
    color: #000;
    line-height: 1 !important;
}
.submenu-company {
    font-size: 21px;
    color: #000;
}
.submenu-link-login {
    float: inline-end;
}

.float-label-wrapper > .float-input {
    top: -3px !important;
    background-color: #f8f9fc00 !important;
    font-size: 23px !important;
}

.btn-login-disable {
    background-color: #B8BBB2 !important;
    background-image: none !important;
}

/*.btn:hover {
    color: #fff !important;
}*/

.js-overflow {
    width: 175px;
    white-space: nowrap;
    overflow: hidden;
}

.has-overflow:after {
    content: "..."
}

button.next-btn {
    border-radius: 25px;
    padding: 0px 14px;
    font-size: x-large;
    border: 1px solid;
}

button.prev-btn {
    border-radius: 25px;
    padding: 0px 14px;
    font-size: x-large;
    border: 1px solid;
}

.owl-item {
    text-align: center !important;
}

button.next-btn, button.prev-btn {
    background-color: white;
    border: 1px solid;
    padding: 0px 14px;
    border-radius: 25px;
    font-size: x-large;
    font-weight: 600;
}

.owl-theme .owl-nav .disabled,
button.disabled {
	opacity: 0.6;
}

.btn-wrap {
    text-align: center;
}

button.next-btn:hover, button.prev-btn:hover {
    background-color: #AF1FBA;
    color: white;
}

#accordionSidebar {
    z-index: 999;
    position: sticky;
}

.owl-carousel.owl-loaded {
    display: inline-grid !important;
}

.select-report {
    margin-left: 25px;
}

#fixednav {
    font-family: 'db_helvethaica_mon_x',sans-serif !important;
}


.tooltip-container, .tooltip-container-firstname, .tooltip-container-email {
    position: relative;
}

.tooltip-container .tooltip-text,
.tooltip-container-firstname .tooltip-firstname,
.tooltip-container-email .tooltip-email {
    visibility: hidden;
    width: auto;
    background-color: #000000;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px;
    position: absolute;
    z-index: 999;
    margin-left: 5px;
}

.tooltip-container:hover .tooltip-text,
.tooltip-container-firstname:hover .tooltip-firstname,
.tooltip-container-email:hover .tooltip-email {
    visibility: visible !important;
}

.tooltip-inner {
    max-height: auto !important;
    font-size: 20px;
    white-space: normal; /* เพื่อให้ข้อความห่อในหลายบรรทัด ถ้าจำเป็น */
}

select.custom-select.custom-select-sm.form-control.form-control-sm {
    margin: 0 10px;
}

label.checkbox {
    font-size: 35px;
}