/**
 * Convention Fitness type scale.
 * One size per role on admin, member, and auth pages.
 * Loaded last so page-specific CSS cannot drift.
 *
 * kicker  12px  uppercase labels, table headers
 * meta    13px  helper text, subtitles, badges
 * ui      15px  buttons, inputs, nav, table body
 * body    16px  paragraphs
 * title   18px  panel and card titles
 * page    22px  page headings
 * display 28px  KPI numbers
 */

:root {
    --type-kicker: 0.75rem;
    --type-meta: 0.8125rem;
    --type-ui: 0.9375rem;
    --type-body: 1rem;
    --type-title: 1.125rem;
    --type-page: 1.375rem;
    --type-display: 1.75rem;
}

html {
    font-size: 16px;
}

body:not(.ci-screen):not(.auth-body) {
    font-size: var(--type-body);
}

/* ----- Page titles ----- */
body:not(.ci-screen):not(.auth-body) h1,
body:not(.ci-screen):not(.auth-body) .admin-page-title,
body:not(.ci-screen):not(.auth-body) .page-title,
body:not(.ci-screen):not(.auth-body) .hero-title,
body:not(.ci-screen):not(.auth-body) .mp-hero-title,
body:not(.ci-screen):not(.auth-body) .mp-hero-name,
body:not(.ci-screen):not(.auth-body) .rp-hero h1 {
    font-size: var(--type-page) !important;
    line-height: 1.25;
}

/* ----- Section / panel titles ----- */
body:not(.ci-screen):not(.auth-body) h2,
body:not(.ci-screen):not(.auth-body) h3,
body:not(.ci-screen):not(.auth-body) h4,
body:not(.ci-screen):not(.auth-body) .ap-panel-title,
body:not(.ci-screen):not(.auth-body) .ap-strip-title,
body:not(.ci-screen):not(.auth-body) .card-heading,
body:not(.ci-screen):not(.auth-body) .panel-title,
body:not(.ci-screen):not(.auth-body) .st-panel h3,
body:not(.ci-screen):not(.auth-body) .ws-panel h3,
body:not(.ci-screen):not(.auth-body) .rp-panel-head,
body:not(.ci-screen):not(.auth-body) .modal-title,
body:not(.ci-screen):not(.auth-body) .tips-title,
body:not(.ci-screen):not(.auth-body) .alert-title {
    font-size: var(--type-title) !important;
    line-height: 1.3;
}

/* ----- Body copy ----- */
body:not(.ci-screen):not(.auth-body) p,
body:not(.ci-screen):not(.auth-body) .admin-page-subtitle,
body:not(.ci-screen):not(.auth-body) .page-subtitle,
body:not(.ci-screen):not(.auth-body) .ap-strip-sub,
body:not(.ci-screen):not(.auth-body) .help-block,
body:not(.ci-screen):not(.auth-body) .alert,
body:not(.ci-screen):not(.auth-body) .alert-text,
body:not(.ci-screen):not(.auth-body) .subtitle {
    font-size: var(--type-ui);
    line-height: 1.5;
}

/* ----- Controls and chrome ----- */
body:not(.ci-screen):not(.auth-body) .btn,
body:not(.ci-screen):not(.auth-body) .form-control,
body:not(.ci-screen):not(.auth-body) select,
body:not(.ci-screen):not(.auth-body) textarea,
body:not(.ci-screen):not(.auth-body) input[type="text"],
body:not(.ci-screen):not(.auth-body) input[type="email"],
body:not(.ci-screen):not(.auth-body) input[type="password"],
body:not(.ci-screen):not(.auth-body) input[type="number"],
body:not(.ci-screen):not(.auth-body) input[type="search"],
body:not(.ci-screen):not(.auth-body) input[type="tel"],
body:not(.ci-screen):not(.auth-body) .sidebar-link,
body:not(.ci-screen):not(.auth-body) .sidebar-logout,
body:not(.ci-screen):not(.auth-body) .admin-mobile-nav .sidebar-link,
body:not(.ci-screen):not(.auth-body) .navbar-nav > li > a,
body:not(.ci-screen):not(.auth-body) .dropdown-menu > li > a,
body:not(.ci-screen):not(.auth-body) .list-group-item,
body:not(.ci-screen):not(.auth-body) .pagination > li > a,
body:not(.ci-screen):not(.auth-body) .pagination > li > span {
    font-size: var(--type-ui) !important;
}

