@import url('https://fonts.cdnfonts.com/css/euclid-circular-a');

body {
  background-color: #FDFEFE !important;
}

.miden-text-bold {
  font-weight: bold !important;
}

.miden-text-regular {
  font-weight: normal !important;
}

.miden-text-light {
  font-weight: lighter !important;
}

.miden-font-9 {
  font-size: 9px !important;
}

.miden-font-10 {
  font-size: 10px !important;
}

.miden-font-11 {
  font-size: 11px !important;
}

.miden-font-12 {
  font-size: 12px !important;
}

.miden-font-13 {
  font-size: 13px !important;
}

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

.miden-font-16 {
  font-size: 16px !important;
}

.miden-font-18 {
  font-size: 18px !important;
}

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

.miden-font-22 {
  font-size: 22px !important;
}

.miden-font-25 {
  font-size: 25px !important;
}

.miden-font-28 {
  font-size: 28px !important;
}

.miden-font-32 {
  font-size: 32px !important;
}

.miden-font-36 {
  font-size: 36px !important;
}

.miden-font-40 {
  font-size: 40px !important;
}

.miden-font-45 {
  font-size: 45px !important;
}

.miden-font-51 {
  font-size: 51px !important;
}

.miden-font-58 {
  font-size: 58px !important;
}

.miden-font-65 {
  font-size: 65px !important;
}

.miden-deep-black-50 {
  color: #e6e6e9 !important;
}

.miden-deep-black-100 {
  color: #b2b0bb !important;
}

.miden-deep-black-200 {
  color: #8d8a9a !important;
}

.miden-deep-black-300 {
  color: #5a546c !important;
}

.miden-deep-black-400 {
  color: #39334f !important;
}

.miden-deep-black-500 {
  color: #080023 !important;
}

.miden-deep-black-600 {
  color: #070020 !important;
}

.miden-deep-black-700 {
  color: #060019 !important;
}

.miden-deep-black-800 {
  color: #040013 !important;
}

.miden-deep-black-900 {
  color: #03000f !important;
}

.miden-pale-blue-50 {
  color: #eaeef1 !important;
}

.miden-pale-blue-100 {
  color: #bdc9d5 !important;
}

.miden-pale-blue-200 {
  color: #9dafc0 !important;
}

.miden-pale-blue-300 {
  color: #718ba3 !important;
}

.miden-pale-blue-400 {
  color: #557591 !important;
}

.miden-pale-blue-500 {
  color: #2b5276 !important;
}

.miden-pale-blue-600 {
  color: #274b6b !important;
}

.miden-pale-blue-700 {
  color: #1f3a54 !important;
}

.miden-pale-blue-800 {
  color: #182d41 !important;
}

.miden-pale-blue-900 {
  color: #122232 !important;
}

.miden-light-blue-50 {
  color: #ebf4fc !important;
}

.miden-light-blue-100 {
  color: #c0ddf6 !important;
}

.miden-light-blue-200 {
  color: #a2ccf2 !important;
}

.miden-light-blue-300 {
  color: #77b5ec !important;
}

.miden-light-blue-400 {
  color: #5da6e8 !important;
}

.miden-light-blue-500 {
  color: #3490e2 !important;
}

.miden-light-blue-600 {
  color: #2f83ce !important;
}

.miden-light-blue-700 {
  color: #2566a0 !important;
}

.miden-light-blue-800 {
  color: #1d4f7c !important;
}

.miden-light-blue-900 {
  color: #163c5f !important;
}

.miden-light-white-50 {
  color: #feffff !important;
}

.miden-light-white-100 {
  color: #fafdff !important;
}

.miden-light-white-200 {
  color: #f8fdff !important;
}

.miden-light-white-300 {
  color: #f5fcff !important;
}

.miden-light-white-400 {
  color: #f3fbff !important;
}

.miden-light-white-500 {
  color: #f0faff !important;
}

.miden-light-white-600 {
  color: #dae4e8 !important;
}

.miden-light-white-700 {
  color: #aab2b5 !important;
}

.miden-light-white-800 {
  color: #848a8c !important;
}

.miden-light-white-900 {
  color: #65696b !important;
}

.miden-orange-50 {
  color: #fef2e9 !important;
}

.miden-orange-100 {
  color: #fcd6ba !important;
}

.miden-orange-200 {
  color: #fac298 !important;
}

.miden-orange-300 {
  color: #f8a669 !important;
}

.miden-orange-400 {
  color: #f6954c !important;
}

.miden-orange-500 {
  color: #f47a1f !important;
}

.miden-orange-600 {
  color: #de6f1c !important;
}

