/* ==============================================================================
   app/static/css/custom.css

   ОСТАТОЧНЫЙ файл — после введения app/static/css/design-system.css
   (единый источник токенов/компонентов для кабинета: типографика, кнопки,
   поля форм, таблицы, сайдбар/шапка/подвал) здесь остались только вещи,
   которые НЕ являются токеном/компонентом в этом смысле: специфичная для
   Cropper.js разметка кругового кропа и скрытие нативного вида
   input[type=file]. Всё остальное, что раньше жило здесь (три предыдущих
   UI-патча), перенесено в design-system.css и отсюда удалено — не должно
   быть двух файлов, спорящих за одно и то же свойство.

   Подключается на всех трёх layout'ах (кабинет, гостевой, публичный сайт) —
   именно поэтому то немногое, что здесь осталось, должно быть безопасно
   везде, включая публичный сайт (design-system.css туда сознательно НЕ
   подключается — его :root-токены/!important-кнопки задуманы только для
   кабинета и сломали бы, например, крупные герой-кнопки на главной).
   ============================================================================== */

/* ------------------------------------------------------------------------
   Круглая область кадрирования аватара. Cropper.js с aspectRatio:1 задаёт
   КВАДРАТНУЮ рабочую область — сам по себе этот параметр НЕ делает
   выделение визуально круглым. Стандартный приём Cropper.js для круглого
   кропа — скруглить сами элементы UI кропа (view-box/face) через
   border-radius:50%, тогда ограничение видно пользователю визуально, а не
   только "квадрат, внутри которого потом вырежут круг где-то в другом месте".
   ------------------------------------------------------------------------ */
.cropper-view-box,
.cropper-face {
    border-radius: 50%;
}
.cropper-view-box {
    outline: 1px solid #39f;
    outline-color: rgba(51, 153, 255, 0.75);
}

/* ------------------------------------------------------------------------
   Кнопка выбора файла аватара — нативный вид <input type="file"> (кнопка
   "Выберите файл" + имя файла) скрыт, вместо него единая кнопка "Выбрать"
   (стиль — design-system.css) без отображения имени файла (превью аватара
   и так показывает, что выбрано — имя файла было избыточным дублированием).
   ------------------------------------------------------------------------ */
.avatar-file-input {
    display: none;
}