/* =========================================================================
   MedPartners — Healthcare UI System
   Приоритет UX: крупная типографика, чёткая структура, увеличенные зоны
   нажатия и комфортное чтение на любых экранах.
   ========================================================================= */

:root {
    /* ── Палитра здравоохранения ──────────────────────────────────────── */
    --mp-teal:        #0d9488;   /* основной — медицинская бирюза   */
    --mp-teal-dark:   #0f766e;
    --mp-teal-darker: #115e59;
    --mp-sky:         #0891b2;   /* info — спокойный голубой        */
    --mp-green:       #16a34a;   /* success — «здоровый» зелёный    */
    --mp-amber:       #d97706;   /* warning                         */
    --mp-red:         #dc2626;   /* danger — мягкий красный         */
    --mp-slate:       #64748b;   /* secondary                       */
    --mp-ink:         #0f2a2e;   /* основной текст                  */
    --mp-muted:       #5b7177;   /* приглушённый текст              */

    /* ── RGB-варианты для утилит Bootstrap ───────────────────────────── */
    --mp-teal-rgb:  13, 148, 136;
    --mp-sky-rgb:   8, 145, 178;
    --mp-green-rgb: 22, 163, 74;
    --mp-amber-rgb: 217, 119, 6;
    --mp-red-rgb:   220, 38, 38;
    --mp-slate-rgb: 100, 116, 139;

    /* ── Структура ────────────────────────────────────────────────────── */
    --sidebar-width: 280px;
    --topbar-height: 72px;
    --tap-min:       48px;         /* минимальная зона нажатия         */
    --radius:        1rem;
    --shell-bg:      #eef4f3;      /* мягкий мятный фон               */
    --surface:       #ffffff;
    --border-soft:   #dbe7e5;

    /* ── Переопределение токенов Bootstrap ───────────────────────────── */
    --bs-primary:        var(--mp-teal);
    --bs-primary-rgb:    var(--mp-teal-rgb);
    --bs-info-rgb:       var(--mp-sky-rgb);
    --bs-success-rgb:    var(--mp-green-rgb);
    --bs-warning-rgb:    var(--mp-amber-rgb);
    --bs-danger-rgb:     var(--mp-red-rgb);
    --bs-secondary-rgb:  var(--mp-slate-rgb);
    --bs-link-color:     var(--mp-teal-dark);
    --bs-link-color-rgb: var(--mp-teal-rgb);
    --bs-link-hover-color: var(--mp-teal-darker);
    --bs-body-color:     var(--mp-ink);
    --bs-body-font-size: 1.0625rem;          /* 17px базовый           */
    --bs-body-line-height: 1.65;
    --bs-border-radius:    0.75rem;
    --bs-border-radius-lg: 1rem;
    --bs-emphasis-color:   var(--mp-ink);
}

/* =========================================================================
   ТИПОГРАФИКА — крупная и читаемая
   ========================================================================= */
body {
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif;
    background-color: var(--shell-bg);
    color: var(--mp-ink);
    font-size: 1.0625rem;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

h1, .h1 { font-size: clamp(1.9rem, 1.4rem + 1.8vw, 2.6rem); }
h2, .h2 { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.1rem); }
h3, .h3 { font-size: clamp(1.35rem, 1.15rem + 0.9vw, 1.7rem); }
h4, .h4 { font-size: 1.4rem; }
h5, .h5 { font-size: 1.2rem; }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--mp-ink);
    line-height: 1.25;
}

.card-title { font-weight: 700; letter-spacing: -0.01em; }

.small, small { font-size: 0.9rem; }

.text-muted { color: var(--mp-muted) !important; }

code {
    background: rgba(var(--mp-teal-rgb), 0.08);
    color: var(--mp-teal-dark);
    padding: 0.12em 0.4em;
    border-radius: 0.4rem;
    font-size: 0.9em;
}

/* =========================================================================
   КАРКАС ПРИЛОЖЕНИЯ
   ========================================================================= */
.app-shell { min-height: 100vh; }

main, .app-main { min-height: 100vh; }
.app-main { display: flex; flex-direction: column; }

