/*
 * Tema v2 (tki) - utilitarios que fixam cor (Bootstrap e tw-* do Tailwind do
 * template). Com os tokens do 00-tokens.css a maior parte (.text-muted,
 * .bg-light, .text-dark, .text-body, .border...) ja' acompanha o tema; aqui
 * ficam os que usam cor fixa ou que no escuro ficariam branco-no-branco.
 */

/* ---------- Texto ---------- */

html.tki-layout .text-body { color: var(--tki-fg) !important; }
html.tki-layout .text-muted,
html.tki-layout .text-secondary,
html.tki-layout .text-body-secondary { color: var(--tki-muted) !important; }
html.tki-layout .text-body-tertiary { color: var(--tki-muted) !important; }
html.tki-layout .text-dark,
html.tki-layout .text-black,
html.tki-layout .text-body-emphasis,
html.tki-layout .link-dark { color: var(--tki-fg) !important; }
html.tki-layout .text-black-50 { color: var(--tki-muted) !important; }

/* Cores de estado: tons que passam em contraste sobre a superficie
   (o verde/ambar/ciano do template ficam abaixo de 4.5:1 no branco). */
html.tki-layout .text-primary,
html.tki-layout .link-primary { color: var(--tki-primary-text) !important; }
html.tki-layout .text-success,
html.tki-layout .link-success { color: var(--tki-success-text) !important; }
html.tki-layout .text-warning,
html.tki-layout .link-warning { color: var(--tki-warning-text) !important; }
html.tki-layout .text-danger,
html.tki-layout .link-danger { color: var(--tki-danger-text) !important; }
html.tki-layout .text-info,
html.tki-layout .link-info { color: var(--tki-info-text) !important; }
html.tki-layout .text-primary-emphasis { color: var(--tki-primary-text) !important; }
html.tki-layout .text-success-emphasis { color: var(--tki-soft-success-fg) !important; }
html.tki-layout .text-warning-emphasis { color: var(--tki-soft-warning-fg) !important; }
html.tki-layout .text-danger-emphasis { color: var(--tki-soft-danger-fg) !important; }
html.tki-layout .text-info-emphasis { color: var(--tki-soft-info-fg) !important; }
html.tki-layout .text-secondary-emphasis,
html.tki-layout .text-dark-emphasis,
html.tki-layout .text-light-emphasis { color: var(--tki-fg-2) !important; }

/* text-light / text-white: so' fazem sentido sobre fundo escuro/colorido.
   Fora disso (fundo claro do tema claro) viram texto normal. */
html.tki-layout[data-bs-theme='light'] :is(.card, .modal-content, .page-content, .dropdown-menu, .table) .text-light:not(:is([class*='bg-'], [class*='bg-'] *, .btn *, .badge *, .toast *, [style*='background'] *)) {
  color: var(--tki-fg) !important;
}

/* ---------- Fundos ---------- */

html.tki-layout .bg-body,
html.tki-layout .bg-body-secondary { background-color: var(--tki-card) !important; }
html.tki-layout .bg-body-tertiary { background-color: var(--tki-surface-2) !important; }
html.tki-layout .bg-light:not([class*='bg-opacity-']) { background-color: var(--tki-surface-2) !important; }
html.tki-layout .bg-transparent { background-color: transparent !important; }

/* bg-white: no escuro vira a superficie (senao texto claro some no branco) */
html.tki-layout[data-bs-theme='dark'] .bg-white:not([class*='bg-opacity-']) { background-color: var(--tki-card) !important; }

/* bg-dark como "superficie escura": no escuro o template inverte --bs-dark
   para uma cor clara; mantem escuro para o texto branco continuar legivel. */
