/* ----------------------------------------------------------------------- */
/* Quill Snow theme — overrides matching this app's design tokens           */
/* ----------------------------------------------------------------------- */
/* Loaded only on /organizations/:id (where the Note form lives) AFTER
   `quill.snow.css`. Selectors mirror the structure of Snow's own
   stylesheet so each rule overrides the matching base rule by source
   order (same specificity, later import wins). When bumping Quill
   the upstream class hooks rarely change; if a rule here stops
   biting, diff against the new quill.snow.css and adjust. */

/* Container — match form-input chrome */
.ql-toolbar.ql-snow,
.ql-container.ql-snow {
  border: 1px solid var(--rule-strong);
}
.ql-toolbar.ql-snow {
  background: var(--surface-2);
  border-top-left-radius: var(--radius-sm);
  border-top-right-radius: var(--radius-sm);
  border-bottom: 0;
}
.ql-container.ql-snow {
  background: var(--surface);
  border-bottom-left-radius: var(--radius-sm);
  border-bottom-right-radius: var(--radius-sm);
}

/* Editor body — give it real estate, match the form's typography. */
.ql-container.ql-snow .ql-editor {
  min-height: 12rem;
  font-family: var(--sans);
  font-size: 0.95rem;
  line-height: 1.55;
  color: var(--ink);
  padding: var(--gap-3) var(--gap-4);
}
.ql-container.ql-snow .ql-editor.ql-blank::before {
  color: var(--ink-faint);
  font-style: normal;
  font-family: var(--sans);
  left: var(--gap-4);
  right: var(--gap-4);
}

/* Toolbar icons — default state uses our soft ink color so the
   toolbar reads as a muted strip until hovered. */
.ql-snow.ql-toolbar button .ql-stroke,
.ql-snow .ql-picker-label .ql-stroke {
  stroke: var(--ink-soft);
}
.ql-snow.ql-toolbar button .ql-fill,
.ql-snow .ql-picker-label .ql-fill {
  fill: var(--ink-soft);
}
.ql-snow .ql-picker-label,
.ql-snow .ql-picker-item {
  color: var(--ink-soft);
}

/* Hover + active — accent color (matches the rest of the app) */
.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-picker-item.ql-selected .ql-stroke {
  stroke: var(--accent);
}
.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button:focus .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-picker-label:hover .ql-fill,
.ql-snow .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-picker-item:hover .ql-fill,
.ql-snow .ql-picker-item.ql-selected .ql-fill {
  fill: var(--accent);
}
.ql-snow.ql-toolbar button:hover,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-picker-label:hover,
.ql-snow .ql-picker-label.ql-active,
.ql-snow .ql-picker-item:hover,
.ql-snow .ql-picker-item.ql-selected {
  color: var(--accent);
}

/* Picker dropdown (Header dropdown's options panel) */
.ql-snow .ql-picker-options {
  background: var(--surface);
  border: 1px solid var(--rule-strong);
  border-radius: var(--radius-sm);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  border-color: var(--rule-strong);
}

/* Links inside the editor — accent, no underline (we keep underlines
   for in-text emphasis only). */
.ql-snow .ql-editor a {
  color: var(--accent);
  text-decoration: underline;
}

/* Code + blockquote — match the print/widget styling */
.ql-snow .ql-editor blockquote {
  border-left: 3px solid var(--rule-strong);
  color: var(--ink-soft);
  padding-left: var(--gap-3);
  margin-left: 0;
}
.ql-snow .ql-editor pre.ql-syntax,
.ql-snow .ql-editor pre {
  background: var(--surface-2);
  color: var(--ink);
  border-radius: var(--radius-sm);
  padding: var(--gap-2) var(--gap-3);
  font-family: var(--mono);
  font-size: 0.88rem;
}
.ql-snow .ql-editor code {
  background: var(--surface-2);
  color: var(--ink);
  padding: 0.05em 0.35em;
  border-radius: 3px;
  font-family: var(--mono);
  font-size: 0.92em;
}

/* Tooltip (the floating link-entry / preview popover) */
.ql-snow .ql-tooltip {
  background: var(--surface);
  border: 1px solid var(--rule-strong);
  border-radius: var(--radius-sm);
  color: var(--ink);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  padding: var(--gap-2) var(--gap-3);
}
.ql-snow .ql-tooltip input[type="text"] {
  background: var(--surface);
  border: 1px solid var(--rule-strong);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 0.9rem;
  border-radius: var(--radius-sm);
}
.ql-snow .ql-tooltip a {
  color: var(--accent);
}
.ql-snow .ql-tooltip a.ql-action::after,
.ql-snow .ql-tooltip a.ql-remove::before {
  border-right-color: var(--rule);
}

/* Selection background inside editor (matches accent-soft toned down) */
.ql-snow .ql-editor ::selection {
  background: var(--accent-soft);
  color: var(--ink);
}