/* Confirm-модалка с иконкой и опасным действием */
        .modal-content--confirm {
            text-align: center;
            padding: 28px 24px 22px;
        }
        .confirm-modal__icon {
            width: 56px;
            height: 56px;
            border-radius: 50%;
            background: #fdecea;
            color: #d65160;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            margin: 0 auto 14px;
        }
        .modal-content--confirm .confirm-modal__title {
            display: block;
            text-align: center;
            margin: 0 0 8px;
            padding: 0;
            font-size: 1.25rem;
            font-weight: 600;
            color: var(--text);
            line-height: 1.3;
        }
        .modal-content--confirm .confirm-modal__text {
            display: block;
            text-align: center;
            margin: 0 auto 18px;
            max-width: 380px;
            color: var(--text-muted);
            line-height: 1.5;
            font-size: 0.95rem;
        }
        .confirm-modal__check {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 10px 14px;
            background: #f6f8fb;
            border: 1px solid var(--border);
            border-radius: 10px;
            margin-bottom: 14px;
            cursor: pointer;
        }
        .confirm-modal__check:hover {
            background: #eef2f7;
        }
        .confirm-modal__check .form-check-input {
            margin: 0;
            flex-shrink: 0;
        }
        .confirm-modal__check .form-check-label {
            margin: 0;
            cursor: pointer;
            user-select: none;
            font-size: 0.92rem;
        }
        .confirm-modal__error {
            min-height: 1.1em;
            margin: 0 0 10px;
            font-size: 0.85rem;
        }
        .confirm-modal__actions {
            display: flex;
            gap: 10px;
            margin-top: 4px;
        }
        .modal-content--confirm .confirm-modal__btn {
            flex: 1;
            margin-top: 0;
            height: 46px;
            border-radius: 10px;
            font-weight: 500;
            border: 1px solid transparent;
            cursor: pointer;
            transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
        }
        /* Главная кнопка модалок — зелёный градиент как у «Открепить»,
           «Сохранить», «Войти». Скоуп через .modal-content, чтобы пробить
           Bootstrap .btn { background:none }. */
        .modal-content .confirm-modal__btn--primary {
            background: linear-gradient(90deg, #2cb67d 0%, #2ec4b6 100%);
            color: #fff;
            border: 0;
        }
        .modal-content .confirm-modal__btn--primary:hover:not(:disabled) {
            filter: brightness(0.95);
            color: #fff;
        }
        .modal-content .confirm-modal__btn--primary:disabled {
            opacity: 0.6;
            cursor: not-allowed;
        }
        /* Эталон вторичной кнопки модалок — белая с серой рамкой, как в
           «Открепить ЛС». При hover — серо-зелёная подсветка рамки. */
        .confirm-modal__btn--cancel {
            background: #fff;
            color: var(--text);
            border: 1.5px solid #d8e2ec;
            font-weight: 600;
        }
        .confirm-modal__btn--cancel:hover {
            border-color: var(--accent-info);
            color: var(--accent-info);
            background: #fff;
        }
        .confirm-modal__btn--danger {
            background: #d65160;
            color: #fff;
        }
        .confirm-modal__btn--danger:hover:not(:disabled) {
            background: #b3303f;
            /* Глобальный button:hover в 01-base.css перебивает на тёмный текст —
               явно держим белый. */
            color: #fff;
        }
        .confirm-modal__btn--danger:disabled {
            background: #e8b9bf;
            color: #fff;
            cursor: not-allowed;
        }

        /* Picker «Удалить показания» — расширяем модалку:
           560px комфортно умещает длинные имена вида «Электричество(ночь)»
           + блок значений «9786.1 → 9800.876 / Расход: 14.776 кВт·ч»
           без переноса слова посимвольно. На мобилке остаётся 95%
           (медиа-правило ниже).

           Скоуп — ТОЛЬКО confirm-picker (модалка удаления показаний).
           Другие picker'ы (ЛС, чаты, уведомления) используют тот же класс
           .modal-content--picker, но без --confirm; их не задеваем.
           Двойной .modal-content--toast.modal-content--confirm даёт нужную
           специфичность, чтобы перебить .modal-content--toast{width:420px}
           из 12-toast.css. */
        .modal-content--toast.modal-content--confirm.modal-content--picker {
            width: 560px;
        }
        .picker-toolbar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 10px;
            gap: 10px;
        }
        .picker-toolbar__select-all {
            background: transparent;
            border: 1px solid var(--accent-info);
            color: var(--accent-info);
            border-radius: 8px;
            padding: 6px 12px;
            font-size: 0.85rem;
            font-weight: 500;
            cursor: pointer;
            transition: background-color 0.15s ease, color 0.15s ease;
        }
        .picker-toolbar__select-all:hover {
            background: var(--brand-grad);
            color: #fff;
        }
        .picker-toolbar__counter {
            font-size: 0.85rem;
            color: var(--text-muted);
        }
        .picker-list {
            display: flex;
            flex-direction: column;
            gap: 8px;
            /* 400px — без скролла помещаются 4 карточки (по ~88px с gap).
               5-й счётчик встретится редко (отопление + 4 «обычные»),
               там уже включится скролл. */
            max-height: 400px;
            overflow-y: auto;
            padding: 4px 4px 4px 0;
            margin-bottom: 14px;
        }
        .picker-card {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 10px 12px;
            background: #fff;
            border: 1.5px solid var(--border);
            border-radius: 10px;
            cursor: pointer;
            text-align: left;
            transition: border-color 0.15s ease, background-color 0.15s ease;
        }
        .picker-card:hover {
            border-color: var(--accent-info);
            background: #f6faff;
        }
        .picker-card.is-selected {
            border-color: #d65160;
            background: #fff5f5;
        }
        .picker-card.is-selected:hover {
            background: #ffe8e8;
        }
        .picker-card__check {
            flex-shrink: 0;
            margin: 0;
        }
        .picker-card__icon {
            flex-shrink: 0;
            width: 36px;
            height: 36px;
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 0.95rem;
            background: #e8f7f0;
            color: var(--accent-info);
        }
        .picker-card[data-cat="water"]   .picker-card__icon { background: #e6f1fb; color: #2a7ed1; }
        .picker-card[data-cat="hot"]     .picker-card__icon { background: #fdecea; color: #d65160; }
        .picker-card[data-cat="heat"]    .picker-card__icon { background: #fef0e6; color: #d97a3a; }
        .picker-card[data-cat="power"]   .picker-card__icon { background: #fff7d6; color: #c79c1d; }
        .picker-card__info {
            flex: 1;
            min-width: 0;
            display: flex;
            flex-direction: column;
            line-height: 1.25;
        }
        .picker-card__name {
            font-size: 0.92rem;
            font-weight: 600;
            color: var(--text);
            min-width: 0;
            overflow-wrap: anywhere; /* длинные слова без пробелов рвём по символу */
            word-break: break-word;
        }
        .picker-card__meta {
            font-size: 0.78rem;
            color: var(--text-muted);
            margin-top: 2px;
            min-width: 0;
            overflow-wrap: anywhere;
            word-break: break-word;
        }
        .picker-card__value {
            font-size: 1rem;
            font-weight: 700;
            color: #1f6f4a;
            white-space: nowrap;
        }
        /* prev → current с расходом — повторяет submitted-card.
           flex-shrink:0 — иначе при длинном zav_n в __info колонка цифр
           «съедается» переносами и расход уезжает в одну строку. */
        .picker-card__valuewrap {
            margin-left: auto;
            flex-shrink: 0;
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 2px;
        }
        .picker-card__values {
            display: inline-flex;
            align-items: baseline;
            gap: 6px;
            white-space: nowrap;
        }
        .picker-card__prev {
            font-size: 0.85rem;
            color: var(--text-muted);
            font-weight: 600;
        }
        .picker-card__arrow {
            color: var(--text-muted);
            font-size: 0.85rem;
        }
        .picker-card__consumption {
            font-size: 0.78rem;
            color: var(--text-muted);
            margin-top: 2px;
        }
        .picker-card__consumption-val {
            color: var(--accent-info);
            font-weight: 700;
            font-size: 0.88rem;
        }
        @media (max-width: 520px) {
            .picker-card__value { font-size: 0.95rem; }
            .picker-card__name  { font-size: 0.88rem; }
            .picker-card__prev  { font-size: 0.8rem; }
            .modal-content--picker { width: 95%; }
        }