/**
 * Tipografia ISPM — tamanhos centralizados
 * Mínimo absoluto: 11px no desktop; 12px em telemóvel (≤768px)
 *
 * Uso: font-size: var(--font-xs);
 * Carregar DEPOIS do Bootstrap / frameworks.
 */

:root {
    /* Escala tipográfica (mínimo absoluto = 11px) */
    --font-min: 11px;
    --font-xs: 11px;
    --font-sm: 13px;
    --font-md: 14px;
    --font-base: 16px;
    --font-lg: 18px;
    --font-xl: 20px;
    --font-2xl: 24px;
    --font-3xl: 28px;

    /* Aliases semânticos */
    --font-label: var(--font-xs);
    --font-caption: var(--font-xs);
    --font-body: var(--font-base);
    --font-heading: var(--font-xl);
}

html {
    font-size: var(--font-base);
}

body {
    font-size: var(--font-base);
    line-height: 1.5;
}

/* ── Piso global: elementos tipicamente microscópicos ── */
small,
.small,
.form-text,
.form-label .lock-tag,
.extra-small,
.text-xs,
.fs-xs,
.badge,
.badge.rounded-pill,
span.badge,
.sb-footer-role,
.menu-label,
.nav-user-role,
.nav-brand-mark,
.institucional-help,
.mensagem-explicada-label,
.stat-label,
.chip-lbl,
.eyebrow-text,
.card-tag,
footer,
footer small,
.footer,
.footer small {
    font-size: var(--font-xs) !important;
    line-height: 1.35;
}

/* Tabelas — cabeçalhos e células legíveis */
.table thead th,
table thead th,
th,
td,
.table td,
.table th {
    font-size: max(var(--font-xs), 0.8125rem);
}

.table thead th,
table thead th {
    font-size: var(--font-xs) !important;
    letter-spacing: 0.04em;
}

/* Bootstrap text utilities que podem cair abaixo de 11px */
.text-muted,
small.text-muted {
    font-size: max(var(--font-xs), 0.875em);
}

/* Botões compactos: texto nunca abaixo do mínimo */
.btn-sm,
.btn.btn-sm {
    font-size: max(var(--font-xs), 0.8125rem) !important;
}

/* Labels uppercase / meta */
.text-uppercase.fw-bold,
.text-uppercase.fw-semibold {
    font-size: max(var(--font-xs), 0.75em);
}

/* Toolbar / navbar — roles e labels de secção */
.nav-user-role,
.menu-label {
    font-size: var(--font-xs) !important;
}

.nav-badge {
    font-size: 11px !important;
    min-width: 20px !important;
    height: 20px !important;
    line-height: 1 !important;
    padding: 0 5px;
}

.nav-badge span {
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 800;
    color: #fff !important;
}

/* Classes utilitárias do projecto */
.font-xs { font-size: var(--font-xs) !important; }
.font-sm { font-size: var(--font-sm) !important; }
.font-md { font-size: var(--font-md) !important; }
.font-base { font-size: var(--font-base) !important; }
.font-lg { font-size: var(--font-lg) !important; }
.font-xl { font-size: var(--font-xl) !important; }

/**
 * Rede de segurança: qualquer elemento com estilo legado
 * que ainda force tamanho < 11px via classes comuns do Bootstrap.
 * (fs-6 do BS5 ≈ 1rem; não mexer em fs-1..fs-4)
 */
.fs-6 {
    font-size: max(var(--font-base), 1rem) !important;
}

/* ── Mobile: piso tipográfico 12px ── */
@media (max-width: 768px) {
    :root {
        --font-min: 12px;
        --font-xs: 12px;
        --font-sm: 13px;
        --font-md: 14px;
        --font-base: 16px;
    }

    html,
    body {
        font-size: var(--font-base);
    }

    small,
    .small,
    .form-text,
    .badge,
    .menu-label,
    .nav-user-role,
    .table thead th,
    table thead th {
        font-size: var(--font-xs) !important;
    }

    .btn-sm,
    .btn.btn-sm {
        font-size: max(var(--font-xs), 0.8125rem) !important;
    }
}