@charset "utf-8";

::root {
  --bs-table-bg: #f3f4f6 !important;
}

[x-cloak] {
  display: none;
}

body {
  font-size: 16px;
  font-family: "Noto Sans CJK", "Microsoft Yahei", "Hiragino Sans GB", "Source Han Sans", "PingFang SC", "Heiti SC", "Helvetica Neue", "Arial",
    sans-serif;
}

a {
  outline: none;
}

a:hover {
  text-decoration: none !important;
}

/**
 * Menu
 */
#menu a {
  text-decoration: none;
  color: rgba(75, 85, 99, 1);
}

#menu a:hover,
#menu li.active > a,
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link.active {
  color: #fff !important;
  opacity: 0.8;
}

#menu li.active > a {
  background-color: transparent;
}

#menu ul > li:not(.active) > a {
  transition: transform 0.3s ease;
}

#menu ul > li:not(.active) > a:hover {
  transform: translate3d(5px, 0, 0);
}

/**
 * Animation
 */
a.swing:hover > i::before {
  display: inline-block;
  animation: swing ease-in-out 0.5s 1 alternate;
}

@keyframes swing {
  0% {
    transform: rotate(0deg);
  }
  10% {
    transform: rotate(10deg);
  }
  30% {
    transform: rotate(0deg);
  }
  40% {
    transform: rotate(-10deg);
  }
  50% {
    transform: rotate(0deg);
  }
  60% {
    transform: rotate(5deg);
  }
  70% {
    transform: rotate(0deg);
  }
  80% {
    transform: rotate(-5deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

/**
 * Scroll Bar
 */
::-webkit-scrollbar {
  width: 10px;
  height: 7px;
}

::-webkit-scrollbar-button {
  width: 0px;
  height: 0px;
}

::-webkit-scrollbar-thumb {
  background: #525965;
  border: 0px none #ffffff;
  border-radius: 0px;
}

::-webkit-scrollbar-thumb:hover {
  background: #525965;
}

::-webkit-scrollbar-thumb:active {
  background: #525965;
}

::-webkit-scrollbar-track {
  background: transparent;
  border: 0px none #ffffff;
  border-radius: 50px;
}

::-webkit-scrollbar-track:hover {
  background: transparent;
}

::-webkit-scrollbar-track:active {
  background: transparent;
}

::-webkit-scrollbar-corner {
  background: transparent;
}

/**
 * Bootstrap5 Custom
 */
.btn-success {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}

.btn-success:hover {
  color: #fff;
  background-color: #218838;
  border-color: #1e7e34;
}

.btn-outline-success {
  color: #28a745;
  border-color: #28a745;
}

.btn-outline-success:hover {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}

.navbar-brand span {
  font-size: 100% !important;
  font-weight: bold;
  display: inline-block;
  background: linear-gradient(135deg, #fd7e14 0%, #ffc107 100%);
  background: -webkit-linear-gradient(-45deg, #fd7e14 0%, #ffc107 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.btn-primary {
  color: #fff;
  background-color: #fd7e14;
  border-color: #fd7e14;
}

.btn-primary:hover {
  color: #fff;
  background-color: #e86e10;
  border-color: #da670f;
}

.btn-outline-primary {
  color: #fd7e14;
  border-color: #fd7e14;
}

.btn-outline-primary:hover {
  color: #fff;
  background-color: #fd7e14;
  border-color: #fd7e14;
}

.bg-primary {
  background-color: #fd7e14 !important;
}

.text-primary {
  color: #fd7e14 !important;
}

.page-link {
  color: #fd7e14;
}

.page-link:hover {
  color: #e86e10;
}

.page-item.active .page-link {
  background-color: #fd7e14;
  border-color: #fd7e14;
  color: #fff;
}

hr {
  position: relative;
}

hr::before {
  content: attr(data-content) "";
  position: absolute;
  top: calc(50% - 12px);
  margin: 0 15px;
  text-transform: uppercase;
}

.nav-underline .nav-link.active,
.nav-underline .show > .nav-link {
  font-weight: 700;
  color: #000;
  border-bottom: 0.125rem solid #000;
}

.table > :not(caption) > * > * {
  background-color: transparent !important;
}

#pagination .pagination {
  margin-bottom: 0;
}
