/*
 * Форма скидки — ОДНА на карточку записи и продажу без записи.
 *
 * Разметка живёт в партиале `_discount_form.html`, а стили жили внутри
 * карточки записи: пока форма была только у неё, это было незаметно, но
 * второму экрану пришлось бы либо тянуть весь стиль карточки, либо завести
 * вторую копию — и формы разъехались бы видом на первой же правке.
 *
 * Классы с префиксом `pay-sec__` оставлены как были: их читает разметка обоих
 * экранов, а переименование ради переезда — это правка вида ради правки.
 *
 * `.bk-hint`, `.pay-sec__head` и `.pay-sec__title` сюда не переехали: они
 * общие для всей панели оплаты, а не для формы скидки, и живут в
 * `pay-card.css` — файле, который подключают все экраны с этой панелью,
 * включая продажу без записи.
 */

/* Форма скидки — под таблицей состава, одна на позицию и на весь чек */
.pay-sec__discount {
    margin-top: .4rem;
    padding: .5rem;
    border: 1px solid var(--bp-line);
    border-radius: var(--bp-radius-sm);
    background: var(--bp-paper-2);
}
/* Ряд формы скидки выровнен по ВЕРХНЕЙ линии: у поля вида под ним висит
   пояснение, и при центрировании оно тянуло сам селект выше соседей. */
.pay-sec__discount-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: .35rem;
}
/* Подписи в ряду («На что») ставим по центру своих полей */
.pay-sec__discount-row > label { align-self: center; }
/* На что скидка: список позиций чекбоксами — годится и для одной, и для
   нескольких, и для всех сразу. */
.pay-sec__disc-targets-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .5rem;
}
.pay-sec__disc-target {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .82rem;
    padding: .1rem 0;
    cursor: pointer;
}
.pay-sec__disc-target input { margin: 0; accent-color: var(--bp-blue); }
.pay-sec__disc-target > span:first-of-type { flex: 1 1 auto; }
/* Подзаголовок брони в списке целей — только у визита: две одинаковые ракетки
   из разных броней иначе неразличимы. У скидки на одну бронь групп нет, и
   строка не выводится. */
.pay-sec__disc-group {
    margin-top: .3rem;
    font-size: .72rem;
    font-weight: 600;
    color: var(--bp-ink-soft);
}
.pay-sec__disc-target + .pay-sec__disc-group { margin-top: .45rem; }

/* Поле величины скидки — фиксированной ширины: она общая для процента и для
   рублей, иначе переключение режима дёргало бы форму. */
.pay-sec__disc-value { width: 8rem; flex: 0 0 8rem; }

/* Вид скидки и его пояснение — одной колонкой: подсказка обязана стоять под
   своим полем, иначе её уносит на строку ниже вслед за соседями по ряду. */
.pay-sec__disc-kind {
    display: inline-flex;
    flex-direction: column;
    gap: .1rem;
    max-width: 17rem;
}
.pay-sec__disc-kind .bk-hint { margin: 0; }

/* Прайс, перечёркнутый скидкой: рядом с ним стоит цена со скидкой, и без
   зачёркивания оператор читал бы два разных числа как ошибку. */
.pay-sec__line-was {
    text-decoration: line-through;
    color: var(--bp-muted);
    font-size: .72rem;
    margin-right: .25rem;
}