:root {
    --tbr-primary: #b476e5;
    --tbr-secondary: #0583d2;
    --tbr-bright-gray-50: #f6f6f9;
    --tbr-bright-gray-500: #6a708d;
    --tbr-bright-gray-950: #23242e;
    --tbr-gray-gray-700: #5e6278;
    --tbr-danger: #f1416c;
    --tbr-warning: #f6c000;
    --tbr-warning--basic: #ffc700;
    --tbr-success: #50cd89;
    --tbr-primary--light: #faf6fe;
    --tbr-secondary--light: #f0f8ff;
    --tbr-success--light: #e8fff3;
    --tbr-danger--light: #fff1f3;
    --bs-card-color: #6a708d;

    --tbr-bg-primary-light: rgba(180, 118, 229, 0.1);
    --tbr-bg-secondary-light: rgba(5, 131, 210, 0.1);
    --tbr-bg-success-light: rgba(80, 205, 137, 0.1);
    --tbr-bg-warning-light: rgba(246, 192, 0, 0.1);
    --tbr-bg-danger-light: rgba(241, 65, 108, 0.1);
    --tbr-bg-fibonacci-blue: rgba(13, 37, 91, 1);

    --tbr-bg-primary: #fcfcfc;
    --tbr-bg-secondary: #ffffff;
    --tbr-bg-form: #f6f6f9;
    --tbr-bg-form-checkbox: #f5f5f8;
    --tbr-bg-table-hover: #fcfcfc;
    --tbr-bg-auth: #f8f7fc;
}

[data-bs-theme="dark"] {
    --tbr-bg-primary: #0f1014;
    --tbr-bg-secondary: #15171c;
    --tbr-bg-form: #1b1c21;
    --tbr-bg-form-checkbox: #26272f;
    --tbr-bg-table-hover: #1b1c21;
    --tbr-bg-auth: #0f1014;
    --bs-menu-dropdown-bg-color: #15171c;
    --tbr-stage-color: #1f222a;
}

[data-bs-theme="light"] {
    --tbr-bg-primary: #fcfcfc;
    --tbr-bg-secondary: #ffffff;
    --tbr-bg-form: #f6f6f9;
    --tbr-bg-form-checkbox: #f5f5f8;
    --tbr-bg-table-hover: #fcfcfc;
    --tbr-bg-auth: #f8f7fc;
    --tbr-stage-color: #f6f6f9;
}

body,
html {
    font-family: "Lexend", sans-serif !important;
}

html a:not(.tbr_btn) {
    color: var(--tbr-secondary);
    transition: all 0.3s ease;
}

a:not(.btn):hover {
    opacity: 0.8;
    transition: all 0.3s ease;
}

.app-content .app-container {
    padding-bottom: 30px;
}

/* ===================================
 * Background colors.
=================================== */

.tbr_background--success {
    background-color: #50cd89;
}

@media (max-width: 991.98px) {
    .app-header {
        margin-bottom: 20px;
    }

    body:not([data-kt-app-toolbar-fixed-mobile="true"]) .app-toolbar {
        margin-top: 0 !important;
    }
}

/* ===================================
 * Font weight.
=================================== */
.tbr_font--weight-500 {
    font-weight: 500;
}

/* ===================================
 * Text colors.
=================================== */
.tbr_text--bright-gray-500 {
    color: var(--tbr-bright-gray-500);
}

.tbr_text--bright-gray-950 {
    color: var(--tbr-bright-gray-950);
}

.tbr_text--secondary {
    color: var(--tbr-secondary);
}

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

.tbr_text--warning {
    color: var(--tbr-warning) !important;
}

.tbr_text--danger {
    color: var(--tbr-danger) !important;
}

.tbr_text--success {
    color: var(--tbr-success) !important;
}

.tbr_text--subtitle {
    color: #5e6278;
    font-weight: bold;
}

.tbr_text--grey {
    color: #7780a1;
    font-size: 14px;
    font-weight: 500 !important;
}

