:root {
    --app-brand: var(--app-primary);
    --app-brand-active: var(--app-primary-active);
    --app-brand-light: var(--app-primary-light);
    --app-brand-rgb: var(--app-primary-rgb);
    --app-on-brand: var(--app-on-primary);

    --app-primary: #211c51;
    --app-primary-active: #17133b;
    --app-primary-light: #ecebf5;
    --app-primary-rgb: 33, 28, 81;
    --app-on-primary: #ffffff;

    --app-secondary: #000000;
    --app-secondary-active: #2b2b2b;
    --app-secondary-light: #f2f4f6;
    --app-secondary-rgb: 0, 0, 0;
    --app-on-secondary: #ffffff;

    --app-success: #198754;
    --app-success-active: #146c43;
    --app-success-light: #e9fef4;
    --app-success-rgb: 25, 135, 84;
    --app-success-ink: #15794b;

    --app-info: #0b7f9e;
    --app-info-active: #096a85;
    --app-info-light: #e6f7fb;
    --app-info-rgb: 11, 127, 158;
    --app-info-ink: #0a7390;

    --app-warning: #ffc107;
    --app-warning-active: #e0a800;
    --app-warning-light: #fff8e1;
    --app-warning-rgb: 255, 193, 7;
    --app-on-warning: #ffffff;
    --app-warning-ink: #6b5000;

    --app-danger: #b81c22;
    --app-danger-active: #9c161c;
    --app-danger-light: #feebec;
    --app-danger-rgb: 184, 28, 34;

    --app-orange: #b85600;
    --app-orange-active: #9c4900;
    --app-orange-rgb: 184, 86, 0;
}

:root {
    --kt-primary: var(--app-primary);
    --kt-primary-active: var(--app-primary-active);
    --kt-primary-light: var(--app-primary-light);
    --kt-primary-inverse: #ffffff;
    --kt-primary-rgb: var(--app-primary-rgb);
    --kt-text-primary: var(--app-primary);

    --kt-secondary: var(--app-secondary);
    --kt-secondary-active: var(--app-secondary-active);
    --kt-secondary-light: var(--app-secondary-light);
    --kt-secondary-inverse: var(--app-on-secondary);
    --kt-secondary-rgb: var(--app-secondary-rgb);
    --kt-text-secondary: var(--app-secondary);

    --kt-success: var(--app-success);
    --kt-success-active: var(--app-success-active);
    --kt-success-light: var(--app-success-light);
    --kt-success-inverse: #ffffff;
    --kt-success-rgb: var(--app-success-rgb);
    --kt-text-success: var(--app-success-ink);

    --kt-info: var(--app-info);
    --kt-info-active: var(--app-info-active);
    --kt-info-light: var(--app-info-light);
    --kt-info-inverse: #ffffff;
    --kt-info-rgb: var(--app-info-rgb);
    --kt-text-info: var(--app-info-ink);

    --kt-warning: var(--app-warning);
    --kt-warning-active: var(--app-warning-active);
    --kt-warning-light: var(--app-warning-light);
    --kt-warning-inverse: var(--app-on-warning);
    --kt-warning-rgb: var(--app-warning-rgb);
    --kt-text-warning: var(--app-warning-ink);

    --kt-danger: var(--app-danger);
    --kt-danger-active: var(--app-danger-active);
    --kt-danger-light: var(--app-danger-light);
    --kt-danger-inverse: #ffffff;
    --kt-danger-rgb: var(--app-danger-rgb);
    --kt-text-danger: var(--app-danger);

    --kt-link-color: var(--app-primary);
    --kt-link-hover-color: var(--app-primary-active);
    --kt-component-active-bg: var(--app-primary);
    --kt-component-active-color: var(--app-on-primary);
    --kt-component-hover-color: var(--app-primary);
    --kt-component-checked-bg: var(--app-primary);
    --kt-form-check-input-checked-bg-color: var(--app-primary);
    --kt-form-check-input-checked-bg-color-solid: var(--app-primary);
    --kt-form-check-input-checked-border-color: var(--app-primary);
    --kt-form-check-input-indeterminate-bg-color: var(--app-primary);
    --kt-form-check-input-indeterminate-border-color: var(--app-primary);

    --kt-menu-link-color-active: var(--app-brand);
    --kt-menu-link-color-here: var(--app-brand);
    --kt-menu-link-color-hover: var(--app-brand);
    --kt-menu-link-color-show: var(--app-brand);
}

