/* Theme fixes - minimal and conservative */

/* Let the original template CSS handle the theming */
/* Only minimal overrides here */

/* --- Reusable CSS Variables --- */
:root {
    --default-border: #dee2e6;
    --default-background: #f8f9fa;
    --text-muted-color: #6c757d;
    --subtle-background: #fafbfd;
    --header-gradient-start: #f8fafc;
    --header-gradient-end: #e2e8f0;
    --card-section-border: #e2e8f0;
    --range-track-bg: #e2e8f0;
    --checkbox-bg: #f1f5f9;
    --secondary-text: #374151;
    --scrollbar-track: #f1f1f1;
    --scrollbar-thumb: var(--primary-color, #6c5ffc);
    --chat-bot-bg: #f0f0ff;
    --chat-bot-border: #e0e0f5;
    --chat-status-bg: #e8f5e9;
    --chat-status-border: #c8e6c9;
    --chat-suggestion-bg: #fff8e1;
    --chat-suggestion-border: #ffecb3;
    --chat-alert-bg: #fce4ec;
    --chat-alert-border: #f8bbd0;
    --step-completed-bg: #f0f9f0;
    --step-current-bg: #fff8e6;
    --step-icon-completed-bg: #d4edda;
}

[data-theme-mode="dark"] {
    --default-border: rgba(255, 255, 255, 0.1);
    --default-background: rgba(255, 255, 255, 0.05);
    --text-muted-color: rgba(255, 255, 255, 0.5);
    --subtle-background: rgba(255,255,255,0.03);
    --header-gradient-start: rgba(255,255,255,0.05);
    --header-gradient-end: rgba(255,255,255,0.1);
    --card-section-border: rgba(255,255,255,0.1);
    --range-track-bg: rgba(255,255,255,0.15);
    --checkbox-bg: rgba(255,255,255,0.08);
    --secondary-text: rgba(255,255,255,0.6);
    --scrollbar-track: rgba(255,255,255,0.05);
    --chat-bot-bg: rgba(108,95,252,0.1);
    --chat-bot-border: rgba(108,95,252,0.2);
    --chat-status-bg: rgba(40,167,69,0.1);
    --chat-status-border: rgba(40,167,69,0.2);
    --chat-suggestion-bg: rgba(255,193,7,0.1);
    --chat-suggestion-border: rgba(255,193,7,0.2);
    --chat-alert-bg: rgba(220,53,69,0.1);
    --chat-alert-border: rgba(220,53,69,0.2);
    --step-completed-bg: rgba(40,167,69,0.1);
    --step-current-bg: rgba(255,193,7,0.1);
    --step-icon-completed-bg: rgba(40,167,69,0.15);
}

/* Ensure transitions work smoothly */
.app-sidebar,
.app-header,
.main-content {
    transition: all 0.3s ease-in-out !important;
}

/* Fix breadcrumb text color to follow theme */
.breadcrumb .breadcrumb-item.active {
    color: var(--bs-secondary-color) !important;
}

/* ============================================================
   Badge de código SIGTAP clicável (componente Shared/SigtapBadge)
   Fonte/tamanho herdados da linha para não destoar dos demais dados.
   ============================================================ */
.sigtap-badge {
    font-size: inherit;
    font-weight: 600;
    padding: 0.15em 0.5em;
    letter-spacing: 0.2px;
    white-space: nowrap;
    transition: filter 0.12s ease;
}
.sigtap-badge:hover {
    filter: brightness(0.92);
    text-decoration: none;
}

/* ============================================================
   Popover de inconsistências da AIH (cabeçalho colorido YNEX)
   ============================================================ */
.popover-aih-erros .popover-header {
    background-color: var(--bs-danger, #dc3545);
    color: #fff;
    font-weight: 600;
}
.popover-aih-erros .popover-body {
    font-size: 0.8rem;
}
.popover-aih-erros .popover-body ul {
    margin: 0;
    padding-left: 1.1rem;
}

/* Lista AIH — tipografia consistente e célula de médicos alinhada */
.aih-table td, .aih-table th { font-size: 0.82rem; vertical-align: middle; }
.aih-table .cel-medicos { min-width: 200px; }
.aih-table .med-linha { display: flex; align-items: baseline; gap: 6px; line-height: 1.4; }
.aih-table .med-rotulo {
    flex: 0 0 36px; color: var(--text-muted-color, #6c757d);
    font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.3px;
}
.aih-table .med-nome {
    flex: 1 1 auto; max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* Célula CID / Procedimento: largura fixa, descrições truncadas em 1 linha */
.aih-table .cel-cidproc { width: 250px; max-width: 250px; }
.aih-table .cidproc-linha { display: flex; align-items: center; gap: 6px; max-width: 100%; }
.aih-table .cidproc-desc {
    flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    font-size: 0.75rem;
}

/* Avatar do paciente por sexo (componente Shared/AvatarPaciente) — global */
.bg-pink-transparent { background-color: rgba(214, 51, 132, 0.12) !important; }
.text-pink { color: #d63384 !important; }
.avatar-paciente { flex-shrink: 0; }
.avatar-paciente-click { cursor: pointer; transition: transform .15s ease; }
.avatar-paciente-click:hover { transform: scale(1.1); }

/* Modal com efeito de flip vertical (entrada) */
@keyframes modalFlipVertical {
    0%   { transform: perspective(1400px) rotateX(-90deg); opacity: 0; }
    60%  { opacity: 1; }
    100% { transform: perspective(1400px) rotateX(0deg); opacity: 1; }
}
.modal-flip-vertical { animation: modalFlipVertical 0.5s ease-out both; transform-origin: top center; }

/* ============================================================
   Menu HORIZONTAL - setas de rolagem
   No menu claro (padrao) o fundo do botao e branco e o SVG usa
   fill="currentColor" que tambem resolvia para branco -> seta
   invisivel. Forca a cor da seta para a cor primaria do tema.
   ============================================================ */
[data-menu-styles="light"][data-nav-layout="horizontal"] .main-menu-container .slide-left svg,
[data-menu-styles="light"][data-nav-layout="horizontal"] .main-menu-container .slide-right svg {
    fill: rgb(var(--primary-rgb)) !important;
}
/* Fallback caso data-menu-styles ainda nao tenha sido aplicado */
[data-nav-layout="horizontal"] .main-menu-container .slide-left svg,
[data-nav-layout="horizontal"] .main-menu-container .slide-right svg {
    fill: rgb(var(--primary-rgb));
}

/* ============================================================
   DARK MODE - Comprehensive fixes
   Targets [data-theme-mode="dark"] set by YNEX template
   ============================================================ */

/* --- Base containers --- */
[data-theme-mode="dark"] .modal-content,
[data-theme-mode="dark"] .offcanvas-body,
[data-theme-mode="dark"] .offcanvas-header {
    background-color: var(--custom-white, #1a1e2e) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .modal-header,
[data-theme-mode="dark"] .modal-footer {
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .modal-title,
[data-theme-mode="dark"] .offcanvas-title {
    color: var(--default-text-color, #d0d0d0) !important;
}

/* --- Cards --- */
[data-theme-mode="dark"] .card {
    background-color: var(--custom-white, #1a1e2e) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .card-header {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .card-body {
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .card-body p,
[data-theme-mode="dark"] .card-body .fw-semibold,
[data-theme-mode="dark"] .card-body h6,
[data-theme-mode="dark"] .card-body strong,
[data-theme-mode="dark"] .card-title {
    color: var(--default-text-color, #d0d0d0) !important;
}

/* --- Form controls --- */
[data-theme-mode="dark"] .form-control,
[data-theme-mode="dark"] .form-select {
    background-color: var(--custom-white, #1a1e2e) !important;
    color: var(--default-text-color, #d0d0d0) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

[data-theme-mode="dark"] .form-control::placeholder {
    color: rgba(255, 255, 255, 0.35) !important;
}

[data-theme-mode="dark"] .form-control:focus,
[data-theme-mode="dark"] .form-select:focus {
    background-color: var(--custom-white, #1a1e2e) !important;
    color: var(--default-text-color, #d0d0d0) !important;
    border-color: var(--primary-color, #667eea) !important;
    box-shadow: 0 0 0 0.25rem rgba(102, 126, 234, 0.25) !important;
}

[data-theme-mode="dark"] .form-label {
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .form-check-label {
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .input-group-text {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--default-text-color, #d0d0d0) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

/* --- Tabs --- */
[data-theme-mode="dark"] .nav-tabs .nav-link {
    color: rgba(255, 255, 255, 0.6) !important;
}

[data-theme-mode="dark"] .nav-tabs .nav-link:hover {
    color: var(--default-text-color, #d0d0d0) !important;
    border-bottom-color: rgba(255, 255, 255, 0.3) !important;
    background-color: transparent !important;
}

[data-theme-mode="dark"] .nav-tabs .nav-link.active {
    background-color: var(--custom-white, #1a1e2e) !important;
    color: var(--primary-color, #667eea) !important;
    border-color: rgba(255, 255, 255, 0.1) rgba(255, 255, 255, 0.1) var(--custom-white, #1a1e2e) !important;
    border-bottom-color: var(--primary-color, #667eea) !important;
}

[data-theme-mode="dark"] .tab-content {
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .tab-navigation {
    background: var(--custom-white, #1a1e2e) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* --- Background overrides --- */
[data-theme-mode="dark"] .bg-light {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .bg-white {
    background-color: var(--custom-white, #1a1e2e) !important;
}

/* --- Tables --- */
[data-theme-mode="dark"] .table {
    color: var(--default-text-color, #d0d0d0) !important;
    --bs-table-bg: transparent !important;
}

[data-theme-mode="dark"] .table-light th,
[data-theme-mode="dark"] .table-light td {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .table td,
[data-theme-mode="dark"] .table th {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme-mode="dark"] .table-active,
[data-theme-mode="dark"] .table-active td,
[data-theme-mode="dark"] .table-active th {
    --bs-table-active-bg: rgba(255, 255, 255, 0.08);
    --bs-table-active-color: var(--default-text-color, #d0d0d0);
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .table-secondary,
[data-theme-mode="dark"] .table-secondary td,
[data-theme-mode="dark"] .table-secondary th {
    --bs-table-bg: rgba(255, 255, 255, 0.03);
    --bs-table-color: var(--default-text-color, #d0d0d0);
    background-color: rgba(255, 255, 255, 0.03) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

/* --- Text colors --- */
[data-theme-mode="dark"] .text-dark {
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] h1, [data-theme-mode="dark"] h2,
[data-theme-mode="dark"] h3, [data-theme-mode="dark"] h4,
[data-theme-mode="dark"] h5, [data-theme-mode="dark"] h6 {
    color: var(--default-text-color, #d0d0d0);
}

[data-theme-mode="dark"] p {
    color: var(--default-text-color, #d0d0d0);
}

[data-theme-mode="dark"] label {
    color: var(--default-text-color, #d0d0d0);
}

[data-theme-mode="dark"] .text-muted {
    color: rgba(255, 255, 255, 0.5) !important;
}

/* --- List groups --- */
[data-theme-mode="dark"] .list-group-item {
    background-color: var(--custom-white, #1a1e2e) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .list-group-item:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
}

/* --- Offcanvas specific (Historico, etc.) --- */
[data-theme-mode="dark"] .offcanvas-historico .offcanvas-header {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme-mode="dark"] .offcanvas-historico .offcanvas-body {
    background: var(--custom-white, #1a1e2e) !important;
}

/* --- Timeline (Historico de Atendimento) --- */
[data-theme-mode="dark"] .fluxograma-container,
[data-theme-mode="dark"] .timeline-container {
    background: var(--custom-white, #1a1e2e) !important;
}

[data-theme-mode="dark"] .timeline-header {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme-mode="dark"] .timeline::before {
    background: rgba(255, 255, 255, 0.15) !important;
}

[data-theme-mode="dark"] .timeline-content {
    background: var(--custom-white, #1a1e2e) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .timeline-content h6 {
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .timeline-content:hover {
    border-color: rgba(255, 255, 255, 0.2) !important;
}

[data-theme-mode="dark"] .fluxo-step.completed {
    background: rgba(40, 167, 69, 0.15) !important;
}

[data-theme-mode="dark"] .fluxo-step.current {
    background: rgba(255, 193, 7, 0.15) !important;
}

[data-theme-mode="dark"] .fluxo-step.pending {
    background: rgba(255, 255, 255, 0.05) !important;
    border-left-color: rgba(255, 255, 255, 0.15) !important;
}

[data-theme-mode="dark"] .fluxo-content h6 {
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .fluxo-arrow {
    color: rgba(255, 255, 255, 0.3) !important;
}

/* --- Alerts in dark mode --- */
[data-theme-mode="dark"] .alert {
    color: var(--default-text-color, #d0d0d0);
}

/* --- Borders --- */
[data-theme-mode="dark"] .border,
[data-theme-mode="dark"] .border-top,
[data-theme-mode="dark"] .border-bottom,
[data-theme-mode="dark"] .border-start,
[data-theme-mode="dark"] .border-end {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* --- Accordion --- */
[data-theme-mode="dark"] .accordion-item {
    background-color: var(--custom-white, #1a1e2e) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme-mode="dark"] .accordion-button {
    background-color: var(--custom-white, #1a1e2e) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .accordion-button:not(.collapsed) {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: var(--primary-color, #667eea) !important;
}

/* --- Dropdown menus --- */
[data-theme-mode="dark"] .dropdown-menu {
    background-color: var(--custom-white, #1a1e2e) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme-mode="dark"] .dropdown-item {
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .dropdown-item:hover,
[data-theme-mode="dark"] .dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.08) !important;
}

/* --- TomSelect (autocomplete CID, etc.) --- */
[data-theme-mode="dark"] .ts-control {
    background: var(--custom-white, #1a1e2e) !important;
    color: var(--default-text-color, #d0d0d0) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

[data-theme-mode="dark"] .ts-control .item {
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .ts-dropdown {
    background: var(--custom-white, #1a1e2e) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

[data-theme-mode="dark"] .ts-dropdown .option {
    color: var(--default-text-color, #d0d0d0) !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
}

[data-theme-mode="dark"] .ts-dropdown .option:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

/* --- Page header --- */
[data-theme-mode="dark"] .page-header-breadcrumb h1,
[data-theme-mode="dark"] .page-title {
    color: var(--default-text-color, #d0d0d0) !important;
}

/* --- Popover/Tooltip --- */
[data-theme-mode="dark"] .popover {
    background-color: var(--custom-white, #1a1e2e) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme-mode="dark"] .popover-body {
    color: var(--default-text-color, #d0d0d0) !important;
}

/* --- Internacao specific --- */
[data-theme-mode="dark"] .Glasgow-point {
    color: var(--default-text-color, #d0d0d0) !important;
}

/* --- Chat (Triagem IA) --- */
[data-theme-mode="dark"] .chat-message {
    color: var(--default-text-color, #d0d0d0) !important;
}

/* --- Miscellaneous elements with inline backgrounds --- */
[data-theme-mode="dark"] .status-container,
[data-theme-mode="dark"] .info-section,
[data-theme-mode="dark"] .detail-card {
    background-color: var(--custom-white, #1a1e2e) !important;
    color: var(--default-text-color, #d0d0d0) !important;
}

/* --- Close button for dark mode --- */
[data-theme-mode="dark"] .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%) !important;
}

/* --- Calendar (AgendaEspecialistas) --- */
[data-theme-mode="dark"] .calendar-grid { background-color: var(--default-border) !important; border-color: var(--default-border) !important; }
[data-theme-mode="dark"] .calendar-header { background-color: var(--default-background) !important; border-color: var(--default-border) !important; color: var(--default-text-color, #d0d0d0) !important; }
[data-theme-mode="dark"] .time-slot { background-color: var(--custom-white, #1a1e2e) !important; color: var(--text-muted-color) !important; }
[data-theme-mode="dark"] .calendar-cell { background-color: var(--custom-white, #1a1e2e) !important; }
[data-theme-mode="dark"] .calendar-cell:hover { background-color: rgba(255, 255, 255, 0.08) !important; }
[data-theme-mode="dark"] .add-agenda-cell { color: var(--text-muted-color) !important; }
[data-theme-mode="dark"] .agenda-item { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important; }

/* --- Glasgow & Evolução modals --- */
[data-theme-mode="dark"] .glasgow-range-card,
[data-theme-mode="dark"] .evolucao-section,
[data-theme-mode="dark"] .pupil-section { background: var(--custom-white, #1a1e2e) !important; border-color: rgba(255, 255, 255, 0.1) !important; }
[data-theme-mode="dark"] .glasgow-range-header,
[data-theme-mode="dark"] .evolucao-section-header { background: var(--default-background) !important; border-color: rgba(255, 255, 255, 0.1) !important; }
[data-theme-mode="dark"] .modal-glasgow-modern .modal-content,
[data-theme-mode="dark"] .modal-evolucao-moderna .modal-content { background: var(--custom-white, #1a1e2e) !important; }
[data-theme-mode="dark"] .modal-glasgow-modern .modal-body,
[data-theme-mode="dark"] .modal-evolucao-moderna .modal-body { background: var(--custom-white, #1a1e2e) !important; }

/* ===================================================================
   Farmácia Municipal (/farmacia-central) — padronização das listas
   Marca-se a página raiz com .fmun-page. Objetivo: todas as colunas
   das tabelas com o MESMO tamanho de fonte (o uso ad-hoc de <small>,
   fs-10 e badges 1.1em deixava cada coluna num tamanho diferente).
   =================================================================== */
.fmun-page .table > thead > tr > th,
.fmun-page .table > tbody > tr > td {
    font-size: .8125rem !important;
    vertical-align: middle;
}
/* <small> dentro de célula não deve mais encolher o conteúdo principal */
.fmun-page .table td small,
.fmun-page .table th small {
    font-size: 100% !important;
    font-weight: inherit;
}
/* Sublinhas reais (segunda linha da célula) ficam menores de forma uniforme */
.fmun-page .table td small.d-block,
.fmun-page .table td .d-block.text-muted,
.fmun-page .table td br + small {
    font-size: .75rem !important;
}
/* Badges das listas com tamanho consistente com o texto (sobrepõe o +10% global) */
.fmun-page .table .badge {
    font-size: .72rem !important;
    padding: .3em .55em !important;
}

/* Dark mode: o Bootstrap colore .table com --bs-body-color (que não inverte
   sob data-theme-mode=dark) e o custom-tables.css herda esse tom escuro,
   resultando em texto escuro sobre fundo escuro. Forçamos o tom de texto
   correto do tema escuro (--default-text-color) nas listas da Farmácia. */
[data-theme-mode="dark"] .fmun-page .table,
[data-theme-mode="dark"] .fmun-page .table > thead > tr > th,
[data-theme-mode="dark"] .fmun-page .table > tbody > tr > td {
    color: var(--default-text-color) !important;
}

/* Dropdowns cujos itens não devem quebrar linha (ex.: menu "Solicitar Exame").
   O template YNEX define .dropdown-item { white-space: unset }, o que faz nomes
   longos quebrarem. Escopo por classe para não afetar dropdowns de busca (SIGTAP). */
.dropdown-menu-nowrap .dropdown-item {
    white-space: nowrap !important;
}