.app-main {
    background-color: white;
}
.app-content * {
    font-size: 16px;
}
.row {
    max-width: 100%;
    margin:0;
}
/**** BUTTON ****/
.btn {
    font-size: 14px;
    font-weight: 700;
}
.btn-transparent {
    background: transparent !important;
}
.btn-xs {
    display: inline-flex;
    height: 25px;
    padding: 0px 7px;
    justify-content: center;
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
}

/**** BUTTON PRIMARY ****/
.btn-transparent-primary, .btn-transparent-primary * {
    color: var(--bs-text-primary) !important;
}

/**** BUTTON SECONDARY ****/
.btn.btn-light-secondary, .btn.btn-light-secondary i  {
    color: var(--bs-text-secondary)
}
.btn.btn-outline.btn-outline-secondary, .btn.btn-outline.btn-outline-secondary i {
    color: var(--bs-secondary);
    border-color: var(--bs-secondary);
}
.btn.btn-outline.btn-outline-secondary:hover, .btn.btn-outline.btn-outline-secondary:hover i {
    color: var(--bs-secondary-active) !important;
    border-color: var(--bs-secondary-active) !important;
}
.btn-transparent-secondary, .btn-transparent-secondary * {
    color: var(--bs-text-secondary) !important;
}

/**** BUTTON LIGHT ****/
.btn.btn-light, .btn.btn-light i  {
    background-color: #fff;
    color:#000 !important;
}
.btn.btn-light-light, .btn.btn-light i  {
    background-color: #FFFFFF80;
    color:#fff;
}
.btn.btn-outline.btn-outline-light, .btn.btn-outline.btn-outline-light i {
    color: #fff;
    border-color: #fff;
}
.btn.btn-outline.btn-outline-light:hover:not(.btn-active) {
    background-color: #FFFFFF80 !important;
}
.btn-transparent-light, .btn-transparent-light * {
    color: #fff !important;
}

/**** BUTTON DARK ****/
.btn.btn-outline.btn-outline-dark, .btn.btn-outline.btn-outline-dark i {
    color: #000;
    border-color: #000;
}
.btn.btn-outline.btn-outline-dark:hover:not(.btn-active) {
    background-color: #ccc6c680 !important;
}
.btn-transparent-dark, .btn-transparent-dark * {
    color: #000 !important;
}

/**** BUTTON DANGER ****/
.btn-transparent-danger, .btn-transparent-danger * {
    color: var(--bs-danger) !important;
}

/**** BUTTON GRAY ****/
.btn-gray {
    background-color: var(--bs-gray);
    color: var(--bs-gray-inverse);
}
.btn-gray * {
    color: var(--bs-gray-inverse) !important;
    background-color: transparent !important;
}
.btn-gray:hover, .btn-gray:hover i {
    background-color: #7b7878;
    color: var(--bs-gray-inverse);
}
.btn-light-gray{
    background-color: var(--bs-gray-light);
    color: var(--bs-text-gray);
}
.btn-light-gray:hover{
    background-color: var(--bs-gray);
    color: var(--bs-gray-inverse);
}
.btn.btn-light-gray:hover:not(.btn-active) i {
    color: var(--bs-gray-inverse) !important;
}
.btn.btn-outline.btn-outline-gray, .btn.btn-outline.btn-outline-gray i {
    color: var(--bs-gray);
    border-color: var(--bs-gray);
}
.btn.btn-outline.btn-outline-gray:hover:not(.btn-active) {
    background-color: var(--bs-gray-light) !important;
}
.btn-transparent-gray, .btn-transparent-gray * {
    color: var(--bs-gray) !important;
}

/**** ALERT ****/
.alert {
    font-weight: 700;
}

/**** ALERT SUCCESS ****/
.alert.alert-success:before {
    content: "\f058";
    font-family: 'Font Awesome 6 Free';
    font-size: 14px;
    margin-right: 5px;
}

/**** ALERT SUCCESS ****/
.alert.alert-warning:before {
    content: "\f06a";
    font-family: 'Font Awesome 6 Free';
    font-size: 14px;
    font-weight: 600;
    margin-right: 5px;
}

/**** ALERT PRIMARY ****/
.alert.alert-primary:before {
    content: "\f06a";
    font-family: 'Font Awesome 6 Free';
    font-size: 14px;
    font-weight: 600;
    margin-right: 5px;
}

/**** ALERT DANGER ****/
.alert.alert-danger:before {
    content: "\f057";
    font-family: 'Font Awesome 6 Free';
    font-size: 14px;
    margin-right: 5px;
}

/**** CHIPS ****/
.chips {
    display: inline-flex;
    align-items: center;
    border-radius: 50rem !important;
    font-weight: 600;
    font-size: 13px;
    padding-left: 10px;
    padding-right: 10px;
    text-transform: uppercase;
    margin-right: 1rem;
}

