{% if lit %}
  <div class="mt-4" id="lit-block">
    <h3 class="mb-3">추천문학</h3>
    <style>
      /* 이 블록 한정: 첫 줄 들여쓰기/왼쪽여백 무조건 0 + 줄바꿈 보존 */
      #lit-block .poem, #lit-block .poem * {
        text-indent: 0 !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
      }
      #lit-block .poem { white-space: pre-line !important; }
      #lit-block .meta { display:block; margin-top:.8rem; font-size:.9rem; color:#6c757d; }
    </style>

    <div class="poem" id="poem-text">
      {{ lit.text|linebreaksbr }}
    </div>

    <div class="meta text-secondary mt-2">
      {% if lit.author %}작가: {{ lit.author }}{% endif %}
      {% if lit.region %}
        {% if lit.author %}<span class="mx-1">·</span>{% endif %}
        지역: {{ lit.region }}
      {% endif %}
    </div>

    <script>
      (function () {
        // 줄 시작 부분에 붙은 모든 공백 문자 제거:
        // 공백, 탭, NBSP(\u00A0), 전각(\u3000), 얇은/특수 공백(\u2000-\u200B, \u202F, \u205F), BOM(\uFEFF) 등
        var el = document.getElementById('poem-text');
        if (!el) return;
        var html = el.innerHTML;

        // <br> 뒤나 문서 처음(^) 이후에 이어지는 공백류를 싹 제거
        html = html.replace(/(^|<br\s*\/?>)[\s\u00A0\u1680\u180E\u2000-\u200B\u202F\u205F\u3000\uFEFF]+/g, '$1');

        // 혹시 에디터가 &nbsp;를 엔티티로 남긴 경우도 제거
        html = html.replace(/(^|<br\s*\/?>)(?:&nbsp;)+/g, '$1');

        el.innerHTML = html;
      })();
    </script>
  </div>
{% else %}
  <div class="text-secondary">표시할 문학가 없습니다.</div>
{% endif %}