/*
 * Otos Vida — moldura do OpenEMR (menu de cima, identificação do doente, separadores)
 * e cores principais do tema nativo, no sistema de desenho.
 * Carregada em TODAS as páginas do OpenEMR por custom/assets/custom.yaml (autoload),
 * depois do tema «Cobalt blue». Não altera ficheiros originais do OpenEMR.
 * Valores = design/tokens.json (copiados aqui porque esta folha vive sem ov-design.css).
 */
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/montserrat-latin-700-normal.woff2') format('woff2')}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/montserrat-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/source-sans-3-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/source-sans-3-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/source-sans-3-latin-700-normal.woff2') format('woff2')}

:root {
  --ovs-brand: #0d3e69; --ovs-brand-strong: #0a2f50; --ovs-brand-soft: #e6eef6;
  --ovs-copper: #c87848; --ovs-canvas: #f6f4ef; --ovs-paper: #ffffff; --ovs-sunken: #faf8f4;
  --ovs-band: #e9e3d7; --ovs-line: #e2ddd3; --ovs-line-strong: #9c9384; --ovs-ink: #1d2b3a; --ovs-muted: #5a6878;
  --ovs-heading: Montserrat, "Segoe UI", Arial, sans-serif;
  --ovs-body: "Source Sans 3", "Segoe UI", Arial, sans-serif;
}

/* ---------- Moldura principal (interface/main/tabs/main.php) ---------- */
#mainBox { font-family: var(--ovs-body); background: var(--ovs-canvas); }

