{% load static %}
{% comment %}
Shared Quill Snow theme CSS + RUFORUM brand overrides. Include in a page's
extra_head block alongside quill_auto_init.html in extra_js.
Quill is served from local static to avoid CDN reachability issues.
{% endcomment %}
<link href="{% static 'css/vendor/quill.snow.css' %}" rel="stylesheet">
<style>
  .js-quill-wrap {
    border: 1px solid #ddd0bc;
    border-radius: 0.5rem;
    overflow: hidden;
    background: #fff;
  }
  .js-quill-wrap .ql-toolbar.ql-snow {
    border: 0;
    border-bottom: 1px solid #ddd0bc;
    background: #f5efe2;
  }
  .js-quill-wrap .ql-container.ql-snow {
    border: 0;
    font-family: inherit;
    font-size: 0.875rem;
    color: #2c1f06;
  }
  .js-quill-wrap .ql-editor {
    min-height: 140px;
    max-height: none;
    padding: 0.875rem 1rem;
    line-height: 1.55;
  }
  .js-quill-wrap .ql-editor.ql-blank::before {
    color: #9e8e72;
    font-style: normal;
  }
  .js-quill-wrap .ql-editor p + p { margin-top: 0.5rem; }
  .js-quill-wrap.js-quill-wrap--sm .ql-editor { min-height: 96px; }
  /* Hide textarea only AFTER Quill has successfully mounted (data-attr set by JS).
     This means if Quill never loads, the native textarea stays usable. */
  textarea.js-quill[data-quill-mounted="1"] { display: none; }
  /* Graceful native-textarea fallback styling for when Quill hasn't mounted yet. */
  textarea.js-quill:not([data-quill-mounted="1"]) {
    width: 100%;
    border: 1px solid #ddd0bc;
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-family: inherit;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #2c1f06;
    background: #fff;
  }
  textarea.js-quill:not([data-quill-mounted="1"]):focus {
    outline: none;
    border-color: #166534;
    box-shadow: 0 0 0 3px rgba(22, 101, 52, 0.12);
  }
</style>