/* Shared account navigation on the homepage, workspace and editor. */
.kt-account-avatar.kt-btn,
.kt-account-avatar.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  min-width: 40px;
  padding: 0;
  overflow: hidden;
  border-radius: 50%;
  border: 1px solid rgba(182, 158, 255, .45);
  background: #382950;
  color: #f3edff;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}
.kt-account-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.kt-account-avatar:hover { border-color: #bfa6ff; box-shadow: 0 0 0 3px rgba(158, 120, 255, .12); }
.kt-account-avatar:focus-visible { outline: 2px solid #c2aaff; outline-offset: 4px; }

/* Badged accounts: the avatar sits inside a gradient ring. The ring is the
   button's own background showing through a 2px padding, so it survives
   overflow:hidden and needs no extra markup. Granted by the admin only. */
.kt-account-avatar.kt-badge-verified,
.kt-account-avatar.kt-badge-founder {
  padding: 2px;
  border-color: transparent;
}
.kt-account-avatar.kt-badge-verified {
  background: conic-gradient(from 200deg, #8f7bff, #c7b3ff, #7bdcff, #8f7bff);
  box-shadow: 0 0 12px -2px rgba(143, 123, 255, .55);
}
.kt-account-avatar.kt-badge-founder {
  padding: 1.5px;
  background: conic-gradient(from 200deg, #f6d489, #c9963f, #ffe9b0, #b8842e, #f6d489);
  box-shadow: 0 0 12px -3px rgba(240, 180, 90, .6);
}
/* The official KitTheme account: brand violet ring. */
.kt-account-avatar.kt-badge-kittheme {
  padding: 1.5px;
  border-color: transparent;
  background: conic-gradient(from 200deg, #7b64ea, #b9a8ff, #6a52d9, #9d8bf7, #7b64ea);
  box-shadow: 0 0 12px -3px rgba(123, 100, 234, .75);
}
.kt-account-avatar.kt-badge-kittheme:hover { border-color: transparent; }
.kt-account-avatar.kt-badge-kittheme img,
.kt-account-avatar.kt-badge-kittheme .kt-initials { border-radius: 50%; }
/* Pro members: electric blue ring, from the live subscription state. */
.kt-account-avatar.kt-badge-pro {
  padding: 1.5px;
  border-color: transparent;
  background: conic-gradient(from 200deg, #4fa8ff, #9fdcff, #2f7cf6, #7bdcff, #4fa8ff);
  box-shadow: 0 0 12px -3px rgba(79, 168, 255, .7);
}
.kt-account-avatar.kt-badge-pro:hover { border-color: transparent; }
.kt-account-avatar.kt-badge-verified img,
.kt-account-avatar.kt-badge-founder img,
.kt-account-avatar.kt-badge-pro img,
.kt-account-avatar.kt-badge-verified .kt-initials,
.kt-account-avatar.kt-badge-founder .kt-initials,
.kt-account-avatar.kt-badge-pro .kt-initials {
  border-radius: 50%;
}
.kt-account-avatar .kt-initials {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  background: #382950;
}
.kt-account-avatar.kt-badge-verified:hover,
.kt-account-avatar.kt-badge-founder:hover { border-color: transparent; }