.miden-orange-700 {
  color: #ad5716 !important;
}

.miden-orange-800 {
  color: #864311 !important;
}

.miden-orange-900 {
  color: #66330d !important;
}

.miden-pale-orange-50 {
  color: #f5ede7 !important;
}

.miden-pale-orange-100 {
  color: #fcd6ba !important;
}

.miden-pale-orange-200 {
  color: #e1c6b4 !important;
}

.miden-pale-orange-300 {
  color: #d2aa8f !important;
}

.miden-pale-orange-400 {
  color: #be835c !important;
}

.miden-pale-orange-500 {
  color: #b16b3d !important;
}

.miden-pale-orange-600 {
  color: #9e460c !important;
}

.miden-pale-orange-700 {
  color: #90400b !important;
}

.miden-pale-orange-800 {
  color: #703209 !important;
}

.miden-pale-orange-900 {
  color: #572707 !important;
}

.miden-error-50 {
  color: #fce6ea !important;
}

.miden-error-100 {
  color: #f5b1be !important;
}

.miden-error-200 {
  color: #f08b9f !important;
}

.miden-error-300 {
  color: #e95573 !important;
}

.miden-error-400 {
  color: #e53558 !important;
}

.miden-error-500 {
  color: #de022e !important;
}

.miden-error-600 {
  color: #ca022a !important;
}

.miden-error-700 {
  color: #9e0121 !important;
}

.miden-error-800 {
  color: #7a0119 !important;
}

.miden-error-900 {
  color: #5d0113 !important;
}

.miden-warning-50 {
  color: #fcf4e6 !important;
}

.miden-warning-100 {
  color: #f5dcb1 !important;
}

.miden-warning-200 {
  color: #f0cb8b !important;
}

.miden-warning-300 {
  color: #e9b355 !important;
}

.miden-warning-400 {
  color: #e5a535 !important;
}

.miden-warning-500 {
  color: #de8e02 !important;
}

.miden-warning-600 {
  color: #ca8102 !important;
}

.miden-warning-700 {
  color: #9e6501 !important;
}

.miden-warning-800 {
  color: #7a4e01 !important;
}

.miden-warning-900 {
  color: #5d3c01 !important;
}

.miden-success-50 {
  color: #e6f8f4 !important;
}

.miden-success-100 {
  color: #b2eadc !important;
}

.miden-success-200 {
  color: #8de0cb !important;
}

.miden-success-300 {
  color: #59d1b3 !important;
}

.miden-success-400 {
  color: #39c9a5 !important;
}

.miden-success-500 {
  color: #07bb8e !important;
}

.miden-success-600 {
  color: #06aa81 !important;
}

.miden-success-700 {
  color: #058565 !important;
}

.miden-success-800 {
  color: #04674e !important;
}

.miden-success-900 {
  color: #034f3c !important;
}

.miden-grey-50 {
  color: #f5f9fc !important;
}

.miden-grey-100 {
  color: #e1ebf5 !important;
}

.miden-grey-200 {
  color: #d2e2f0 !important;
}

.miden-grey-300 {
  color: #bdd4e9 !important;
}

.miden-grey-400 {
  color: #b1cce5 !important;
}

.miden-grey-500 {
  color: #9dbfde !important;
}

.miden-grey-600 {
  color: #8faeca !important;
}

.miden-grey-700 {
  color: #6f889e !important;
}

.miden-grey-800 {
  color: #56697a !important;
}

.miden-grey-900 {
  color: #42505d !important;
}

.miden-button-primary-small {
  display: inline-flex !important;
  padding: 8px 12px !important;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 4px !important;
  background: #0A0032 !important;
  color: #fff !important;
  border: 0px !important;
}

.miden-button-primary-medium {
  display: inline-flex !important;
  padding: 11px 12px !important;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 4px !important;
  background: #0A0032 !important;
  color: #fff !important;
  border: 0px !important;
}

.miden-button-primary-large {
  display: inline-flex !important;
  padding: 14px 12px !important;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 4px !important;
  background: #0A0032 !important;
  color: #fff !important;
  border: 0px !important;
}

.miden-button-primary-small:hover,
.miden-button-primary-medium:hover,
.miden-button-primary-large:hover {
  background: #1590FF !important;
}

.miden-button-primary-small:active,
.miden-button-primary-medium:active,
.miden-button-primary-large:active {
  background: #44A6FF !important;
}

.miden-button-primary-small:disabled,
.miden-button-primary-medium:disabled,
.miden-button-primary-large:disabled {
  background: #BDD4E9 !important;
  cursor: not-allowed !important;
}

