/*********************
 * Identity :: BEGIN
 ********************/

:root {
    --bs-primary: #e64514;
    --bs-secondary: #101010;
    --bs-text-primary: #939393;
    --bs-primary-light: #e8e8e8;
    --bs-primary-active: #101010;
    --bs-text-gray-900: #101010;
}

body { 
    background-image: url('../media/img/bg-login.jpeg');
}
#kt_app_sidebar{
    background: none;
}
#kt_app_sidebar.drawer-on{
    background-image: url('../media/img/bg-login.jpeg');
}

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

.link-primary{
    color: var(--bs-secondary) !important;
}

.link-primary:hover, .link-primary:focus {
    color: var(--bs-primary) !important;
}

.form-check-input:checked {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

.form-switch.form-check-solid .form-check-input:not(:checked) {
    background-color: var(--bs-gray-300);
}

input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 8px;
  background: var(--bs-primary-light);
  border-radius: 5px;
  outline: none;
  opacity: 0.9;
  transition: 0.2s;
}

input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  background: var(--bs-primary);
  border-radius: 50%;
  cursor: pointer;
}

input[type="range"]::-moz-range-thumb {
  width: 20px;
  height: 20px;
  background: var(--bs-primary);
  border-radius: 50%;
  cursor: pointer;
}

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

/*********************
 * Identity :: END
 ********************/

/*********************
 * Helpers :: BEGIN
 ********************/

.ki-spinner {
    animation: ki-spinner 2s linear infinite;
}
@keyframes ki-spinner {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

 @keyframes shake {
  0% { transform: translate(0, 0); }
  20% { transform: translate(-2px, 0); }
  40% { transform: translate(2px, 0); }
  60% { transform: translate(-2px, 0); }
  80% { transform: translate(2px, 0); }
  100% { transform: translate(0, 0); }
}

.shake {
  animation: shake 0.5s;
}

/*********************
 * Helpers :: END
 ********************/

/*********************
 * toastify :: BEGIN
 ********************/
.toastify {
    font-size: 13px;
    border-radius: 0.375rem;
    min-width: 350px;
}

.toastify-warning {
    background: rgb(255, 250, 240);
    color: rgb(192, 86, 33);
}

.toastify-error {
    background: rgb(255, 245, 245);
    color: rgb(197, 48, 48);
}

.toastify-success {
    background: rgb(230, 255, 250);
    color: rgb(35, 78, 82);
}
/*********************
 * toastify :: END
 ********************/