/* Navegação única — barra de 5 itens visível em todas as telas de navegação. */
#tabBar.tab-capsule{position:fixed;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;align-items:stretch;left:14px;right:14px;bottom:calc(4px + env(safe-area-inset-bottom));height:68px;padding:5px;border-radius:34px;background:var(--card);border:1px solid var(--line);box-shadow:var(--tab-shadow);max-width:560px;margin:0 auto;z-index:60}
#tabBar.tab-capsule button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:0;min-width:0;padding:0;border-radius:26px;background:transparent;color:var(--sub);font-size:10.5px;font-weight:700;letter-spacing:0;white-space:nowrap}
#tabBar.tab-capsule button svg{width:22px;height:22px}
#tabBar.tab-capsule button[aria-current=page]{background:var(--accent-soft);color:var(--accent)}
#tabBar.tab-capsule .tab-search{justify-content:flex-end;padding-bottom:3px}
#tabBar.tab-capsule .tab-search[aria-current=page]{background:transparent;color:var(--accent)}
#tabBar .tab-search-circle{width:50px;height:50px;margin-top:-22px;border-radius:25px;background:var(--accent);color:var(--accent-ink);display:flex;align-items:center;justify-content:center;box-shadow:var(--tab-shadow);flex:none}
#tabBar .tab-search-circle svg{width:24px;height:24px}
@media (max-width:359px){#tabBar.tab-capsule{left:8px;right:8px}#tabBar.tab-capsule button{font-size:9.5px}#tabBar .tab-search-circle{width:44px;height:44px}}

/* A barra aparece também em módulos, SRI, busca e Ajustes (antes era escondida). */
html.module-open #tabBar.tab-capsule,html.sri-open #tabBar.tab-capsule,html.search-open #tabBar.tab-capsule,html.settings-open #tabBar.tab-capsule{display:grid!important;visibility:visible!important}
html.settings-open #tabBar.tab-capsule{z-index:90}
/* v34 (02/11, pedido do Marcos): a barra fica visível também com a droga aberta (folha) e no paciente.
   Some só com o teclado aberto e no código de PCR ao vivo, que tem a própria barra de ações embaixo. */
html.sheet-open #tabBar.tab-capsule,html.patient-open #tabBar.tab-capsule{display:grid!important;visibility:visible!important;z-index:75}
html.sheet-open .panel{padding-bottom:calc(110px + env(safe-area-inset-bottom))}
html.kb-open #tabBar.tab-capsule.tab-capsule,html.code-live #tabBar.tab-capsule.tab-capsule{display:none!important}
/* Folhas de confirmação e janelas por cima da tela (Excluir caso, Ajustar registro, 5H 5T, etc.) cobrem a barra:
   os botões dessas folhas ficam no rodapé e não podem ficar embaixo dela (relato do Marcos, 02/11). */
html:has(.code-sheet-wrap:not([hidden]) .code-sheet) #tabBar.tab-capsule.tab-capsule,html:has(#patientModal:not([hidden])) #tabBar.tab-capsule.tab-capsule,html:has(.sync-history:not([hidden])) #tabBar.tab-capsule.tab-capsule{display:none!important}
#searchButton,#searchButton.search-button{display:none!important}
#settingsScreen{padding-bottom:calc(110px + env(safe-area-inset-bottom))}
.wrap{padding-bottom:calc(120px + env(safe-area-inset-bottom))}

/* Cabeçalho: logo leva ao Início; o lado direito da faixa inicial fica livre. */
button.mini-brand{background:none;border:0;padding:0 6px;min-height:44px;color:inherit;font:inherit;cursor:pointer;border-radius:14px}
.home-status:empty{display:none}

/* Busca (aba central) */
.recent-searches{display:flex;flex-wrap:wrap;gap:8px}
.search-chip{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:20px;background:var(--card);border:1px solid var(--line);color:var(--ink);font-size:13.5px;font-weight:700;max-width:100%}
.search-chip svg{width:16px;height:16px;color:var(--sub);flex:none}
.search-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.link-button{background:none;border:0;color:var(--accent);font-size:13px;font-weight:700;min-height:44px;padding:0}
html.nav-search #home{display:none}

@media (prefers-reduced-motion:no-preference){#appContent>section:not([hidden]),#list:not([hidden]){animation:nav-in .18s ease-out}}
@keyframes nav-in{from{opacity:.4;transform:translateX(12px)}to{opacity:1;transform:none}}

/* Berço (07/11/2026, pedido do Marcos): a barra abre um encaixe sob a aba ativa e o ícone flutua num círculo
   da cor de destaque do tema. Buscar continua no centro; o círculo acompanha a aba escolhida. */
@property --tab-x{syntax:"<length>";inherits:true;initial-value:0px}
#tabBar.tab-capsule.has-cradle{background:transparent;border-color:transparent;box-shadow:none;filter:drop-shadow(0 10px 18px rgba(13,20,36,.16))}
#tabBar.has-cradle.is-ready{transition:--tab-x .55s cubic-bezier(.34,1.4,.55,1)}
#tabBar .tab-cradle{position:absolute;inset:0;z-index:0;border-radius:inherit;background:var(--card);border:1px solid var(--line);-webkit-mask-image:radial-gradient(circle at var(--tab-x) 0,transparent 31px,#000 32px);mask-image:radial-gradient(circle at var(--tab-x) 0,transparent 31px,#000 32px);pointer-events:none}
#tabBar .tab-orb{position:absolute;z-index:2;top:-22px;left:var(--tab-x);width:48px;height:48px;margin-left:-24px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:var(--accent-ink);box-shadow:0 10px 22px color-mix(in srgb,var(--accent) 38%,transparent),inset 0 1px rgba(255,255,255,.45);pointer-events:none;transition:opacity .25s ease,transform .25s ease}
#tabBar .tab-orb svg{width:23px;height:23px}
#tabBar.tab-capsule.has-cradle button{position:relative;z-index:1}
#tabBar.tab-capsule.has-cradle .tab-search{justify-content:center;padding-bottom:0}
#tabBar.tab-capsule.has-cradle button[aria-current=page]{background:transparent;color:var(--accent)}
#tabBar.tab-capsule.has-cradle button[aria-current=page] svg{opacity:0}
#tabBar.has-cradle.no-active .tab-cradle{-webkit-mask-image:none;mask-image:none}
#tabBar.has-cradle.no-active .tab-orb{opacity:0;transform:scale(.6)}
@media (max-width:359px){#tabBar .tab-orb{width:42px;height:42px;margin-left:-21px;top:-19px}}
@media (prefers-reduced-motion:reduce){#tabBar.has-cradle.is-ready{transition:none}}
