/* ════════════════════════════════════════════════════════════════
   NexusCare — Tema "Liquid Glass" (sobreposição global)
   Carregado POR ÚLTIMO em html_header.php. Re-skin do portal (hpb-*) e do
   backoffice com a estética da landing: branco + vidro + ciano/teal/índigo.

   ROBUSTEZ: os elementos visíveis críticos (botões, ícones de marca,
   números) usam GRADIENTES LITERAIS — não dependem de var(--grad) — para
   nunca ficarem invisíveis se um token não resolver.

   SEGURANÇA CLÍNICA: cores semânticas (Manchester, semáforo, NEWS2,
   alertas, estados, motor de IA) NÃO são alteradas.
   ════════════════════════════════════════════════════════════════ */

/* ── 1. Tokens: repor a paleta NexusCare (hpb.css tinha-a tornado laranja) ── */
:root {
  --brand:      #0ea5e9;
  --brand-2:    #2dd4bf;
  --brand-deep: #0c4a6e;
  --accent:     #6366f1;

  --hpb:        #0ea5e9;
  --hpb-deep:   #0284c7;
  --hpb-dark:   #0c4a6e;
  --hpb-soft:   #e6f6fb;

  --glass:       rgba(255, 255, 255, .72);
  --glass-chrome: rgba(255, 255, 255, .66);
  --glass-brd:   rgba(255, 255, 255, .72);
  --glass-shadow: 0 16px 40px -24px rgba(15, 23, 42, .42);
  --glass-inset: inset 0 1px 1px rgba(255, 255, 255, .9);
  --grad:        linear-gradient(120deg, #0ea5e9, #2dd4bf 55%, #6366f1);
}

/* Forçar o acento ciano onde o laranja insistia (literais, à prova de tokens) */
.hpb-cta { background: linear-gradient(180deg, #0ea5e9, #0284c7) !important; color: #fff !important; }
.hpb-nav > a.active, .hpb-readmore, .hpb-topbar i, .hpb-footer-col i,
.hpb-contact-card i, .sit-local i, .hpb-marc-date b, .hpb-marc-date small { color: #0ea5e9; }
.hpb-news-date, .hpb-pagination .is-active { background: #0ea5e9; border-color: #0ea5e9; color: #fff; }
.hpb-twocol h2::after { background: #0ea5e9; }

/* ── 2. Fundo claro + auroras + SEM scroll horizontal ─────────────────
   (a gaveta off-canvas do header/sidebar fica fora do ecrã à direita/esquerda;
    overflow-x: clip impede o scroll lateral e que ela "espreite",
    mantendo o header sticky a funcionar — ao contrário de overflow:hidden) */
html { overflow-x: hidden; overflow-x: clip; }
body { background: #f6f9fd; overflow-x: hidden; overflow-x: clip; }
body::before {
  content: ""; position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background:
    radial-gradient(1100px 560px at 82% -8%, #e8f6ff 0%, transparent 55%),
    radial-gradient(820px 560px at -6% 12%, #e6fbf4 0%, transparent 52%),
    radial-gradient(720px 720px at 112% 110%, #ebebff 0%, transparent 55%),
    linear-gradient(180deg, #fbfdff 0%, #eef3fb 60%, #f4f7fc 100%);
}

/* ════════════════════════════════════════════════════════════════
   3. SUPERFÍCIES DE VIDRO (cartões de conteúdo)
   ════════════════════════════════════════════════════════════════ */
.card, .kpi, .auth-card, .hpb-auth,
.hpb-esp-card, .hpb-med-card, .hpb-contact-card, .hpb-news-card, .hpb-marc-card,
.fila-card, .sala-card, .reforco-card, .situacao-card, .sit-metric,
.agente-card, .rag-card, .rag-item, .lean-card, .briefing-card, .hist-item,
.semaforo-nowcast, .processo-doc, .hv-card {
  background: var(--glass);
  -webkit-backdrop-filter: blur(12px) saturate(155%); backdrop-filter: blur(12px) saturate(155%);
  box-shadow: var(--glass-shadow), var(--glass-inset);
}
.briefing-card { border: 1px solid rgba(14, 165, 233, .22); border-left: 5px solid #0ea5e9; }
.hv-card { border: 1px solid var(--glass-brd); }

/* ════════════════════════════════════════════════════════════════
   4. BACKOFFICE — sidebar / topbar (vidro claro) + texto escuro
   ════════════════════════════════════════════════════════════════ */
.app-shell, .app-main { background: transparent; }

.sidebar {
  background: var(--glass-chrome);
  -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%);
  border-right: 1px solid var(--glass-brd);
  color: #475569;
}
.sb-head { border-bottom-color: rgba(15, 23, 42, .08); }
.sb-logo-text { color: #0f172a; }
.sb-logo-text small { color: #0c4a6e; }
.sb-close { color: #0f172a; }
.sb-group { color: #94a3b8; }
.sb-nav li a { color: #475569; }
.sb-nav li a:hover { background: rgba(14, 165, 233, .10); color: #0f172a; }
.sb-foot { border-top-color: rgba(15, 23, 42, .08); }
.sb-user strong { color: #0f172a; }
.sb-user small { color: #94a3b8; }
.sb-user i { color: #0c4a6e; }
.sb-logout { color: #dc2626; }
.sb-logout:hover { background: rgba(239, 68, 68, .12); }
.sb-nav li.active a { background: linear-gradient(120deg, #0ea5e9, #2dd4bf); color: #fff; }

.topbar {
  background: rgba(255, 255, 255, .70);
  -webkit-backdrop-filter: blur(16px) saturate(180%); backdrop-filter: blur(16px) saturate(180%);
  border-bottom: 1px solid var(--glass-brd);
}
.notif-drop {
  background: rgba(255, 255, 255, .92);
  -webkit-backdrop-filter: blur(18px) saturate(180%); backdrop-filter: blur(18px) saturate(180%);
  border-color: var(--glass-brd);
}
.reforco-card.is-on { background: rgba(14, 165, 233, .08); border-color: #0ea5e9; }
.reforco-card.is-on i, .reforco-card.is-on strong { color: #0284c7; }
.chip-sugestao { background: var(--hpb-soft); color: #0c4a6e; border-color: rgba(14, 165, 233, .35); }
.chip-sugestao:hover { background: #d7eefb; }
.hpb-esp-card:hover { box-shadow: 0 12px 26px -18px rgba(14, 165, 233, .6); }

/* ════════════════════════════════════════════════════════════════
   5. PORTAL PÚBLICO → ESTÉTICA DA LANDING (.hpb-* só existe no portal)
   ════════════════════════════════════════════════════════════════ */
/* Barra utilitária + cabeçalho + rodapé claros/vidro */
.hpb-topbar {
  position: relative; z-index: 60;   /* acima do header sticky → dropdown do idioma visível */
  background: rgba(255, 255, 255, .55); color: #475569;
  -webkit-backdrop-filter: blur(10px) saturate(160%); backdrop-filter: blur(10px) saturate(160%);
  border-bottom: 1px solid var(--glass-brd);
}
.hpb-topbar a:hover { color: #0f172a; }

/* ── Seletor de idioma (i18n) ── */
.lang-switch { position: relative; display: inline-block; }
.lang-switch summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: .3rem;
  padding: .22rem .6rem; border-radius: 999px; font-weight: 700; font-size: .8rem; color: #0c4a6e;
  background: rgba(14, 165, 233, .1); border: 1px solid rgba(14, 165, 233, .22);
}
.lang-switch summary::-webkit-details-marker { display: none; }
.lang-switch summary:hover { background: rgba(14, 165, 233, .17); }
.lang-switch summary .bx-globe { font-size: 1rem; }
.lang-caret { font-size: 1rem; transition: transform .2s ease; }
.lang-switch[open] .lang-caret { transform: rotate(180deg); }
.lang-menu {
  position: absolute; top: calc(100% + 9px); right: 0; min-width: 184px; z-index: 90;
  background: rgba(255, 255, 255, .94);
  -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid var(--glass-brd); border-radius: 14px; padding: .35rem;
  box-shadow: 0 26px 54px -24px rgba(13, 42, 76, .5);
}
.lang-menu a {
  display: flex; align-items: center; gap: .5rem; padding: .55rem .6rem; border-radius: 10px;
  font-size: .9rem; color: #334155; font-weight: 500;
}
.lang-menu a:hover { background: rgba(14, 165, 233, .1); color: #0f172a; }
.lang-menu a.is-active { color: #0284c7; font-weight: 700; }
.lang-menu a .lang-code { font-weight: 800; font-size: .7rem; min-width: 22px; color: #94a3b8; letter-spacing: .03em; }
.lang-menu a.is-active .lang-code { color: #0284c7; }
.lang-menu a .bx-check { margin-left: auto; color: #0ea5e9; font-size: 1.05rem; }
/* Vidro do header via ::before — assim o header NÃO vira bloco de contenção
   da gaveta fixed (que assim fica relativa ao ecrã, com altura total). */
.hpb-header { background: transparent; border-bottom: none; }
.hpb-header::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: rgba(255, 255, 255, .70);
  -webkit-backdrop-filter: blur(16px) saturate(180%); backdrop-filter: blur(16px) saturate(180%);
  border-bottom: 1px solid var(--glass-brd);
}

/* Botões em cápsula — gradiente LITERAL (nunca invisíveis) */
.hpb-btn { border-radius: 999px; }
.hpb-btn--primary { background: linear-gradient(180deg, #0ea5e9, #0284c7); color: #fff; border-color: transparent;
  box-shadow: 0 14px 30px -14px rgba(14, 165, 233, .75); }
.hpb-btn--ghost { border-color: rgba(14, 165, 233, .5); color: #0c4a6e; background: rgba(255, 255, 255, .5);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }

/* Kicker em cor sólida (robusto, sem background-clip) */
.hpb-section-kicker { color: #0284c7; }

/* Painéis de destaque (homepage) → contidos, arredondados */
.hpb-panels { width: min(1180px, 92%); margin: clamp(2rem, 5vw, 3.5rem) auto 0; gap: 1.1rem; }
.hpb-panel { border-radius: 24px;
  box-shadow: 0 26px 60px -34px rgba(13, 42, 76, .55), inset 0 1px 1px rgba(255, 255, 255, .35); }
.hpb-panel:nth-child(1) { background: linear-gradient(160deg, #0ea5e9, #0284c7); }
.hpb-panel:nth-child(2) { background: linear-gradient(160deg, #14b8c6, #0d9488); }
.hpb-panel:nth-child(3) { background: linear-gradient(160deg, #6366f1, #4f46e5); }

/* Cartões com elevação ao passar */
.hpb-esp-card, .hpb-med-card, .hpb-contact-card, .hpb-news-card {
  border-radius: 22px; border-color: var(--glass-brd);
  transition: transform .25s ease, box-shadow .25s ease;
}
.hpb-esp-card:hover, .hpb-med-card:hover, .hpb-contact-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 30px 64px -32px rgba(13, 42, 76, .5), inset 0 1px 1px rgba(255, 255, 255, .9);
}

/* Ícones / avatares — gradiente LITERAL + ícone branco (sempre visíveis) */
.hpb-esp-ic, .hpb-med-avatar {
  background: linear-gradient(135deg, #0ea5e9, #2dd4bf); color: #fff;
  box-shadow: 0 12px 26px -12px rgba(14, 165, 233, .7), inset 0 1px 1px rgba(255, 255, 255, .5);
}
.hpb-esp-ic i, .hpb-med-avatar i { color: #fff; }
.hpb-policy-ic {
  border: none; color: #fff; background: linear-gradient(135deg, #0ea5e9, #2dd4bf); border-radius: 22px;
  box-shadow: 0 18px 40px -18px rgba(14, 165, 233, .7);
}
.hpb-news-img { background: linear-gradient(135deg, #7fd0ee, #38bdf8); }
.hpb-compromisso-img { background: radial-gradient(120% 120% at 30% 20%, #d8f3ff, #aee3f7 60%, #7fd0ee); }
.hpb-section--soft { background: #f3f8fc; }

/* Faixa de estatísticas → clara, números em cor sólida (sem clip → sempre visíveis) */
.hpb-stats {
  background: rgba(255, 255, 255, .6);
  -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%);
  border-top: 1px solid var(--glass-brd); border-bottom: 1px solid var(--glass-brd); color: #0f172a;
}
.hpb-stats strong { color: #0284c7; font-weight: 800; -webkit-text-fill-color: currentColor; }
.hpb-stats span { color: #475569; }

/* Banda CTA → cartão de vidro claro, com botão em gradiente literal */
.hpb-cta-band { background: transparent; padding: 1.5rem 0; color: #0f172a; }
.hpb-cta-band-inner {
  width: min(1180px, 92%); margin-inline: auto; border-radius: 30px; padding: clamp(2rem, 4vw, 3rem);
  background: rgba(255, 255, 255, .6);
  -webkit-backdrop-filter: blur(18px) saturate(170%); backdrop-filter: blur(18px) saturate(170%);
  border: 1px solid var(--glass-brd);
  box-shadow: 0 30px 70px -36px rgba(13, 42, 76, .5), inset 0 1px 1px rgba(255, 255, 255, .9);
}
.hpb-cta-band h2 { color: #0f172a; }
.hpb-cta-band .hpb-btn--outline-white {
  background: linear-gradient(180deg, #0ea5e9, #0284c7); color: #fff; border-color: transparent;
}

/* Rodapé claro de vidro */
.hpb-footer {
  background: rgba(255, 255, 255, .55);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-top: 1px solid #e4e9f2; color: #475569;
}
.hpb-footer-col h4 { color: #0f172a; }
.hpb-footer-col a, .hpb-footer-col p { color: #475569; }
.hpb-footer-col a:hover { color: #0ea5e9; }
.hpb-footer-brand p { color: #0c4a6e; }
.hpb-footer-base { border-top-color: #e4e9f2; color: #94a3b8; }
.hpb-footer .hpb-logo-img--mono { filter: none; }

/* Formulários nítidos com foco ciano */
.hpb-field input, .hpb-field select, .hpb-field textarea,
.ficha-form input, .ficha-form select, .ficha-form textarea,
.fila-actions select, .fila-actions input { background: rgba(255, 255, 255, .9); }
.hpb-field input:focus, .hpb-field select:focus, .hpb-field textarea:focus {
  border-color: #0ea5e9; box-shadow: 0 0 0 4px rgba(14, 165, 233, .18);
}
.slot { background: rgba(255, 255, 255, .9); }
.slot.is-sel, .slot:hover:not(.is-busy) { border-color: #0ea5e9; }
.slot.is-sel { background: #0ea5e9; color: #fff; }

/* ════════════════════════════════════════════════════════════════
   6. CONTRASTE — rede de segurança (classes do tema antigo, se usadas)
   ════════════════════════════════════════════════════════════════ */
.section-title, .feature h3, .layer h3, .flow h4,
.hero-copy h1, .hero-stats strong, .hv-metric strong, .footer-hospital strong { color: #0f172a; }
.nav-public-links a, .hero-copy p, .hv-card-head, .hv-foot, .footer-hospital small { color: #475569; }
.feature i, .layer h3 i { color: #0ea5e9; }

/* ════════════════════════════════════════════════════════════════
   7. RESPONSIVO — reforço mobile (todo o projeto, exceto a landing)
   ════════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .kpi-grid--6 { grid-template-columns: repeat(3, 1fr); }
  .reforco-grid, .sit-top { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .kpi-grid, .kpi-grid--6 { grid-template-columns: repeat(2, 1fr); }
  .notif-drop { width: min(92vw, 330px); right: -6px; }
  .hpb-marc-card { flex-wrap: wrap; }
  .hpb-marc-info { flex: 1 1 60%; }
}
@media (max-width: 560px) {
  .kpi-grid, .kpi-grid--6 { grid-template-columns: repeat(2, 1fr); gap: .7rem; }
  .kpi--sm { padding: .8rem; }
  .reforco-grid, .sit-top, .equipa-grid { grid-template-columns: 1fr; }
  .vitais-box { grid-template-columns: repeat(2, 1fr); }
  .card { padding: 1.1rem; }
  .fila-actions, .fila-actions form { width: 100%; }
  .fila-actions .btn { flex: 1 1 auto; justify-content: center; }
  .hpb-stats-inner { padding: 2.6rem 0; }
  .hpb-twocol h2, .hpb-section-head h2 { font-size: 1.55rem; }
}
@media (max-width: 380px) {
  .kpi-grid, .kpi-grid--6, .vitais-box { grid-template-columns: 1fr; }
  .topbar-title h1 { font-size: 1.05rem; }
  .semaforo-estado { font-size: 1.8rem; }
  .app-content { padding: .85rem; }
}
@media (pointer: coarse) {
  .sb-nav li a, .hpb-nav > a, .notif summary, .slot, .hpb-readmore { min-height: 42px; }
}

/* ── Impressão do processo clínico ── */
@media print {
  body::before { display: none !important; }
  .processo-doc { background: #fff !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; }
}

/* ════════════════════════════════════════════════════════════════
   HEADER do portal — UX/UI + responsividade (todos os ecrãs)
   ════════════════════════════════════════════════════════════════ */
.hpb-header-inner { padding: .5rem 0; gap: 1rem; }
.hpb-logo-img { height: 50px; }
.hpb-nav { gap: 1.1rem; }
.hpb-nav > a { font-size: .96rem; }
.hpb-cta { border-radius: 999px !important; padding: .72rem 1.4rem; font-size: .9rem; }
.hpb-burger { position: relative; z-index: 60; color: #0f172a; padding: .2rem; line-height: 1; }
.hpb-nav-backdrop { display: none; }

/* Hambúrguer + gaveta de vidro a partir de 1100px (o nav completo só com espaço) */
@media (max-width: 1100px) {
  .hpb-burger { display: block; }
  .hpb-nav {
    position: fixed; inset: 0 0 0 auto; width: min(330px, 86%); z-index: 55;
    flex-direction: column; align-items: stretch; justify-content: flex-start; gap: .35rem;
    padding: 5.5rem 1.2rem 2rem;
    background: rgba(255, 255, 255, .9);
    -webkit-backdrop-filter: blur(24px) saturate(180%); backdrop-filter: blur(24px) saturate(180%);
    border-left: 1px solid rgba(255, 255, 255, .65);
    box-shadow: -24px 0 60px -28px rgba(13, 42, 76, .55);
    transform: translateX(100%); transition: transform .28s ease; overflow-y: auto;
  }
  .hpb-nav-toggle:checked ~ .hpb-nav { transform: translateX(0); }
  .hpb-nav > a { padding: .85rem .65rem; border-radius: 12px; font-size: 1.05rem; color: #334155; }
  .hpb-nav > a:hover, .hpb-nav > a.active { background: rgba(14, 165, 233, .1); color: #0284c7; }
  .hpb-cta { margin-top: .6rem; justify-content: center; }
  .hpb-nav-toggle:checked ~ .hpb-nav-backdrop {
    display: block; position: fixed; inset: 0; z-index: 54; background: rgba(13, 27, 42, .45);
    -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
  }
}

/* Barra de topo: simplificar em ecrãs pequenos (MANTÉM o seletor de idioma) */
@media (max-width: 760px) {
  .hpb-topbar-inner { justify-content: flex-end; }
  .hpb-topbar-morada { display: none; }       /* esconde a morada longa */
  .hpb-tb-txt { display: none; }              /* atalhos ficam só com ícone */
  .hpb-topbar-right { gap: 1rem; align-items: center; }
}
@media (max-width: 480px) {
  .hpb-logo-img { height: 42px; }
  .hpb-header-inner { padding: .45rem 0; }
}

/* ── Logótipo NexusCare (PNG transparente) — sem caixa/fundo atrás ── */
.sb-logo-mark, .brand-mark { background: none; box-shadow: none; overflow: visible; }
.sb-logo-mark img, .brand-mark img { width: 100%; height: 100%; object-fit: contain; }
/* fim — NexusCare liquidglass.css */