/* Menu de cima: azul do logótipo, texto branco, linha cobre por baixo */
#mainBox > nav.navbar { background: var(--ovs-brand) !important; border-bottom: 3px solid var(--ovs-copper); min-height: 56px; }
#mainBox > nav.navbar .navbar-brand, #mainBox > nav.navbar .navbar-brand * { color: #fff !important; }
#mainBox > nav.navbar .menuLabel { color: #fff !important; font: 600 15px/20px var(--ovs-body); padding-top: 18px !important; padding-bottom: 18px !important; }
#mainBox > nav.navbar .menuLabel:hover, #mainBox > nav.navbar .show > .menuLabel, #mainBox > nav.navbar .menuLabel[aria-expanded="true"], #mainBox > nav.navbar li:hover > .menuLabel { color: #fff !important; background: var(--ovs-brand-strong) !important; }
#mainBox > nav.navbar .navbar-toggler { border-color: rgba(255,255,255,.5); }
/* Menu do utilizador (templates/interface/main/tabs/user_data_template.html.twig): iniciais e nome no azul; menu aberto em papel branco */
#mainBox > nav.navbar #userData .ov-user__toggle { display: flex !important; align-items: center; gap: 10px; color: #fff !important; padding: 8px 12px !important; border-radius: 6px; cursor: pointer; }
#mainBox > nav.navbar #userData .ov-user__toggle:hover, #mainBox > nav.navbar #userData .show > .ov-user__toggle { background: var(--ovs-brand-strong) !important; }
#mainBox > nav.navbar #userData .ov-user__toggle::after { color: #fff; }
#mainBox > nav.navbar #userData .ov-user__name { color: #fff; font: 600 15px/20px var(--ovs-body); max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#mainBox #userData .ov-user__avatar { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--ovs-copper); color: #fff; font: 700 13px/1 var(--ovs-heading); letter-spacing: .02em; flex: none; }
#mainBox #userData .ov-user__avatar--lg { width: 40px; height: 40px; font-size: 15px; }
#mainBox #userData .ov-user__menu { min-width: 260px !important; padding: 0 0 6px !important; background: var(--ovs-paper) !important; border: 1px solid var(--ovs-line) !important; border-radius: 8px !important; box-shadow: 0 12px 32px rgba(13,62,105,.18) !important; overflow: hidden; }
#mainBox #userData .ov-user__head { display: flex; align-items: center; gap: 12px; padding: 14px 16px; margin-bottom: 6px; background: var(--ovs-sunken); border-bottom: 1px solid var(--ovs-line); }
#mainBox #userData .ov-user__who { display: grid; gap: 2px; min-width: 0; }
#mainBox #userData .ov-user__who strong { color: var(--ovs-ink); font: 700 15px/20px var(--ovs-body); white-space: nowrap; }
#mainBox #userData .ov-user__who small { color: var(--ovs-muted); font: 400 13px/18px var(--ovs-body); }
#mainBox #userData .ov-user__menu .dropdown-item { display: flex; align-items: center; gap: 10px; padding: 9px 16px; color: var(--ovs-ink) !important; font: 400 15px/22px var(--ovs-body); background: none; }
#mainBox #userData .ov-user__menu .dropdown-item i { width: 18px; color: var(--ovs-muted); text-align: center; }
#mainBox #userData .ov-user__menu .dropdown-item:hover, #mainBox #userData .ov-user__menu .dropdown-item:focus { background: var(--ovs-brand-soft) !important; color: var(--ovs-brand) !important; }
#mainBox #userData .ov-user__menu .dropdown-item:hover i { color: var(--ovs-brand); }
#mainBox #userData .ov-user__menu .dropdown-divider { margin: 6px 0; border-top-color: var(--ovs-line); }
#mainBox #userData .ov-user__menu .ov-user__sair { color: #a33a2a !important; font-weight: 600; }
#mainBox #userData .ov-user__menu .ov-user__sair i { color: #a33a2a; }
#mainBox #userData .ov-user__menu .ov-user__sair:hover { background: #f8e9e6 !important; color: #8c2f21 !important; }
@media (max-width: 991px) { #mainBox > nav.navbar #userData .ov-user__name { display: none; } }
#mainBox > nav.navbar .form-inline input { border: 0; border-radius: 4px 0 0 4px; font-family: var(--ovs-body); }
#mainBox > nav.navbar .form-inline .btn { border: 0 !important; background: #fff !important; color: var(--ovs-brand) !important; border-radius: 0 4px 4px 0; }
/* Menus abertos: papel branco, sombra única do sistema */
#mainBox #mainMenu .dropdown-menu { background: var(--ovs-paper) !important; border: 1px solid var(--ovs-line) !important; box-shadow: 0 8px 24px rgba(13,62,105,.14); padding: 4px 0; }
#mainBox #mainMenu .dropdown-menu .menuLabel { color: var(--ovs-ink) !important; font: 400 15px/22px var(--ovs-body); padding: 8px 16px !important; background: none; }
#mainBox #mainMenu .dropdown-menu .menuLabel:hover, #mainBox #mainMenu .dropdown-menu li:hover > .menuLabel { background: var(--ovs-brand-soft) !important; color: var(--ovs-brand) !important; }

/* Identificação do doente: faixa branca com filete azul, nome em Montserrat */
#mainBox > #attendantData { background: var(--ovs-paper) !important; border-bottom: 1px solid var(--ovs-line); border-left: 4px solid var(--ovs-brand); color: var(--ovs-ink); }
#mainBox > #attendantData .ptName, #mainBox > #attendantData .ptName span { color: var(--ovs-ink) !important; font: 700 22px/28px var(--ovs-heading); text-decoration: none; }
#mainBox > #attendantData .ptName small, #mainBox > #attendantData .ptName small span { color: var(--ovs-muted) !important; font: 600 15px/20px var(--ovs-body); }
#mainBox > #attendantData .mt-2, #mainBox > #attendantData .mt-2 span { color: var(--ovs-muted); font-size: 14px; }
#mainBox > #attendantData .img-thumbnail { border-color: var(--ovs-line); border-radius: 8px; }
/* Botões da faixa do doente (histórico, encontros, nova consulta): fundo azul-claro, contorno azul — claramente botões */
#mainBox > #attendantData .btn-secondary, #mainBox > #attendantData .btn-primary {
  background: var(--ovs-brand-soft) !important; border: 1px solid var(--ovs-brand) !important; color: var(--ovs-brand) !important;
  font: 600 14px/20px var(--ovs-body); border-radius: 4px; min-height: 34px;
}
#mainBox > #attendantData .btn-secondary:hover, #mainBox > #attendantData .btn-primary:hover { background: var(--ovs-brand) !important; color: #fff !important; }
#mainBox > #attendantData a:not(.ptName):not(.btn) { color: var(--ovs-brand); }
/* Lista de encontros: data e tipo à esquerda, «Rever» alinhado à direita em todas as linhas */
#mainBox > #attendantData .dropdown-menu > li.d-inline-flex { display: flex !important; }
#mainBox > #attendantData .dropdown-menu > li > .dropdown-item { width: auto; }
#mainBox > #attendantData .dropdown-menu > li > .dropdown-item:first-child { flex: 1 1 auto; }
#mainBox > #attendantData .dropdown-menu > li > .dropdown-item:last-child:not(:first-child) { flex: 0 0 auto; color: var(--ovs-brand); }
/* Sem doente aberto: a faixa vazia não aparece */
#mainBox > #attendantData:not(:has(.ptName, a, button, .btn, .alert, img)) { display: none !important; }

