/*
 * Типографика CRM TechBar
 * Ориентиры: WCAG по контрасту и размеру текста, модульная шкала,
 * Inter + системный стек, tabular-nums в таблицах, сглаживание на macOS.
 */

:root {
    --app-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial,
        "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
    --app-font-mono: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, monospace;
    --app-leading-tight: 1.25;
    --app-leading-snug: 1.4;
    --app-leading-normal: 1.55;
    --app-leading-relaxed: 1.65;
    /* Иерархия оттенков текста (не только Bootstrap text-muted) */
    --app-text-primary: #1a1d21;
    --app-text-secondary: #495057;
    --app-text-tertiary: #6c757d;

    /* Bootstrap 5.3 — согласованные токены */
    --bs-body-font-family: var(--app-font-sans);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: var(--app-leading-normal);
    --bs-body-color: var(--app-text-primary);
    --bs-secondary-color: var(--app-text-secondary);
    --bs-heading-font-weight: 600;
    --bs-heading-color: #16181b;
}

html {
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: var(--app-font-sans);
    font-size: var(--bs-body-font-size);
    line-height: var(--bs-body-line-height);
    color: var(--bs-body-color);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Заголовки: модульная шкала + чуть плотнее межбуквенно только у крупных */
h1,
.h1 {
    font-size: clamp(1.65rem, 1.35rem + 1.1vw, 2.125rem);
    line-height: var(--app-leading-tight);
    letter-spacing: -0.02em;
    font-weight: var(--bs-heading-font-weight);
    color: var(--bs-heading-color);
}

h2,
.h2 {
    font-size: clamp(1.35rem, 1.2rem + 0.55vw, 1.6rem);
    line-height: var(--app-leading-tight);
    letter-spacing: -0.015em;
    font-weight: var(--bs-heading-font-weight);
    color: var(--bs-heading-color);
}

h3,
.h3 {
    font-size: clamp(1.15rem, 1.05rem + 0.35vw, 1.3125rem);
    line-height: var(--app-leading-snug);
    font-weight: var(--bs-heading-font-weight);
    color: var(--bs-heading-color);
}

h4,
.h4 {
    font-size: 1.125rem;
    line-height: var(--app-leading-snug);
    font-weight: 600;
    color: var(--bs-heading-color);
}

h5,
.h5 {
    font-size: 1rem;
    line-height: var(--app-leading-snug);
    font-weight: 600;
    color: var(--bs-heading-color);
}

h6,
.h6 {
    font-size: 0.9375rem;
    line-height: var(--app-leading-snug);
    font-weight: 600;
    color: var(--app-text-secondary);
    text-transform: none;
}

main.container-fluid {
    line-height: var(--app-leading-normal);
}

/* Подписи к полям — чуть контрастнее подписи */
.form-label {
    font-weight: 500;
    color: var(--app-text-secondary);
    margin-bottom: 0.35rem;
}

.form-text,
small.text-muted {
    color: var(--app-text-tertiary) !important;
    line-height: var(--app-leading-snug);
}

/* Ссылки в основном тексте — смещение подчёркивания (Material / GitHub-подобно) */
main a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.badge) {
    text-underline-offset: 0.2em;
    text-decoration-thickness: 1px;
}

main a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.badge):hover {
    text-decoration-thickness: 2px;
}

/* Навбар: читаемый бренд без «крика» капсом */
.navbar-brand {
    font-family: var(--app-font-sans);
    font-weight: 600;
    font-size: 1.0625rem;
    letter-spacing: 0.01em;
    line-height: 1.2;
}

.navbar .nav-link {
    font-weight: 500;
    letter-spacing: 0.01em;
}

/* Вкладки дашборда — жирность ближе к UI-гайдам (600 вместо 700) */
.nav-tabs .nav-link {
    font-weight: 600 !important;
    letter-spacing: 0.01em;
}

/* Таблицы: единая цифровая ширина, комфортный межстрочный */
.table {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1, "kern" 1, "liga" 1;
}

.table thead th {
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: none;
    color: var(--app-text-secondary);
    font-size: 0.8125rem;
}

/* Тёмные таблицы: общий цвет шапки из Bootstrap, иначе --app-text-secondary почти сливается с фоном */
.table.table-dark thead th {
    color: var(--bs-table-color, #fff);
}

/* Панели с таблицами (дашборд) — та же иерархия, выше специфичность чем у Bootstrap */
.tab-pane .table thead th {
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--app-text-secondary);
    font-size: 0.8125rem;
}

/* В тёмных таблицах заголовки должны оставаться контрастными (таб. thead могут «переопределяться» правилом выше). */
.tab-pane .table.table-dark thead th {
    color: var(--bs-table-color, #fff);
}

.table tbody td {
    line-height: var(--app-leading-snug);
}

/* Алерты и подсказки */
.alert {
    line-height: var(--app-leading-snug);
}

/* Кнопки: чуть плотнее подпись */
.btn {
    font-weight: 500;
    letter-spacing: 0.015em;
}

.btn-sm {
    letter-spacing: 0.01em;
}

/* Карточки */
.card-header {
    font-weight: 600;
    color: var(--bs-heading-color);
}

/* Модальные окна (общая типографика; тема — см. modals.css + класс .crm-modal на корне модалки) */
.modal-title {
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: var(--app-leading-tight);
}

/* Списки описаний */
dd {
    line-height: var(--app-leading-normal);
}

dt {
    font-weight: 600;
    color: var(--app-text-secondary);
}

code,
kbd,
pre,
samp {
    font-family: var(--app-font-mono);
    font-size: 0.9em;
}

.toast .toast-body {
    line-height: var(--app-leading-snug);
    font-size: 0.9375rem;
}