.tbr_text--gray-gray-700 {
    color: var(--tbr-gray-gray-700) !important;
}

/* ===================================
 * Custom forms.
=================================== */
input.form-control,
select.form-control,
.like-form.form-control {
    min-height: 48px;
}

.form-control[disabled] {
    background-color: #7780a133;
    border-color: #7780a133 !important;
    font-weight: 500;
}

html .form-control,
html .form-select {
    border: 2px solid var(--tbr-bg-form);
    background-color: var(--tbr-bg-form);
    border-radius: 10px;
    box-shadow: none !important;
    outline: none !important;
    transition: all 0.3s ease;
    color: #7780a1 !important;
}

html .form-control:focus {
    background-color: var(--tbr-bg-primary);
    border-color: var(--tbr-primary);
    transition: all 0.3s ease;
}

html .form-control.text-success {
    border: 2px solid var(--tbr-bg-success-light);
    background-color: var(--tbr-bg-success-light);
    color: var(--tbr-success) !important;
}

html .form-control.text-danger {
    border: 2px solid var(--tbr-bg-danger-light);
    background-color: var(--tbr-bg-danger-light);
    color: var(--tbr-danger) !important;
}

html input[type="checkbox"] {
    width: 20px;
    height: 20px;
    border: none;
    background-color: var(--tbr-bg-form-checkbox);
    cursor: pointer;
}

html .checkbox-shopping input[type="checkbox"] {
    width: 30px;
    height: 30px;
    border: none;
    background-color: #f1f1f2;
    background-image: url("data:image/svg+xml, %3Csvg width='17' height='17' viewBox='0 0 17 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.4' d='M13.5793 4.22036H13.3126L11.0593 1.96703C10.8793 1.78703 10.5859 1.78703 10.3993 1.96703C10.2193 2.14703 10.2193 2.44036 10.3993 2.62703L11.9926 4.22036H5.5126L7.10594 2.62703C7.28594 2.44703 7.28594 2.1537 7.10594 1.96703C6.92594 1.78703 6.6326 1.78703 6.44594 1.96703L4.19927 4.22036H3.9326C3.3326 4.22036 2.08594 4.22037 2.08594 5.92703C2.08594 6.5737 2.21927 7.00036 2.49927 7.28036C2.65927 7.44703 2.8526 7.5337 3.05927 7.58036C3.2526 7.62703 3.45927 7.6337 3.65927 7.6337H13.8459C14.0526 7.6337 14.2459 7.62036 14.4326 7.58036C14.9926 7.44703 15.4193 7.04703 15.4193 5.92703C15.4193 4.22037 14.1726 4.22036 13.5793 4.22036Z' fill='%237780A1' /%3E%3Cpath d='M13.848 7.63422H3.65469C3.46135 7.63422 3.24802 7.62755 3.05469 7.57422L3.89469 12.7009C4.08135 13.8476 4.58135 15.1676 6.80135 15.1676H10.5414C12.788 15.1676 13.188 14.0409 13.428 12.7809L14.4347 7.57422C14.248 7.62089 14.048 7.63422 13.848 7.63422ZM8.74802 12.8342C7.18802 12.8342 5.91469 11.5609 5.91469 10.0009C5.91469 9.72755 6.14135 9.50089 6.41469 9.50089C6.68802 9.50089 6.91469 9.72755 6.91469 10.0009C6.91469 11.0142 7.73469 11.8342 8.74802 11.8342C9.76135 11.8342 10.5814 11.0142 10.5814 10.0009C10.5814 9.72755 10.808 9.50089 11.0814 9.50089C11.3547 9.50089 11.5814 9.72755 11.5814 10.0009C11.5814 11.5609 10.308 12.8342 8.74802 12.8342Z' fill='%237780A1' /%3E%3C/svg%3E") !important;
}