html.tki-layout .bg-dark:not([class*='bg-opacity-']) { background-color: #18181b !important; color: #fafafa; }
html.tki-layout[data-bs-theme='dark'] .bg-dark:not([class*='bg-opacity-']) { background-color: #23262d !important; }

/* Fundos "subtle" do Bootstrap: tons suaves do tki */
html.tki-layout .bg-primary-subtle { background-color: var(--tki-soft-primary-bg) !important; }
html.tki-layout .bg-success-subtle { background-color: var(--tki-soft-success-bg) !important; }
html.tki-layout .bg-warning-subtle { background-color: var(--tki-soft-warning-bg) !important; }
html.tki-layout .bg-danger-subtle { background-color: var(--tki-soft-danger-bg) !important; }
html.tki-layout .bg-info-subtle { background-color: var(--tki-soft-info-bg) !important; }
html.tki-layout :is(.bg-secondary-subtle, .bg-light-subtle, .bg-dark-subtle) { background-color: var(--tki-soft-neutral-bg) !important; }

/* Solidos com texto branco: tons que passam em contraste */
html.tki-layout .bg-success:not([class*='bg-opacity-']):not(.badge) { background-color: #047857 !important; }
html.tki-layout .bg-warning:not([class*='bg-opacity-']):not(.badge) { background-color: #b45309 !important; }
html.tki-layout .bg-info:not([class*='bg-opacity-']):not(.badge) { background-color: #0369a1 !important; }
html.tki-layout .bg-danger:not([class*='bg-opacity-']):not(.badge) { background-color: #dc2626 !important; }
html.tki-layout .bg-secondary:not([class*='bg-opacity-']):not(.badge) { background-color: #52525b !important; }

/* Texto de cor sobre fundo "subtle"/opacidade: mesma familia, legivel */
html.tki-layout .bg-success-subtle.text-success,
html.tki-layout .bg-success.bg-opacity-10 .text-success { color: var(--tki-soft-success-fg) !important; }
html.tki-layout .bg-warning-subtle.text-warning { color: var(--tki-soft-warning-fg) !important; }
html.tki-layout .bg-danger-subtle.text-danger { color: var(--tki-soft-danger-fg) !important; }
html.tki-layout .bg-info-subtle.text-info { color: var(--tki-soft-info-fg) !important; }

/* ---------- Bordas e sombras ---------- */

html.tki-layout .border,
html.tki-layout .border-top,
html.tki-layout .border-bottom,
html.tki-layout .border-start,
html.tki-layout .border-end { --bs-border-color: var(--tki-border); }
html.tki-layout .border-light { border-color: var(--tki-border) !important; }
html.tki-layout .border-dark { border-color: var(--tki-input-border-hover) !important; }
html.tki-layout .border-dashed,
html.tki-layout .border-dashed-bottom { border-color: var(--tki-border) !important; }
html.tki-layout .custom-border { border-color: var(--tki-border) !important; }
html.tki-layout .shadow,
html.tki-layout .shadow-lg { box-shadow: var(--tki-shadow-pop) !important; }
html.tki-layout .shadow-sm { box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05) !important; }
html.tki-layout[data-bs-theme='dark'] .shadow-sm { box-shadow: none !important; }

/* ---------- Tailwind (prefixo tw-) do template ---------- */

html.tki-layout [class*='tw-bg-white'],
html.tki-layout [class*='tw-bg-neutral-50'],
html.tki-layout [class*='tw-bg-gray-50'],
html.tki-layout [class*='tw-bg-slate-50'] { background-color: var(--tki-card) !important; }
html.tki-layout :is([class*='tw-bg-neutral-100'], [class*='tw-bg-gray-100'], [class*='tw-bg-slate-100'], [class*='tw-bg-zinc-100']) { background-color: var(--tki-surface-2) !important; }
html.tki-layout :is([class*='tw-bg-neutral-800'], [class*='tw-bg-neutral-900'], [class*='tw-bg-gray-800'], [class*='tw-bg-gray-900']) { background-color: var(--tki-card) !important; }
html.tki-layout :is(.tw-text-black, [class*='tw-text-neutral-900'], [class*='tw-text-neutral-800'], [class*='tw-text-gray-900'], [class*='tw-text-gray-800'], [class*='tw-text-slate-900']) { color: var(--tki-fg) !important; }
html.tki-layout :is([class*='tw-text-neutral-700'], [class*='tw-text-neutral-600'], [class*='tw-text-gray-700'], [class*='tw-text-gray-600']) { color: var(--tki-fg-2) !important; }
html.tki-layout :is([class*='tw-text-neutral-500'], [class*='tw-text-neutral-400'], [class*='tw-text-gray-500'], [class*='tw-text-gray-400']) { color: var(--tki-muted) !important; }
html.tki-layout :is([class*='tw-border-neutral'], [class*='tw-border-gray'], [class*='tw-border-slate']) { border-color: var(--tki-border) !important; }
html.tki-layout[data-bs-theme='dark'] .tw-text-white { color: #fafafa !important; }

/* Atributo hidden vence display de componente (botao, chip, cartao). */
html.tki-layout :is(.tki-btn, .tki-chip, .tki-badge, .tki-card, .tki-field, .tki-menu-item)[hidden] { display: none !important; }