@layer base {
     @font-face {
          font-family: 'Krub-Bold';
          src: url(../fonts/Krub/Krub-Bold.ttf);
     }

     @font-face {
          font-family: 'Krub-Light';
          src: url(../fonts/Krub/Krub-Light.ttf);
     }

     @font-face {
          font-family: 'Krub-Medium';
          src: url(../fonts/Krub/Krub-Medium.ttf);
     }

     @font-face {
          font-family: 'Krub-Regular';
          src: url(../fonts/Krub/Krub-Regular.ttf);
     }

     @font-face {
          font-family: 'Krub-SemiBold';
          src: url(../fonts/Krub/Krub-SemiBold.ttf);
     }

     input[type="number"]::-webkit-inner-spin-button,
     input[type="number"]::-webkit-outer-spin-button {
          -webkit-appearance: none;
          margin: 0;
     }

     input.form-input {
          @apply border-[1px] border-[#FF5247] bg-[#F5F7FC] rounded-[4px] placeholder:text-[#615e5e] px-4 text-[12px] min-h-[42px] outline-none py-2 w-full mb-2;
     }
}

.bg-dashboard {
     background-image: url('../img/dashboard-bg.svg');
     background-position: center;
     background-size: cover;
     background-repeat: no-repeat;
}
#app {
     height: 100%;
}

.form-normal select{
     background-color: white !important;
}
.bg-auth {
     background-image: url('../img/auth-background.png');
     background-position: center;
     background-size: cover;
     background-repeat: no-repeat;
     background-attachment: fixed;
}

input[type="checkbox"] {
     height: 0px;
     width: 17px;
     position: relative;
     border: none !important;
     box-shadow: none !important;
}

input[type="checkbox"]::after {
     content: ' ';
     border-radius: 5px;
     width: 17px;
     height: 17px;
     position: absolute;
     border: 1.7px solid #e5e7eb;
     background: #fff;
}

input[type="checkbox"]:checked::after {
     background: #3943B7;
     border-color: #3943B7;
     background-position: center;
     background-size: cover;
     background-image: url('../img/checkbox.svg');
}
input[type="checkbox"]:checked:disabled::after{
     background-image: url('../img/checkbox-disabled.svg');
     border-color: #CDCFD0;
}
.select-input {
     -webkit-appearance: none;
     -moz-appearance: none;
     background-image: url('../img/select-dropdown.svg');
     background-repeat: no-repeat;
     background-position-y: 16px;
     background-position-x: calc(100% - 17px);
     background-size: 10px;
}
.card-shadow{
     box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.25);;
}

input:focus,textarea:focus,select:focus{
     box-shadow: none !important;
}
.has-error input{
     border-color: red !important;
}
.has-error .error-text{
     color: red !important;
}
.fake-profile{
     background-image: url('../img/fake-profile.svg');
     background-position: center;
     background-size: cover;
}

input::-webkit-input-placeholder, input:-moz-placeholder, input::-ms-input-placeholder, input:-ms-input-placeholder, input::placeholder, input::-moz-placeholder {
     color: #25213B !important;
     opacity: 1;
     font-weight: 500;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
transition: background-color 5000s ease-in-out 0s;
-webkit-text-fill-color: #25213B !important;
outline: none !important;
color: #25213B !important;
}


input.form-normal {
     background-color: #fff;
     border: .5px solid #D3DCE4 !important;
}

.status-inactive, .status-inactive path {
     fill: #F00 !important;
}

.chat-message-content{
     white-space: pre-wrap;
     white-space: -moz-pre-wrap;
     white-space: -pre-wrap;
     white-space: -o-pre-wrap;
     word-wrap: break-word;
     word-break: break-all;
}