.checkbox-shopping .form-check-input:checked[type="checkbox"] {
    background-color: var(--tbr-secondary) !important;
    background-image: url("data:image/svg+xml, %3Csvg width='17' height='17' viewBox='0 0 17 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.4' d='M13.5793 4.22036H13.3126L11.0593 1.96703C10.8793 1.78703 10.5859 1.78703 10.3993 1.96703C10.2193 2.14703 10.2193 2.44036 10.3993 2.62703L11.9926 4.22036H5.5126L7.10594 2.62703C7.28594 2.44703 7.28594 2.1537 7.10594 1.96703C6.92594 1.78703 6.6326 1.78703 6.44594 1.96703L4.19927 4.22036H3.9326C3.3326 4.22036 2.08594 4.22037 2.08594 5.92703C2.08594 6.5737 2.21927 7.00036 2.49927 7.28036C2.65927 7.44703 2.8526 7.5337 3.05927 7.58036C3.2526 7.62703 3.45927 7.6337 3.65927 7.6337H13.8459C14.0526 7.6337 14.2459 7.62036 14.4326 7.58036C14.9926 7.44703 15.4193 7.04703 15.4193 5.92703C15.4193 4.22037 14.1726 4.22036 13.5793 4.22036Z' fill='white' /%3E%3Cpath d='M13.848 7.63422H3.65469C3.46135 7.63422 3.24802 7.62755 3.05469 7.57422L3.89469 12.7009C4.08135 13.8476 4.58135 15.1676 6.80135 15.1676H10.5414C12.788 15.1676 13.188 14.0409 13.428 12.7809L14.4347 7.57422C14.248 7.62089 14.048 7.63422 13.848 7.63422ZM8.74802 12.8342C7.18802 12.8342 5.91469 11.5609 5.91469 10.0009C5.91469 9.72755 6.14135 9.50089 6.41469 9.50089C6.68802 9.50089 6.91469 9.72755 6.91469 10.0009C6.91469 11.0142 7.73469 11.8342 8.74802 11.8342C9.76135 11.8342 10.5814 11.0142 10.5814 10.0009C10.5814 9.72755 10.808 9.50089 11.0814 9.50089C11.3547 9.50089 11.5814 9.72755 11.5814 10.0009C11.5814 11.5609 10.308 12.8342 8.74802 12.8342Z' fill='white' /%3E%3C/svg%3E") !important;
}

html .form-group label {
    color: #7780a1;
    font-size: 14px;
    font-weight: 500 !important;
}

.form-check.form-check-solid .form-check-input:not(:checked) {
    width: 22px;
    height: 22px;
    transition: all 0.3s ease;
    background-color: var(--tbr-bg-form-checkbox);
}

html input[type="radio"].form-check-input:checked {
    width: 22px;
    height: 22px;
    background-color: var(--tbr-primary);
    transition: all 0.3s ease;
}

html .input-group .input-group-text {
    background-color: var(--tbr-primary);
    color: white;
    border: none;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

html .input-group .input-group-text > svg path {
    fill: white;
}

.form-select.form-select-solid {
    background-color: var(--tbr-bg-form);
}

.form-select.form-select-solid[aria-expanded="true"] {
    border-color: var(--tbr-primary) !important;
    transition: all 0.3s ease;
}

select[readonly] ~ .select2 .form-select.form-select-solid {
    border: 2px solid var(--bs-gray-300);
    border-radius: 10px;
}

select[readonly].select2-hidden-accessible + .select2-container {
    pointer-events: none;
    touch-action: none;
    cursor: no-drop;
}

.form-check-custom {
    position: relative;
}

.form-check-custom .form-check-input:checked[type="radio"] {
    background-image: none !important;
}

.form-check-custom .form-check-input::before {
    content: "";
    position: absolute;
    top: 6px;
    left: 6px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--tbr-bg-form-checkbox);
}

.tbr_stage--icon .btn {
    width: 40px;
    height: 40px;
    display: flex;
    border-radius: 12px;
    align-items: center;
    justify-content: center;
    background-color: #faf6fe;
    padding: 0 !important;
}

[data-bs-theme="dark"] .tbr_stage--icon .btn {
    background-color: #23242e;
}

