/* Minimal Trix toolbar - only bold and italic buttons */

/* Hide ALL toolbar buttons by default */
.trix-button {
  display: none !important;
}

/* Show bold, italic, link, quote, and bullet list buttons */
.trix-button[data-trix-attribute="bold"],
.trix-button[data-trix-attribute="italic"],
.trix-button[data-trix-attribute="href"],
.trix-button[data-trix-attribute="quote"],
.trix-button[data-trix-attribute="bullet"] {
  display: inline-block !important;
}

/* Hide all button group separators */
.trix-button-group {
  display: none !important;
}

/* Show button groups that contain our enabled buttons */
.trix-button-group:has([data-trix-attribute="bold"]),
.trix-button-group:has([data-trix-attribute="italic"]),
.trix-button-group:has([data-trix-attribute="href"]),
.trix-button-group:has([data-trix-attribute="quote"]),
.trix-button-group:has([data-trix-attribute="bullet"]) {
  display: inline-flex !important;
  gap: 0;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  background-color: #f9fafb;
}

/* Style the toolbar itself */
.trix-toolbar {
  background-color: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  padding: 4px;
}

/* Make buttons look clean */
.trix-button[data-trix-attribute="bold"],
.trix-button[data-trix-attribute="italic"],
.trix-button[data-trix-attribute="href"],
.trix-button[data-trix-attribute="quote"],
.trix-button[data-trix-attribute="bullet"] {
  padding: 6px 10px;
  font-size: 14px;
  border: 1px solid transparent;
  background-color: transparent;
  cursor: pointer;
  transition: all 0.2s ease;
}

.trix-button[data-trix-attribute="bold"]:hover,
.trix-button[data-trix-attribute="italic"]:hover,
.trix-button[data-trix-attribute="href"]:hover,
.trix-button[data-trix-attribute="quote"]:hover,
.trix-button[data-trix-attribute="bullet"]:hover {
  background-color: #f3f4f6;
  border-color: #d1d5db;
}

.trix-button[data-trix-attribute="bold"].trix-active,
.trix-button[data-trix-attribute="italic"].trix-active,
.trix-button[data-trix-attribute="href"].trix-active,
.trix-button[data-trix-attribute="quote"].trix-active,
.trix-button[data-trix-attribute="bullet"].trix-active {
  background-color: #2563eb;
  color: white;
  border-color: #2563eb;
}