/* Separadores das janelas abertas: faixa própria em tom de pedra, separada do menu e da página.
   Ativo: branco, contorno e traço cobre em cima (pasta aberta). Inativos: cinza, discretos. */
#mainBox > #tabs_div { background: var(--ovs-band) !important; border-top: 1px solid var(--ovs-line); border-bottom: 1px solid var(--ovs-line-strong); padding: 6px 8px 0 !important; overflow: visible !important; }
#mainBox #tabs_div .tabControls { align-items: flex-end; overflow: visible !important; }
#mainBox #tabs_div .tabsNoHover.w-100 { border: 0 !important; }
#mainBox #tabs_div .tabSpan {
  display: inline-flex !important; align-items: center; gap: 2px; min-height: 38px; margin: 0 2px -1px 0 !important; padding: 0 10px 0 14px !important;
  background: transparent !important; border: 1px solid transparent !important; border-bottom: 0 !important; border-radius: 6px 6px 0 0 !important;
  color: var(--ovs-muted) !important; font: 600 14px/20px var(--ovs-body);
}
#mainBox #tabs_div .tabSpan * { color: inherit !important; }
#mainBox #tabs_div .tabSpan:hover { background: rgba(255,255,255,.55) !important; color: var(--ovs-ink) !important; }
#mainBox #tabs_div .tabSpan:not(.tabsNoHover) {
  background: var(--ovs-paper) !important; color: var(--ovs-brand) !important; font-weight: 700;
  border-color: var(--ovs-line-strong) !important; border-top: 3px solid var(--ovs-copper) !important; position: relative; z-index: 1;
}
/* Atualizar e fixar só ao passar o rato; fechar sempre, discreto */
#mainBox #tabs_div .tabSpan .fa-sync, #mainBox #tabs_div .tabSpan .fa-unlock, #mainBox #tabs_div .tabSpan .fa-lock { display: none !important; }
#mainBox #tabs_div .tabSpan:hover .fa-sync, #mainBox #tabs_div .tabSpan:hover .fa-unlock, #mainBox #tabs_div .tabSpan:hover .fa-lock { display: inline-block !important; opacity: .65; }
#mainBox #tabs_div .tabSpan .fa-times { opacity: .55; padding: 4px; border-radius: 3px; }
#mainBox #tabs_div .tabSpan .fa-times:hover { opacity: 1; background: var(--ovs-brand-soft); }
#mainBox #tabs_div .menu_arrow { color: var(--ovs-muted) !important; }

/* Rodapé da versão */
#versionFooter { color: var(--ovs-muted) !important; font-family: var(--ovs-body); }

/* ---------- Ecrãs nativos (dentro das janelas): cores principais do tema ---------- */
.btn-primary, .btn-primary:not(:disabled):not(.disabled):active { background-color: var(--ovs-brand) !important; border-color: var(--ovs-brand) !important; color: #fff !important; }
.btn-primary:hover, .btn-primary:focus { background-color: var(--ovs-brand-strong) !important; border-color: var(--ovs-brand-strong) !important; }
.bg-primary { background-color: var(--ovs-brand) !important; }
.text-primary { color: var(--ovs-brand) !important; }
.btn:focus-visible, .form-control:focus { box-shadow: 0 0 0 2px var(--ovs-copper) !important; border-color: var(--ovs-brand) !important; }

/* Barras de título dentro dos ecrãs nativos (Registo Clínico, Consulta, Procura de utentes…):
   papel branco com linha por baixo, em vez da faixa azul do tema */
.navbar.bg-light { background: var(--ovs-paper) !important; border-bottom: 1px solid var(--ovs-line); font-family: var(--ovs-body); }
.navbar.bg-light .navbar-brand { color: var(--ovs-ink) !important; font: 700 18px/24px var(--ovs-heading); }
.navbar.bg-light .nav-link, .navbar.bg-light .navbar-nav > li > a { color: var(--ovs-brand) !important; font-weight: 600; }
.navbar.bg-light .nav-link:hover { color: var(--ovs-brand-strong) !important; text-decoration: underline; }

/* Separadores dentro da consulta (Resumo · Consulta ORL · Atestado…) e outros separadores nativos:
   barra branca com linha por baixo (segundo nível); ativo com sublinhado cobre */
#enctabs.nav-tabs, .tabs-nav.nav-tabs { background: var(--ovs-paper) !important; border-bottom: 1px solid var(--ovs-line-strong) !important; gap: 20px; padding: 0 16px !important; }
#enctabs .tabs-anchor, .tabs-nav .tabs-anchor {
  background: transparent !important; color: var(--ovs-muted) !important; border: 0 !important; border-bottom: 3px solid transparent !important;
  border-radius: 0 !important; font: 600 14px/20px var(--ovs-body); padding: 10px 2px !important; margin-bottom: -1px;
}
#enctabs .tabs-anchor:hover, .tabs-nav .tabs-anchor:hover { color: var(--ovs-ink) !important; border-bottom-color: var(--ovs-line-strong) !important; }
#enctabs .tabs-anchor.active, .tabs-nav .tabs-anchor.active { background: transparent !important; color: var(--ovs-brand) !important; font-weight: 700; border-bottom-color: var(--ovs-copper) !important; }
#enctabs .icon-close, .tabs-nav .icon-close { color: var(--ovs-muted); margin-left: 6px; }