.tbr_stage--icon .btn-check:checked + .btn {
    background-color: var(--tbr-primary) !important;
}

.tbr_stage--icon .btn-check:checked + .btn > svg * {
    fill: white;
}

.tbr_stage--icon .btn-check:checked + .btn::after {
    content: url("../svg/icons/circle_check.svg");
    position: absolute;
    right: -2px;
    top: -7px;
}

.tbr_radio--btn .btn-check + .btn {
    background: var(--tbr-bg-secondary-light);
    color: var(--tbr-secondary);
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 10px;
}

.tbr_radio--btn .btn-check:checked + .btn {
    background: linear-gradient(100.39deg, #984ad3 4.74%, #0583d2 49.18%);
    border-radius: 6px;
    color: white;
    padding: 12px 20px 12px 20px;
}

.tbr_radio--btn.simple {
    gap: 32px;
}

.tbr_radio--btn.simple label {
    padding: 0 0 20px 0 !important;
}

.tbr_radio--btn.simple .btn-check + .btn {
    background: unset;
    color: #7780a1;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;
}

.tbr_radio--btn.simple .btn-check + .btn:hover {
    color: var(--tbr-secondary);
    transition: all 0.3s ease;
}

.tbr_radio--btn.simple .btn-check:checked + .btn {
    background: unset;
    border-radius: 6px;
    color: var(--tbr-secondary);
    padding: 12px 20px 12px 20px;
    transition: all 0.3s ease;
}

.tbr_radio--btn.simple .btn-check + .btn::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 0px;
    left: 0;
    bottom: 0;
    border-radius: 6px;
    transition: all 0.3s ease;
}

.tbr_radio--btn.simple .btn-check:checked + .btn::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 4px;
    left: 0;
    bottom: 0;
    border-radius: 6px;
    background-color: var(--tbr-secondary);
    transition: all 0.3s ease;
}

.tbr_radio--btn.simple label .line-separator {
    position: absolute;
    top: 0;
    right: -16px;
    height: 60%;
    width: 1px;
    border-right: solid 2px #7780a133;
}

.tbr_radio--btn.simple label:last-of-type .line-separator {
    display: none;
}

/* ===================================
 * Custom button.
=================================== */
html .tbr_btn {
    min-height: 40px;
}

html .tbr_btn--icon {
    display: flex;
    justify-content: center;
    align-items: center;
}

