/* =====================================================================
   BRAND — camada de tokens do white-label (carregar DEPOIS do dist).

   Fonte da cor: setting `theme_accent_color` (hex), aplicada como canais
   RGB em --brand/--brand-hover/--brand-active pelo brand-boot.js
   (anti-flash) e por applyBrandColor() após o fetch de /public.
   Uso: rgb(var(--brand)) para a cor cheia, rgb(var(--brand) / .12) para
   opacidade. NUNCA voltar a hardcodar cor de marca em CSS/HTML/JS.

   Default NEUTRO (estado "produto sem cliente"): aço grafite #6C7A93 —
   luminância próxima do accent que substituiu, então todas as relações
   de contraste do tema se mantêm com qualquer cor de instância razoável.

   Este arquivo também re-aponta as regras do Bootstrap compilado que
   nasceram com a cor literal (btn-primary, form-check, focus...).
   ===================================================================== */

:root {
    --brand: 108 122 147;        /* #6C7A93 */
    --brand-hover: 123 135 158;  /* +10% branco */
    --brand-active: 97 110 132;  /* -10% preto */

    /* Tokens do tema (--ck-*) passam a derivar do canal */
    --ck-accent: rgb(var(--brand));
    --ck-accent-hover: rgb(var(--brand-hover));
    --ck-accent-active: rgb(var(--brand-active));
    --ck-accent-dim: rgb(var(--brand) / .12);
    --ck-accent-ring: rgb(var(--brand) / .35);

    /* Ponte Bootstrap */
    --bs-primary: rgb(var(--brand));
    --bs-primary-rgb: var(--brand);
}

/* ---- Componentes Bootstrap compilados com a cor literal ---- */

.btn-primary {
    --bs-btn-bg: rgb(var(--brand));
    --bs-btn-border-color: rgb(var(--brand));
    --bs-btn-hover-bg: rgb(var(--brand-hover));
    --bs-btn-hover-border-color: rgb(var(--brand-hover));
    --bs-btn-active-bg: rgb(var(--brand-active));
    --bs-btn-active-border-color: rgb(var(--brand-active));
    --bs-btn-focus-shadow-rgb: var(--brand);
    --bs-btn-disabled-bg: rgb(var(--brand) / .55);
    --bs-btn-disabled-border-color: transparent;
}

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

.form-control:focus { border-color: var(--ck-accent); }
.form-select:focus {
    border-color: var(--ck-accent);
    box-shadow: 0 0 0 .25rem rgb(var(--brand) / .25);
}
.form-check-input:focus {
    border-color: var(--ck-accent);
    box-shadow: 0 0 0 3px var(--ck-accent-ring);
}
.form-check-input:checked,
.form-check-input[type=checkbox]:indeterminate {
    background-color: var(--ck-accent);
    border-color: var(--ck-accent);
}
.form-range::-webkit-slider-thumb { background-color: var(--ck-accent); }
.form-range::-moz-range-thumb { background-color: var(--ck-accent); }

.dropdown-menu { --bs-dropdown-link-active-bg: rgb(var(--brand)); }
.dropdown-menu-dark { --bs-dropdown-link-active-bg: rgb(var(--brand)); }

.nav-tabs {
    --bs-nav-tabs-link-active-color: rgb(var(--brand-hover));
    --bs-nav-tabs-link-active-border-color: rgb(var(--brand));
}
.nav-pills { --bs-nav-pills-link-active-bg: rgb(var(--brand)); }

.accordion { --bs-accordion-active-color: rgb(var(--brand-hover)); --bs-accordion-active-bg: rgb(var(--brand) / .12); }

.pagination {
    --bs-pagination-active-bg: rgb(var(--brand));
    --bs-pagination-active-border-color: rgb(var(--brand));
    --bs-pagination-focus-box-shadow: 0 0 0 .25rem rgb(var(--brand) / .25);
}

.progress, .progress-stacked { --bs-progress-bar-bg: rgb(var(--brand)); }

.list-group {
    --bs-list-group-active-bg: rgb(var(--brand));
    --bs-list-group-active-border-color: rgb(var(--brand));
}

.table { --bs-table-active-bg: rgb(var(--brand) / .12); }

:focus-visible { outline-color: var(--ck-accent); }
blockquote, .blockquote { border-left-color: var(--ck-accent); }
.input-group:focus-within { outline-color: var(--ck-accent); }

.ck-tag-accent {
    background-color: rgb(var(--brand) / .12);
    color: rgb(var(--brand-hover));
    border-color: rgb(var(--brand) / .3);
}