.chips-outline-light {
    background-color: transparent;
    border: 1px solid white;
    color:var(--bs-light);
}
.chips-outline-secondary {
    background-color: transparent;
    border: 1px solid var(--bs-secondary);
    color:var(--bs-secondary);
}
.chips-outline-primary {
    background-color: transparent;
    border: 1px solid var(--bs-primary);
    color:var(--bs-primary);
}

.chips-outline-dark {
    background-color: transparent;
    border: 1px solid var(--bs-dark);
    color:var(--bs-dark);
}

.chips-outline-success {
    background-color: transparent;
    border: 1px solid var(--bs-success);
    color:var(--bs-dark);
}

.chips-primary {
    background-color: var(--bs-primary);
    color: white;
}
.chips-secondary {
    background-color: var(--bs-secondary);
    color: white;
}
.chips-danger {
    background-color: var(--bs-danger);
    color: white;
}
.chips-light {
    background-color: white;
    color: black;
}
.chips-dark {
    background-color: var(--bs-dark);
    color: white;
}
.chips-success {
    background-color: var(--bs-success);
    color: white;
}
.chips-warning {
    background-color: var(--bs-warning);
    color: white;
}


/**** MENU ****/
.menu-item a {
    font-size: 14px;
    font-weight: 600;
}


/**** FOOTER ****/
#kt_app_footer .app-container {
    padding-left: 6rem !important;
    padding-right: 6rem !important;
}
#kt_app_footer .title {
    color: var(--bs-primary);
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    word-wrap: break-word;
}
#kt_app_footer .circle {
    height: 32px;
    width: 32px;
    background-color: transparent;
    border-radius: 19.50px;
    border: 1px #96969647 solid;
    display: flex;
    justify-content: center;
    align-items: center;
}
#kt_app_footer .circle i {
    color: black;
}
.app-footer .row div a {
    color: var(--bs-dark) !important;
}

/**** MAIN ****/
.app-content {
    padding-top:0;
    padding-bottom:0;
}
#kt_app_content_container {
    padding:0 !important;
}
.single-title {
    color: var(--bs-primary);
    font-size: 28px;
    font-weight: 700;
    line-height: 36px;
    word-wrap: break-word;
}
.section {
    padding-left: 2rem;
    padding-right:2rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
}
.title {
    color: var(--bs-primary);
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    word-wrap: break-word;
    margin-bottom: 2rem;
}
.title.green {
    color: var(--bs-secondary);
}
.section .row {
    margin-left: 2rem;
}
.fs-30px {
    font-size: 30px;
}
.w-80 {
    width: 80%;
}
a {
    color:unset;
}

/**** VARIE ****/
.w-60 {
    width: 60% !important;
}
.w-40 {
    width: 40% !important;
}
.bg-linear-gradient {
    background: linear-gradient(90deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
}
.errorback{
    color: red;
    font-size: 30px;
    font-weight: 900;
    padding:2rem;
    width: 40%;
}
.title.white {
    color: white;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    word-wrap: break-word;
    margin-bottom: 2rem;
}
.white-space-break {
    white-space: break-spaces;
}

/***** TYPEAHEAD *****/
.typeahead{
    border: 1px solid #E1E3EA !important;
    height: 48px !important;
    font-size: 15px !important;
    outline:none !important;
    color: var(--bs-gray-700) !important;
}

.tt-menu, .tt-dataset{
    background-color: white !important;
}

.tt-dataset{
    border: 1px solid #E1E3EA !important;
}

/***** PAGINATION *****/
.pagination {
    justify-content: start;
}
.page-item .page-link {
    background: transparent;
    color: #c1c1c1;
    font-weight: bold;
    border: 1px solid #c1c1c1;
    border-radius: 5px;
    margin-bottom: 0.6rem;
}
.page-item.active .page-link {
    background: transparent;
    color: var(--bs-primary);
    font-weight: bold;
    border: 2px solid var(--bs-primary);
    border-radius: 5px;
}

/***** FORM *****/
.form-label {
    font-weight: bolder !important;
}

/********************** M O B I L E **********************/

@media only screen and (max-width: 600px) {

    /*** MENU ***/
    .app-header-logo {
        display: inline-flex;
        width: 100%;
        justify-content: space-between;
    }

    /**** FOOTER ****/
    #kt_app_footer .app-container {
        padding-left: 2rem !important;
        padding-right: 2rem !important;
    }
    [data-bs-theme=light] {
        --bs-app-header-height: 80px;
    }
}

/********************** T A B L E T **********************/
@media only screen and (min-width: 600px) and (max-width: 1024px) {
    [data-bs-theme=light] {
        --bs-app-header-height: 80px;
    }


    /**** MENU ****/
    .app-header-logo {
        display: inline-flex;
        width: 100%;
        justify-content: space-between;
    }

    /**** FOOTER ****/
    #kt_app_footer .app-container {
        padding-left: 2rem !important;
        padding-right: 2rem !important;
    }
}