/**
 * ARK-IA · Tipografía de marca (estilo IA)
 * Sora para títulos y menú (negrita, tamaños compactos); Inter para el texto.
 */
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@500;600;700;800&display=swap');

:root { --ark-display: 'Sora', 'Poppins', 'Inter', sans-serif; }

/* =============== SIDEBAR =============== */
html body #sidebar .sidebar-brand,
html body #sidebar .brand-text {
    font-family: var(--ark-display) !important;
    font-weight: 800 !important;
    font-size: .8rem !important;
    letter-spacing: .2px;
    line-height: 1.15;
}
html body #sidebar .sidebar-nav .nav-link {
    font-family: var(--ark-display) !important;
    font-weight: 700 !important;
    font-size: .78rem !important;
    letter-spacing: .1px;
}
html body #sidebar:not(.collapsed) .sidebar-nav .nav-link > i:first-child {
    width: 28px !important; height: 28px; flex-basis: 28px; font-size: .74rem !important;
}
html body #sidebar .submenu a {
    font-family: var(--ark-display) !important;
    font-weight: 600 !important;
    font-size: .74rem !important;
}
html body #sidebar .usage-label { font-family: var(--ark-display); font-weight: 700; font-size: .58rem !important; }
html body #sidebar .usage-count { font-family: var(--ark-display); font-weight: 700 !important; font-size: .66rem !important; }
html body #sidebar .user-name { font-family: var(--ark-display) !important; font-weight: 700 !important; font-size: .76rem !important; }
html body #sidebar .user-email { font-size: .68rem !important; }

/* =============== BARRA SUPERIOR =============== */
html body .header .page-title {
    font-family: var(--ark-display) !important;
    font-weight: 700 !important;
    font-size: 1.05rem !important;
    letter-spacing: -.2px;
}

/* =============== TÍTULOS DEL CONTENIDO =============== */
html body .main-content h1, html body .main-content h2, html body .main-content h3,
html body .main-content h4, html body .main-content h5, html body .main-content h6,
html body .main-content .card-title, html body .modal .modal-title,
html body .modal h1, html body .modal h2, html body .modal h3, html body .modal h4, html body .modal h5, html body .modal h6 {
    font-family: var(--ark-display) !important;
    font-weight: 700 !important;
    letter-spacing: -.25px;
}
/* Encabezados verdes (hero) */
html body .main-content .ark-hero h3, html body .main-content .dash-hero h3,
html body .main-content .ct-hero h3, html body .main-content .tpl-hero h3 {
    font-size: 1.4rem !important;
    font-weight: 800 !important;
    letter-spacing: -.4px;
    line-height: 1.25;
}
/* Títulos de tarjetas y secciones */
html body .main-content .card-header h5, html body .main-content .card-header h6, html body .main-content .card-header .card-title,
html body .main-content .dash-card-title, html body .main-content .ct-title {
    font-size: 14px !important;
    font-weight: 700 !important;
}
html body .main-content .tpl-name, html body .main-content .cp-name, html body .main-content .ct-name { font-family: var(--ark-display); font-weight: 700 !important; }
html body .main-content .tpl-name { font-size: 14px; }
/* Números destacados (indicadores) */
html body .main-content .dash-kpi .num, html body .main-content .ct-kpi .num, html body .main-content .cp-kpi .num,
html body .main-content .dash-step .num, html body .main-content .dash-usage .val, html body .main-content .tpl-stat b {
    font-family: var(--ark-display);
    font-weight: 800 !important;
    letter-spacing: -.4px;
}
html body .main-content .dash-kpi .num, html body .main-content .ct-kpi .num, html body .main-content .cp-kpi .num { font-size: 19px !important; }
html body .main-content .dash-step .num { font-size: 21px !important; }
/* Botones con la misma familia, en negrita */
html body .main-content .btn, html body .modal .btn { font-family: var(--ark-display); font-weight: 700 !important; letter-spacing: .1px; }
html body .main-content .tpl-tabs .nav-link, html body .main-content .tpl-chip, html body .main-content .cp-chip {
    font-family: var(--ark-display);
}
/* Etiquetas en mayúscula de tablas */
html body .main-content .table > thead th { font-family: var(--ark-display); font-weight: 700 !important; letter-spacing: .5px; }

@media (max-width: 767.98px) {
    html body .main-content .ark-hero h3, html body .main-content .dash-hero h3,
    html body .main-content .ct-hero h3, html body .main-content .tpl-hero h3 { font-size: 1.15rem !important; }
    html body .header .page-title { font-size: .9rem !important; }
}