/* NormaCheck — кастомные стили поверх Tabler (Bootstrap 5).
   Тема Tabler (flat, MIT) сама рисует layout/card/btn/form-control —
   статичные лейблы над полем здесь работают из коробки, JS-плавающих
   лейблов больше нет. Сюда добавляем только то, чего нет в теме:
   @media print для печати QR-лейблов (Срез B5) + классы .qr-*. */

/* Анти-FOUC: пока KnockoutJS не применил биндинги, #app скрыт — иначе
   модалки/вью (которые есть в DOM до applyBindings) моргают и прячутся.
   boot() вешает .ko-ready после ko.applyBindings. */
#app { visibility: hidden; }
#app.ko-ready { visibility: visible; }

/* ===================== QR-лейбл (экран) ===================== */
.qr-label {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 10px;
    background: #fff;
    text-align: center;
    width: 160px;
}
.qr-label img {
    width: 130px;
    height: 130px;
    display: block;
}
.qr-label .qr-label-name {
    font-weight: 600;
    font-size: 12px;
    margin-top: 6px;
    line-height: 1.3;
    word-break: break-word;
}
.qr-label .qr-label-type {
    font-size: 11px;
    color: #6c757d;
    margin-top: 2px;
}

/* ===================== Лист печати QR (экран) ===================== */
.qr-sheet {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding: 16px;
}

/* ===================== Кнопки печати ===================== */
.btn-print-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

/* ===================== @media print ===================== */
@media print {
    /* Скрыть навигацию и топбар (Tabler) */
    .navbar,
    .navbar-vertical,
    .btn-print-row,
    .card-header,
    .table-responsive {
        display: none !important;
    }

    /* Убрать отступы page-wrapper (Tabler) */
    .page-wrapper {
        margin: 0 !important;
        padding: 0 !important;
    }
    .page-wrapper .container-xl {
        max-width: none !important;
        padding: 0 !important;
    }

    body {
        background: #fff !important;
    }

    /* Показывать только активную print-секцию */
    [data-bind*="currentView() === 'objects'"],
    [data-bind*="currentView() === 'object'"],
    [data-bind*="currentView() === 'objects-admin'"],
    [data-bind*="currentView() === 'auth'"],
    [data-bind*="currentView() === 'register'"],
    [data-bind*="currentView() === 'remind'"],
    [data-bind*="currentView() === 'run'"],
    [data-bind*="currentView() === 'done'"],
    [data-bind*="currentView() === 'object-types'"],
    [data-bind*="currentView() === 'journal'"] {
        display: none !important;
    }

    /* Показать только print-вьюхи */
    [data-bind*="currentView() === 'print'"] {
        display: block !important;
    }

    /* QR-лист: сетка 4 в ряд */
    .qr-sheet {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
        padding: 0;
    }

    .qr-label {
        border: 1px solid #999;
        page-break-inside: avoid;
        width: 100%;
        padding: 6px;
    }

    .qr-label img {
        width: 100%;
        height: auto;
    }

    /* Одиночный лейбл */
    .qr-print-single {
        display: flex !important;
        justify-content: center;
        padding: 40px;
    }

    .qr-print-single .qr-label {
        width: 220px;
        padding: 16px;
    }

    .qr-print-single .qr-label img {
        width: 180px;
        height: 180px;
    }

    .qr-print-single .qr-label-name {
        font-size: 14px;
    }
}

/* ===================== Tabler-иконки (webfont) ===================== */
/* Инлайновые .ti чуть крупнее текста и выровнены по базовой линии строки. */
.ti {
    font-size: 1.15em;
    line-height: 1;
    vertical-align: -0.125em;
}

/* В sidenav иконки фиксированного «иконочного» размера. */
.nav-link-icon .ti {
    font-size: 1.25rem;
    vertical-align: middle;
}

/* В icon-кнопках (btn-icon) иконка занимает кнопку целиком, без сдвига базовой линии. */
.btn .ti {
    vertical-align: -0.125em;
}
.btn-icon .ti {
    font-size: 1.1rem;
    vertical-align: middle;
}

/* Иконка перед текстом в кнопке получает отступ (как у SVG-иконок Tabler);
   в btn-icon иконка единственный ребёнок — отступ не нужен. */
.btn > .ti:first-child:not(:only-child) {
    margin-right: 0.35em;
}