/* Version 2021-2022 */

/********************************** LAYOUT **********************************/

:root {
    --font-family-primary: "Poppins", sans-serif;
    --font-family-secondary: "NanumPenScript", sans-serif;
    --background-color-primary: rgb(255 255 255);
    --background-color-secondary: rgb(249 250 251);
    --background-color-tertiary: rgb(229 231 235);
    --border-color-primary: rgb(209 213 219);
    --border-color-secondary: rgb(229 231 235);
    --outline-color-primary: var(--border-color-secondary);
    --box-shadow-primary: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --box-shadow-secondary: var(--box-shadow-primary);
    --box-shadow-card: var(--box-shadow-primary);
    --box-shadow-error: var(--box-shadow-primary);
    --green-color-primary: rgb(22 163 74);
    --green-color-primary-hover: rgb(34 197 94);
    --green-color-secondary: rgb(220 252 231);
    --green-color-tertiary: rgb(0 130 54);
    --red-color-primary: rgb(231 0 11);
    --red-color-primary-hover: rgb(251 44 54);
    --red-color-secondary: rgb(255 226 226);
    --yellow-color-primary: rgb(253 199 0);
    --yellow-color-primary-hover: rgb(255 223 32);
    --yellow-color-secondary: rgb(254 249 194);
    --blue-color-primary: rgb(43 127 255);
    --blue-color-secondary: rgb(219 234 254);
    --indigo-color-primary: rgb(79 57 246);
    --indigo-color-secondary: rgb(224 231 255);
    --border-radius-primary: 0.375rem;
    --text-5xl: 2.25rem;
    --text-4xl: 2rem;
    --text-3xl: 1.75rem;
    --text-2xl: 1.5rem;
    --text-xl: 1.25rem;
    --text-base: 1rem;
    --text-sm: 0.875rem;
    --text-xs: 0.75rem;
    --text-color-primary: rgb(17 24 39);
    --text-color-secondary: rgb(107 114 128);
    --text-color-tiertary: rgb(156 163 175);
}