:root {
    --bs-primary: var(--app-primary);
    --bs-secondary: var(--app-secondary);
    --bs-success: var(--app-success);
    --bs-info: var(--app-info);
    --bs-warning: var(--app-warning);
    --bs-danger: var(--app-danger);

    --bs-primary-rgb: var(--app-primary-rgb);
    --bs-secondary-rgb: var(--app-secondary-rgb);
    --bs-success-rgb: var(--app-success-rgb);
    --bs-info-rgb: var(--app-info-rgb);
    --bs-warning-rgb: var(--app-warning-rgb);
    --bs-danger-rgb: var(--app-danger-rgb);

    --bs-link-color: var(--app-brand);
    --bs-link-hover-color: var(--app-brand-active);
}

.btn-primary,
.btn-success,
.btn-info,
.btn-danger {
    --bs-btn-color: #ffffff;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-active-color: #ffffff;
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn-warning {
    --bs-btn-color: var(--app-on-warning);
    --bs-btn-hover-color: var(--app-on-warning);
    --bs-btn-active-color: var(--app-on-warning);
    --bs-btn-disabled-color: var(--app-on-warning);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn-secondary {
    --bs-btn-color: var(--app-on-secondary);
    --bs-btn-hover-color: var(--app-on-secondary);
    --bs-btn-active-color: var(--app-on-secondary);
    --bs-btn-disabled-color: var(--app-on-secondary);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn-primary {
    --bs-btn-bg: var(--app-primary);
    --bs-btn-border-color: var(--app-primary);
    --bs-btn-hover-bg: var(--app-primary-active);
    --bs-btn-hover-border-color: var(--app-primary-active);
    --bs-btn-active-bg: var(--app-primary-active);
    --bs-btn-active-border-color: var(--app-primary-active);
    --bs-btn-disabled-bg: var(--app-primary);
    --bs-btn-disabled-border-color: var(--app-primary);
    --bs-btn-focus-shadow-rgb: var(--app-primary-rgb);
}

.btn-secondary {
    --bs-btn-bg: var(--app-secondary);
    --bs-btn-border-color: var(--app-secondary);
    --bs-btn-hover-bg: var(--app-secondary-active);
    --bs-btn-hover-border-color: var(--app-secondary-active);
    --bs-btn-active-bg: var(--app-secondary-active);
    --bs-btn-active-border-color: var(--app-secondary-active);
    --bs-btn-disabled-bg: var(--app-secondary);
    --bs-btn-disabled-border-color: var(--app-secondary);
    --bs-btn-focus-shadow-rgb: var(--app-secondary-rgb);
}

.btn-success {
    --bs-btn-bg: var(--app-success);
    --bs-btn-border-color: var(--app-success);
    --bs-btn-hover-bg: var(--app-success-active);
    --bs-btn-hover-border-color: var(--app-success-active);
    --bs-btn-active-bg: var(--app-success-active);
    --bs-btn-active-border-color: var(--app-success-active);
    --bs-btn-disabled-bg: var(--app-success);
    --bs-btn-disabled-border-color: var(--app-success);
    --bs-btn-focus-shadow-rgb: var(--app-success-rgb);
}

.btn-info {
    --bs-btn-bg: var(--app-info);
    --bs-btn-border-color: var(--app-info);
    --bs-btn-hover-bg: var(--app-info-active);
    --bs-btn-hover-border-color: var(--app-info-active);
    --bs-btn-active-bg: var(--app-info-active);
    --bs-btn-active-border-color: var(--app-info-active);
    --bs-btn-disabled-bg: var(--app-info);
    --bs-btn-disabled-border-color: var(--app-info);
    --bs-btn-focus-shadow-rgb: var(--app-info-rgb);
}

.btn-warning {
    --bs-btn-bg: var(--app-warning);
    --bs-btn-border-color: var(--app-warning);
    --bs-btn-hover-bg: var(--app-warning-active);
    --bs-btn-hover-border-color: var(--app-warning-active);
    --bs-btn-active-bg: var(--app-warning-active);
    --bs-btn-active-border-color: var(--app-warning-active);
    --bs-btn-disabled-bg: var(--app-warning);
    --bs-btn-disabled-border-color: var(--app-warning);
    --bs-btn-focus-shadow-rgb: var(--app-warning-rgb);
}

.btn-danger {
    --bs-btn-bg: var(--app-danger);
    --bs-btn-border-color: var(--app-danger);
    --bs-btn-hover-bg: var(--app-danger-active);
    --bs-btn-hover-border-color: var(--app-danger-active);
    --bs-btn-active-bg: var(--app-danger-active);
    --bs-btn-active-border-color: var(--app-danger-active);
    --bs-btn-disabled-bg: var(--app-danger);
    --bs-btn-disabled-border-color: var(--app-danger);
    --bs-btn-focus-shadow-rgb: var(--app-danger-rgb);
}

.btn-orange {
    background: var(--app-orange) !important;
    border-color: var(--app-orange) !important;
    color: #ffffff !important;
}

.btn-orange:hover,
.btn-orange:focus,
.btn-orange:active {
    background: var(--app-orange-active) !important;
    border-color: var(--app-orange-active) !important;
    color: #ffffff !important;
}

.btn-orange .svg-icon,
.btn-orange i {
    color: #ffffff;
}

.alert-primary {
    --bs-alert-color: var(--app-primary);
    --bs-alert-bg: var(--app-primary-light);
    --bs-alert-border-color: var(--app-primary);
}

.alert-secondary {
    --bs-alert-color: var(--app-secondary-active);
    --bs-alert-bg: var(--app-secondary-light);
    --bs-alert-border-color: var(--app-secondary);
}

.alert-success {
    --bs-alert-color: var(--app-success-ink);
    --bs-alert-bg: var(--app-success-light);
    --bs-alert-border-color: var(--app-success);
}

.alert-info {
    --bs-alert-color: var(--app-info-ink);
    --bs-alert-bg: var(--app-info-light);
    --bs-alert-border-color: var(--app-info);
}

.alert-warning {
    --bs-alert-color: var(--app-warning-ink);
    --bs-alert-bg: var(--app-warning-light);
    --bs-alert-border-color: var(--app-warning);
}

.alert-danger {
    --bs-alert-color: var(--app-danger);
    --bs-alert-bg: var(--app-danger-light);
    --bs-alert-border-color: var(--app-danger);
}

.badge-light-warning,
.text-warning {
    color: var(--app-warning-ink) !important;
}

.border-secondary { border-color: var(--app-secondary) !important; }
.border-success { border-color: var(--app-success) !important; }
.border-info { border-color: var(--app-info) !important; }
.border-warning { border-color: var(--app-warning) !important; }
.border-danger { border-color: var(--app-danger) !important; }

.link-primary { color: var(--app-primary) !important; }
.link-secondary { color: var(--app-secondary) !important; }
.link-success { color: var(--app-success) !important; }
.link-info { color: var(--app-info) !important; }
.link-warning { color: var(--app-warning) !important; }
.link-danger { color: var(--app-danger) !important; }

[data-theme="dark"] {
    --app-brand: var(--app-primary);
    --app-brand-active: var(--app-primary-active);
    --app-brand-light: var(--app-primary-light);
    --app-brand-rgb: var(--app-primary-rgb);
    --app-on-brand: var(--app-on-primary);

    --app-primary: #8f89d9;
    --app-primary-active: #aaa5e4;
    --app-primary-light: #1e1b3d;
    --app-primary-rgb: 143, 137, 217;
    --app-on-primary: #151521;

    --app-secondary: #c9c9d1;
    --app-secondary-active: #e2e2e8;
    --app-secondary-light: #2b2b40;
    --app-secondary-rgb: 201, 201, 209;
    --app-on-secondary: #151521;

    --app-success: #0ae37c;
    --app-success-active: #3ef29a;
    --app-success-light: #003b1e;
    --app-success-rgb: 10, 227, 124;

    --app-info: #22c3e6;
    --app-info-active: #4ed3f0;
    --app-info-light: #063540;
    --app-info-rgb: 34, 195, 230;

    --app-warning: #ffc61a;
    --app-warning-active: #ffd451;
    --app-warning-light: #3d3300;
    --app-warning-rgb: 255, 198, 26;
    --app-warning-ink: #ffc61a;
    --app-on-warning: #151521;

    --app-danger: #ee4d56;
    --app-danger-active: #f26b73;
    --app-danger-light: #350f11;
    --app-danger-rgb: 238, 77, 86;

    --app-orange: #ff8c1a;
    --app-orange-active: #ffa040;
    --app-orange-rgb: 255, 140, 26;
}

[data-theme="dark"] {
    --kt-success-inverse: #151521;
    --kt-info-inverse: #151521;
    --kt-warning-inverse: #151521;
    --kt-danger-inverse: #151521;
    --kt-secondary-inverse: #151521;
}

[data-theme="dark"] .btn-primary,
[data-theme="dark"] .btn-secondary,
[data-theme="dark"] .btn-success,
[data-theme="dark"] .btn-info,
[data-theme="dark"] .btn-warning,
[data-theme="dark"] .btn-danger {
    --bs-btn-color: #151521;
    --bs-btn-hover-color: #151521;
    --bs-btn-active-color: #151521;
    --bs-btn-disabled-color: #151521;
}

[data-theme="dark"] .btn.btn-primary,
[data-theme="dark"] .btn.btn-primary:hover,
[data-theme="dark"] .btn.btn-primary:focus,
[data-theme="dark"] .btn.btn-primary:active,
[data-theme="dark"] .btn.btn-primary.active,
[data-theme="dark"] .btn.btn-primary.show,
[data-theme="dark"] .show > .btn.btn-primary,
[data-theme="dark"] .btn.btn-secondary,
[data-theme="dark"] .btn.btn-secondary:hover,
[data-theme="dark"] .btn.btn-secondary:focus,
[data-theme="dark"] .btn.btn-secondary:active,
[data-theme="dark"] .btn.btn-success,
[data-theme="dark"] .btn.btn-success:hover,
[data-theme="dark"] .btn.btn-success:focus,
[data-theme="dark"] .btn.btn-success:active,
[data-theme="dark"] .btn.btn-info,
[data-theme="dark"] .btn.btn-info:hover,
[data-theme="dark"] .btn.btn-info:focus,
[data-theme="dark"] .btn.btn-info:active,
[data-theme="dark"] .btn.btn-warning,
[data-theme="dark"] .btn.btn-warning:hover,
[data-theme="dark"] .btn.btn-warning:focus,
[data-theme="dark"] .btn.btn-warning:active,
[data-theme="dark"] .btn.btn-danger,
[data-theme="dark"] .btn.btn-danger:hover,
[data-theme="dark"] .btn.btn-danger:focus,
[data-theme="dark"] .btn.btn-danger:active {
    color: #151521 !important;
}

[data-theme="dark"] .btn.btn-primary i,
[data-theme="dark"] .btn.btn-primary .svg-icon,
[data-theme="dark"] .btn.btn-secondary i,
[data-theme="dark"] .btn.btn-secondary .svg-icon,
[data-theme="dark"] .btn.btn-success i,
[data-theme="dark"] .btn.btn-success .svg-icon,
[data-theme="dark"] .btn.btn-info i,
[data-theme="dark"] .btn.btn-info .svg-icon,
[data-theme="dark"] .btn.btn-warning i,
[data-theme="dark"] .btn.btn-warning .svg-icon,
[data-theme="dark"] .btn.btn-danger i,
[data-theme="dark"] .btn.btn-danger .svg-icon {
    color: #151521 !important;
}

[data-theme="dark"] .btn-orange,
[data-theme="dark"] .btn-orange:hover,
[data-theme="dark"] .btn-orange:focus,
[data-theme="dark"] .btn-orange:active {
    color: #151521 !important;
}

[data-theme="dark"] .btn-orange .svg-icon,
[data-theme="dark"] .btn-orange i {
    color: #151521;
}