/* =========================================================================
   app.css — overrides mínimos do Bootstrap 5.3
   Este arquivo intencionalmente NÃO compete com o Bootstrap. Só corrige
   pequenos detalhes que o default não cobre bem. Etapas posteriores podem
   adicionar regras pra navbar, sidebar, etc. — quando essas telas existirem.
   ========================================================================= */

/* Utility usada em filhos de flex pra que `text-truncate` funcione.
   Sem isso, um conteúdo longo dentro de .flex-grow-1 estoura a largura
   do pai (causa scroll horizontal e corta botões à direita em mobile).
   Bootstrap 5.3 não inclui essa classe utility por padrão. */
.min-width-0 { min-width: 0; }

/* Utility pra liberar overflow em `.table-responsive` que contém
   dropdowns na coluna de Ações. Sem isso, o `overflow-x: auto` do
   wrapper corta o menu (problema clássico do Bootstrap 5 — o
   data-bs-strategy="fixed" deveria resolver mas em algumas versões
   o atributo não é honrado). Em desktop md+ as tabelas dos CRUDs do
   tenant cabem na tela e não precisam de scroll horizontal mesmo.
   Em <md usamos cards, então essa classe não atrapalha. */
.table-responsive-dropdown {
    overflow: visible;
}

/* Emojis do navbar (Dashboard, Profissionais, Serviços, etc).
   Aumenta levemente o tamanho em todos os temas, e no tema escuro
   aplica filtro de brilho+contraste pra que emojis monocromáticos
   (⚙️ 🛎️) e cinzas (👥 👤) não fiquem opacos contra o fundo escuro
   da navbar. */
.nav-emoji {
    display: inline-block;
    font-size: 1.15em;
    line-height: 1;
    margin-right: .15rem;
    vertical-align: -.06em;
}
[data-bs-theme="dark"] .nav-emoji {
    filter: brightness(1.25) contrast(1.05) saturate(1.15);
}

/* Suaviza a transição quando o usuário alterna entre claro/escuro,
   senão a mudança de fundo é instantânea e visualmente "estala". */
html, body {
    transition: background-color 200ms ease-out, color 200ms ease-out;
}

/* Botão de toggle de tema no canto superior direito do header simples
   (sem navbar Bootstrap completa nesta fase). */
.btn-tema {
    background: transparent;
    border: 1px solid var(--bs-border-color);
    color: var(--bs-body-color);
    border-radius: .375rem;
    padding: .25rem .55rem;
    line-height: 1;
    cursor: pointer;
    min-height: 36px;
    min-width: 36px;
}
.btn-tema:hover,
.btn-tema:focus {
    background: var(--bs-tertiary-bg);
    border-color: var(--bs-emphasis-color);
}