/* Share composer: text starts at the card's left inset, without an avatar. */
.composer .avatar.outline {
  display: none;
}

.composer #postButton {
  margin-left: 0;
  color: var(--ink) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

/* User avatar slot. Replace --avatar-image with an uploaded image URL later. */
.login-icon {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  font-size: 0;
  background: var(--avatar-image, linear-gradient(145deg, #252a35, #677889));
  background-position: center;
  background-size: cover;
}

/* Category emoji slots. Change the content value for each category as needed. */
.category-panel > a > i {
  width: 31px;
  height: 31px;
  border-radius: 10px;
  border: 0;
  font-size: 0;
  background: var(--category-tint, #edf0f4);
}

.category-panel > a > i::after {
  font-size: 14px;
  line-height: 1;
}

.category-panel > a:nth-of-type(1) > i { --category-tint: #dbe9f7; }
.category-panel > a:nth-of-type(1) > i::after { content: "💻"; }
.category-panel > a:nth-of-type(2) > i { --category-tint: #f5e5cc; }
.category-panel > a:nth-of-type(2) > i::after { content: "🎨"; }
.category-panel > a:nth-of-type(3) > i { --category-tint: #dcebdc; }
.category-panel > a:nth-of-type(3) > i::after { content: "🚀"; }
.category-panel > a:nth-of-type(4) > i { --category-tint: #eadcea; }
.category-panel > a:nth-of-type(4) > i::after { content: "🎬"; }
.category-panel > a:nth-of-type(5) > i { --category-tint: #e5efcf; }
.category-panel > a:nth-of-type(5) > i::after { content: "🌿"; }
.category-panel > a:nth-of-type(6) > i { --category-tint: #e5e7ea; }
.category-panel > a:nth-of-type(6) > i::after { content: "🧪"; }