.miden-button-outline-small {
  display: inline-flex !important;
  padding: 8px 12px !important;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #080023 !important;
  border: 1px solid #080023 !important;
}

.miden-button-outline-medium {
  display: inline-flex !important;
  padding: 11px 12px !important;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #080023 !important;
  border: 1px solid #080023 !important;
}

.miden-button-outline-large {
  display: inline-flex !important;
  padding: 14px 12px !important;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #080023 !important;
  border: 1px solid #080023 !important;
}

.miden-button-outline-small:hover,
.miden-button-outline-medium:hover,
.miden-button-outline-large:hover {
  background: #E8F4FF !important;
  border: 1px solid #1590FF !important;
  color: #1590FF !important;
}

.miden-button-outline-small:active,
.miden-button-outline-medium:active,
.miden-button-outline-large:active {
  background: #E8F4FF !important;
  border: 1px solid #62B5FF !important;
  color: #62B5FF !important;
}

.miden-button-outline-small:disabled,
.miden-button-outline-medium:disabled,
.miden-button-outline-large:disabled {
  background: #fff !important;
  border: 1px solid #B6DDFF !important;
  cursor: not-allowed !important;
  color: #BDD4E9 !important;
}

.fw-300 {
  font-weight: 300 !important;
}

.fw-500 {
  font-weight: 500 !important;
}

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

.card {
  border-radius: 4px !important;
  background: #FAFDFF !important;
  border: none !important;
}

.cardBlue {
  border-radius: 4px !important;
  background: #F0FAFF !important;
  border: none !important;
}

.sidebarTitle {
  padding: 0px 40px !important;
}

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

.deznav .metismenu>li a>svg {
  font-size: 1.4rem;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: 0;
  height: auto;
  width: auto;
  border-radius: 0.5rem;
  line-height: 1;
  text-align: center;
  -webkit-transition: all 0.5s;
  -ms-transition: all 0.5s;
  transition: all 0.5s;
  margin-right: 15px;
}

.form-control:focus {
  box-shadow: none !important;
}

.authincation {
  display: block !important;
}

.float-right {
  float: right;
}

.loginCenter {
  padding: 0px 280px;
}

.loginCenterDown {
  padding: 0px 270px;
}

input::placeholder {
  color: #BDD4E9 !important;
  font-weight: 100 !important;
  opacity: 0.8 !important;
}

.bottomAlign {
  position: fixed;
  bottom: 0;
  width: 100%;
  padding: 10px;
}

.input-relative {
  position: relative !important;
}

.input-icon-login {
  position: absolute;
  top: 53px;
  right: 20px;
  transform: translateY(-50%);
  z-index: 1;
  cursor: pointer;
}

.input-icon-others {
  position: absolute;
  top: 50px;
  left: 18px;
  transform: translateY(-50%);
  z-index: 1;
  cursor: pointer;
}

.inputWithIcon {
  padding: 0.3125rem 3rem !important;
}

.backgroundAuth {
  background-image: url(../images/miden/backgroundAuth.png);
  border-radius: var(--Spacing-1, 4px);
  background-size: cover;
}


/* Custom Select */

.custom-select {
  position: relative;
}

.custom-select-with-icon {
  position: relative;
}

.custom-select-filter {
  position: relative;
}

select {
  appearance: none;
  /* safari */
  -webkit-appearance: none;
  /* other styles for aesthetics */
  width: 100%;
  font-size: 1.15rem;
  padding: 0.675em 6em 0.675em 1em;
  background-color: #fff;
  border: 1px solid #caced1;
  border-radius: 0.25rem;
  color: #000;
  cursor: pointer;
}

.custom-select::before,
.custom-select::after {
  --size: 0.3rem;
  position: absolute;
  content: "";
  right: 1rem;
  pointer-events: none;
}

.custom-select-with-icon::before,
.custom-select-with-icon::after {
  --size: 0.3rem;
  position: absolute;
  content: "";
  right: 1rem;
  pointer-events: none;
}

.custom-select-filter::before,
.custom-select-filter::after {
  --size: 0.3rem;
  position: absolute;
  content: "";
  right: 1rem;
  pointer-events: none;
}


/* .custom-select::before {
    border-left: var(--size) solid transparent;
    border-right: var(--size) solid transparent;
    border-bottom: var(--size) solid black;
    top: 40%;
} */

.custom-select::after {
  border-left: var(--size) solid transparent;
  border-right: var(--size) solid transparent;
  border-top: var(--size) solid black;
  top: 65%;
}

.custom-select-with-icon::after {
  border-left: var(--size) solid transparent;
  border-right: var(--size) solid transparent;
  border-top: var(--size) solid black;
  top: 65%;
}

