/* CodeMirror 6 - Стили для правильного отображения */

:root {
  color-scheme: light dark;
    --brdr: light-dark(#333, #ccc);
    --accent-mode-color: light-dark(#222, #eee);
  }

.cm6-editor-wrapper {
  /* Основной wrapper, созданный CodeMirror */
  flex-direction: column;
  overflow: hidden;
}

.cm-editor {
  /* Сам редактор внутри wrapper - растягиваем на всю доступную высоту */
  flex: 1 1 auto;
  font-family: monospace;
  line-height: 1;
  border: 1px solid var(--brdr);;
}

/*
  Утилитарные классы для управления шириной.
  Мы ищем редактор .cm-editor ВНУТРИ элемента с нашим классом.
*/

.codemirror-width-s > .cm-editor {
  /* Маленький (для чисел, коротких ID) */
  max-width: 8em !important;
}

.codemirror-width-m > .cm-editor {
  /* Средний (для URL, коротких строк) */
  max-width: calc(50% - 13em) !important;  /* Вычитание 13em подобрано. Это ширина бокового меню слева */
}

.codemirror-width-l > .cm-editor {
  /* Большой (для текста, JSON, HTML) */
  max-width: calc(75% - 13em) !important;
}

.codemirror-width-xl > .cm-editor {
  /* Во всю ширину контейнера */
  max-width: calc(100% - 13em) !important;
}

/* Ширина редактора зависит от видимости бокового меню Django Admin.
   На экранах < 767px меню прячется, поэтому вычитание 13em неактуально.
   Подобрано значение 3ex. */
@media (max-width: 767px) {
  .codemirror-width-m > .cm-editor,
  .codemirror-width-l > .cm-editor,
  .codemirror-width-xl > .cm-editor {
    max-width: calc(100% - 3ex) !important;
  }
}

/* --- Новый класс для минимальной высоты --- */
.codemirror-min-height-5 .cm-editor {
    min-height: 8em; /* 5 строк */
}
.codemirror-min-height-10 .cm-editor {
    min-height: 16em; /* 10 строк */
}

.codemirror-no-lines .cm-gutters {
  /* Скрываем  нумерацию строк */
  display: none !important;
}


/* Скрыть оригинальный textarea */
textarea[data-codemirror-editor] {
  display: none !important;
}