/* ======================================================================
 * Мелкие правки органов управления поверх темы.
 *
 * Здесь то, что относится не к одной странице, а к элементу вообще, и что
 * нельзя чинить правкой style.css: он собран сборщиком и переписывается
 * целиком.
 * ====================================================================== */

/* Кнопка внутри цветной плашки.
 *
 * Плашки в этой теме сплошные и задают своему содержимому цвет текста: белый
 * на синей, тёмный на жёлтой. Кнопка же приносила свой фон — у btn-default он
 * почти белый, — и белый текст плашки ложился на белую кнопку: подпись
 * «Скачать файл выплаты» на светлой теме была не видна вовсе.
 *
 * Поэтому кнопка не приносит своих цветов, а берёт цвет плашки: contour в
 * currentColor контрастен фону по построению, на любой плашке и в любой теме.
 * Подсветка при наведении — нейтральная серая: она читается и на светлом, и
 * на тёмном фоне. */
.alert .btn-default,
.alert .btn-light,
.alert .btn-secondary,
.alert .btn-outline-secondary,
.alert .btn-outline-light,
.card .alert .btn-default.btn-flat,
.card .alert .btn-light.btn-flat {
    background-color: transparent;
    /* !important — единственный способ перебить `.card .btn-flat`, где рамка
       объявлена с ним же и почти прозрачным коричневым. */
    border: 1px solid currentColor !important;
    color: inherit;
    text-shadow: none;
    box-shadow: none;
}

.alert .btn-default:hover,
.alert .btn-light:hover,
.alert .btn-secondary:hover,
.alert .btn-outline-secondary:hover,
.alert .btn-outline-light:hover,
.alert .btn-default:focus,
.alert .btn-light:focus {
    background-color: rgba(127, 127, 127, .22);
    border-color: currentColor;
    color: inherit;
}

/* ======================================================================
 * Обсуждение под карточкой
 *
 * Раньше это была лента строк во всю ширину: подпись автора у левого края,
 * время у правого, между ними тысяча пикселей пустоты, а сами реплики
 * разделены сплошной чертой. Читать такое приходилось зигзагом.
 *
 * Теперь каждая реплика — карточка своей ширины: аватар, шапка с автором и
 * временем рядом, текст под ней. Системные отметки (переотправка, ответ
 * службы) отличаются оформлением — это не разговор, и мешать их с репликами
 * людей без различия нельзя.
 * ====================================================================== */

.cmt-list { display: flex; flex-direction: column; gap: 14px; }
.cmt-list__items { display: flex; flex-direction: column; gap: 10px; }

.cmt {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    max-width: 760px;
}

.cmt__avatar {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    background: #eef1f4;
}

.cmt__body {
    flex: 1 1 auto;
    min-width: 0;
    padding: 8px 12px 9px;
    border: 1px solid #e4e9ee;
    border-radius: 8px;
    background: #fff;
}

.cmt__head {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 3px;
}

.cmt__author { font-weight: 600; font-size: .86rem; }

.cmt__when {
    font-size: .74rem;
    color: #8a949e;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    margin-left: auto;
}

.cmt__text { font-size: .88rem; line-height: 1.5; word-break: break-word; }

/* Системная отметка: не реплика, а запись самой системы. Отсюда и приглушённый
   фон, и моноширинный шрифт — в таких записях номера, а не слова. */
.cmt--system .cmt__body {
    background: #f7f9fb;
    border-color: #e7ecf1;
    border-left: 3px solid #c3ced9;
}

.cmt--system .cmt__author { color: #6c757d; }

.cmt--system .cmt__text {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: .8rem;
    line-height: 1.45;
    color: #4a555f;
}

.cmt-list__empty {
    margin: 0;
    padding: 12px 14px;
    border: 1px dashed #dfe4e9;
    border-radius: 8px;
    font-size: .85rem;
    color: #8a949e;
}

.cmt-form {
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 760px;
    padding-top: 4px;
}

.cmt-form .send-comment { flex: 1 1 auto; }


/* Подпись единиц измерения рядом с полем — «кг», «см».
 *
 * В style.css у .input-group-append .input-group-text задан цвет #c9c8c8:
 * светло-серый по светло-серой подложке #e9ecef, то есть почти невидимый.
 * В разметке это лечили инлайновым color:#000, а инлайн бьёт любое правило
 * темы — и в тёмной подпись становилась чёрной по тёмному, то есть невидимой
 * уже там. Инлайны убраны, цвет задаётся здесь; тёмная тема перекрывает его
 * своим правилом на .input-group-text, оно специфичнее. */
.input-group-append .input-group-text,
.input-group-prepend .input-group-text { color: #495057; }

/* Текст, окрашенный цветом статуса.
 *
 * Цвет приходит из базы и подбирался под белый фон: из восемнадцати статусов
 * одиннадцать на тёмной подложке не читаются, «Отмененная доставка» (#2a2a2a)
 * даёт 1,10:1. Хелпер status_ink() отдаёт оба цвета переменными, а выбор
 * делает CSS — на сервере это решить нельзя, тему ещё и скрипт в шапке ставит
 * из локального хранилища. */
.st-ink { color: var(--c-light); }