body.lyear-user-page {
  background: #f4f6fb;
}

.user-sidebar-header {
  padding: 0 18px;
}

.user-logo {
  display: flex !important;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: #2b3445;
}

.user-logo:hover {
  color: #2b3445;
}

.user-logo-mark,
.auth-brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: linear-gradient(135deg, #2f80ed 0%, #00b894 100%);
}

.user-logo-mark {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  font-size: 22px;
  flex: 0 0 auto;
}

.auth-brand-mark {
  width: 52px;
  height: 52px;
  border-radius: 8px;
  font-size: 28px;
}

.user-logo-text {
  display: block;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 18px;
  font-weight: 700;
}

.user-page-title {
  margin-left: 18px;
  padding-left: 18px;
  border-left: 1px solid #e7ebf3;
  color: #253044;
  font-size: 16px;
  font-weight: 700;
}

.user-content {
  padding-top: 22px;
}

.user-avatar {
  width: 34px;
  height: 34px;
  object-fit: cover;
  border-radius: 50%;
  margin-right: 8px;
  border: 2px solid #edf1f7;
}

.user-profile-toggle {
  display: inline-flex !important;
  align-items: center;
  color: #39465e;
}

.user-header-metrics {
  gap: 10px;
  margin-right: 16px;
}

.user-metric {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 5px 10px;
  border: 1px solid #edf1f7;
  border-radius: 8px;
  color: #5f6f89;
  background: #fff;
}

.user-metric:hover {
  color: #2f80ed;
}

.user-metric strong {
  color: #253044;
}

.lyear-layout-content .card,
.lyear-layout-content .bg-white {
  border-radius: 8px;
}

.lyear-layout-content table {
  margin-bottom: 0;
}

.lyear-layout-content th {
  white-space: nowrap;
}

.lyear-layout-content a {
  text-decoration: none;
}

.user-gradient,
.user-gradient-x {
  background: linear-gradient(135deg, #2f80ed 0%, #00b894 100%) !important;
}

.user-max-md {
  max-width: 28rem;
}

.user-max-2xl {
  max-width: 42rem;
}

.user-max-3xl {
  max-width: 48rem;
}

.user-max-4xl {
  max-width: 56rem;
}

.user-w-40 {
  width: 10rem;
}

.user-icon-sm,
.user-icon-md,
.user-icon-lg,
.user-icon-xl,
.user-icon-xxl,
.user-avatar-xl,
.user-empty-icon,
.user-rank-icon,
.user-rank-icon-sm {
  flex: 0 0 auto;
}

.user-icon-sm {
  width: 2.5rem;
  height: 2.5rem;
}

.user-icon-md {
  width: 3rem;
  height: 3rem;
}

.user-icon-lg {
  width: 4rem;
  height: 4rem;
}

.user-icon-xl {
  width: 3.5rem;
  height: 3.5rem;
}

.user-icon-xxl {
  width: 5rem;
  height: 5rem;
}

.user-avatar-xl {
  width: 8rem;
  height: 8rem;
  object-fit: cover;
}

.user-empty-icon {
  width: 6rem;
  height: 6rem;
}

.user-rank-icon {
  width: 2.25rem;
  height: 2.25rem;
}

.user-rank-icon-sm {
  width: 2rem;
  height: 2rem;
}

.user-dot {
  width: .75rem;
  height: .75rem;
  display: inline-block;
}

.user-chart-box {
  height: 18rem;
}

.user-progress-track {
  height: .5rem;
}

.user-sort-indicator {
  width: .75rem;
}

.user-table-label {
  width: 10rem;
}

.user-min-w-0 {
  min-width: 0;
}

.user-cursor-pointer {
  cursor: pointer;
}

.user-cursor-default {
  cursor: default;
}

.user-cursor-not-allowed {
  cursor: not-allowed;
}

.user-text-xs {
  font-size: .75rem;
}

.user-text-xxs {
  font-size: .68rem;
}

.user-divide-y > * + * {
  border-top: 1px solid #edf1f7;
}

.user-ring-primary {
  box-shadow: 0 0 0 .2rem rgba(13, 110, 253, .18);
}

.user-modal-backdrop {
  z-index: 1050;
  background: rgba(0, 0, 0, .5);
}

@media (min-width: 768px) {
  .user-w-md-auto {
    width: auto !important;
  }

  .user-w-md-56 {
    width: 14rem !important;
  }

  .user-w-md-72 {
    width: 18rem !important;
  }
}

@media (max-width: 767.98px) {
  .user-page-title {
    margin-left: 10px;
    padding-left: 10px;
    font-size: 15px;
  }

  .user-content {
    padding: 16px 12px 24px;
  }
}