/**
 * Sticky toolbar for lexxy-editor
 * Makes the toolbar stay visible at the top when scrolling down the page
 *
 * Best practice: Modern rich text editors should keep formatting controls accessible
 * without requiring users to scroll back to the top of long documents.
 *
 * Implementation:
 * - Uses position: sticky to keep toolbar at top during scroll
 * - Adds subtle shadow to indicate floating state
 * - Ensures proper z-index layering
 * - Maintains background to prevent content bleed-through
 */

/* Make the lexxy toolbar sticky when scrolling */
lexxy-toolbar {
  position: sticky;
  top: 0;
  z-index: 10;
  background-color: white;
  /* Add a subtle shadow to indicate it's floating above content */
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05);
  transition: box-shadow 0.2s ease-in-out;
}

/* Enhanced shadow when user scrolls (optional - can be enhanced with JS) */
lexxy-toolbar:hover {
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.08);
}