.custom-select-filter::after {
  border-left: var(--size) solid transparent;
  border-right: var(--size) solid transparent;
  border-top: var(--size) solid black;
  top: 50%;
}

.custom-select .icon {
  margin-right: 8px;
  display: inline-block;
  width: 16px;
  height: 16px;
}


/* End of custom Select */

.ant-modal-footer {
  border: none !important;
}

@keyframes rotateOutIn {

  0%,
  100% {
    transform: rotate(0deg) scaleY(1);
  }

  25%,
  75% {
    transform: rotate(90deg) scaleY(1.5);
  }

  50% {
    transform: rotate(180deg) scaleY(1);
  }
}

.rotating-border-container {
  position: relative;
  width: 100px;
  height: 100px;
}

.rotating-border {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 2px solid #3498db;
  border-radius: 50%;
  content: '';
  animation: rotateOutIn 4s linear infinite;
}


/* For Toast */

@import 'ngx-toastr/toastr';
@import 'ngx-toastr/toastr-bs4-alert';

.toast-error-custom {
  border-radius: 4px !important;
  border: 0.5px solid #DE022E !important;
  background: #FDEBF0 !important;
  width: 402px !important;
  padding: 16px !important;
}

.errorTitle {
  color: #DE022E !important;
  display: flex !important;
  font-weight: 600;
}

.errorTitle::before {
  content: url(../images/miden/close-circle.svg) !important;
  margin-right: 10px;
}

.toast-success-custom {
  border-radius: 4px !important;
  border: 0.5px solid #06AA81 !important;
  background: #F2FAF7 !important;
  width: 402px !important;
  padding: 16px !important;
}

.successTitle {
  color: #07BB8E !important;
  display: flex !important;
  font-weight: 600;
}

.successTitle::before {
  content: url(../images/miden/tick-circle.svg) !important;
  margin-right: 10px;
}

.toast-info-custom {
  border-radius: 4px !important;
  border: 0.5px solid #1383E8 !important;
  background: #F3F8FD !important;
  width: 402px !important;
  padding: 16px !important;
}

.infoTitle {
  color: #1590FF !important;
  display: flex !important;
  font-weight: 600;
}

.infoTitle::before {
  content: url(../images/miden/info-circle.svg) !important;
  margin-right: 10px;
}

.toast-warning-custom {
  border-radius: 4px !important;
  border: 0.5px solid #DE8E02 !important;
  background: #FDF9F3 !important;
  width: 402px !important;
  padding: 16px !important;
}

.warningTitle {
  color: #DE8E02 !important;
  display: flex !important;
  font-weight: 600;
}

.warningTitle::before {
  content: url(../images/miden/warning-triangle.svg) !important;
  margin-right: 10px;
}

.toastMessage {
  font-size: 12px !important;
  color: #2D3748 !important;
  margin-left: 35px !important;
}

.toast-close-button {
  color: #8FAECA !important;
  font-weight: bold;
  font-size: 16px;
}


/* End For Toast */

input[readonly] {
  border-radius: 4px !important;
  border: 1px solid #E1EBF5 !important;
  background: #F5F9FC !important;
  color: #B1CCE5 !important;
}

.miden-badge-error {
  padding: 4px 12px;
  align-items: center;
  border-radius: var(--Spacing-6, 24px);
  background: #DE022E;
  color: #E1EBF5;
  gap: 6px;
}

.miden-badge-warning {
  padding: 4px 12px;
  align-items: center;
  border-radius: var(--Spacing-6, 24px);
  background: #DE8E02;
  color: #E1EBF5;
  gap: 6px;
}

.miden-badge-success {
  padding: 4px 12px;
  align-items: center;
  border-radius: var(--Spacing-6, 24px);
  background: #06AA81;
  color: #E1EBF5;
  gap: 6px;
}

.forgotLogin {
  color: #274B6B
}

.forgotLogin:hover {
  color: #3490e2
}

.input-icon-search {
  position: absolute;
  top: 23px;
  left: 10px;
  transform: translateY(-50%);
  z-index: 1;
}

.filterIcon {
  padding: 4px;
  border-radius: 4px;
  background: #FAFDFF;
  box-shadow: 0px 7px 30px 0px rgba(0, 0, 0, 0.10);
}

.filterIcon>svg {
  fill: #557591;
}

.filterIcon>svg:hover {
  fill: #1590FF;
}

.ant-modal-body {
  padding: 0px !important;
}

.readonly-select {
  pointer-events: none;
  background-color: #F6F9FC !important;
  color: #CEDCEC !important;
}