@font-face {
    font-family: Poppins;
    font-weight: 100;
    src: url("../../libraries/fonts/poppins/Poppins-Thin.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 100;
    font-style: italic;
    src: url("../../libraries/fonts/poppins/Poppins-ThinItalic.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 200;
    src: url("../../libraries/fonts/poppins/Poppins-ExtraLight.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 200;
    font-style: italic;
    src: url("../../libraries/fonts/poppins/Poppins-ExtraLightItalic.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 300;
    src: url("../../libraries/fonts/poppins/Poppins-Light.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 300;
    font-style: italic;
    src: url("../../libraries/fonts/poppins/Poppins-LightItalic.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 400;
    src: url("../../libraries/fonts/poppins/Poppins-Regular.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 400;
    font-style: italic;
    src: url("../../libraries/fonts/poppins/Poppins-Italic.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 500;
    src: url("../../libraries/fonts/poppins/Poppins-Medium.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 500;
    font-style: italic;
    src: url("../../libraries/fonts/poppins/Poppins-MediumItalic.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 600;
    src: url("../../libraries/fonts/poppins/Poppins-SemiBold.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 600;
    font-style: italic;
    src: url("../../libraries/fonts/poppins/Poppins-SemiBoldItalic.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 700;
    src: url("../../libraries/fonts/poppins/Poppins-Bold.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 700;
    font-style: italic;
    src: url("../../libraries/fonts/poppins/Poppins-BoldItalic.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 800;
    src: url("../../libraries/fonts/poppins/Poppins-ExtraBold.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 800;
    font-style: italic;
    src: url("../../libraries/fonts/poppins/Poppins-ExtraBoldItalic.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 900;
    src: url("../../libraries/fonts/poppins/Poppins-Black.ttf");
}

@font-face {
    font-family: Poppins;
    font-weight: 900;
    font-style: italic;
    src: url("../../libraries/fonts/poppins/Poppins-BlackItalic.ttf");
}

@font-face {
    font-family: LiuJianMaoCao;
    font-weight: 400;
    src: url("../../libraries/fonts/LiuJianMaoCao/LiuJianMaoCao-Regular.ttf");
}

@font-face {
    font-family: NanumPenScript;
    font-weight: 400;
    src: url("../../libraries/fonts/LiuJianMaoCao/NanumPenScript-Regular.ttf");
}

/*========== DISCONTINUED ==========*/

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

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

/* ======================================== OPTIMIZED ======================================== */

html, body {
    font-family: var(--font-family-primary);
    color: var(--text-color-primary);
    -webkit-font-smoothing: antialiased;
    min-height: 100vh;
    font-size: 1rem;
}

body {
    display: flex;
    flex-direction: column;
}

.container {
    position: relative;
    padding-top: 3rem;
    transition: all .15s ease;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding-right: 1rem;
    padding-left: 1rem;
    max-width: 1400px;
    width: 100%;
}

.h-auto {
    flex-grow: 0 !important;
}

.page-loader {
    webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -ms-overflow-style: none;
    user-select: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    background-color: rgba(246, 245, 241, .05);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-loader svg {
    width: 3rem;
    height: 3rem;
    animation: spin 1.5s linear infinite;
}

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

    to {
        transform: rotate(360deg);
    }
}

.page-loader .inm-dot {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 200px;
    animation: jumploader 1.2s infinite;
}

.page-loader .inm-normal {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 200px;
}

@keyframes jumploader {
    0% {
        transform: translate(-40%, -55%) scale(1.25, 0.75);
    }

    50% {
        transform: translate(-50%, -100%) scale(1, 1);
    }

    100% {
        transform: translate(-40%, -55%) scale(1.25, 0.75);
    }
}

.container-fluid {
    position: relative;
    padding: 0;
    transition: all .15s ease;
}

.container .container {
    min-height: auto;
    padding: 0;
}

.container-inner {
    display: flex;
    flex-wrap: wrap;
    margin-right: -0.5rem;
    margin-left: -0.5rem;
    flex-grow: 1;
}

.container-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.body-title-wrapper {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-grow: 0;
    margin-bottom: 1rem;
}

.body-title-wrapper >* {
    flex-grow: 1;
}

.body-title-wrapper .body-title {
    font-weight: 500;
    font-size: var(--text-xl) !important;
    line-height: 1.75;
    margin: 0;
    color: var(--text-color-primary);
}

.body-title-wrapper .body-subtitle {
    margin: 0;
}

.body-title-wrapper .body-title .text-muted {
    color: #a1a5b7 !important;
}

.body-title-wrapper .body-subtitle a {
    color: #a1a5b7 !important;
    font-weight: 700;
}

.scroll-container {
    max-height: 350px;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.scroll-container.no-scroll {
    height: auto !important;
}

.separator {
    border-bottom: 1px solid var(--background-color-tertiary);
    margin: 1rem 0;
}

.datetime-open-disable-scroll {
    overflow: visible !important;
}

.card {
    background-color: var(--background-color-primary);
    border-radius: var(--border-radius-primary);
    border: 1px solid var(--border-color-secondary);
    flex-grow: 1;
}

.card .card {
    border: none;
    border-radius: 0;
    background-color: transparent;
}

.card-header {
    display: flex;
    background-color: transparent;
    border: none;
    border-radius: var(--border-radius-primary) var(--border-radius-primary) 0 0 !important;
    flex-grow: 0;
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    justify-content: space-between;
}

.card-title {
    font-weight: 500;
    font-size: var(--text-xl) !important;
    line-height: 1.75;
    margin: 0;
    color: var(--text-color-primary);
}

.card-body {
    flex-grow: 1;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.card-footer {
    display: flex;
    background-color: transparent;
    border: none;
    border-radius: var(--border-radius-primary) var(--border-radius-primary) 0 0 !important;
    flex-grow: 0;
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

label {
    font-size: var(--text-sm) !important;
    line-height: 1.5;
    font-weight: 500;
    margin-bottom: 0.25rem;
    color: var(--text-color-primary);
}

.text-muted {
    font-size: var(--text-xs) !important;
    color: var(--text-color-secondary) !important;
    font-weight: 500;
}

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

input,
.form-control {
    display: block;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
    background-color: var(--background-color-primary);
    border-radius: var(--border-radius-primary);
    transition: none;
    font-size: var(--text-sm) !important;
    line-height: 1.5;
    border: none;
    box-shadow: inset 0 0 0 1px var(--border-color-primary);
    color: var(--text-color-primary);
    height: 2.25rem;
}

.form-control:focus,
input:focus,
.form-control:active,
input:active {
    box-shadow: inset 0 0 0 2px var(--green-color-primary);
    color: var(--text-color-primary);
}

.btn,
.btn-disabled,
.btn-secondary,
.btn-light,
.btn-default,
.btn-white,
.btn-gray-primary,
.btn-outline-primary {
    color: var(--text-color-primary);
    vertical-align: middle;
    background-color: var(--background-color-primary);
    border-radius: var(--border-radius-primary);
    transition: none;
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 0.375rem;
    border-color: var(--border-color-primary);
    border-width: 1px;
    border-style: solid;
    font-weight: 500;
    font-size: var(--text-sm) !important;
    line-height: 1.5;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    height: 2.25rem;
    box-shadow: none !important;
}

.btn:focus,
.btn:hover,
.btn:active,
.btn-disabled:hover,
.btn-disabled:active,
.btn-secondary:hover,
.btn-secondary:active,
.btn-light:hover,
.btn-light:active,
.btn-default:hover,
.btn-default:active,
.btn-white:hover,
.btn-white:active,
.btn-gray-primary:hover, 
.btn-gray-primary:focus, 
.btn-gray-primary:active,
.btn-outline-primary:hover,
.btn-outline-primary:focus, 
.btn-outline-primary:active {
    border-color: var(--border-color-primary);
    color: var(--text-color-primary);
    background-color: var(--background-color-secondary);
    box-shadow: none !important;
}

.btn-primary,
.btn-dark-primary,
.btn-success {
    color: var(--white);
    background-color: var(--green-color-primary);
    border-color: var(--green-color-primary);
}

.btn-primary:not(:disabled):not(.disabled).active, 
.btn-primary:not(:disabled):not(.disabled):active,
.show>.btn-primary.dropdown-toggle,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-dark-primary:hover,
.btn-dark-primary:focus,
.btn-dark-primary:active,
.btn-success:hover,
.btn-success:focus,
.btn-success:active {
    color: var(--white);
    background-color: var(--green-color-primary-hover);
    border-color: var(--green-color-primary-hover);
}

.btn[disabled],
.btn.disabled,
.btn[disabled]:hover,
.btn.disabled:hover,
.btn[disabled]:focus,
.btn.disabled:focus {
    color: var(--text-color-primary);
    background-color: var(--background-color-primary);
    border-color: var(--border-color-primary);
}

input[type="button"],
input[type="submit"] {
    line-height: 1;
}

.input-group-text {
    white-space: nowrap;
    color: var(--text-color-tiertary);
    vertical-align: middle;
    background-color: var(--background-color-primary);
    border-radius: var(--border-radius-primary);
    transition: none;
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 0.375rem;
    border-color: var(--border-color-primary);
    border-width: 1px;
    font-weight: 500;
    font-size: var(--text-sm) !important;
    line-height: 1.25;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    z-index: 1;
}

.input-group-append .input-group-text {
    border-left: 0;
}

.input-group-prepend .input-group-text {
    border-right: 0;
}

.bootstrap-select button,
.bootstrap-select button:hover, 
.bootstrap-select button:active, 
.bootstrap-select button:focus {
    font-weight: 400;
    background-color: transparent;
}

.bootstrap-select .dropdown-toggle::after {
    content: "\f107";
    font-family: "Font Awesome 6 Pro";
    border: none;
}

.bootstrap-select .dropdown-toggle:focus {
    outline: none !important;
    box-shadow: none !important;
}

.bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.29;
}

.btn-light:not(:disabled):not(.disabled).active,
.btn-light:not(:disabled):not(.disabled):active,
.show > .btn-light.dropdown-toggle {
    color: var(--text-color-primary);
    background-color: var(--background-color-primary);
    border-color: var(--border-color-primary);
}

.bootstrap-select > .dropdown-toggle.bs-placeholder,
.bootstrap-select > .dropdown-toggle.bs-placeholder:active, 
.bootstrap-select > .dropdown-toggle.bs-placeholder:focus,
.bootstrap-select > .dropdown-toggle.bs-placeholder:hover {
    color: var(--text-color-primary);
}

.modal-dialog {
    position: absolute;
    top: 45% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    min-width: 50rem;
}

.error-modal .modal-dialog {
    width: 25rem;
    min-width: 25rem;
}

.modal-content {
    border: none;
    border-radius: var(--border-radius-primary);
}

.modal-header {
    display: flex;
    background-color: transparent;
    border: none;
    border-radius: var(--border-radius-primary) var(--border-radius-primary) 0 0 !important;
    flex-grow: 0;
    padding-top: 1rem;
    padding-bottom: 0;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    gap: 0.5rem;
}

.modal-header .close {
    color: var(--text-color-primary);
    font-weight: 300;
    flex-grow: 0;
    margin: 0;
    padding: 0;
}

.modal-title {
    font-weight: 500;
    font-size: var(--text-xl) !important;
    line-height: 1.75;
    margin: 0;
    color: var(--text-color-primary);
}

.modal-subtitle {
    font-size: var(--text-sm) !important;
    color: var(--text-color-secondary);
    font-weight: 500;
}

.modal-subtitle:empty {
    display: none;
}

.modal-body {
    flex-grow: 1;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    font-size: var(--text-sm) !important;
    color: var(--text-color-primary);
}

.modal-footer {
    display: flex;
    background-color: transparent;
    border: none;
    border-radius: var(--border-radius-primary) var(--border-radius-primary) 0 0 !important;
    flex-grow: 0;
    padding-top: 0;
    padding-bottom: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.modal-backdrop {
    z-index: 2050;
}

.modal-open .modal, 
.modal.fade.in {
    z-index: 30000;
}

.modal-footer>* {
    margin: 0;
}

.page-functions-container {
    position: fixed;
    right: 0;
    bottom: 50%;
    transform: translateY(50%);
    z-index: 2000;
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    background-color: var(--background-color-primary);
    padding: 0.5rem;
    border: 1px solid var(--border-color-secondary);
    border-top-left-radius: var(--border-radius-primary);
    border-bottom-left-radius: var(--border-radius-primary);
}

.page-functions-container .wrapper {
    display: block;
    position: relative;
    z-index: 2000;
}

.page-functions-container .inner-wrapper {
    cursor: pointer;
    border: none;
    background-color: var(--background-color-secondary);
    padding: 0.25rem 0.5rem;
    border-radius: var(--border-radius-primary);
    line-height: 1.25;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-functions-container svg {
    width: 0.75rem;
    height: 0.75rem;
    color: var(--text-color-primary);
}

#helpFunction.modal:not(.show) {
    opacity: 1 !important;
    left: -30rem;
    transition: .3s ease-in-out;
}

#helpFunction.modal {
    opacity: 1 !important;
    left: 0;
    transition: .3s ease-in-out;
}

.help-function-modal .modal-dialog {
    left: 0 !important;
    transform: translate(0, 0) !important;
    top: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    width: 30rem;
    transition: .15s ease-in-out !important;
    min-width: 0;
    max-width: 100%;
}

.help-function-modal .modal-header {
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--border-color-secondary);
}

.help-function-modal .modal-content {
    height: 100%;
    overflow: auto;
    border-radius: 0;
}

.modal .modal-dialog.expand-help-container {
    width: 50% !important;
    max-width: 50% !important;
    transition: .15s ease-in-out !important;
}

.help-function-modal h1,
.help-function-modal .h1 {
    font-size: var(--text-5xl) !important;
    margin-bottom: 2rem;
    color: var(--text-color-primary);
    border-bottom: 1px solid var(--border-color-secondary);
    font-weight: 500;
    line-height: 1.25;
}

.help-function-modal h2,
.help-function-modal .h2 {
    font-size: var(--text-4xl) !important;
    margin: 2rem 0 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--border-color-secondary);
    color: var(--text-color-primary);
    font-weight: 500;
    line-height: 1.25;
}

.help-function-modal h3,
.help-function-modal .h3 {
    font-size: var(--text-3xl) !important;
    margin: 2rem 0 2rem;
    padding-bottom: 1rem;
    color: var(--text-color-primary);
    border-bottom: 1px solid var(--border-color-secondary);
    font-weight: 500;
    line-height: 1.25;
}

.help-function-modal p,
.help-function-modal .p,
.help-function-modal ul,
.help-function-modal ol,
.help-function-modal ul li,
.help-function-modal ol li {
    font-size: var(--text-sm) !important;
    color: var(--text-color-primary);
    line-height: 1.5;
}

.help-function-modal b {
    font-weight: 500;
}

/*========== COMPRESS ==========*/

body.compress .container {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

body.compress .card-header {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
}

body.compress .card-body {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
}

body.compress .card-footer {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
}

body.compress .form-group {
    margin-bottom: 0.5rem;
}

body.compress input {
    padding-top: 0;
    padding-bottom: 0;
    height: 1.5rem;
}

body.compress .input-group-append .input-group-text {
    height: 1.5rem;
}

body.compress .input-group-prepend .input-group-text {
    height: 1.5rem;
}

body.compress .btn,
body.compress .btn-disabled,
body.compress .btn-secondary,
body.compress .btn-light,
body.compress .btn-default,
body.compress .btn-white {
    padding-top: 0;
    padding-bottom: 0;
    height: 1.5rem;
}

body.compress .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    line-height: 1.65;
}

body.compress .data-table thead th,
body.compress .data-table tbody tr th {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

body.compress .data-table tbody tr td {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

body.compress .pagination > li > a,
body.compress .pagination > li > span {
    padding-top: 0;
    padding-bottom: 0;
    height: 1.5rem;
}

body.compress .pagination .first a,
body.compress .pagination .last a {
    padding-top: 0;
    padding-bottom: 0;
    height: 1.5rem;
}

body.compress .search-container .search-title {
    padding-top: 0;
    padding-bottom: 0;
    height: 1.5rem;
}

body.compress .nav-tab-navbar {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

body.compress .nav-tab-navbar .container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    min-height: auto !important;
}

body.compress .nav-tab-navbar .nav-title {
    font-size: 20px !important;
}

body.compress .nav-tabs .nav-link {
    padding: 8px 15px !important;
}

body.compress .nav-tab-navbar .nav-title {
    font-size: 22px !important;
}

body.compress .nav-tab-navbar .nav-title {
    font-size: 22px !important;
}

body.compress .nav-tab-navbar .nav-title {
    font-size: 22px !important;
}

body.compress .nav-tab-navbar .nav-title {
    font-size: 22px !important;
}

body.compress .nav-tab-navbar .nav-title {
    font-size: 22px !important;
}

body.compress .nav-tab-navbar .nav-title {
    font-size: 22px !important;
}

body.compress .nav-tab-navbar .nav-title {
    font-size: 22px !important;
}

body.compress .body-title-wrapper {
    margin-bottom: 0.5rem;
}

body.compress .col-form-label {
    padding: 0 0.5rem;
}

body.compress .custom-file-label {
    padding-top: 0;
    padding-bottom: 0;
    height: 1.5rem;
}

/*========== HIGH CONTRAST ==========*/

.high-contrast-theme {
    filter: brightness(0.74) contrast(1.94);
}

/* ======================================== OPTIMIZED - END ======================================== */

/*========== GENERAL ==========*/

html {
    scroll-behavior: smooth;
    font-family: sans-serif;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

html.modal-is-open {
    overflow: hidden;
}

html.modal-is-open body {
    overflow: hidden !important;
}

::placeholder {
    color: var(--text-color-secondary);
}

hr {
    border-top: 1px solid var(--border-color-secondary) !important;
}

img {
    max-width: 100%;
}

.cursor-pointer {
    cursor: pointer !important;
}

.cursor-default {
    cursor: default !important;
}

.large--hide {
    display: none !important;
}

.overflow-visible {
    overflow: visible !important;
}

.trailing {
    cursor: pointer;
    margin-left: 0.2rem;
    font-size: 0.9rem;
    background-color: var(--background-color-primary);
}

.new-badge {
    position: absolute;
    top: -13px;
    left: -28px;
    background-color: #dc3545;
    color: #fff;
    border-radius: 5px 5px 0 5px;
    font-size: 11px;
    padding: 2px 4px;
}

.content-title {
    font-size: var(--text-base) !important;
    font-weight: 500;
    color: var(--text-color-primary);
}

.font-weight-regular {
    font-weight: 400 !important;
}

.font-weight-bolder,
.font-weight-medium {
    font-weight: 500 !important;
}

.font-weight-bold {
    font-weight: 600 !important;
}

.font-weight-boldest {
    font-weight: 800 !important;
}

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

li.disabled {
    opacity: 0.5;
}

.text-4xl {
    font-size: var(--text-4xl) !important;
}

.text-2xl {
    font-size: var(--text-2xl) !important;
}

.text-xl {
    font-size: var(--text-xl) !important;
}

.text-base {
    font-size: var(--text-base) !important;
}

.text-sm {
    font-size: var(--text-sm) !important;
}

.text-xs {
    font-size: var(--text-xs) !important;
}

pre {
    color: var(--text-color-primary);
    font-size: var(--text-sm);
    white-space: normal;
}

/*========== BACKGROUND ==========*/

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

.bg-dark {
    background-color: #333 !important;
}

.bg-success,
.bg-green {
    background-color: #eaf8f0 !important;
}

.bg-danger, 
.bg-red {
    background-color: #ffe6e6 !important;
}

.bg-warning, 
.bg-orange {
    background-color: #fef2e2 !important;
}

.bg-info, 
.bg-blue {
    background-color: #e8f7f9 !important;
}

/*========== TEXT ==========*/

a {
    color: var(--green-color-primary);
    text-decoration: none;
    transition: none;
}

a:hover, 
a:focus, 
a:active {
    color: var(--green-color-primary-hover);
    text-decoration: none;
    transition: none;
}

/* COLOR */

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

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

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

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

.text-warning,
.text-orange {
    color: #ffc700 !important;
}

.text-info,
.text-blue {
    color: #009ef7 !important;
}

.font-size-20 {
    font-size: 20px !important;
}

.text-initial {
    text-transform: initial !important;
}

h1,
.h1 {
    font-size: var(--text-5xl) !important;
}

h2,
.h2 {
    font-size: var(--text-4xl) !important;
}

h3,
.h3 {
    font-size: var(--text-3xl) !important;
}

h4,
.h4 {
    font-size: var(--text-2xl) !important;
}

h5,
.h5 {
    font-size: var(--text-xl) !important;
}

h6,
.h6 {
    font-size: var(--text-base) !important;
}

p {
    font-size: var(--text-sm) !important;
}

p * {
    font-size: var(--text-sm) !important;
}

/********************************** PAGE **********************************/

.page-title {
    margin: 0;
    font-size: 24px;
    color: #181c32;
}

.page-full-info {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 10000;
    background-color: var(--background-color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.page-full-info .inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2rem;
}

.page-full-info .inner * {
    margin: 0;
}

.page-full-info h1 {
    font-size: var(--text-5xl) !important;
    font-weight: 500;
    color: var(--text-color-primary);
}

.page-full-info h2 {
    font-size: var(--text-4xl) !important;
    font-weight: 500;
    color: var(--text-color-primary);
}

.page-full-info h3 {
    font-size: var(--text-3xl) !important;
    font-weight: 500;
    color: var(--text-color-primary);
}

.page-full-info h4 {
    font-size: var(--text-2xl) !important;
    font-weight: 500;
    color: var(--text-color-primary);
}

.page-full-info h5 {
    font-size: var(--text-xl) !important;
    font-weight: 500;
    color: var(--text-color-primary);
}

.page-full-info p {
    font-size: var(--text-sm) !important;
    font-weight: 400;
    color: var(--text-color-primary);
}

.page-full-info img {
    width: 12rem;
    height: auto;
    display: block;
    margin: 0 auto;
}

.page-full-info .btn,
.page-full-info .btn:focus,
.page-full-info .btn:hover,
.page-full-info .btn:active {
    width: fit-content;
    margin: 0 auto;
}

/********************************** FORM **********************************/

.required:after {
    content: "*";
    position: relative;
    font-size: inherit;
    color: #f64e60;
    padding-left: 0.25rem;
    font-weight: 600;
}

/*========== NAV TAB ==========*/

.nav-tabs {
    border: none;
    gap: 1rem;
}

.nav-tabs .nav-link {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
    border: 1px solid var(--border-color-secondary);
    border-radius: var(--border-radius-primary);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text-color-primary);
    white-space: nowrap;
}

.nav-tabs .nav-link:hover {
    border-color: var(--border-color-secondary);
    color: var(--text-color-primary);
    background-color: var(--border-color-primary);
}

.nav-tabs .nav-link.active, 
.nav-tabs .show > .nav-link {
    border-color: var(--border-color-secondary);
    color: var(--text-color-primary);
    background-color: var(--background-color-tertiary);
}


/*========== CONTAINER ==========*/

/*----- EXTEND -----*/

body.expand .container {
    width: 100% !important;
    max-width: none !important;
}

/*========== CARD ==========*/

.card-custom {
    position: relative;
    background: var(--background-color-primary);
    border-radius: var(--border-radius-primary);
    border: none;
    max-width: 100%;
    height: 100%;
    -webkit-box-shadow: var(--box-shadow-card);
    box-shadow: var(--box-shadow-card);
}

/*========== ROW / COL ==========*/
.row {
    margin-right: -0.5rem;
    margin-left: -0.5rem;
}

.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
    padding: 0 0.5rem;
}

.col-xl-12 {
    max-width: 100%;
}

/*========== SPACING ==========*/

.relative {
    position: relative !important;
}

/* WIDTH */

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

.w-fit {
    width: fit-content !important;
}

/* GAP */

.gap-xs {
    gap: 0.25rem !important
}

.gap-1 {
    gap: 0.5rem !important
}

.gap-2 {
    gap: 1rem !important
}

.gap-3 {
    gap: 1.5rem !important
}

.gap-20,
.gap-4 {
    gap: 2rem !important
}

.gap-5 {
    gap: 2.5rem !important
}

.gap-6 {
    gap: 3rem !important
}

.gap-7 {
    gap: 3.5 !important
}

.gap-8 {
    gap: 4rem !important
}

.gap-9 {
    gap: 4.5rem !important
}

.gap-10 {
    gap: 5rem !important
}

/* MARGIN */

.m-xs {
    margin: 0.25rem !important
}

.m-1 {
    margin: 0.5rem !important
}

.m-2 {
    margin: 1rem !important
}

.m-3 {
    margin: 1.5rem !important
}

.m-4 {
    margin: 2rem !important
}

.m-5 {
    margin: 2.5rem !important
}

.m-6 {
    margin: 3rem !important
}

.m-7 {
    margin: 3.5 !important
}

.m-8 {
    margin: 4rem !important
}

.m-9 {
    margin: 4.5rem !important
}

.m-10 {
    margin: 5rem !important
}

/* MARGIN TOP */

.mt-xs {
    margin-top: 0.25rem !important
}

.mt-1 {
    margin-top: 0.5rem !important
}

.mt-2 {
    margin-top: 1rem !important
}

.mt-3 {
    margin-top: 1.5rem !important
}

.mt-20,
.mt-4 {
    margin-top: 2rem !important
}

.mt-5 {
    margin-top: 2.5rem !important
}

.mt-6 {
    margin-top: 3rem !important
}

.mt-7 {
    margin-top: 3.5 !important
}

.mt-8 {
    margin-top: 4rem !important
}

.mt-9 {
    margin-top: 4.5rem !important
}

.mt-10 {
    margin-top: 5rem !important
}

/* MARGIN LEFT */

.ml-xs {
    margin-left: 0.25rem !important
}

.ml-1 {
    margin-left: 0.5rem !important
}

.ml-2 {
    margin-left: 1rem !important
}

.ml-3 {
    margin-left: 1.5rem !important
}

.ml-4 {
    margin-left: 2rem !important
}

.ml-5 {
    margin-left: 2.5rem !important
}

.ml-6 {
    margin-left: 3rem !important
}

.ml-7 {
    margin-left: 3.5 !important
}

.ml-8 {
    margin-left: 4rem !important
}

.ml-9 {
    margin-left: 4.5rem !important
}

.ml-10 {
    margin-left: 5rem !important
}

/* MARGIN BOTTOM */

.mb-xs {
    margin-bottom: 0.25rem !important
}

.mb-1 {
    margin-bottom: 0.5rem !important
}

.mb-2 {
    margin-bottom: 1rem !important
}

.mb-3 {
    margin-bottom: 1.5rem !important
}

.mb-20,
.mb-4 {
    margin-bottom: 2rem !important
}

.mb-5 {
    margin-bottom: 2.5rem !important
}

.mb-6 {
    margin-bottom: 3rem !important
}

.mb-7 {
    margin-bottom: 3.5 !important
}

.mb-8 {
    margin-bottom: 4rem !important
}

.mb-9 {
    margin-bottom: 4.5rem !important
}

.mb-10 {
    margin-bottom: 5rem !important
}

/* MARGIN RIGHT */

.mr-xs {
    margin-right: 0.25rem !important
}

.mr-1 {
    margin-right: 0.5rem !important
}

.mr-2 {
    margin-right: 1rem !important
}

.mr-3 {
    margin-right: 1.5rem !important
}

.mr-4 {
    margin-right: 2rem !important
}

.mr-5 {
    margin-right: 2.5rem !important
}

.mr-6 {
    margin-right: 3rem !important
}

.mr-7 {
    margin-right: 3.5 !important
}

.mr-8 {
    margin-right: 4rem !important
}

.mr-9 {
    margin-right: 4.5rem !important
}

.mr-10 {
    margin-right: 5rem !important
}

.p-10-15 {
    padding: 10px 15px !important;
}

.p-15 {
    padding: 15px !important;
}

.pl-15 {
    padding-left: 15px !important;
}

.pr-15 {
    padding-right: 15px !important;
}

.pb-15 {
    padding-bottom: 15px !important;
}

.pt-15 {
    padding-top: 15px !important;
}

.pt-0 {
    padding-top: 0 !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}

.p-20 {
    padding: 20px !important;
}

.pl-20 {
    padding-left: 20px !important;
}

.pr-20 {
    padding-right: 20px !important;
}

.pb-20 {
    padding-bottom: 20px !important;
}

.pt-20 {
    padding-top: 20px !important;
}

.p-box {
    padding: 20px 30px !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}

.p-xs {
    padding: 0.25rem !important;
}

.pt-xs {
    padding-top: 0.25rem !important;
}

.pb-xs {
    padding-bottom: 0.25rem !important;
}

.pr-xs {
    padding-right: 0.25rem !important;
}

.pl-xs {
    padding-left: 0.25rem !important;
}

.py-xs {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
}

.px-xs {
    padding-right: 0.25rem !important;
    padding-left: 0.25rem !important;
}

/*========== FLEX ==========*/

.d-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.f-1 {
    -webkit-box-flex: 1 !important;
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
}

.f-0-1-auto {
    -webkit-box-flex: 0 1 auto !important;
    -ms-flex: 0 1 auto !important;
    flex: 0 1 auto !important;
}

/* COLUMN */

.flex-column-start {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: flex-start !important;
    -ms-flex-align: flex-start !important;
    align-items: flex-start !important;
}

.flex-column-stretch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: stretch !important;
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
}

/* ROW */

.flex-row-between, .flex-row-between-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: space-between;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

.flex-row-between-start {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: space-between;
    -webkit-box-align: flex-start !important;
    -ms-flex-align: flex-start !important;
    align-items: flex-start !important;
}

.flex-row-start, .flex-row-start-start {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: flex-start;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

.flex-row-start-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: flex-start;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

.flex-row-start-end {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: flex-start;
    -webkit-box-align: flex-end !important;
    -ms-flex-align: flex-end !important;
    align-items: flex-end !important;
}

.flex-row-start-stretch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: flex-start;
    -webkit-box-align: stretch !important;
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
}

.flex-row-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: center;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

.flex-row-center-end {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: center;
    -webkit-box-align: flex-end !important;
    -ms-flex-align: flex-end !important;
    align-items: flex-end !important;
}

.flex-row-end-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: flex-end;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

.flex-row-stretch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: space-between;
    -webkit-box-align: stretch !important;
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
}

.flex-row-between-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: space-between;
    -webkit-box-align: flex-start !important;
    -ms-flex-align: flex-start !important;
    align-items: flex-start !important;
}

.flex-row-start-start-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: flex-start;
    -webkit-box-align: flex-start !important;
    -ms-flex-align: flex-start !important;
    align-items: flex-start !important;
}

.flex-row-between-center-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: space-between;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

.flex-row-stretch-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: space-between;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

.flex-row-start-center-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    justify-content: flex-start;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

/*========== PAGE - ERROR / EMPTY ==========*/

.empty-page-header {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.empty-page-header .title {
    margin: 0;
    font-size: 26px;
    font-weight: normal;
}

/********************************** FORM **********************************/

/*========== FORM GROUP ==========*/

.form-group.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    justify-content: end;
}

.form-group .col-form-label {
    text-align: right;
    padding: 10px;
}

.form-group .col-form-control {
    padding: 0 10px;
    position: relative;
}

.form-group .or {
    position: absolute;
    top: 60px;
    opacity: 0.5;
    font-size: 12px;
}

.form-group-footer {
    margin: 25px -25px -15px !important;
    padding: 20px 25px;
    background-color: #fafafa;
}

.form-group-footer .col-form-control {
    padding: 0 !important;
}

.form-group-footer .btn {
    min-width: 100px;
    margin-right: 15px;
}

.form-group-footer .btn:last-child {
    margin-right: 0;
}

.form-group .search-btn {
    position: absolute;
    top: 0;
    right: 10px;
    opacity: 0.5;
    padding: 0 10px;
}

.form-group .search-btn .fa,
.form-group .search-btn svg, 
.form-group .search-btn i {
    width: 20px;
    height: 20px;
}

.form-group-flex {
    margin: 0 -7.5px;
}

.form-group-flex .flex-content-wrapper {
    margin-bottom: 15px;
    margin: 0;
    width: 100%;
    padding: 0 7.5px;
}

.form-group-flex .col-form-label {
    padding: 0;
}

.form-group-flex .col-form-control {
    padding: 0;
}

.form-text:not(:empty) {
    margin-top: 5px;
    font-size: 12px;
    color: #a1a5b7;
}

.form-text:empty {
    display: none;
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(0, 177, 70, 0.7);
    }

    70% {
        box-shadow: 0 0 0 10px rgba(0, 177, 70, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(0, 177, 70, 0);
    }
}

/*========== INPUT / FORM CONTROL ==========*/

input[type="file"] {
    cursor: pointer;
}

.bootstrap-select .bs-ok-default:after {
    content: '' !important;
    display: inline-block !important;
    font-style: normal !important;
    font-variant: normal !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased !important;
    font-family: "Font Awesome 6 Pro" !important;
    font-weight: 900 !important;
    content: "\f00c" !important;
    transform: none !important;
    border: none !important;
}

input.read-only:focus,
input.read-only:active {
    cursor: text;
    box-shadow: none;
    padding-left: 0;
    padding-right: 0;
    font-weight: 500 !important;
    outline: none !important;
}

.input-group {
    position: relative;
    flex-wrap: nowrap;
    width: 100%;
}

.input-group > .form-control:not(:last-child),
.input-group > .custom-select:not(:last-child) {
    border-right: none !important;
    padding-right: 0 !important;
}

.input-group>.form-control, 
.input-group>.custom-select, 
.input-group>.custom-file {
    position: relative;
    flex: 1 1 auto;
    width: 1%;
    margin-bottom: 0;
}

.input-group>.custom-select:not(:first-child), 
.input-group>.form-control:not(:first-child) {
    border-left: 0;
}

textarea.form-control {
    max-width: 100%;
}

input.read-only {
    cursor: text;
    box-shadow: none;
    padding-left: 0;
    padding-right: 0;
    font-weight: 500 !important;
    background-color: transparent !important;
}

/* SUMMERNOTE */

.note-editor.note-airframe, 
.note-editor.note-frame {
    border: 1px solid #e5e5e5;
}

.note-editor .btn-group > .btn {
    background-color: inherit !important;
    padding: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    text-align: inherit !important;
    vertical-align: inherit !important;
    line-height: inherit !important;
    border-radius: inherit !important;
    width: 2.5rem;
    box-shadow: none !important;
    border: none !important;
}

.note-editor .btn-group > .btn:hover, 
.note-editor .btn-group > .btn:focus, 
.note-editor .btn-group > .btn:active {
    color: inherit !important;
}

.note-editor .popover .btn-group > .btn {
    color: var(--background-color-primary) !important;
}

.note-editor .dropdown-toggle::after {
    position: relative !important;
    border-top: .3em solid;
    border-right: .3em solid transparent !important;
    border-bottom: 0 !important;
    border-left: .3em solid transparent !important;
    right: 0 !important;
    top: 0 !important;
}

.note-editor .card-header {
    background-color: #f9f9f9;
    border-bottom: 1px solid #e5e5e5;
    padding: 0 15px;
    min-height: auto;
    justify-content: flex-start;
}

.note-editor .btn-light {
    border: none !important;
}

.note-editor.note-airframe .note-statusbar, 
.note-editor.note-frame .note-statusbar {
    background-color: #f9f9f9;
    border-top: 1px solid #e5e5e5;
}

.note-toolbar > .note-btn-group {
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
}

.note-editor.note-airframe .note-editing-area .note-editable,
.note-editor.note-frame .note-editing-area .note-editable {
    font-size: var(--text-sm) !important;
    height: 500px;
    background-color: var(--background-color-primary);
}

.note-editor iframe {
    border: none;
    box-shadow: none;
    width: 1024px;
    min-width: 1024px;
    max-width: 1024px;
    height: 600px;
    display: block;
    visibility: visible;
    margin: 0;
    border-radius: 20px;
    zoom: 1.4;
    -moz-transform: scale(1.4);
    -moz-transform-origin: 0 0;
}

.note-editor .dropdown-item {
    color: inherit !important;
    font-weight: inherit !important;
}

/*========== SELECT / DROPDOWN ==========*/

.dropdown, 
.dropleft, 
.dropright, 
.dropup {
    position: relative;
}

.bootstrap-select:not(.input-group-btn), 
.bootstrap-select[class*=col-] {
    float: none;
    display: inline-block;
    margin-left: 0;
}

.bootstrap-select.form-control {
    margin-bottom: 0;
    padding: 0;
    border: none;
    height: auto;
}

:not(.input-group) > .bootstrap-select.form-control:not([class*=col-]) {
    width: 100%;
}

.bootstrap-select:not(.input-group-btn), 
.bootstrap-select[class*=col-] {
    float: none;
    display: inline-block;
    margin-left: 0;
    width: 100% !important;
}

.bootstrap-select.form-control {
    margin-bottom: 0;
    padding: 0;
    border: none;
    height: auto;
}

.bs-actionsbox .btn-group {
    gap: 0.5rem;
}

.bs-actionsbox .btn-group button {
    color: var(--text-color-primary);
    vertical-align: middle;
    background-color: var(--background-color-primary);
    border-radius: var(--border-radius-primary) !important;
    transition: none;
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 0.375rem;
    border-color: var(--border-color-primary);
    border-width: 1px;
    border-style: solid;
    font-weight: 500;
    font-size: var(--text-sm) !important;
    line-height: 1.5;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    height: 2.25rem;
}

.bs-actionsbox .btn-group button:hover,
.bs-actionsbox .btn-group button:focus,
.bs-actionsbox .btn-group button:active {
    background-color: var(--background-color-secondary);
}

.bootstrap-select .status {
    display: none !important; 
}


/* DROPDOWN MENU */

.bootstrap-select .dropdown-menu {
    min-width: 100% !important;
}

.dropdown-menu {
    border-radius: var(--border-radius-primary);
    box-shadow: var(--box-shadow-primary);
    padding-top: 0;
    padding-bottom: 0;
    font-size: var(--text-sm) !important;
}

.dropdown-menu > li > a {
    padding: 0.5rem 0.75rem;
    color: var(--text-color-primary);
    font-size: var(--text-sm) !important;
    font-weight: 500;
}

.bootstrap-select .dropdown-menu li small {
    white-space: normal;
    word-break: break-word;
    color: #a1a5b7 !important;
    font-size: 13px;
    font-weight: 500;
    display: block;
    padding: 0;
}

.bootstrap-select .dropdown-menu li.active small {
    color: #a1a5b7 !important;
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus,
.dropdown-menu > li > a:focus,
.dropdown-menu > li > a:hover {
    background-color: var(--green-color-primary) !important;
    color: var(--white);
}

.bootstrap-select .no-results {
    text-align: center;
    margin: 0;
}

.dropdown-menu div[role="listbox"] {
    max-height: 15vh !important;
    max-height: 15vh !important;
    overflow-y: auto;
    overflow-x: hidden;
}

body.expand .bootstrap-select {
    width: 100% !important;
    margin: 0;
}


/*========== CHECKBOX / RADIO ==========*/

.flex-row-between-wrap .inm-checkbox {
    min-width: 33%;
    word-break: break-word;
    white-space: normal;
    margin-right: 0 !important;
}

.inm-checkbox {
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
    width: fit-content;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin: 0;
    text-transform: inherit;
    padding: 0.15rem 0;
    min-height: 2rem;
}

.inm-checkbox.checkbox-error .checkmark {
    background-color: var(--red-color-secondary);
    border-color: var(--red-color-primary);
}

.inm-checkbox a {
    color: inherit !important;
    text-decoration: underline !important;
    text-decoration-style: dotted !important;
}

.inm-checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.inm-checkbox span:first-child {
    margin-left: 1.5rem;
    font-size: var(--text-sm) !important;
    padding-top: 2px;
}

.checkmark {
    position: absolute;
    left: 0;
    height: 1rem;
    width: 1rem;
    background-color: var(--background-color-tertiary);
    border-radius: var(--border-radius-primary);
}

.radio {
    position: absolute;
    left: 0;
    height: 1rem;
    width: 1rem;
    background-color: var(--background-color-tertiary);
    border-radius: 50%;
}

.inm-checkbox input:checked ~ .checkmark {
    background-color: var(--green-color-primary);
}

.inm-checkbox input:checked ~ .radio {
    background-color: var(--green-color-primary);
}

/*========== DROPZONE ==========*/

.dropzone {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-color-primary);
    border-radius: var(--border-radius-primary);
}

.dropzone .dz-message {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: var(--text-base);
    font-weight: 500;
    color: var(--text-color-primary);
    width: 100%;
}

.dropzone .dz-preview.dz-error .dz-error-message {
    padding: 10px 15px !important;
    -webkit-box-shadow: 0 20px 30px 0 rgba(0,0,0,.10) !important;
    box-shadow: 0 20px 30px 0 rgba(0,0,0,.10) !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    border: none !important;
    color: rgb(254, 89, 87) !important;
    background-image: none !important;
    background-color: #f8f8f8 !important;
    text-align: center !important;
    font-weight: 500 !important;
    top: -62px !important;
}

.dropzone .dz-preview .dz-error-message:after {
    top: auto !important;
    bottom: -6px;
    border-top: 6px solid #f8f8f8 !important;
    border-bottom: none !important;
}

.dropzone .dz-preview .dz-image {
    border-radius: 10px !important;
}

.dropzone .dz-preview .dz-remove {
    color: #333 !important;
    font-weight: 500 !important;
    margin-top: 10px !important;
}

.dropzone .dz-preview .dz-success-mark, 
.dropzone .dz-preview .dz-error-mark {
    margin-top: -40px !important;
}


/*========== ALERTS ==========*/

.alert {
    border-radius: var(--border-radius-primary);
    margin: 0;
    padding: 0.5rem 0.8rem;
    text-align: left;
    font-size: var(--text-xs) !important;
    font-weight: 500;
    border: 1px solid var(--border-color-primary);
}

.alert-secondary,
a.alert-secondary:hover {
    color: var(--text-color-secondary);
    background-color: var(--background-color-secondary);
    border-color: var(--background-color-secondary);
}

.alert-danger,
a.alert-danger:hover {
    color: var(--red-color-primary);
    background-color: var(--red-color-secondary);
    border-color: var(--red-color-secondary);
}

.alert-primary,
.alert-success,
a.alert-primary:hover,
a.alert-success:hover {
    color: var(--green-color-primary);
    background-color: var(--green-color-secondary);
    border-color: var(--green-color-secondary);
}

.alert-info,
a.alert-info:hover {
    color: var(--blue-color-primary);
    background-color: var(--blue-color-secondary);
    border-color: var(--blue-color-secondary);
}

.alert-warning,
a.alert-warning:hover {
    color: var(--yellow-color-primary);
    background-color: var(--yellow-color-secondary);
    border-color: var(--yellow-color-secondary);
}

.alert-pill {
    border-radius: 5rem;
    padding: 0.2rem 0.6rem;
    width: fit-content;
    font-size: var(--text-xs);
    font-weight: 500;
}

.alert-dashed {
    border-style: dashed;
}

.alert svg,
.alert .fa,
.alert i {
    font-size: var(--text-sm) !important;
}

.indicator {
    background-color: grey;
    height: 0.5rem;
    width: 0.5rem;
    border-radius: 50%;
}

.indicator-primary {
    background-color: var(--green-color-primary);
}

.indicator-info {
    background-color: var(--blue-color-primary);
}

.indicator-warning {
    background-color: var(--yellow-color-primary);
}

.indicator-danger {
    background-color: var(--red-color-primary);
}

.indicator-default {
    border: 1px solid var(--border-color-primary);
    background-color: transparent;
}


/*========== BUTTONS ==========*/

/* INFO */

.btn-info {
    color: #009ef7 !important;
    background-color: #f1faff !important
}

.btn-info:hover, 
.btn-info:focus, 
.btn-info:active {
    color: #fff !important;
    background-color: #009ef7 !important;
}

.btn-dark-info {
    background-color: #009ef7 !important;
    color: #fff !important;
}

.btn-dark-info:hover, 
.btn-dark-info:focus, 
.btn-dark-info:active {
    color: #fff !important;
    background-color: #24c6db !important;
}

.btn-gray-info {
    color: #009ef7 !important;
    background-color: #f5f8fa !important;
}

.btn-gray-info:hover, 
.btn-gray-info:focus, 
.btn-gray-info:active {
    color: #fff !important;
    background-color: #009ef7 !important;
}

/* WARNING */

.btn-warning {
    color: white;
    background-color: var(--yellow-color-primary);
    border-color: var(--yellow-color-primary);
}

.btn-warning:hover, 
.btn-warning:focus, 
.btn-warning:active {
    color: white;
    background-color: var(--yellow-color-primary-hover);
    border-color: var(--yellow-color-primary-hover);
}

.btn-outline-warning {
    border: 1px solid var(--yellow-color-primary) !important;
    color: var(--yellow-color-primary) !important;
}

.btn-outline-warning:hover,
.btn-outline-warning:focus,
.btn-outline-warning:active {
    color: white;
    background-color: var(--yellow-color-primary);
    border-color: var(--yellow-color-primary);
}

/* DANGER */

.btn-danger,
.btn-dark-danger,
.btn-gray-danger {
    color: var(--white);
    background-color: var(--red-color-primary);
    border-color: var(--red-color-primary);
}

.btn-danger:not(:disabled):not(.disabled).active, 
.btn-danger:not(:disabled):not(.disabled):active,
.show>.btn-danger.dropdown-toggle,
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-dark-danger:hover,
.btn-dark-danger:focus,
.btn-dark-danger:active,
.btn-gray-danger:hover,
.btn-gray-danger:focus,
.btn-gray-danger:active {
    color: var(--white);
    background-color: var(--red-color-primary-hover);
    border-color: var(--red-color-primary-hover);
}

.btn-outline-danger {
    color: var(--red-color-primary) !important;
    border: 1px solid var(--red-color-primary) !important;
}

.btn-outline-danger:hover,
.btn-outline-danger:focus,
.btn-outline-danger:active {
    color: #fff !important;
    background-color: var(--red-color-primary) !important;
}

/* WHITE */

.btn-white:hover, 
.btn-white:focus, 
.btn-white:active {
    background-color: #fff !important;
}

/* MORE */

.btn-icon,
.btn-icon:hover,
.btn-icon:focus,
.btn-icon:active {
    width: 2.8rem;
    position: relative;
    padding: 0.5rem 0.8rem;
    background-color: var(--background-color-secondary) !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-icon.primary {
    color: var(--green-color-primary) !important;
}

.btn-icon.dark-primary {
    background-color: var(--green-color-primary) !important;
    color: #fff !important;
}

.btn-icon.info {
    color: #009ef7 !important;
}

.btn-icon.warning {
    color: var(--yellow-color-primary) !important;
}

.btn-icon.danger {
    color: var(--red-color-primary) !important;
}

.btn-icon.default {
    color: var(--text-color-secondary) !important;
}

.btn-transparent {
    background-color: transparent !important;
    border: 1px solid var(--border-color-primary) !important;
}

.btn-transparent:not(.selectpicker):not(.bootstrap-select):hover,
.btn-transparent:not(.selectpicker):not(.bootstrap-select):focus,
.btn-transparent:not(.selectpicker):not(.bootstrap-select):active {
    background-color: var(--background-color-secondary) !important;
    border: 1px solid var(--border-color-secondary) !important;
}




/*========== SWITCH ==========*/

.switch-wrapper {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 0.2rem;
    cursor: pointer;
    font-weight: inherit;
}

.switch-wrapper .label {
    margin-left: 1rem;
}

.switch {
    position: relative;
    display: inline-block;
    width: 2rem;
    height: 1.2rem;
    margin: 0;
}

.switch input {
  display: none;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--background-color-tertiary);
}

.slider:before {
    position: absolute;
    content: "";
    height: 1rem;
    width: 1rem;
    left: 1px;
    bottom: 1.5px;
    background-color: var(--background-color-primary);
}

.slider.round {
  border-radius: 5rem;
}

.slider.round:before {
  border-radius: 50%;
}

input:checked + .slider,
input.default:checked + .slider {
    background-color: var(--green-color-primary);
}

input.primary:checked + .slider {
  background-color: var(--green-color-primary);
}

input.success:checked + .slider {
  background-color: var(--green-color-primary);
}

input.info:checked + .slider {
  background-color: var(--green-color-primary);
}

input.warning:checked + .slider {
  background-color: var(--green-color-primary);
}

input.danger:checked + .slider {
  background-color: var(--green-color-primary);
}

input:checked + .slider:before {
    transform: translateX(14px);
}


/*========== FILE ==========*/

.custom-file {
    position: relative;
    display: inline-block;
    margin-bottom: 0;
}

.custom-file-input {
    position: relative;
    z-index: 2;
    margin: 0;
    padding: 0;
    opacity: 0;
    outline: none !important;
    height: 38px;
}

.custom-file-label {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    left: 0;
    z-index: 1;
    line-height: 1.2;
    display: block;
    height: 38px;
    padding: 7px 15px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    background-color: #fff !important;
    background-clip: padding-box;
    color: #3f4254;
    border: 1px solid #eff2f5;
    border-radius: 8px;
    outline: none !important;
    box-shadow: none !important;
    -webkit-transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
}

.custom-file-label:focus, 
.custom-file-label:active {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    background-color: #fff;
    border-color: #eaf8f0;
    outline: none !important;
}

.custom-file-label:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    display: block;
    line-height: 1.2;
    content: "Browse";
    background-color: #fff;
    border-left: none;
    border-radius: 0 8px 8px 0;
    height: 100%;
    padding: 10px 15px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
}

.custom-select {
    font-size: 14px !important;
}

.custom-select option {
    background-color: #fff;
    color: rgb(90,90,90);
    border: none;
    transition: .15s ease-in-out;
}

.custom-select option:hover {
    background-color: #eff2f5 !important;
}

.img-upload-wrapper {
    height: 8rem;
    width: 8rem;
    border-radius: var(--border-radius-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    border: 1px solid var(--border-color-primary);
    overflow: hidden;
}

.img-upload-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.btn-upload-file,
.btn-upload-file:hover,
.btn-upload-file:active,
.btn-upload-file:focus {
    position: absolute;
    top: 1rem;
    left: 7rem;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    padding: 0;
    min-height: 0;
}

.btn-remove-file,
.btn-remove-file:hover,
.btn-remove-file:focus,
.btn-remove-file:active {
    position: absolute;
    bottom: 4rem;
    left: 7rem;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    padding: 0;
    min-height: 0;
}

.upload-modal .modal-dialog,
.modal.upload .modal-dialog {
    width: 35rem;
}

.img-upload-wrapper .custom-file-input {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
}

/* UPLOAD MODAL */

.file-upload-wrapper.modal-styling {
    cursor: pointer;
    min-height: 150px;
    background: white;
    padding: 20px 20px;
    width: 100%;
    border-radius: 10px !important;
    border: 4px dashed rgb(229,245,231) !important;
    min-width: 500px;
    position: relative;
}

.file-upload-wrapper.modal-styling .upload-message {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    outline: inherit;
    margin: 0 !important;
    font-size: 14px;
    font-weight: 500;
    color: #a1a5b7;
    text-align: center;
    width: 65%;
}

.file-upload-wrapper.modal-styling .file {
    opacity: 0;
    width: 0.1px;
    height: 0.1px;
    position: absolute;
}

.file-upload-wrapper.modal-styling .file-input label {
    display: block;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0 !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    padding: 30px !important;
}

.file-upload-wrapper.modal-styling .file-name {
    font-weight: 500;
    color: #2ebb6e !important;
    width: 80%;
    margin-bottom: 0 !important;
    text-align: center;
}


/********************************** TABLE **********************************/

.table-responsive {
    width: 100% !important;
    height: 100% !important;
}

table,
.table {
    color: inherit;
    border: none !important;
    margin-bottom: 0 !important;
}

.table-fixed {
    table-layout: fixed !important;
}

.data-table {
    border: none !important;
    background-color: var(--background-color-primary);
    border-collapse: collapse;
    width: 100%;
}

.data-table thead {
    position: relative;
}

.data-table thead th, 
.data-table tbody tr th {
    font-size: var(--text-sm) !important;
    font-weight: 500;
    color: var(--text-color-primary);
    border-bottom: 1px solid var(--border-color-secondary);
    vertical-align: middle;
    padding: 1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border-top: none;
}

.data-table.table-sm thead th,
.data-table.table-sm tbody th,
.data-table.table-sm tbody td {
    padding: 0.2rem 0.5rem !important;
}

.data-table thead th.rotated,
.data-table tbody tr th.rotated {
    background-color: inherit !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 4rem !important;
}

.data-table thead th.rotated div,
.data-table tbody tr th.rotated div {
    transform: translate(0.5rem, 0px) rotate(310deg);
    width: 2rem;
}

.data-table thead th b, .data-table tbody tr th b {
    font-weight: inherit !important;
}

.data-table thead th:first-child, 
.data-table tbody tr th:first-child {
    padding-left: 0 !important;
}

.data-table thead th:last-child, 
.data-table tbody tr th:last-child {
    padding-right: 0 !important;
    text-align: right !important;
    justify-content: flex-end !important;
}

.data-table tbody tr th.text-dark,
.data-table tbody tr td.text-dark {
    color: var(--text-color-primary) !important;
}

.data-table tbody+tbody,
.table tbody + tbody {
    border-top: 1px solid var(--background-color-tertiary);
}

.data-table tbody tr:hover td {
    background-color: var(--background-color-secondary) !important;
}

.data-table.no-hover tbody tr:hover td {
    background-color: var(--background-color-primary) !important;
}

.data-table tbody tr td {
    padding: 1rem;
    vertical-align: middle;
    font-size: var(--text-sm) !important;
    border-top: none;
    border-bottom: 1px solid var(--border-color-secondary);
    line-height: 1.5;
    background-color: var(--background-color-primary);
    color: var(--text-color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 12rem;
}

.data-table tbody tr td:first-child {
    padding-left: 0 !important;
}

.data-table tbody tr td:last-child {
    padding-right: 0 !important;
    text-align: right !important;
    justify-content: flex-end !important;
}

.data-table .highlighted {
    color: var(--green-color-primary) !important;
}

.data-table.reports td, 
.data-table.reports th {
    padding: 0.2rem 0.5rem !important;
}

.table td,
.table th {
    border-top: 1px solid var(--border-color-secondary);
}

.table-borderless tbody + tbody, 
.table-borderless td, 
.table-borderless th, 
.table-borderless thead th {
    border: 0 !important;
}

.data-table tr td.p-0 {
    padding: 0 !important;
}

.data-table input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.data-table .checkmark {
    position: relative;
    height: 1rem;
    width: 1rem;
    background-color: var(--background-color-tertiary);
    border-radius: var(--border-radius-primary);
    display: block;
    margin: 0 auto;
}

.data-table input:checked ~ .checkmark {
    background-color: var(--green-color-primary);
}

/* dataTable PLUGIN */

.dataTable {
    margin-top: 20px;
    margin-bottom: 20px !important;
}

.dataTables_info {
    font-size: var(--text-xs);
    font-weight: 500;
    color: var(--text-color-secondary);
}

.dataTables_paginate {
    float: right;
}

.dataTables_wrapper .dt-buttons {
    float: right;
    margin-bottom: 20px;
}

.dataTables_filter {
    float: right;
    margin-bottom: 1.5rem;
}

.dataTables_filter label {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    margin: 0;
}

.dataTables_filter label input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin: 0 !important;
}

.dataTables_filter label .input-group-text {
    margin-left: -1px;
    border-left: none;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    padding-top: 0.65rem;
    padding-bottom: 0.6rem;
}

.dataTables_wrapper tbody tr td.dataTables_empty {
    text-align: center !important;
    justify-content: center !important;
}

.dataTables_wrapper .row {
    margin: 0;
}

.dataTables_wrapper .row:not(:first-child):not(:last-child) {
    flex-grow: 1;
}

.dataTables_wrapper .col-sm-12:first-child,
.dataTables_wrapper .col-md-6:first-child {
    padding-left: 0 !important;
}

.dataTables_wrapper .col-sm-12:last-child,
.dataTables_wrapper .col-md-6:last-child {
    padding-right: 0 !important;
}

.dataTables_wrapper {
    height: 100% !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: stretch !important;
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
}

.dataTables_wrapper .row:last-child {
    height: 100%;
    -webkit-box-align: flex-end;
    -ms-flex-align: flex-end;
    align-items: flex-end;
    margin-top: 20px !important;
}

.dataTables_wrapper .row:nth-child(2) .col-sm-12 {
    overflow-x: auto;
    overflow-y: hidden;
}

.data-tables-length-wrapper select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    min-height: 2rem;
    text-align: center;
    margin-left: 0.5rem;
    padding: 0.5rem;
}

div.dataTables_wrapper div.dataTables_processing {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: fit-content;
    margin: 0;
    border: none;
    background-color: transparent;
    color: #2ebb6e;
}

div.dataTables_wrapper div.dataTables_processing .spinner-border {
    display: none !important;
}

div.dataTables_processing > div:last-child > div {
    width: 30px;
    height: 30px;
    background: rgb(0 177 70);
}

div.dataTables_processing > div:last-child > div:nth-child(1) {
    left: -15px;
    animation: datatables-loader-1 .6s infinite;
}

div.dataTables_processing>div:last-child>div:nth-child(2) {
    left: -3px;
    animation: datatables-loader-2 .6s infinite;
}

table thead > tr > th.sorting_asc,
table thead > tr > th.sorting_desc {
    color: inherit !important;
}

table.dataTable thead > tr > th.sorting:before,
table.dataTable thead > tr > th.sorting_asc:before,
table.dataTable thead > tr > th.sorting_desc:before,
table.dataTable thead > tr > th.sorting_asc_disabled:before,
table.dataTable thead > tr > th.sorting_desc_disabled:before,
table.dataTable thead > tr > td.sorting:before,
table.dataTable thead > tr > td.sorting_asc:before,
table.dataTable thead > tr > td.sorting_desc:before,
table.dataTable thead > tr > td.sorting_asc_disabled:before,
table.dataTable thead > tr > td.sorting_desc_disabled:before {
    bottom: 40%;
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    content: "\f062";
}

table.dataTable thead>tr>th.sorting:after, 
table.dataTable thead>tr>th.sorting_asc:after,
table.dataTable thead>tr>th.sorting_desc:after,
table.dataTable thead>tr>th.sorting_asc_disabled:after, 
table.dataTable thead>tr>th.sorting_desc_disabled:after, 
table.dataTable thead>tr>td.sorting:after,
table.dataTable thead>tr>td.sorting_asc:after, 
table.dataTable thead>tr>td.sorting_desc:after,
table.dataTable thead>tr>td.sorting_asc_disabled:after,
table.dataTable thead>tr>td.sorting_desc_disabled:after {
    top: 40%;
    font-family: "Font Awesome 6 Pro";
    content: "\f063";
}

table.dataTable thead>tr>th.sorting:before,
table.dataTable thead>tr>th.sorting:after, 
table.dataTable thead>tr>th.sorting_asc:before,
table.dataTable thead>tr>th.sorting_asc:after, 
table.dataTable thead>tr>th.sorting_desc:before, 
table.dataTable thead>tr>th.sorting_desc:after, 
table.dataTable thead>tr>th.sorting_asc_disabled:before, 
table.dataTable thead>tr>th.sorting_asc_disabled:after,
table.dataTable thead>tr>th.sorting_desc_disabled:before, 
table.dataTable thead>tr>th.sorting_desc_disabled:after, 
table.dataTable thead>tr>td.sorting:before,
table.dataTable thead>tr>td.sorting:after, 
table.dataTable thead>tr>td.sorting_asc:before, 
table.dataTable thead>tr>td.sorting_asc:after,
table.dataTable thead>tr>td.sorting_desc:before, 
table.dataTable thead>tr>td.sorting_desc:after, 
table.dataTable thead>tr>td.sorting_asc_disabled:before, 
table.dataTable thead>tr>td.sorting_asc_disabled:after, 
table.dataTable thead>tr>td.sorting_desc_disabled:before, 
table.dataTable thead>tr>td.sorting_desc_disabled:after {
    opacity: 0;
}

table.dataTable thead>tr>th.sorting_asc:before,
table.dataTable thead>tr>th.sorting_desc:after,
table.dataTable thead>tr>td.sorting_asc:before, 
table.dataTable thead>tr>td.sorting_desc:after {
    opacity: 1;
}

/********************************** MODAL / POPOVER **********************************/

/* ERROR / DANGER / WARNING */

.error-modal .modal-header,
.danger-modal .modal-header,
.warning-modal .modal-header,
.alert-modal .modal-header {
    justify-content: center;
    padding-bottom: 0;
}

.error-modal .modal-title,
.danger-modal .modal-title,
.warning-modal .modal-title,
.alert-modal .modal-title {
    text-align: center;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    gap: 1rem;
}

.error-modal .modal-body,
.danger-modal .modal-body,
.warning-modal .modal-body,
.alert-modal .modal-body {
    text-align: center;
}

.error-modal .modal-footer,
.danger-modal .modal-footer,
.warning-modal .modal-footer,
.alert-modal .modal-footer {
    justify-content: center;
}

.error-modal .modal-header i,
#error_modal .modal-header i,
.error-modal .modal-header .fa,
#error_modal .modal-header .fa,
.error-modal .modal-header svg,
#error_modal .modal-header svg {
    height: 5rem;
    width: 5rem;
    color: var(--red-color-primary);
    -webkit-animation: hithere 1s ease 1;
    animation: hithere 1s ease 1;
    font-size: 5rem;
    line-height: 1;
}

.warning-modal .modal-header .fa,
.warning-modal .modal-header svg,
.warning-modal .modal-header i {
    height: 5rem;
    width: 5rem;
    color: var(--yellow-color-primary);
    -webkit-animation: hithere 1s ease 1;
    animation: hithere 1s ease 1;
    font-size: 5rem;
    line-height: 1;
}

.alert-modal .modal-header .fa,
.alert-modal .modal-header svg,
.alert-modal .modal-header i {
    height: 5rem;
    width: 5rem;
    color: var(--text-color-primary);
    -webkit-animation: hithere 1s ease 1;
    animation: hithere 1s ease 1;
    font-size: 5rem;
    line-height: 1;
}

@keyframes hithere {
    30% {
        transform: scale(1.2);
    }

    40%, 60% {
        transform: rotate(-20deg) scale(1.2);
    }

    50% {
        transform: rotate(20deg) scale(1.2);
    }

    70% {
        transform: rotate(0deg) scale(1.2);
    }

    100% {
        transform: scale(1);
    }
}


/* IFRAME */

.modal-iframe {
    border: none;
    min-width: 600px;
    min-height: 600px;
    width: 100%;
    height: 100%;
}

body.modal-iframe-body {
    background-color: transparent !important;
    overflow-x: hidden !important;
}

.modal-iframe-body .container {
    padding: 0 !important;
    max-width: none !important;
    width: 100% !important;
}

.modal-iframe-body .row.f-1 {
    margin: 0 !important;
}

.modal-iframe-body form#ccform {
    margin: 0 !important;
}

.modal-iframe-body .col-xl-12.d-flex.flex-column {
    padding: 0 !important;
}

.modal-iframe-body .card.card-custom {
    box-shadow: none !important;
}

.modal-iframe-body .card-footer {
    background-color: transparent;
}

.modal-iframe-body footer,
.modal-iframe-body .page-functions-container {
    display: none !important;
}

/* FULL SCREEN */

.modal.full-screen {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    margin: 0;
    top: 0 !important;
    left: 0 !important;
    transform: none !important;
}

.modal.full-screen .modal-dialog {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    margin: 0;
    top: 0 !important;
    left: 0 !important;
    transform: none !important;
}

.modal.full-screen .modal-content {
    height: 100% !important;
    max-height: 100% !important;
    border-radius: 0 !important;
}

/* SEMI TRANSPARENT */

.modal.semi-transparent .modal-content {
    background-color: rgba(255, 255, 255, .75) !important;
}

.modal.semi-transparent .modal-header {
    background-color: transparent !important;
}

.modal.semi-transparent .modal-body {
    background-color: transparent !important;
}

.modal.semi-transparent .modal-footer {
    background-color: transparent !important;
}

/*========== JUMPING DOTS ==========*/

.jumping-dots {
    position: relative;
    margin-bottom: 30px;
}

.dot {
    width: 18px;
    height: 18px;
    background: #2ebb6e;
    display: inline-block;
    border-radius: 50%;
    right: 0px;
    bottom: 0px;
    margin: 0px 4px;
    position: relative;
    animation: jump 1s infinite;
}

.jumping-dots .dot-1 {
    -webkit-animation-delay: 100ms;
    animation-delay: 100ms;
}

.jumping-dots .dot-2 {
    -webkit-animation-delay: 200ms;
    animation-delay: 200ms;
}

.jumping-dots .dot-3 {
    -webkit-animation-delay: 300ms;
    animation-delay: 300ms;
}

@keyframes jump {
   0%   {bottom: 0px;}
   20%  {bottom: 5px;}
   40%  {bottom: 0px;}
}

/*========== POPOVER ==========*/

.popover {
    border: none;
    box-shadow: none;
    border-radius: var(--border-radius-primary);
    background-color: var(--text-color-primary);
    transition: none;
    z-index: 100000;
}

.bs-popover-auto[x-placement^=top] > .arrow::before,
.bs-popover-top > .arrow::before {
    border-top-color: transparent;
}

.bs-popover-auto[x-placement^=bottom] > .arrow::before,
.bs-popover-bottom > .arrow::before {
    border-bottom-color: transparent;
}

.bs-popover-right .arrow::before,
.bs-popover-auto[x-placement^="right"] .arrow::before {
    left: 0;
    border-right-color: transparent;
}

.bs-popover-left .arrow::before,
.bs-popover-auto[x-placement^="left"] .arrow::before {
    left: 0;
    border-left-color: transparent;
}

.bs-popover-auto[x-placement^=top] > .arrow::after, .bs-popover-top > .arrow::after {
    bottom: 2px;
    border-top-color: var(--text-color-primary);
}

.bs-popover-auto[x-placement^=left] > .arrow::after, .bs-popover-left > .arrow::after {
    right: 2px;
    border-left-color: var(--text-color-primary);
}

.bs-popover-auto[x-placement^=bottom] > .arrow::after, .bs-popover-bottom > .arrow::after {
    top: 2px;
    border-bottom-color: var(--text-color-primary);
}

.bs-popover-auto[x-placement^=right] > .arrow::after, .bs-popover-right > .arrow::after {
    left: 2px;
    border-right-color: var(--text-color-primary);
}

.popover-header {
    padding: 0.2rem 0.5rem 0;
    font-size: var(--text-sm) !important;
    background-color: transparent;
    border: none;
    border-top-left-radius: var(--border-radius-primary);
    border-top-right-radius: var(--border-radius-primary);
    color: var(--white);
}

.popover-body {
    padding: 0.2rem 0.5rem;
    color: var(--white);
    font-size: var(--text-xs) !important;
    white-space: pre-wrap;
}

.note-popover .popover-content>.note-btn-group {
    background-color: var(--text-color-primary);
    margin: 0;
}

.note-popover .popover-content {
    display: flex;
    width: 100%;
}

/*========== DATE PICKER ==========*/

.bootstrap-datetimepicker-widget .fa-calendar-check, 
.bootstrap-datetimepicker-widget .fa-trash {
    height: 15px;
    width: 15px;
    margin: 10px 0;
}

.bootstrap-datetimepicker-widget {
    border-radius: var(--border-radius-primary);
    overflow: hidden;
    border: 1px solid var(--border-color-primary);
    box-shadow: var(--box-shadow-primary);
    z-index: 10000;
    padding: 0 !important;
    width: auto !important;
    min-width: 0;
}

.bootstrap-datetimepicker-widget .datepicker {
    width: 22rem;
}

.bootstrap-datetimepicker-widget table thead tr:nth-child(1) th,
.bootstrap-datetimepicker-widget table thead tr:nth-child(1) th:hover {
    border: none;
    padding: 1rem;
    font-size: var(--text-sm) !important;
    font-weight: 500;
    background-color: transparent;
}

.bootstrap-datetimepicker-widget table thead tr:nth-child(1) th:first-child {
    padding-right: 0;
}

.bootstrap-datetimepicker-widget table thead tr:nth-child(1) th:last-child {
    padding-left: 0;
}

.bootstrap-datetimepicker-widget table th.disabled,
.bootstrap-datetimepicker-widget table th.disabled:hover {
    opacity: 0.5;
    cursor: not-allowed;
}

.bootstrap-datetimepicker-widget table th.disabled span {
    opacity: 0.5;
    cursor: not-allowed;
}

.bootstrap-datetimepicker-widget table thead tr:nth-child(2) th {
    font-size: var(--text-xs) !important;
    color: var(--text-color-secondary);
    font-weight: 500;
    border: none;
    height: auto;
    line-height: inherit;
    width: auto;
    padding: 0.5rem;
    vertical-align: middle;
}

.bootstrap-datetimepicker-widget table td.day {
    font-size: var(--text-sm) !important;
    color: var(--text-color-primary);
    width: 2rem;
    height: 2rem;
    padding: 0.5rem;
    border: none;
    vertical-align: middle;
}

.bootstrap-datetimepicker-widget table td.day:hover {
    border-radius: 50%;
    background-color: var(--green-color-primary);
    color: var(--white);
    text-shadow: none;
}

.bootstrap-datetimepicker-widget table td.active {
    border-radius: 50%;
    background-color: var(--green-color-primary);
    color: var(--white);
    text-shadow: none;
}

.bootstrap-datetimepicker-widget table td.active:hover {
    background-color: var(--green-color-primary-hover);
}

.bootstrap-datetimepicker-widget table td.old, 
.bootstrap-datetimepicker-widget table td.new {
    color: var(--text-color-secondary);
}

.bootstrap-datetimepicker-widget table td.today:before,
.bootstrap-datetimepicker-widget table td.active.today:before {
    border-color: var(--green-color-primary);
    border-radius: 50%;
}

.bootstrap-datetimepicker-widget table td.cw {
    font-size: var(--text-xs) !important;
    color: var(--text-color-secondary);
    font-weight: 500;
    border: none;
    height: auto;
    line-height: inherit;
    width: auto;
    padding: 0.8rem 0.5rem;
    vertical-align: middle;
}

/*========== TIME PICKER ==========*/

.bootstrap-datetimepicker-widget.usetwentyfour .btn {
    width: 100%;
    height: 100%;
}

.bootstrap-datetimepicker-widget .timepicker-hour, 
.bootstrap-datetimepicker-widget .timepicker-minute, 
.bootstrap-datetimepicker-widget .timepicker-second {
    font-size: var(--text-sm) !important;
    font-weight: 500;
    color: var(--text-color-primary);
    width: 100%;
    height: 100%;
}

.bootstrap-datetimepicker-widget .separator {
    border: none;
}

.bootstrap-datetimepicker-widget .fa-arrow-up, 
.bootstrap-datetimepicker-widget .fa-arrow-down {
    background-image: none;
    font-size: var(--text-sm) !important;
}

.bootstrap-datetimepicker-widget .btn {
    color: var(--text-color-primary);
}

.bootstrap-datetimepicker-widget .picker-switch {
    text-align: center;
}

.bootstrap-datetimepicker-widget table td span {
    width: 3.5rem;
    height: 3.5rem;
    font-size: var(--text-sm) !important;
    color: var(--text-color-primary);
    padding: 0.5rem;
    border: none;
    vertical-align: middle;
    margin: 0;
    line-height: 3;
}

.bootstrap-datetimepicker-widget table td a.btn {
    border: none;
}

.bootstrap-datetimepicker-widget table td span:hover,
.bootstrap-datetimepicker-widget table td a.btn:hover {
    border-radius: 50%;
    background-color: var(--green-color-primary);
    color: var(--white);
    text-shadow: none;
}

.bootstrap-datetimepicker-widget .timepicker-picker table td span:hover,
.bootstrap-datetimepicker-widget .timepicker-picker table td a.btn:hover {
    background-color: transparent;
    color: var(--text-color-primary);
}

.bootstrap-datetimepicker-widget table td span.active,
.bootstrap-datetimepicker-widget table td a.btn.active {
    border-radius: 50%;
    background-color: var(--green-color-primary);
    color: var(--white);
    text-shadow: none;
}

.bootstrap-datetimepicker-widget table td span.active:hover,
.bootstrap-datetimepicker-widget table td a.btn.active:hover {
    background-color: var(--green-color-primary-hover);
}

.bootstrap-datetimepicker-widget table td span.old {
    color: var(--text-color-secondary);
}

.bootstrap-datetimepicker-widget.usetwentyfour td.minute,
.bootstrap-datetimepicker-widget.usetwentyfour td.hour {
    width: 2rem;
    height: 2rem;
    font-size: var(--text-sm) !important;
    color: var(--text-color-primary);
    padding: 0.5rem;
    border: none;
    vertical-align: middle;
    margin: 0;
    line-height: 1.8;
}

.bootstrap-datetimepicker-widget.usetwentyfour td.minute:hover,
.bootstrap-datetimepicker-widget.usetwentyfour td.hour:hover {
    border-radius: 50%;
    background-color: var(--green-color-primary);
    color: var(--white);
    text-shadow: none;
}

.bs-actionsbox, .bs-donebutton, .bs-searchbox {
    padding: 0.5rem;
}

/*========== INM LOOKUP ==========*/

.inm-lookup .content-title {
    font-size: var(--text-sm) !important;
}

.inm-lookup option {
    height: 25px;
    padding: 3px 0;
    font-size: 14px;
    color: #212529;
    transition: .15s ease-in-out;
}

.inm-lookup option:hover {
    color: #2ebb6e !important;
}

/********************************** PAGINATION **********************************/

.pagination {
    margin: 0;
    vertical-align: middle;
    gap: 0.5rem;
}

.page-item:first-child .page-link {
    margin-left: 0;
    color: #5e6278 !important;
}

.pagination > li > a,
.pagination > li > span,
.pagination > li > a:hover,
.pagination > li > span:hover,
.page-item:last-child .page-link {
    color: var(--text-color-primary);
    vertical-align: middle;
    background-color: var(--background-color-primary);
    border-radius: var(--border-radius-primary);
    transition: none;
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 0.375rem;
    border-color: var(--border-color-primary);
    border-width: 1px;
    border-style: solid;
    font-weight: 500;
    font-size: var(--text-sm) !important;
    line-height: 1.125rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    height: 100%;
}

.pagination > li > a .svg-inline--fa, 
.pagination > li > span .svg-inline--fa {
    height: 0.8rem !important;
    width: 0.8rem !important;
    margin: 0 !important;
}

.pagination > li > a:hover,
.pagination > li > span:hover {
    border: 1px solid var(--border-color-secondary);
    background-color: var(--background-color-secondary);
}

.page-item.active .page-link {
    color: var(--white);
    background-color: var(--green-color-primary);
    border-color: var(--green-color-primary);
    box-shadow: none;
}

.page-item.disabled .page-link {
    height: 100%;
    color: var(--text-color-primary);
    border-color: var(--border-color-primary);
}

/********************************** FOOTER **********************************/


footer {
    font-size: var(--text-xs) !important;
    font-weight: 500;
    color: var(--text-color-secondary);
}

footer a {
    color: inherit;
}

footer img {
    object-fit: contain;
    height: 0.75rem;
}

footer .container {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

.print--only {
    display: none !important;
}

/*========== MEDIA ==========*/

@media print {
    :root {
        --text-base: 14pt;
        --text-4xl: 22pt;
        --text-2xl: 18pt;
        --text-xl: 16pt;
        --text-sm: 12pt;
        --text-xs: 10pt;
        --background-color-secondary: rgb(255 255 255);
        --border-radius-primary: 0;
    }

    @page {
        margin: 12mm 12mm 12mm 24mm;
    }

    iframe {
        margin: 0;
    }

    body,
    html {
        overflow: visible;
        height: auto;
    }

    body {
        margin: 0;
        padding: 0;
        background-color: var(--background-color-primary);
    }

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

    .container {
        max-width: 100% !important;
        width: 100% !important;
        padding: 0 !important;
    }

    .card {
        border: none !important;
    }

    ::-webkit-scrollbar {
        display: none;
    }

    footer.footer {
        display: none !important;
    }

    .container-inner {
        margin: 0 !important;
    }

    .col-12.d-flex.flex-column {
        padding: 0 10px 0 0 !important;
    }

    .page-footer-left {
        display: block !important;
    }
            
    .page-footer-left:after {
        content: "";
        position: fixed;
        bottom: 0;
        left: 0;
    }

    .page-footer-right {
        display: block !important;
        position: fixed;
        content: url(/navimg/logo/inm-simple.png);
        bottom: 0;
        right: 0;
        height: 1rem;
        width: auto;
    }

    .print-page-break {
        page-break-before: avoid !important;
        page-break-after: always !important;
    }

    table {
        page-break-inside: auto;
    }

    tr {
        page-break-inside: avoid;
        page-break-after: auto;
    }

    thead {
        display: table-header-group;
    }
    
    tfoot {
        display: table-header-group;
    }

    .card.card-custom {
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    .card-footer,
    .card-header {
        border-radius: 0 !important;
        padding: 0 !important;
    }

    .card-body {
        padding-left: 0;
        padding-right: 0;
    }

    .fixed-functions-container, 
    .separator,
    .btn-print {
        display: none !important;
    }

    footer,
    #InmFooter,
    #InmFooterMobile,
    .page-functions-container {
        display: none !important;
    }

    .btn, .print-hide {
        display: none !important;
    }

    .print--only {
        display: block !important;
    }

    .print--hide {
        display: none !important;
    }

    table.dataTable > thead .sorting_desc:before,
    table.dataTable > thead .sorting:before,
    table.dataTable > thead .sorting_asc:before,
    table.dataTable > thead .sorting_desc:before,
    table.dataTable > thead .sorting_asc_disabled:before,
    table.dataTable > thead .sorting_desc_disabled:before,
    table.dataTable > thead .sorting_desc:after,
    table.dataTable > thead .sorting:after,
    table.dataTable > thead .sorting_asc:after,
    table.dataTable > thead .sorting_desc:after,
    table.dataTable > thead .sorting_asc_disabled:after,
    table.dataTable > thead .sorting_desc_disabled:after {
        opacity: 0 !important;
        display: none !important;
    }

    #vimeo-record-extension,
    .modal,
    .popover {
        display: none !important;
    }

}

@media (max-width: 1300px) {
    .container {
        padding-top: 1rem;
    }
}

@media (max-width: 767px) {
    .modal-dialog {
        max-width: 90%;
        min-width: 0;
        width: 90%;
        margin: 0;
        top: 50% !important;
    }

    .small--hide {
        display: none !important;
    }

    .large--hide {
        display: block !important;
    }

    .large--hide.d-flex {
        display: flex !important;
    }

    .nav-tab-navbar {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .nav-tab-navbar .container {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .nav-tab-navbar .nav-title {
        font-size: 18px;
        margin-right: 15px;
    }

    .nav-tabs {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
    }

    .trailing {
        vertical-align: top;
    }

    .page-full-info .inner {
        width: 90%;
        padding: 2rem;
    }

    .page-full-info h1 {
        font-size: 1.6rem;
    }

    .page-full-info h2 {
        margin-bottom: 1.5rem;
        font-size: inherit;
    }

    .page-full-info img {
        width: 10rem;
    }

    .page-full-info .btn,
    .page-full-info .btn:focus,
    .page-full-info .btn:hover,
    .page-full-info .btn:active {
        margin-top: 1.5rem;
    }

    .flex-grow-sm {
        flex-grow: 1;
    }

    .page-loader .inm-dot {
        width: 8rem;
    }

    .page-loader .inm-normal {
        width: 8rem;
    }

    .data-table thead th:first-child {
        padding-left: 0 !important;
    }

    .data-table thead th:last-child {
        padding-right: 0 !important;
    }

    .data-table tbody tr td:first-child {
        padding-left: 0 !important;
    }

    .data-table tbody tr td:last-child {
        padding-right: 0 !important;
    }

    .page-nav {
        overflow: auto;
    }

    .dataTable {
        margin-top: 15px;
        margin-bottom: 15px !important;
    }

    .dataTables_info {
        font-size: 12px;
    }

    .dataTables_filter label .input-group-text {
        margin: 0 !important;
    }

    table.dataTable {
        table-layout: fixed !important;
        margin: 0 !important;
    }

    table.dataTable th {
        width: 90px !important;
        min-width: 90px !important;
        max-width: none !important;
        white-space: nowrap !important;
    }

    #configWidth {
        display: none;
    }

    footer.py-4 {
        -ms-flex: 0 0 40px;
        flex: 0 0 40px;
        max-height: 40px;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    footer .container {
        justify-content: end !important;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .page-functions-container {
        bottom: auto;
        top: 3rem;
    }

    #configHeight,
    #high_contrast,
    #scrollToTop,
    #scrollToBottom {
        display: none;
    }

    .body-title-wrapper {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .body-title-wrapper .d-flex.align-items-center {
        flex-grow: 1;
        width: 100%;
        flex-wrap: wrap;
    }

    .body-title-wrapper .d-flex.align-items-center .btn {
        flex-grow: 1;
        white-space: nowrap;
        width: calc(50% - 1rem);
    }

    #helpFunction #printHelp,
    #helpFunction #expandHelp {
        display: none;
    }

    .dataTables_wrapper .row:first-child {
        flex-wrap: nowrap;
        justify-content: space-between;
    }

    .dataTables_wrapper .row:first-child * {
        width: fit-content;
    }

    .dataTables_filter label input {
        width: 9rem !important;
    }
}