#nprogress .bar {
  background: #003778 !important;
}

html{
  @apply overflow-hidden;
}

body {
  @apply bg-primary-25;
}

.el-main {
  max-height: 100vh;
}

// Menu
.el-menu-item .el-menu-tooltip__trigger {
  @apply items-center justify-center flex;
  width: 58px;
  left: 2px;
  margin-left: -12px;
}
// Popper
.el-popper__arrow {
  display: none;
}

.el-popper.is-dark {
  background-color: #F2F2F2;
  color: #222;
  @apply font-medium h-6 px-1.5 border-none rounded-md flex items-center shadow;
}

// Overlay
.el-overlay {
  --el-overlay-color-lighter: rgba(0, 0, 0, 0.15);
  background-color: rgba(0, 0, 0, 0.15);
}

// Divider
hr {
  @apply border-t;
  border-color: #e9e9e9;
}

.el-loading-mask {
  @apply bg-transparent;

  .el-loading-spinner {
    @apply relative flex items-center justify-center h-full top-auto mt-auto;

    .circular {
      @apply h-6 w-6;
    }

    .path {
      stroke: #111827;
    }
  }
}

.app-page-spinner {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 10rem;

  .el-loading-mask {
    @apply bg-transparent;
    z-index: 10;
  }
  .el-loading-spinner {
    @apply relative flex items-center justify-center h-full top-auto mt-auto;
    .circular {
      @apply w-10 h-10;
    }
  }
}

.custom-spinner::before {
  @apply border-2 border-gray-100 border-b-gray-900 border-x-gray-900 rounded-full h-8 w-8 absolute;
  top: 10%;
  left: 10%;
  transform: translate3d(-50%, -50%, 0);
  content: "";
}

.el-loading-spinner .path {
  stroke: #003778;
}

.el-row {
  flex-wrap: wrap;
}

// Disable autocomplete background
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: #000 !important;
}
