/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Lexxy Editor Dark Mode Overrides - Force Light Background */
lexxy-editor {
  background-color: white !important;
  color: #1f2937 !important;
}

lexxy-editor .lexxy-editor__content {
  background-color: white !important;
  color: #1f2937 !important;
}

lexxy-toolbar {
  background-color: #f9fafb !important;
  border-color: #d1d5db !important;
}

lexxy-toolbar .lexxy-editor__toolbar-button {
  color: #374151 !important;
  background-color: transparent !important;
}

lexxy-toolbar .lexxy-editor__toolbar-button:hover {
  background-color: #f3f4f6 !important;
}

lexxy-toolbar .lexxy-editor__toolbar-button.lexxy-editor__toolbar-button--active {
  background-color: #dbeafe !important;
  color: #1d4ed8 !important;
}

/* Target any contenteditable areas within lexxy-editor */
lexxy-editor [contenteditable] {
  background-color: white !important;
  color: #1f2937 !important;
}

/* Ensure any nested elements also use light styling */
lexxy-editor * {
  color: inherit !important;
}

/* Folder Menu - Details/Summary Chevron Rotation */
details[open] > summary .chevron {
  transform: rotate(0deg);
  transition: transform 0.2s ease;
}

details:not([open]) > summary .chevron {
  transform: rotate(-90deg);
  transition: transform 0.2s ease;
}

/* Search Highlights */
.search-highlight em {
  font-style: normal;
  font-weight: 400;
  background-color: #fef08a;
  padding: 0 2px;
}

.dark .search-highlight em {
  background-color: #854d0e;
  color: #fef08a;
}