/* ── Боковая панель ───────────────────────────────────────────────────── */
.sidebar {
    width: var(--sidebar-width);
    min-height: 100vh;
    background: linear-gradient(180deg, var(--mp-teal-dark) 0%, var(--mp-teal-darker) 60%, #0c4842 100%);
    position: sticky;
    top: 0;
    align-self: flex-start;
    padding: 1.5rem 1rem !important;
    z-index: 1045;
    box-shadow: 0 0 40px rgba(15, 42, 46, 0.12);
}

.sidebar .navbar-brand,
.sidebar .brand {
    gap: 0.65rem;
    padding: 0.25rem 0.5rem 0.75rem;
}

.sidebar .brand-title { font-size: 1.4rem; font-weight: 800; letter-spacing: -0.02em; }
.sidebar .brand-sub { font-size: 0.78rem; opacity: 0.7; letter-spacing: 0.04em; text-transform: uppercase; }

.sidebar .nav { gap: 0.35rem !important; }

.sidebar .nav-link {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-height: var(--tap-min);
    padding: 0.7rem 1rem;
    border-radius: 0.85rem;
    font-size: 1.02rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.82) !important;
    transition: background-color .18s ease, color .18s ease, transform .12s ease;
}

.sidebar .nav-link i { font-size: 1.25rem; flex: 0 0 auto; }

.sidebar .nav-link:hover,
.sidebar .nav-link:focus-visible {
    background-color: rgba(255, 255, 255, 0.12);
    color: #fff !important;
}

.sidebar .nav-link.active {
    background-color: rgba(255, 255, 255, 0.95);
    color: var(--mp-teal-darker) !important;
    font-weight: 700;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}

.sidebar .border-top { border-color: rgba(255, 255, 255, 0.15) !important; }

/* ── Верхняя панель ───────────────────────────────────────────────────── */
.topbar,
.navbar.bg-white {
    min-height: var(--topbar-height);
    background: var(--surface) !important;
    border-bottom: 1px solid var(--border-soft) !important;
    padding-inline: clamp(1rem, 3vw, 2rem) !important;
    position: sticky;
    top: 0;
    z-index: 1030;
    gap: 1rem;
    flex-wrap: nowrap;
}

.topbar-title,
.navbar .navbar-brand {
    font-size: clamp(1.15rem, 1rem + 0.6vw, 1.5rem) !important;
    font-weight: 700;
    color: var(--mp-ink);
    letter-spacing: -0.01em;
    margin: 0;
}

.topbar .form-control,
.navbar .form-control {
    min-width: clamp(180px, 32vw, 360px);
}

/* ── Гамбургер / переключатель боковой панели ─────────────────────────── */
.sidebar-toggle {
    width: var(--tap-min);
    height: var(--tap-min);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    border: 1px solid var(--border-soft);
    border-radius: 0.75rem;
    background: var(--surface);
    color: var(--mp-teal-dark);
    flex: 0 0 auto;
}

.sidebar-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(15, 42, 46, 0.45);
    backdrop-filter: blur(2px);
    z-index: 1040;
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s ease, visibility .2s ease;
}

body.sidebar-open .sidebar-backdrop { opacity: 1; visibility: visible; }

/* =========================================================================
   КАРТОЧКИ И ПОВЕРХНОСТИ — чёткая структура
   ========================================================================= */
.card {
    border: 1px solid var(--border-soft);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: 0 1px 2px rgba(15, 42, 46, 0.04);
}

.card.shadow-sm {
    box-shadow: 0 6px 22px rgba(15, 42, 46, 0.06) !important;
}

.card-body { padding: clamp(1.25rem, 1rem + 1vw, 1.85rem); }

/* Иконные «кружки» на дашборде делаем крупнее и мягче */
.rounded-circle.p-3 {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 1.2rem !important;
}

/* Числовые показатели дашборда */
.fs-3.fw-bold { font-size: clamp(1.7rem, 1.4rem + 1vw, 2.3rem) !important; }

/* =========================================================================
   КНОПКИ — увеличенные зоны нажатия
   ========================================================================= */
.btn {
    --bs-btn-padding-y: 0.65rem;
    --bs-btn-padding-x: 1.25rem;
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 600;
    --bs-btn-border-radius: 0.7rem;
    min-height: var(--tap-min);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    line-height: 1.2;
    transition: transform .12s ease, box-shadow .15s ease, background-color .15s ease;
}

.btn:active { transform: translateY(1px); }

.btn-lg {
    --bs-btn-padding-y: 0.85rem;
    --bs-btn-padding-x: 1.6rem;
    --bs-btn-font-size: 1.1rem;
    --bs-btn-border-radius: 0.85rem;
    min-height: 56px;
}

