/*
SUROS - Tema y estandar de componentes.
Archivo raiz unico de design tokens y de las reglas estandar de componentes.
Debe cargarse DESPUES de Bootstrap para que las reglas estandar manden.
Referencias: SUROS.Framework/UI/TOKENS.md, SUROS.Framework/CONTRACTS/BADGE.md y
SUROS.Framework/CONTRACTS/BUTTON.md.
*/

:root {
    /* Tokens de borde */
    --suros-radius-sm: 4px;
    --suros-radius-md: 6px;

    /*
    Token del componente Boton.
    Radio unico para todas las variantes (primary, secondary, outline, etc.).
    Bootstrap define 6px por defecto y eso hacia que un boton outline se viera con
    un radio mayor que el primario; el sistema usa 3px de forma uniforme.
    */
    --suros-btn-border-radius: 3px;

    /*
    Tokens del componente Badge.
    Un solo tamano para todos los badges de estado en grids, filtros y toolbars.
    El padding va en px (no en em) para que no dependa del tamano de fuente del
    contenedor: en tablas con fuente pequena el padding en em se encogia y los
    badges se veian diminutos.
    */
    --suros-badge-font-size: 0.75rem;        /* 12px con la raiz en 16px */
    --suros-badge-padding: 4px 10px;         /* 4px vertical, 10px horizontal */
    --suros-badge-font-weight: 600;
    --suros-badge-line-height: 1.25;
    --suros-badge-border-radius: var(--suros-radius-md);
    --suros-badge-icon-font-size: 0.64rem;
}

/*
COMPONENTE BADGE - regla estandar.

Los componentes traen tamanos inline (0.5 a 0.72rem) y Bootstrap aplica
font-size en em, que encoge el badge dentro de tablas con fuente pequena.
Por eso la regla se impone con !important, igual que el precedente acordado en
el panel de Clientes y Sedes (idea suros-admin-clientes).

Un badge nuevo NO debe declarar font-size ni padding: los hereda de aqui.
*/
.badge {
    font-size: var(--suros-badge-font-size) !important;
    padding: var(--suros-badge-padding) !important;
    font-weight: var(--suros-badge-font-weight);
    line-height: var(--suros-badge-line-height) !important;
    border-radius: var(--suros-badge-border-radius);
    white-space: nowrap;
}

/* Iconos dentro del badge: proporcionales al texto del badge. */
.badge i {
    font-size: var(--suros-badge-icon-font-size) !important;
}

/*
Excepciones documentadas. Ver SUROS.Framework/CONTRACTS/BADGE.md.

1) Badge de conteo dentro de pestanas: vive en la fila del nav-link (44px) y no
   es un badge de estado, se mantiene compacto (PATTERNS/TABS.md).
2) Badge dentro de un boton: acompana la altura y el texto del boton.
*/
.nav-link .badge,
.nav-tabs .badge {
    font-size: 0.62rem !important;
    padding: 1px 6px !important;
    line-height: 1.2 !important;
    font-weight: 500;
}

.btn .badge {
    font-size: 0.68rem !important;
    padding: 2px 6px !important;
    line-height: 1 !important;
}

/*
COMPONENTE BOTON - regla estandar de radio.

Todas las variantes de boton comparten el mismo radio. Bootstrap deja 6px en los
botones que no llevan la regla del primario y eso producia mezcla de radios en una
misma barra o grid. Sin !important: los modulos con identidad propia (por ejemplo
Electoral) pueden seguir sobrescribiendolo con mayor especificidad, y los grupos de
botones (.btn-group) conservan sus radios de union.
*/
.btn {
    border-radius: var(--suros-btn-border-radius);
}