html .tbr_btn.tbr_btn--primary,
html .tbr_btn.tbr_btn--primary:active {
    background: linear-gradient(100.39deg, #984ad3 4.74%, #0583d2 49.18%);
    color: white;
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--primary:hover {
    box-shadow: 0px 14px 25px -10px rgba(5, 131, 210, 0.6),
        0px 10px 17px -5px rgba(5, 131, 210, 0.2) !important;
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-primary,
html .tbr_btn.tbr_btn--light-primary:active {
    background: var(--tbr-bg-primary-light);
    color: var(--tbr-primary);
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-primary:hover {
    color: white;
    background-color: var(--tbr-primary);
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-primary:hover > svg path {
    fill: white;
}

html .tbr_btn.tbr_btn--secondary,
html .tbr_btn.tbr_btn--secondary:active {
    background: var(--tbr-secondary);
    color: white;
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--secondary:hover:not(.tbr_btn--tab-calendar) {
    box-shadow: 0px 14px 25px -10px rgba(5, 131, 210, 0.6),
        0px 10px 17px -5px rgba(5, 131, 210, 0.2) !important;
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-secondary,
html .tbr_btn.tbr_btn--light-secondary:active {
    background: var(--tbr-bg-secondary-light);
    color: var(--tbr-secondary);
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-secondary:hover {
    background: var(--tbr-secondary);
    color: white;
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-secondary:hover > svg path {
    fill: white;
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--danger,
html .tbr_btn.tbr_btn--danger:active {
    background: var(--tbr-danger);
    color: white;
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--danger:hover {
    box-shadow: 0px 14px 25px -10px rgba(241, 65, 108, 0.6),
        0px 10px 17px -5px rgba(239, 73, 122, 0.2) !important;
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-danger,
html .tbr_btn.tbr_btn--light-danger:active {
    background: var(--tbr-bg-danger-light);
    color: var(--tbr-danger);
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-danger:hover {
    color: white;
    background-color: var(--tbr-danger);
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-danger:hover > svg path {
    fill: white;
}

html .tbr_btn.tbr_btn--light-success,
html .tbr_btn.tbr_btn--light-success:active {
    background: var(--tbr-bg-success-light);
    color: var(--tbr-success);
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-success:hover {
    color: white;
    background-color: var(--tbr-success);
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-success:hover > svg path {
    fill: white;
}

html .tbr_btn.tbr_btn--light-secondary-bordered,
html .tbr_btn.tbr_btn--light-secondary-bordered:active {
    color: #99a1b7;
    border: 1px dashed #7780a133 !important;
    transition: all 0.3s ease;
}

html .tbr_btn.tbr_btn--light-secondary-bordered:hover {
    color: var(--tbr-secondary);
    border: 1px dashed var(--tbr-secondary) !important;
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--primary,
html .tbr_btn--icon.tbr_btn--primary:active {
    min-width: 48px;
    min-height: 48px;
    width: 48px;
    height: 48px;
    max-width: 48px;
    border-radius: 8px;
    max-height: 48px;
    padding: 0 !important;
    background: var(--tbr-primary);
    color: var(--tbr-bright-gray-950);
    transition: all 0.3s ease;
}

[data-bs-theme="dark"] .tbr_btn--primary {
    background-color: #23242e !important;
}

html .tbr_btn--icon.tbr_btn--secondary,
html .tbr_btn--icon.tbr_btn--secondary:active {
    min-width: 48px;
    min-height: 48px;
    width: 48px;
    height: 48px;
    max-width: 48px;
    border-radius: 8px;
    max-height: 48px;
    padding: 0 !important;
    background: var(--tbr-secondary);
    color: var(--tbr-bright-gray-950);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--grey,
html .tbr_btn--icon.tbr_btn--grey:active {
    min-width: 48px;
    min-height: 48px;
    width: 48px;
    height: 48px;
    max-width: 48px;
    border-radius: 8px;
    max-height: 48px;
    padding: 0 !important;
    background: var(--tbr-stage-color);
    color: var(--tbr-bright-gray-950);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-primary,
html .tbr_btn--icon.tbr_btn--light-primary:active {
    min-width: 48px;
    min-height: 48px;
    width: 48px;
    height: 48px;
    max-width: 48px;
    border-radius: 8px;
    max-height: 48px;
    padding: 0 !important;
    background: var(--tbr-bg-primary-light);
    color: var(--tbr-bright-gray-950);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-primary:hover {
    background: var(--tbr-primary);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-primary:hover > svg path {
    fill: white;
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-secondary,
html .tbr_btn--icon.tbr_btn--light-secondary:active {
    min-width: 48px;
    min-height: 48px;
    width: 48px;
    height: 48px;
    max-width: 48px;
    border-radius: 8px;
    max-height: 48px;
    padding: 0 !important;
    background: var(--tbr-bg-secondary-light);
    color: var(--tbr-bright-gray-950);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-secondary:hover {
    background: var(--tbr-secondary);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-secondary:hover > svg path {
    fill: white;
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-success,
html .tbr_btn--icon.tbr_btn--light-success:active {
    min-width: 48px;
    min-height: 48px;
    width: 48px;
    height: 48px;
    max-width: 48px;
    border-radius: 8px;
    max-height: 48px;
    padding: 0 !important;
    background: var(--tbr-bg-success-light);
    color: var(--tbr-bright-gray-950);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-success:hover {
    background: var(--tbr-success);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-success:hover > svg path {
    fill: white;
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-danger,
html .tbr_btn--icon.tbr_btn--light-danger:active {
    min-width: 48px;
    min-height: 48px;
    width: 48px;
    height: 48px;
    max-width: 48px;
    border-radius: 8px;
    max-height: 48px;
    padding: 0 !important;
    background: var(--tbr-bg-danger-light);
    color: var(--tbr-bright-gray-950);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-danger:hover {
    background: var(--tbr-danger);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-danger:hover > svg path {
    fill: white;
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-warning,
html .tbr_btn--icon.tbr_btn--light-warning:active {
    min-width: 48px;
    min-height: 48px;
    width: 48px;
    height: 48px;
    max-width: 48px;
    border-radius: 8px;
    max-height: 48px;
    padding: 0 !important;
    background: var(--tbr-bg-warning-light);
    color: var(--tbr-bright-gray-950);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-warning:hover {
    background: var(--tbr-warning);
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--light-warning:hover > svg path {
    fill: white;
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--transparent,
html .tbr_btn--icon.tbr_btn--transparent:active {
    min-width: 48px;
    min-height: 48px;
    width: 48px;
    height: 48px;
    max-width: 48px;
    border-radius: 8px;
    max-height: 48px;
    padding: 0 !important;
    background: transparent;
    transition: all 0.3s ease;
}

html .tbr_btn--icon.tbr_btn--transparent:hover > svg path {
    opacity: 0.8;
    transition: all 0.3s ease;
}

html .tbr_btn--icon.sm,
html .tbr_btn--icon.sm:active {
    min-width: 34px;
    min-height: 34px;
    width: 34px;
    height: 34px;
    max-width: 34px;
    max-height: 34px;
}

html .tbr_btn--icon.md,
html .tbr_btn--icon.md:active {
    min-width: 45px;
    min-height: 45px;
    width: 45px;
    height: 45px;
    max-width: 45px;
    max-height: 45px;
}

html .tbr_btn--icon.xsm,
html .tbr_btn--icon.xsm:active {
    min-width: 20px;
    min-height: 20px;
    width: 20px;
    height: 20px;
    max-width: 20px;
    max-height: 20px;
}

html .tbr_btn--icon.ic-35px,
html .tbr_btn--icon.ic-35px:active {
    min-width: 35px;
    min-height: 35px;
    width: 35px;
    height: 35px;
    max-width: 35px;
    max-height: 35px;
}

html .tbr_btn.with-icon:hover > svg * {
    fill: white;
}

/* ===================================
 * Custom alerts.
=================================== */
.tbr_alert {
    border-radius: 4px;
    padding: 12px 16px 12px 16px;
    transition: all 0.3s ease;
}

.tbr_alert.tbr_alert--warning {
    color: var(--tbr-warning--basic) !important;
    background-color: var(--tbr-bg-warning-light);
}

.tbr_alert.tbr_alert--danger {
    color: var(--tbr-danger);
    background-color: var(--tbr-bg-danger-light);
}

.tbr_alert.tbr_alert--success {
    color: var(--tbr-success);
    background-color: var(--tbr-bg-success-light);
}

.tbr_alert.tbr_alert--secondary {
    color: var(--tbr-secondary);
    background-color: var(--tbr-bg-secondary-light);
}

.tbr_alert.tbr_alert--primary {
    color: var(--tbr-primary);
    background-color: var(--tbr-bg-primary-light);
}

.tbr_alert.tbr_border--primary {
    border-radius: 8px;
    color: unset !important;
    border: 2px dashed var(--tbr-primary);
    padding: 19px 10px 19px 10px;
}

.tbr_alert.tbr_border--warning {
    border-radius: 8px;
    color: unset !important;
    border: 2px dashed var(--tbr-warning);
    padding: 19px 10px 19px 10px;
}

.breadcrumb .breadcrumb-item::after {
    content: "";
    padding-left: 0;
    margin-left: 8px;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.3' d='M6.8932 12.6662C6.76078 12.667 6.63114 12.6283 6.52079 12.5551C6.41044 12.4819 6.3244 12.3775 6.27362 12.2552C6.22284 12.1329 6.20963 11.9983 6.23568 11.8684C6.26173 11.7386 6.32585 11.6195 6.41987 11.5262L9.89987 7.99955L6.41987 4.55288C6.35771 4.49073 6.3084 4.41693 6.27476 4.33572C6.24112 4.2545 6.22381 4.16746 6.22381 4.07955C6.22381 3.99164 6.24112 3.9046 6.27476 3.82338C6.3084 3.74217 6.35771 3.66838 6.41987 3.60622C6.48203 3.54406 6.55582 3.49475 6.63703 3.46111C6.71825 3.42747 6.80529 3.41016 6.8932 3.41016C6.98111 3.41016 7.06815 3.42747 7.14937 3.46111C7.23058 3.49475 7.30437 3.54406 7.36653 3.60622L11.3332 7.55955C11.4574 7.68446 11.5271 7.85343 11.5271 8.02955C11.5271 8.20567 11.4574 8.37464 11.3332 8.49955L7.38653 12.4462C7.3242 12.5153 7.24811 12.5705 7.16315 12.6084C7.07818 12.6463 6.98623 12.666 6.8932 12.6662Z' fill='%237E8299'/%3E%3C/svg%3E%0A");
}

/* ===================================
 * Custom positions.
=================================== */
.tbr_btn--icon.profile_upload {
    top: 50%;
    left: 125px;
}

.tbr_btn--icon.profile_delete {
    top: 50%;
    left: 165px;
}

.close-modal {
    right: 23px;
    top: 23px;
}

.translate-top {
    transform: translate(-50%, -100%);
}

/* ===================================
 * Custom modal.
=================================== */
html .modal-content {
    border-radius: 20px;
}

/* ===================================
 * Other styles.
=================================== */
.tbr_avatar.image-input {
    border-radius: 12px;
}

.tbr_avatar .image-input-wrapper {
    border-radius: 12px;
    background-size: 100% 100% !important;
}

.h-36px {
    min-height: 36px !important;
    height: 36px !important;
}

.h-34px {
    min-height: 34px !important;
    height: 34px !important;
}

.w-180px {
    width: 180px !important;
    min-width: 180px !important;
}

/* ===================================
 * Custom tooltips.
=================================== */
.tooltip-warning {
    --bs-tooltip-color: var(--tbr-warning);
}

.width-300px .tooltip-inner {
    max-width: 300px !important;
}

.tooltip-warning .tooltip-inner {
    background-color: #fff8dd;
}

.tooltip-warning .tooltip-arrow::before {
    border-bottom-color: #fff8dd !important;
    border-top-color: #fff8dd !important;
}

.tbr_tooltip .tbr_tooltiptext {
    visibility: hidden;
    width: 70px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px;
    position: absolute;
    z-index: 1;
    bottom: 121%;
    margin-left: -26px;
    opacity: 0;
    transition: opacity 0.3s;
}

.tbr_tooltip .tbr_tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}

.tbr_tooltip:hover .tbr_tooltiptext {
    visibility: visible;
    opacity: 1;
}

/* ===================================
 * Custom filter dropdown.
=================================== */
.tbr_filter {
    width: 369px !important;
}

/* ===================================
 * Badge.
=================================== */
.tbr_badge {
    min-width: 20px;
    min-height: 20px;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
}

.tbr_badge.warning {
    background-color: var(--tbr-warning);
    color: white !important;
}

.tbr_badge.success {
    background-color: var(--tbr-success);
    color: white !important;
}

.tbr_badge.primary {
    background-color: var(--tbr-primary);
    color: white !important;
    min-width: 30px;
}

/* ===================================
 * Button Collapse.
=================================== */
.tbr_btn.tbr_collapse {
    display: flex;
    justify-content: center;
    align-items: center;
}

.tbr_btn.tbr_collapse[aria-expanded="true"] > svg.tbr_arrow {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transition: all 0.3s ease;
}

.tbr_btn.tbr_collapse[aria-expanded="false"] > svg.tbr_arrow {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transition: all 0.3s ease;
}

/* ===================================
 * Overlay.
=================================== */
.tbr_overlay {
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 100;
    background-color: #151515;
    opacity: 5%;
}

.tbr_overlay.tbr_overlay--card {
    border-radius: 0.625rem;
}

.tbr_overlay--content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 100;
}

/* ===================================
 * Custom Card.
=================================== */
.tbr_custom_card {
    border-radius: 4px;
}

.tbr_custom_card .tbr_custom_card--header {
    background: linear-gradient(110.07deg, #984ad3 4.1%, #0583d2 42.63%);
    padding: 10px;
    border-radius: 4px 4px 0 0;
    color: white;
}

.tbr_custom_card .tbr_custom_card--body {
    border-width: 0px 1px 1px 1px;
    border-style: solid;
    border-color: #7780a133;
    border-radius: 0 0px 4px 4px;
}

.tbr_custom_card .tbr_border--bottom {
    border-bottom: 1px dashed #7780a133;
}

/* ===================================
 * Custom Border.
=================================== */
.tbr_border--bottom {
    border-bottom: 1px dashed #dbdfe9;
}

@media (max-width: 991.98px) {
    body:not([data-kt-app-toolbar-fixed-mobile="true"]) .app-toolbar {
        margin: 16px 0px;
    }
}

/* ==================================
* Production line dropdown
====================================*/
#line-menu .select2-container--open .select2-dropdown {
    box-shadow: none !important;
}

.select2_search {
    background-color: var(--bs-body-bg);
    padding: 0.55rem 0.75rem;
    color: var(--bs-gray-700);
    font-size: 0.95rem;
    border: 1px solid var(--bs-gray-300);
    border-radius: 0.425rem;
    width: 100%;
    outline: 0 !important;
}

.tbr_item_line:hover {
    background-color: var(--bs-component-hover-bg);
    color: var(--bs-component-hover-color);
    transition: color 0.2s ease;
}

.tbr_item_line.active {
    background-color: var(--bs-component-hover-bg);
    color: var(--bs-component-hover-color);
    transition: color 0.2s ease;
}

.tbr_item_line {
    cursor: pointer;
    color: var(--bs-gray-700);
    transition: color 0.2s ease;
    margin: 0 0;
    position: relative;
}

.tbr_item_line.active::after {
    top: 50%;
    display: block;
    position: absolute;
    transform: translateY(-50%);
    height: 0.75rem;
    width: 0.75rem;
    content: "";
    mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    background-color: var(--bs-component-hover-color);
    -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 11'%3e%3cpath fill='var%28--bs-component-hover-color%29' d='M4.89557 6.49823L2.79487 4.26513C2.26967 3.70683 1.38251 3.70683 0.857309 4.26513C0.375593 4.77721 0.375593 5.57574 0.857309 6.08781L4.74989 10.2257C5.14476 10.6455 5.81176 10.6455 6.20663 10.2257L13.1427 2.85252C13.6244 2.34044 13.6244 1.54191 13.1427 1.02984C12.6175 0.471537 11.7303 0.471536 11.2051 1.02984L6.06096 6.49823C5.74506 6.83403 5.21146 6.83403 4.89557 6.49823Z'/%3e%3c/svg%3e");
    mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 11'%3e%3cpath fill='var%28--bs-component-hover-color%29' d='M4.89557 6.49823L2.79487 4.26513C2.26967 3.70683 1.38251 3.70683 0.857309 4.26513C0.375593 4.77721 0.375593 5.57574 0.857309 6.08781L4.74989 10.2257C5.14476 10.6455 5.81176 10.6455 6.20663 10.2257L13.1427 2.85252C13.6244 2.34044 13.6244 1.54191 13.1427 1.02984C12.6175 0.471537 11.7303 0.471536 11.2051 1.02984L6.06096 6.49823C5.74506 6.83403 5.21146 6.83403 4.89557 6.49823Z'/%3e%3c/svg%3e");
    mask-position: center;
    -webkit-mask-position: center;
    right: 1.25rem;
}

#parent_production_line {
    max-height: 250px;
    overflow-y: scroll;
}