.btn-sm {
    --bs-btn-padding-y: 0.45rem;
    --bs-btn-padding-x: 0.9rem;
    --bs-btn-font-size: 0.92rem;
    min-height: 40px;
}

/* — Primary (бирюза) — */
.btn-primary {
    --bs-btn-bg: var(--mp-teal);
    --bs-btn-border-color: var(--mp-teal);
    --bs-btn-hover-bg: var(--mp-teal-dark);
    --bs-btn-hover-border-color: var(--mp-teal-dark);
    --bs-btn-active-bg: var(--mp-teal-darker);
    --bs-btn-active-border-color: var(--mp-teal-darker);
    --bs-btn-disabled-bg: var(--mp-teal);
    --bs-btn-disabled-border-color: var(--mp-teal);
    box-shadow: 0 6px 16px rgba(var(--mp-teal-rgb), 0.28);
}
.btn-primary:hover { box-shadow: 0 8px 22px rgba(var(--mp-teal-rgb), 0.34); }

.btn-outline-primary {
    --bs-btn-color: var(--mp-teal-dark);
    --bs-btn-border-color: var(--mp-teal);
    --bs-btn-hover-bg: var(--mp-teal);
    --bs-btn-hover-border-color: var(--mp-teal);
    --bs-btn-active-bg: var(--mp-teal-dark);
    --bs-btn-active-border-color: var(--mp-teal-dark);
    border-width: 2px;
}

/* — Success — */
.btn-success {
    --bs-btn-bg: var(--mp-green);
    --bs-btn-border-color: var(--mp-green);
    --bs-btn-hover-bg: #15803d;
    --bs-btn-hover-border-color: #15803d;
    --bs-btn-active-bg: #166534;
}

/* — Danger / outline-danger — */
.btn-outline-danger {
    --bs-btn-color: var(--mp-red);
    --bs-btn-border-color: var(--mp-red);
    --bs-btn-hover-bg: var(--mp-red);
    --bs-btn-active-bg: #b91c1c;
    border-width: 2px;
}

/* — Secondary outline — */
.btn-outline-secondary {
    --bs-btn-color: var(--mp-slate);
    --bs-btn-border-color: #cbd5e1;
    --bs-btn-hover-bg: var(--mp-slate);
    --bs-btn-hover-border-color: var(--mp-slate);
    --bs-btn-active-bg: #475569;
    border-width: 2px;
}

/* Группа кнопок в таблицах — комфортные отступы */
.btn-group .btn { gap: 0.3rem; }
.btn-group.btn-group-sm .btn { min-height: 40px; }

/* =========================================================================
   ФОРМЫ — крупные поля и зоны нажатия
   ========================================================================= */
.form-control,
.form-select {
    min-height: var(--tap-min);
    border-radius: 0.7rem;
    border: 1.5px solid var(--border-soft);
    font-size: 1rem;
    padding: 0.6rem 0.95rem;
    color: var(--mp-ink);
    transition: border-color .15s ease, box-shadow .15s ease;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--mp-teal);
    box-shadow: 0 0 0 0.22rem rgba(var(--mp-teal-rgb), 0.18);
}

.form-control-lg,
.form-select-lg { min-height: 56px; font-size: 1.08rem; }

.form-label { font-weight: 600; margin-bottom: 0.4rem; color: var(--mp-ink); }

.form-text { font-size: 0.9rem; }

/* =========================================================================
   ВКЛАДКИ (nav-pills) — крупные, чёткие
   ========================================================================= */
.nav-pills {
    --bs-nav-pills-link-active-bg: var(--mp-teal);
    --bs-nav-pills-border-radius: 0.7rem;
    gap: 0.4rem;
}

.nav-pills .nav-link {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-weight: 600;
    color: var(--mp-teal-dark);
    background: rgba(var(--mp-teal-rgb), 0.07);
    padding: 0.55rem 1.1rem;
}

.nav-pills .nav-link:hover { background: rgba(var(--mp-teal-rgb), 0.14); }

.nav-pills .nav-link.active {
    color: #fff;
    box-shadow: 0 6px 16px rgba(var(--mp-teal-rgb), 0.28);
}

/* =========================================================================
   ТАБЛИЦЫ — крупный, читаемый текст и просторные строки
   ========================================================================= */
.table {
    --bs-table-hover-bg: rgba(var(--mp-teal-rgb), 0.05);
    font-size: 1rem;
    margin-bottom: 0;
}

