/**
 * Color base del sistema.
 * Incluir después de Bootstrap en layouts.base para que aplique de forma global.
 */
:root {
    --brand: #003ba9;
    --brand-rgb: 0, 59, 169;
    --brand-hover: #002d80;
    --brand-hover-rgb: 0, 45, 128;
    --brand-soft: #e6eef9;
    --brand-border: #99b3e0;
    --brand-emphasis: #002766;

    /* Bootstrap 5.3 — primary / links */
    --bs-primary: var(--brand);
    --bs-primary-rgb: var(--brand-rgb);
    --bs-primary-text-emphasis: var(--brand-emphasis);
    --bs-primary-bg-subtle: var(--brand-soft);
    --bs-primary-border-subtle: var(--brand-border);
    --bs-link-color: var(--brand);
    --bs-link-color-rgb: var(--brand-rgb);
    --bs-link-hover-color: var(--brand-hover);
    --bs-link-hover-color-rgb: var(--brand-hover-rgb);
}

.btn-primary {
    --bs-btn-bg: var(--brand);
    --bs-btn-border-color: var(--brand);
    --bs-btn-hover-bg: var(--brand-hover);
    --bs-btn-hover-border-color: var(--brand-hover);
    --bs-btn-active-bg: var(--brand-hover);
    --bs-btn-active-border-color: var(--brand-hover);
    --bs-btn-disabled-bg: var(--brand);
    --bs-btn-disabled-border-color: var(--brand);
}

.btn-outline-primary {
    --bs-btn-color: var(--brand);
    --bs-btn-border-color: var(--brand);
    --bs-btn-hover-bg: var(--brand);
    --bs-btn-hover-border-color: var(--brand);
    --bs-btn-active-bg: var(--brand);
    --bs-btn-active-border-color: var(--brand);
    --bs-btn-disabled-color: var(--brand);
    --bs-btn-disabled-border-color: var(--brand);
}

.text-primary {
    --bs-text-opacity: 1;
    color: rgba(var(--brand-rgb), var(--bs-text-opacity)) !important;
}

.bg-primary {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--brand-rgb), var(--bs-bg-opacity)) !important;
}

.border-primary {
    --bs-border-opacity: 1;
    border-color: rgba(var(--brand-rgb), var(--bs-border-opacity)) !important;
}