/* =========================================================
   app.css — все стили приложения (собрано fix22)
   Структура:
     1. Навбар и логотип
     2. Hero текущего исследования (dashboard)
     3. Sticky-панель кнопок сохранения (протоколы Этапа I/II)
     4. Общие компоненты протоколов (area-header, factor-row и т.п.)
     5. Специфика отдельных протоколов (neu, lu, pc, tv, zv, eeg, veg, scl)
     6. Отчёты (rep-*, age-header)
     7. РЦОН — Траектория развития
     8. Портал родителя
     9. Утилиты
   ========================================================= */

/* --- 1. Навбар и логотип --- */
.app-navbar {
    background-image: linear-gradient(90deg, #0d6efd 0%, #0a58ca 100%);
}
.app-brand-icon {
    vertical-align: middle;
    flex-shrink: 0;
}

/* --- 2. Hero текущего исследования --- */
.study-hero {
    background: #ffffff;
    border: 1px solid #dee2e6;
    border-left: 5px solid #0d6efd;
    border-radius: .5rem;
    padding: 1.25rem 1.5rem;
}
.study-hero.border-primary { border-left-color: #0d6efd !important; }
.study-hero.border-info    { border-left-color: #0dcaf0 !important; }
.study-hero.border-success { border-left-color: #198754 !important; }
.study-hero__icon {
    font-size: 2.5rem;
    line-height: 1;
    margin-right: 1rem;
    user-select: none;
    flex-shrink: 0;
    display: flex;
    align-items: center;
}
.study-hero__eyebrow {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #6c757d;
    margin-bottom: .25rem;
}
.study-hero__title {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0 0 .35rem;
    color: #212529;
}
.study-hero__desc {
    color: #6c757d;
    font-size: .9rem;
    margin: 0 0 .75rem;
}

/* --- 3. Sticky-панель кнопок сохранения --- */
.sticky-savebar {
    position: sticky; bottom: 0; z-index: 10;
    background: #fff; border-top: 1px solid #dee2e6;
    padding: 10px 15px; margin: 0 -15px -15px -15px;
    box-shadow: 0 -2px 8px rgba(0,0,0,.05);
}

/* --- 4. Общие компоненты протоколов --- */
.area-header {
    background: #f1f4f9;
    font-weight: 600;
    padding: 6px 12px;
}
.group-card { scroll-margin-top: 80px; }
.sticky-gh { position: sticky; top: 0; z-index: 5; }
.tabs-narrow .nav-link { padding: .4rem .9rem; font-size: .95rem; }
.q-row { padding: 4px 0; }
.q-opts label { margin-right: 12px; cursor: pointer; font-size: .92rem; }
.skill-row { padding: 6px 0; }
.skill-opts label { margin-right: 14px; cursor: pointer; }
.kid-row { padding: 4px 0; }
.kid-opts label { margin-right: 10px; cursor: pointer; font-size: .92rem; }
.factor-row { padding: 4px 0; }
.factor-row label { cursor: pointer; }
.factor-check-lg { width: 1.2em; height: 1.2em; }
.trigger-grid label { display: block; margin: 3px 0; cursor: pointer; }
.sarnat-row { padding: 6px 0; border-bottom: 1px solid #f0f0f0; }
.sarnat-row:last-child { border-bottom: 0; }
.sarnat-crit { font-weight: 500; }
.sarnat-opts label { margin-right: 14px; font-weight: normal; cursor: pointer; }
.fam-table td, .fam-table th { text-align: center; vertical-align: middle; }
.fam-table td:first-child, .fam-table th:first-child { text-align: left; }
.fam-table input[type=checkbox] { width: 1.2em; height: 1.2em; }

/* --- 5. Специфика протоколов --- */
.neu-row { padding: 6px 0; border-bottom: 1px solid #f4f4f4; }
.neu-row:last-child { border-bottom: 0; }
.neu-param { font-weight: 500; }
.neu-options label { margin-right: 14px; font-weight: normal; cursor: pointer; }
.neu-note { font-size: .85rem; }
.lu-table td { padding: .3rem .5rem !important; vertical-align: middle; }
.lu-table th { padding: .3rem .5rem !important; font-weight: 500; }
.lu-table .form-check-input { margin: 0; }
.tv-table td, .tv-table th { padding: .35rem .5rem !important; vertical-align: middle; }
.tv-table thead th { background: #f8f9fa; font-weight: 500; }
.tv-table .form-control { max-width: 140px; }
.tv-diff { font-family: monospace; }
.zv-table td { padding: .25rem .4rem !important; vertical-align: middle; }
.zv-table th { padding: .25rem .4rem !important; font-weight: 500; }
.zv-table th small { display: block; font-size: .7rem; line-height: 1.1; }
.zv-table thead th { background: #f8f9fa; }
.zv-table .form-check-input { margin: 0; }
.eeg-row { padding: 6px 0; border-bottom: 1px solid #f4f4f4; }
.eeg-row:last-child { border-bottom: 0; }
.eeg-param { font-weight: 500; }
.eeg-options label { margin-right: 14px; font-weight: normal; cursor: pointer; }
.eeg-options label.d-block { margin-right: 0; }
.veg-row { padding: 5px 0; border-bottom: 1px solid #f4f4f4; }
.veg-row:last-child { border-bottom: 0; }
.veg-param { font-weight: 500; }
.veg-opts label { margin-right: 12px; cursor: pointer; font-weight: normal; }
.vod-table td, .vod-table th { padding: .25rem .4rem !important; }
.vod-table input { max-width: 90px; }
.vod-rest input { max-width: 110px; }
.scale-row { padding: 6px 0; border-bottom: 1px solid #f4f4f4; }
.scale-row:last-child { border-bottom: 0; }
.scale-name { font-weight: 500; }
.scale-opts label { margin-right: 12px; font-weight: normal; cursor: pointer; }
.scorad-card { background: #fbfbfd; }
.pc-row { padding: 6px 0; border-bottom: 1px solid #f4f4f4; transition: opacity .15s; }
.pc-row:last-child { border-bottom: 0; }
.pc-q { font-weight: 500; font-size: .93rem; }
.pc-opts label { margin-right: 10px; font-size: .88rem; cursor: pointer; }
.pc-sub-header { background: #f1f4f9; padding: 8px 12px; font-weight: 600; }
.pc-skip { font-size: .78rem; color: #999; }
.pc-summary { background: #f8f9fa; }
.pc-z-ok   { color: #198754; }
.pc-z-warn { color: #fd7e14; }
.pc-z-bad  { color: #dc3545; }
.pc-row.pc-skipped {
    opacity: .35;
    background: repeating-linear-gradient(45deg, #fafafa, #fafafa 6px, #f0f0f0 6px, #f0f0f0 12px);
}
.pc-row.pc-skipped .pc-q { text-decoration: line-through; color: #888; }
.pc-row.pc-skipped::before {
    content: 'пропущен';
    display: inline-block;
    font-size: .7rem;
    color: #b00020;
    background: #ffe5e5;
    padding: 1px 6px;
    border-radius: 3px;
    margin-right: 6px;
}

/* --- Stage3: overview — сводные плитки --- */
.overview-stat { border-radius: 6px; padding: 10px 14px; background: #f8f9fa; }
.overview-stat .num { font-size: 1.4rem; font-weight: 600; }
.overview-stat .lbl { font-size: .8rem; color: #6c757d; }

/* --- 6. Отчёты --- */
.rep-table { font-size: .9rem; }
.rep-table th, .rep-table td { padding: .35rem .55rem; vertical-align: middle; }
.rep-table thead th { background: #f1f4f9; }
.rep-p { font-family: monospace; font-weight: 600; }
.rep-rho { font-family: monospace; }
.rep-metric-label { font-weight: 500; }
.rep-cat-row { background: #fafbfd; }
.grp-1 { color: #6c757d; }
.grp-2 { color: #0d6efd; }
.age-header { background: #eef3fb; font-weight: 600; }

/* --- 7. РЦОН — Траектория развития --- */
.rcd-traj-table td, .rcd-traj-table th { padding: .5rem .6rem; }
.rcd-traj-table tbody tr:hover { background: #fafbfd; }

/* --- 8. Портал родителя --- */
body.portal-body { background: #f4f6fa; }
.portal-wrap { max-width: 640px; margin: 0 auto; padding: 0 12px 90px; }
.portal-header {
    background: #0d6efd;
    color: #fff;
    padding: 14px 16px;
    position: sticky; top: 0; z-index: 20;
    box-shadow: 0 2px 6px rgba(0,0,0,.08);
}
.portal-header a { color: #fff; text-decoration: none; }
.portal-card {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.portal-btn { min-height: 46px; padding: 10px 18px; border-radius: 10px; }
.portal-radio-lg label {
    display: block; min-height: 46px; padding: 12px 14px;
    border: 1px solid #dee2e6; border-radius: 10px;
    margin-bottom: 8px; cursor: pointer;
    background: #fff;
}
.portal-radio-lg input { margin-right: 10px; }
.portal-radio-lg input:checked + span { font-weight: 600; }
.portal-radio-lg label:has(input:checked) { border-color: #0d6efd; background: #eef5ff; }
.portal-footer-nav {
    position: fixed; bottom: 0; left: 0; right: 0;
    background: #fff; border-top: 1px solid #dee2e6;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    display: flex; gap: 8px; justify-content: space-between;
    max-width: 640px; margin: 0 auto;
    z-index: 30;
}

/* --- 9. Утилиты --- */
.text-orange { color: #fd7e14 !important; }
.bg-orange { background-color: #fd7e14 !important; color: #fff !important; }

/* --- Кнопка «На главную» в шапке портала (fix24) --- */
.portal-home-btn {
    display: inline-block;
    background: rgba(255,255,255,.22);
    color: #fff !important;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: .82rem;
    text-decoration: none;
    font-weight: 600;
    line-height: 1.2;
}
.portal-home-btn:hover {
    background: rgba(255,255,255,.36);
    color: #fff !important;
    text-decoration: none;
}
.portal-logout-link {
    font-size: .78rem;
    margin-left: 8px;
    color: #fff !important;
    opacity: .8;
}
.portal-logout-link:hover { opacity: 1; }


/* --- fix29: утилитарные классы --- */
.border-bottom-soft { border-bottom: 1px solid #f0f0f0; }
.border-top-soft    { border-top: 1px solid #f0f0f0; }
.scroll-y-520       { max-height: 520px; overflow: auto; }
.scroll-y-320       { max-height: 320px; overflow: auto; }
.scroll-y-280       { max-height: 280px; overflow: auto; }
.norms-pre          { white-space: pre-wrap; font-family: inherit; font-size: .9rem;
                      margin: 0; line-height: 1.55; }
.auth-wrap          { max-width: 420px; margin-top: 10vh; }
.w-120px            { width: 120px; }
.w-160px            { width: 160px; }


/* =========================================================
   fix33-portal-stages — Табы этапов и карточки визитов
   ========================================================= */
.portal-tabs {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    margin: 0 -12px 12px;
    padding: 4px 12px 8px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.portal-tabs::-webkit-scrollbar { display: none; }

.portal-tab {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 8px 14px;
    background: #fff;
    color: #495057;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    font-size: .9rem;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    transition: transform .12s, background-color .12s, border-color .12s;
}
.portal-tab:active { transform: scale(.98); }
.portal-tab.is-active {
    background: #0d6efd;
    color: #fff;
    border-color: #0d6efd;
    font-weight: 600;
}
.portal-tab__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 11px;
    font-size: .75rem;
    font-weight: 700;
    background: #dc3545;
    color: #fff;
}
.portal-tab__badge.is-active {
    background: rgba(255,255,255,.28);
    color: #fff;
}

.portal-visit-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.portal-visit-card {
    display: block;
    background: #fff;
    border-radius: 12px;
    padding: 14px 16px;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 1px 3px rgba(0,0,0,.06);
    border-left: 4px solid #dee2e6;
    transition: transform .1s;
}
.portal-visit-card:active { transform: scale(.99); }
.portal-visit-card.is-planned   { border-left-color: #dee2e6; }
.portal-visit-card.is-completed { border-left-color: #198754; }
.portal-visit-card.is-missed    { border-left-color: #ffc107; }
.portal-visit-card.is-refused   { border-left-color: #dc3545; }

.portal-visit-card__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 6px;
}
.portal-visit-card__title {
    font-weight: 600;
    font-size: 1rem;
    color: #212529;
    margin: 0;
}
.portal-visit-card__status {
    flex-shrink: 0;
    font-size: .75rem;
    padding: 2px 8px;
    border-radius: 6px;
    font-weight: 600;
}
.portal-visit-card__status.is-planned   { background: #e9ecef; color: #495057; }
.portal-visit-card__status.is-completed { background: #d1e7dd; color: #0f5132; }
.portal-visit-card__status.is-missed    { background: #fff3cd; color: #664d03; }
.portal-visit-card__status.is-refused   { background: #f8d7da; color: #842029; }

.portal-visit-card__date {
    color: #6c757d;
    font-size: .85rem;
    margin-bottom: 8px;
}
.portal-visit-card__meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: .88rem;
    padding-top: 8px;
    border-top: 1px solid #f0f0f0;
}
.portal-visit-card__count { color: #495057; }
.portal-visit-card__count b { color: #0d6efd; }
.portal-visit-card__count.is-empty { color: #adb5bd; }
.portal-visit-card__arrow { color: #0d6efd; font-weight: 600; }

/* fix53-portal-view */
.portal-view-table { width:100%; font-size:.9rem; }
.portal-view-table td { padding:6px 4px; border-bottom:1px solid #f0f0f0; vertical-align:top; }
.portal-view-table td:first-child { color:#6c757d; width:45%; }
.portal-view-table td:last-child { font-weight:500; }
.portal-view-table tr:last-child td { border-bottom:0; }