.table > :not(caption) > * > * { padding: 0.95rem 1rem; }

.table thead.table-light th,
.table > thead th {
    background: #f1f7f6;
    color: var(--mp-muted);
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 2px solid var(--border-soft);
    white-space: nowrap;
}

.table tbody tr { border-color: #eef3f2; }
.table tbody td { vertical-align: middle; }
.fw-medium { font-weight: 600 !important; }

/* =========================================================================
   ЗНАЧКИ (badges)
   ========================================================================= */
.badge {
    font-weight: 600;
    font-size: 0.8rem;
    padding: 0.4em 0.7em;
    border-radius: 0.55rem;
    letter-spacing: 0.01em;
}

.badge.bg-light { background: #eef3f2 !important; border: 1px solid var(--border-soft); }

/* =========================================================================
   СПИСКИ / РЕЗУЛЬТАТЫ ПОИСКА
   ========================================================================= */
.list-group-item {
    padding: 0.9rem 1.15rem;
    font-size: 1rem;
    border-color: #eef3f2;
}

#globalSearchResults .list-group-item { min-height: var(--tap-min); display: flex; align-items: center; }
#globalSearchResults .list-group-item:hover { background-color: rgba(var(--mp-teal-rgb), 0.06); }

/* =========================================================================
   ПРОГРЕСС / АЛЕРТЫ
   ========================================================================= */
.progress { border-radius: 1rem; background: #e3eeec; }
.progress-bar { background-color: var(--mp-teal); }

.alert { border-radius: 0.85rem; border: none; font-size: 1rem; padding: 1rem 1.15rem; }
.alert-success { background: rgba(var(--mp-green-rgb), 0.12); color: #166534; }
.alert-danger  { background: rgba(var(--mp-red-rgb), 0.10);  color: #991b1b; }
.alert-warning { background: rgba(var(--mp-amber-rgb), 0.14); color: #92400e; }

.alert-link { font-weight: 700; }

/* =========================================================================
   МОДАЛЬНЫЕ ОКНА
   ========================================================================= */
.modal-content { border: none; border-radius: var(--radius); box-shadow: 0 24px 60px rgba(15,42,46,.25); }
.modal-header, .modal-footer { border-color: var(--border-soft); padding: 1.25rem 1.5rem; }
.modal-body { padding: 1.5rem; }
.modal-title { font-weight: 700; }

/* Доступная зона нажатия для крестика */
.btn-close { width: 1.1rem; height: 1.1rem; padding: 0.75rem; }

/* =========================================================================
   АДАПТИВНОСТЬ — комфортно на любом экране
   ========================================================================= */
@media (max-width: 991.98px) {
    .sidebar {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        transform: translateX(-100%);
        transition: transform .26s cubic-bezier(.4, 0, .2, 1);
        width: min(86vw, var(--sidebar-width));
    }
    body.sidebar-open .sidebar { transform: translateX(0); }
}

@media (min-width: 992px) {
    .sidebar-toggle { display: none !important; }
}

@media (max-width: 575.98px) {
    :root { --bs-body-font-size: 1.02rem; }
    .card-body { padding: 1.1rem; }
    .topbar .form-control,
    .navbar .form-control { min-width: 0; width: 100%; }
    .btn-group.btn-group-sm { flex-wrap: wrap; gap: 0.4rem; }
    .btn-group.btn-group-sm > .btn { border-radius: 0.7rem !important; }
}

/* Доступность фокуса по всему интерфейсу */
:focus-visible {
    outline: 3px solid rgba(var(--mp-teal-rgb), 0.45);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

.search-hero {
    background: linear-gradient(135deg, rgba(var(--mp-teal-rgb), 0.08) 0%, rgba(var(--mp-sky-rgb), 0.06) 100%);
    border: 1px solid rgba(var(--mp-teal-rgb), 0.12);
    border-radius: 1rem;
    padding: 1.75rem 1.5rem;
}

/* ─────────────── Монитор фоновых воркеров ─────────────── */
.worker-monitor {
    position: relative;
}
.worker-monitor .worker-monitor-btn {
    white-space: nowrap;
    border-radius: 0.7rem;
}
.worker-monitor .worker-monitor-panel {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    width: min(360px, 90vw);
    max-height: 70vh;
    overflow-y: auto;
    z-index: 1050;
}
.worker-monitor .worker-item:first-of-type {
    border-top: none !important;
    padding-top: 0 !important;
    margin-top: 0.25rem !important;
}