@font-face {
  font-family: "Ouer Material Icons";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("/theme/Xboard/assets/ouer-material-icons.woff2") format("woff2");
}

.title-text {
  align-items: center;
  color: #405d82 !important;
  display: inline-flex;
  gap: 8px;
}

.title-text::before {
  content: "language";
  direction: ltr;
  font-family: "Ouer Material Icons";
  font-size: 22px;
  font-style: normal;
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1;
  text-transform: none;
  white-space: nowrap;
  word-wrap: normal;
}

.dark .title-text {
  color: inherit !important;
}

.ouer-remember-row {
  align-items: center;
  color: #4b5563;
  cursor: pointer;
  display: flex;
  font-size: 14px;
  gap: 8px;
  margin: 10px 0 14px;
  user-select: none;
  width: 100%;
}

.ouer-remember-row input {
  accent-color: #2f7f88;
  height: 16px;
  margin: 0;
  width: 16px;
}

.ouer-subpage-back {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 4px;
  color: #52606d;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font: inherit;
  height: 36px;
  justify-content: center;
  margin: 0;
  padding: 0;
  width: 36px;
}

.ouer-subpage-back:hover {
  background: #edf3f4;
  color: #2f7f88;
}

.ouer-subpage-back:focus-visible {
  outline: 2px solid #2f7f88;
  outline-offset: 2px;
}

.ouer-subpage-back__icon {
  direction: ltr;
  font-family: "Ouer Material Icons";
  font-size: 19px;
  font-style: normal;
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1;
  text-transform: none;
  white-space: nowrap;
}

.ouer-subpage-breadcrumb {
  align-items: center;
  display: inline-flex;
}

.ouer-subpage-breadcrumb > :not(.ouer-subpage-back) {
  display: none !important;
}

@media (min-width: 768px) {
  html:has(.n-layout-sider:not(.n-layout-sider--collapsed))
    article > header > :first-child > .n-icon:first-child {
    align-items: center;
    border-radius: 4px;
    cursor: pointer;
    display: flex !important;
    height: 34px;
    justify-content: center;
    left: 178px;
    position: fixed;
    top: 13px;
    width: 34px;
    z-index: 20;
  }

  html:has(.n-layout-sider:not(.n-layout-sider--collapsed))
    article > header > :first-child > .n-icon:first-child:hover {
    background: #edf3f4;
    color: #2f7f88;
  }
}

@media (min-width: 1024px) {
  html[data-ouer-route="dashboard"] .cus-scroll-y > .mb-1.md\:mb-10 {
    display: grid;
    gap: 20px;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  }

  html[data-ouer-route="dashboard"] .cus-scroll-y > .mb-1.md\:mb-10 > :first-child {
    grid-column: 1 / -1;
  }

  html[data-ouer-route="dashboard"] .cus-scroll-y > .mb-1.md\:mb-10 > .n-card {
    align-self: start;
    margin-top: 0 !important;
    min-width: 0;
  }

  html[data-ouer-route="plan"] .card-container {
    display: grid !important;
    gap: 24px 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-ouer-route="plan"] .card-container > .card-item {
    min-width: 0 !important;
    width: auto !important;
  }

  html[data-ouer-route="plan"] .card-container > .card-item > .n-card {
    height: 100%;
    max-width: none !important;
    width: 100% !important;
  }
}

@media (max-width: 1023px) {
  html[data-ouer-route="dashboard"] .cus-scroll-y > .mb-1.md\:mb-10 > .n-card {
    width: 100%;
  }
}