/* Separadores nativos antigos (Histórico, Dados demográficos…: ul.tabNav + div.tabContainer): mesmo padrão dos sub-separadores */
html body ul.tabNav { display: flex !important; flex-wrap: wrap; gap: 4px 20px; margin: 0 !important; padding: 0 16px !important; list-style: none;
  background: var(--ovs-paper) !important; border: 1px solid var(--ovs-line) !important; border-bottom-color: var(--ovs-line-strong) !important; border-radius: 6px 6px 0 0 !important; }
html body ul.tabNav > li { float: none !important; margin: 0 0 -1px !important; padding: 0 !important; background: transparent !important; border: 0 !important; }
html body ul.tabNav > li > a { display: block; padding: 10px 2px !important; margin: 0 !important; background: transparent !important; border: 0 !important; border-bottom: 3px solid transparent !important;
  border-radius: 0 !important; color: var(--ovs-muted) !important; font: 600 14px/20px var(--ovs-body) !important; text-decoration: none !important; }
html body ul.tabNav > li > a:hover { background: transparent !important; color: var(--ovs-ink) !important; border-bottom-color: var(--ovs-line-strong) !important; }
html body ul.tabNav > li.current > a { background: transparent !important; color: var(--ovs-brand) !important; font-weight: 700 !important; border-bottom-color: var(--ovs-copper) !important; }
html body div.tabContainer { background: var(--ovs-paper) !important; border: 1px solid var(--ovs-line) !important; border-top: 0 !important; border-radius: 0 0 6px 6px !important; padding: 16px !important; color: var(--ovs-ink); }
html body div.tabContainer > div, html body div.tabContainer .tab { background: transparent !important; border: 0 !important; }

/* Registo Clínico (auditoria de 18/10/2026): sem o seletor «Contexto» (Outpatient, Inpatient…) e sem o cartão
   «Health Concerns». Os cartões Laboratórios, Lembretes e Imunizações saem pela Configuração. */
#context-nav-widget { display: none !important; }
section.card:has(#health_concern_ps_expand), section.card:has(#recall_ps_expand) { display: none !important; }

/* Relatório do doente: sem os relatórios RAC/CCR e DRA/CCD (formatos de troca de dados dos EUA) */
#patient_reports > #ccr_report { display: none !important; }

/* Tabelas nativas (Utilizadores, Listas, Esquemas…): cabeçalho do sistema de desenho em vez da faixa azul do tema */
table.table > thead { background: var(--ovs-sunken) !important; }
table.table > thead th, table.table > thead td { color: var(--ovs-muted) !important; font: 700 12px/16px var(--ovs-body) !important; letter-spacing: .04em; text-transform: uppercase; border-bottom: 1px solid var(--ovs-line-strong) !important; border-top: 0 !important; vertical-align: bottom; }
table.table td { border-top-color: var(--ovs-line) !important; }

/* Letra do sistema também nos ecrãs nativos */
body { font-family: var(--ovs-body); }

/* Cartões do Registo Clínico (Alergias, Problemas Médicos, Medicamentos…): título em tinta, ícones no azul do logótipo */
.card-title > a, .card-title > a.font-weight-bolder { color: var(--ovs-ink) !important; font-family: var(--ovs-heading); font-weight: 600 !important; font-size: 15px; }
.card-title .fa, .card-title i { color: var(--ovs-brand); }
.card { border-color: var(--ovs-line); }
a { color: var(--ovs-brand); }

/* Listas (Administração): a coluna «Tradução» é só leitura — texto discreto, não verde grande */
html body td.translation { color: #5b6878; font-size: 13px; text-align: left; vertical-align: middle; }

/* «+» Nova visita escondido a quem não cria visitas (ov-shell.js pergunta a ov_visita/nova.php?pode=1) */
.ov-sem-nova-visita a[data-bind*="clickNewEncounter"] { display: none !important; }