/*
  Стек модальных окон и offcanvas относительно шапки и TinyMCE.

  #page-topbar в app.css: z-index 1060.
  Bootstrap 5 по умолчанию: offcanvas 1045 / offcanvas-backdrop 1040 / modal 1055 / backdrop 1050 —
  шапка перекрывает offcanvas и модалки.

  TinyMCE .tox-tinymce-aux по умолчанию: z-index 1300 —
  прозрачный слой aux перехватывает клики по модалке
  (типичный симптом: окно «затенено», кнопки не нажимаются).

  Целевой стек:
    topbar 1060 < tinymce-aux 1070 = offcanvas-backdrop 1070 < offcanvas 1075
    < backdrop 1080 < modal 1085 < date-picker 1090
    (datepicker монтируется в body и должен быть выше модалки)
*/
:root {
  --ask-offcanvas-backdrop-zindex: 1070;
  --ask-offcanvas-zindex: 1075;
  --ask-modal-zindex: 1085;
  --ask-backdrop-zindex: 1080;
  --ask-tinymce-aux-zindex: 1070;
  --ask-datepicker-zindex: 1090;
}

/* Переопределяем CSS-переменные Bootstrap на самих элементах
   (значения на :root перекрываются правилами .modal / .modal-backdrop / .offcanvas / .offcanvas-backdrop). */
.offcanvas {
  --bs-offcanvas-zindex: var(--ask-offcanvas-zindex);
  z-index: var(--ask-offcanvas-zindex) !important;
}

.offcanvas-backdrop {
  --bs-offcanvas-zindex: var(--ask-offcanvas-backdrop-zindex);
  z-index: var(--ask-offcanvas-backdrop-zindex) !important;
}

.modal {
  --bs-modal-zindex: var(--ask-modal-zindex);
  z-index: var(--ask-modal-zindex) !important;
}

.modal-backdrop {
  --bs-backdrop-zindex: var(--ask-backdrop-zindex);
  z-index: var(--ask-backdrop-zindex) !important;
}

.tox.tox-tinymce-aux,
.tox-tinymce-aux {
  z-index: var(--ask-tinymce-aux-zindex) !important;
}

/* date-picker монтируется в body; без этого оказывается под modal/backdrop */
.date-picker,
#date-picker-main {
  z-index: var(--ask-datepicker-zindex) !important;
}