/* ----- Labels, kickers, table heads ----- */
body:not(.ci-screen):not(.auth-body) label,
body:not(.ci-screen):not(.auth-body) .control-label,
body:not(.ci-screen):not(.auth-body) .ap-strip-kicker,
body:not(.ci-screen):not(.auth-body) .stat-label,
body:not(.ci-screen):not(.auth-body) .table > thead > tr > th,
body:not(.ci-screen):not(.auth-body) .ap-table > thead > tr > th,
body:not(.ci-screen):not(.auth-body) .ll-kpi .label,
body:not(.ci-screen):not(.auth-body) .ll-filters label,
body:not(.ci-screen):not(.auth-body) .st-custom label,
body:not(.ci-screen):not(.auth-body) .ws-panel label,
body:not(.ci-screen):not(.auth-body) .st-panel label {
    font-size: var(--type-kicker) !important;
    line-height: 1.35;
}

/* ----- Table body and secondary UI ----- */
body:not(.ci-screen):not(.auth-body) .table > tbody > tr > td,
body:not(.ci-screen):not(.auth-body) .table > tfoot > tr > td,
body:not(.ci-screen):not(.auth-body) .ap-table > tbody > tr > td {
    font-size: var(--type-ui) !important;
}

body:not(.ci-screen):not(.auth-body) .badge,
body:not(.ci-screen):not(.auth-body) .label,
body:not(.ci-screen):not(.auth-body) .ap-status,
body:not(.ci-screen):not(.auth-body) .ll-badge,
body:not(.ci-screen):not(.auth-body) .ws-tab,
body:not(.ci-screen):not(.auth-body) .st-segment a,
body:not(.ci-screen):not(.auth-body) .st-range,
body:not(.ci-screen):not(.auth-body) small,
body:not(.ci-screen):not(.auth-body) .mp-showing {
    font-size: var(--type-meta) !important;
}

/* ----- KPI numbers stay one display size ----- */
body:not(.ci-screen):not(.auth-body) .stat-value,
body:not(.ci-screen):not(.auth-body) .rp-kpi-value,
body:not(.ci-screen):not(.auth-body) .ll-kpi .value {
    font-size: var(--type-display) !important;
    line-height: 1.1;
}

body:not(.ci-screen):not(.auth-body) .stat-value small,
body:not(.ci-screen):not(.auth-body) .rp-kpi-value small,
body:not(.ci-screen):not(.auth-body) .stat-value-unit {
    font-size: var(--type-meta) !important;
}

/* Sidebar group labels stay the kicker size */
body:not(.ci-screen):not(.auth-body) .sidebar-group-toggle {
    font-size: var(--type-kicker) !important;
}

/* Do not shrink print cards or editor chrome */
.member-pass,
.member-id-card,
.nid-card,
.tox,
.tox-tinymce {
    font-size: inherit;
}

@media (max-width: 767px) {
    body:not(.ci-screen):not(.auth-body) h1,
    body:not(.ci-screen):not(.auth-body) .admin-page-title,
    body:not(.ci-screen):not(.auth-body) .page-title,
    body:not(.ci-screen):not(.auth-body) .hero-title,
    body:not(.ci-screen):not(.auth-body) .rp-hero h1 {
        font-size: var(--type-page) !important;
    }

    body:not(.ci-screen):not(.auth-body) .stat-value,
    body:not(.ci-screen):not(.auth-body) .rp-kpi-value,
    body:not(.ci-screen):not(.auth-body) .ll-kpi .value {
        font-size: var(--type-page) !important;
    }
}
