/* Quill Viewer Styles
   These styles ensure that content created in the Quill editor
   is properly displayed when viewing outside of edit mode */

.ql-viewer {
  /* Base styles */
  font-family: inherit;
  font-size: inherit;
  line-height: 1.5;
  color: inherit;
}

/* Text alignment */
.ql-viewer .ql-align-center {
  text-align: center;
}

.ql-viewer .ql-align-right {
  text-align: right;
}

.ql-viewer .ql-align-justify {
  text-align: justify;
}

/* Indentation */
.ql-viewer .ql-indent-1 {
  padding-left: 3em;
}

.ql-viewer .ql-indent-2 {
  padding-left: 6em;
}

.ql-viewer .ql-indent-3 {
  padding-left: 9em;
}

.ql-viewer .ql-indent-4 {
  padding-left: 12em;
}

.ql-viewer .ql-indent-5 {
  padding-left: 15em;
}

.ql-viewer .ql-indent-6 {
  padding-left: 18em;
}

.ql-viewer .ql-indent-7 {
  padding-left: 21em;
}

.ql-viewer .ql-indent-8 {
  padding-left: 24em;
}

/* Headings */
.ql-viewer h1 {
  font-size: 2em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  font-weight: bold;
}

.ql-viewer h2 {
  font-size: 1.5em;
  margin-top: 0.83em;
  margin-bottom: 0.83em;
  font-weight: bold;
}

.ql-viewer h3 {
  font-size: 1.17em;
  margin-top: 1em;
  margin-bottom: 1em;
  font-weight: bold;
}

.ql-viewer h4 {
  font-size: 1em;
  margin-top: 1.33em;
  margin-bottom: 1.33em;
  font-weight: bold;
}

.ql-viewer h5 {
  font-size: 0.83em;
  margin-top: 1.67em;
  margin-bottom: 1.67em;
  font-weight: bold;
}

.ql-viewer h6 {
  font-size: 0.67em;
  margin-top: 2.33em;
  margin-bottom: 2.33em;
  font-weight: bold;
}

/* ===== Quill Editor Fixes ===== */
/* These styles fix issues with the Quill editor toolbar and dropdowns */

/* Make sure dropdowns appear above other content */
.ql-toolbar {
  z-index: 100 !important;
}

/* Fix for dropdowns to appear above content */
.ql-toolbar .ql-picker-options {
  z-index: 200 !important;
}

/* Ensure toolbar wraps properly */
.ql-toolbar.ql-snow {
  white-space: normal !important;
  display: flex !important;
  flex-wrap: wrap !important;
}

/* Ensure toolbar buttons are properly aligned */
.ql-toolbar.ql-snow .ql-formats {
  margin-right: 10px !important;
  margin-bottom: 5px !important;
}

/* Lists */
.ql-viewer ul {
  list-style-type: disc;
  margin-left: 1.5em;
  padding-left: 0;
}

.ql-viewer ol {
  list-style-type: decimal;
  margin-left: 1.5em;
  padding-left: 0;
}

/* Blockquote */
.ql-viewer blockquote {
  border-left: 4px solid #ccc;
  margin-bottom: 5px;
  margin-top: 5px;
  padding-left: 16px;
}

/* Code block */
.ql-viewer pre {
  background-color: #f0f0f0;
  border-radius: 3px;
  padding: 5px 10px;
  white-space: pre-wrap;
}

/* Images */
.ql-viewer img {
  max-width: 100%;
  height: auto;
}

/* Links */
.ql-viewer a {
  color: #06c;
  text-decoration: underline;
}