#portal-app { --texto-base:.875rem; --texto-campo:1rem; --texto-clinica:1.0625rem; --texto-numeral:1.375rem; --texto-numeral-hero:1.5rem; --texto-headline:1.625rem; --texto-titulo:1.75rem; --texto-destaque:2rem; }
@font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/Lato-Regular.ttf') format('truetype'); }
@font-face { font-family: 'Lato'; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/Lato-Bold.ttf') format('truetype'); }
#portal-app:has([data-ux-pagina]) { max-width: 1080px; }
.ux-pagina .portal-cartao, .ux-pagina .portal-consent-card { border-radius: 2px; box-shadow: none; border-top-width: 1px; }
.ux-pagina :is(button,.portal-link-botao,.portal-escolha) { border-radius: 2px; }
.ux-pagina :is(h1,h2,h3) { text-wrap: balance; }
.ux-pagina :is(p,dd,label) { overflow-wrap: anywhere; }
.ux-pagina .portal-cabecalho { margin-bottom: 28px; }
.ux-pagina .portal-nav-fixa { max-width: 1080px; }
.ux-pagina .portal-nav-fixa a { min-height: 64px; font-size: .75rem; }
.ux-portal-acesso { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); min-height: calc(100dvh - 100px); align-items: stretch; }
.ux-portal-intro { padding: 48px 40px; background: var(--navy); color: var(--cream); display: flex; flex-direction: column; justify-content: center; }
.ux-portal-intro strong { font: 700 1.4rem var(--fonte-titulo); color: var(--cream); margin-bottom: 64px; }
.ux-portal-intro h2 { color: var(--cream); font: 700 2rem/1.25 var(--fonte-titulo); margin: 0 0 24px; }
.ux-portal-intro p { color: color-mix(in srgb, var(--cream) 85%, var(--navy)); margin: 0; line-height: 1.7; }
.ux-portal-acesso-form { padding: 32px; align-self: center; min-width: 0; }
.ux-portal-acesso-form .portal-cartao { background: transparent; padding: 0; border: 0; }
.ux-portal-inicio { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(240px,1fr); gap: 0 28px; align-items: start; }
.ux-portal-inicio-proxima, .ux-portal-inicio-cuidados { grid-column: 1; min-width: 0; }
.ux-portal-inicio-acoes { grid-column: 2; grid-row: 1 / span 2; min-width: 0; padding-top: 18px; }
.ux-pagina[data-ux-pagina="portal-agendar"] .portal-procedimento { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; text-align: left; padding: 24px; min-height: 96px; }
.ux-pagina[data-ux-pagina="portal-agendar"] .portal-procedimento-nome { font-size: 1.1rem; font-family: var(--fonte-titulo); }
.ux-pagina[data-ux-pagina="portal-agendar"] :is(.portal-grelha-dias,.portal-grelha-horarios) { gap: 12px; }
.ux-pagina[data-ux-pagina="portal-contato"] .portal-troca-contato { max-width: 680px; margin-inline: auto; }
.ux-pagina[data-ux-pagina="portal-dados"] .portal-dados-lista { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 32px; }
.ux-pagina[data-ux-pagina="portal-profissional"] .portal-ficha { max-width: 900px; }
.ux-pagina[data-ux-pagina="portal-mensagens"] .portal-conversa { min-height: 40dvh; }
.ux-pagina .portal-envio-mensagem textarea { min-width: 0; }
.ux-pagina .portal-envio-mensagem button { width: auto; flex-shrink: 0; }
.ux-pagina[data-ux-pagina="portal-formulario"] :is(.portal-formulario-termo-caixa,.portal-formulario-termo-janela) { max-width: 75ch; }
.ux-pagina[data-ux-pagina="portal-conta"] .portal-consent-resumo { background: white; border: 1px solid var(--borda); padding: 24px; }
@media (max-width: 900px) {
  #portal-app:has([data-ux-pagina]) { max-width: 680px; }
  .ux-portal-acesso { display: block; min-height: 0; }
  .ux-portal-intro { display: none; }
  .ux-portal-acesso-form { padding: 0; }
  .ux-portal-inicio { grid-template-columns: minmax(0,1fr); }
  .ux-portal-inicio-acoes { grid-column: 1; grid-row: auto; padding: 0; }
  .ux-pagina .portal-nav-fixa { max-width: 680px; }
  .ux-pagina[data-ux-pagina="portal-dados"] .portal-dados-lista { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 480px) {
  .ux-pagina .portal-envio-mensagem { flex-direction: column; }
  .ux-pagina .portal-envio-mensagem textarea { width: 100%; min-height: 120px; }
  .ux-pagina .portal-envio-mensagem button { width: 100%; }
}

.ux-pagina .portal-envio-mensagem textarea,
.ux-pagina #diario-observacao { min-height:120px; line-height:1.5; }
@media(max-width:480px) {
  .ux-pagina .portal-dados-grade { grid-template-columns:minmax(0,1fr); }
}

/* Login do Portal: opção 3 aprovada em 29/10/2026. */
#portal-app:has(.ux-portal-acesso) { max-width:1152px; }
.ux-portal-acesso { grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr); min-height:0; margin-top:16px; }
.ux-portal-acesso-cabecalho { grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:12px 0 36px; }
.ux-portal-marca { display:flex; align-items:center; gap:16px; }
.ux-portal-marca img { width:74px; height:74px; object-fit:contain; border-radius:4px; background:var(--navy); }
.ux-portal-marca strong { display:block; color:var(--navy); font:700 28px/1.15 var(--fonte-titulo); }
.ux-portal-marca span { display:block; margin-top:6px; font-size:var(--texto-base); color:var(--texto-suave); }
.ux-portal-acesso-form { align-self:stretch; padding:40px 48px; background:#fff; border:1px solid var(--borda); border-right:0; }
.ux-portal-acesso-form .portal-cartao { margin-bottom:24px; }
.ux-portal-acesso-form .portal-cartao:last-child { margin-bottom:0; }
.ux-portal-acesso-form :is(h1,h2) { font:700 32px/1.2 var(--fonte-titulo); margin:16px 0; }
.ux-portal-acesso-form input:not([type="radio"]):not([type="checkbox"]) { min-width:0; min-height:52px; font-size:var(--texto-campo); }
.ux-portal-acesso-form form > button[type="submit"] { width:100%; min-height:48px; }
.ux-portal-acesso-form .portal-campo-senha { width:100%; }
.ux-portal-acesso-form .portal-cpf-escolhido { flex-wrap:wrap; }
.ux-portal-acesso-form .portal-cpf-identificador { white-space:nowrap; }
.ux-portal-acesso-form .portal-cpf-escolhido .portal-link { width:auto; flex:none; }
.ux-portal-intro { grid-column:2; grid-row:2; padding:40px; justify-content:flex-start; }
.ux-portal-intro > h2 { font-size:var(--texto-destaque); margin:0 0 18px; }
.ux-portal-intro > p { line-height:1.6; }
.ux-portal-instalacao { margin-top:30px; padding-top:28px; border-top:1px solid color-mix(in srgb, var(--cream) 32%, var(--navy)); }
.ux-portal-instalacao h2 { font-size:var(--texto-headline); margin:0 0 16px; }
.ux-portal-instalacao p { margin-bottom:20px; line-height:1.6; }
.ux-portal-acesso .ux-portal-instalar-acao { min-height:48px; background:#bfa45f; border:1px solid #bfa45f; color:#091026; font-weight:700; }
.ux-portal-acesso .ux-portal-instalar-acao:hover { background:#d4b86a; }
.ux-portal-instalacao .ux-portal-instalar-acao { width:100%; }
.ux-portal-instalar-mobile { display:none; }
.ux-portal-instalar-passos { padding:22px 0 0; margin:24px 0 0; list-style:none; border-top:1px solid color-mix(in srgb, var(--cream) 32%, var(--navy)); color:#f5f4ee; font-size:var(--texto-campo); }
.ux-portal-instalar-passos li { margin:0 0 18px; line-height:1.5; }
.ux-portal-instalar-passos strong { display:block; margin:0 0 4px; font:700 16px/1.5 system-ui,sans-serif; }
.ux-portal-intro .ux-portal-instalar-status { margin:12px 0 0; font-size:var(--texto-campo); }
.ux-portal-acesso .ux-portal-instalar-acao[hidden] { display:none; }
.portal-clinicas-escolha { display:grid; gap:12px; margin:24px 0; }
.portal-clinica-opcao { display:flex; align-items:center; gap:16px; min-height:92px; padding:16px; border:1px solid var(--borda); border-radius:4px; background:white; cursor:pointer; }
.portal-clinica-opcao:has(input:checked) { border-color:#8a7434; background:var(--cream); outline:1px solid #8a7434; }
.portal-clinica-opcao:focus-within { outline:3px solid #8a7434; outline-offset:3px; }
.portal-clinica-opcao strong { font-size:var(--texto-clinica); line-height:1.4; overflow-wrap:anywhere; }
.portal-clinica-logo,.portal-clinica-iniciais { width:58px; height:58px; flex-shrink:0; object-fit:contain; background:white; border:1px solid var(--borda); border-radius:4px; padding:4px; }
.portal-clinica-iniciais { display:grid; place-items:center; font:700 23px/1 var(--fonte-titulo); color:#8a7434; }
.portal-clinica-opcao input[type="radio"] { width:22px; height:22px; flex-shrink:0; margin:0 0 0 auto; accent-color:#8a7434; }
.portal-acesso-validado { color:#3d6b4a; font-size:var(--texto-campo); }
@media(max-width:900px) {
  #portal-app:has(.ux-portal-acesso) { max-width:680px; }
  .ux-portal-acesso { display:flex; flex-direction:column; margin-top:0; }
  .ux-portal-acesso-cabecalho { padding:12px 0 24px; gap:12px; }
  .ux-portal-marca { gap:10px; }
  .ux-portal-marca img { width:48px; height:48px; }
  .ux-portal-marca strong { font-size:var(--texto-numeral); }
  .ux-portal-marca span { font-size:var(--texto-base); }
  .ux-portal-instalar-mobile { display:block; width:auto; flex-shrink:0; padding:10px 12px; }
  .ux-portal-acesso-form { padding:24px; border:1px solid var(--borda); }
  .ux-portal-intro { display:block; padding:28px 24px; }
  .ux-portal-intro > :is(h2,p) { display:none; }
  .ux-portal-instalacao { padding:0; margin:0; border:0; }
}
@media(max-width:480px) {
  .ux-portal-marca span { font-size:var(--texto-base); }
  .ux-portal-acesso .ux-portal-instalar-mobile { font-size:var(--texto-base); padding:10px; }
  .ux-portal-acesso-form { padding:22px 18px; }
  .ux-portal-acesso-form :is(h1,h2) { font-size:var(--texto-destaque); }
  .portal-clinica-opcao { gap:12px; padding:12px; }
  .portal-clinica-logo,.portal-clinica-iniciais { width:48px; height:48px; }
  .portal-clinica-opcao strong { font-size:var(--texto-campo); }
}

.portal-cabecalho:has(.portal-trocar-clinica) { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:8px 12px; }
.portal-cabecalho:has(.portal-trocar-clinica) > img { grid-row:1 / span 2; }
.portal-cabecalho:has(.portal-trocar-clinica) .portal-clinica-nome { grid-column:2; grid-row:1; min-width:0; overflow-wrap:anywhere; }
.portal-cabecalho:has(.portal-trocar-clinica) .portal-conta-link { grid-column:3; grid-row:1 / span 2; }
.portal-cabecalho .portal-trocar-clinica { grid-column:2; grid-row:2; justify-self:start; width:auto; min-height:44px; padding:8px 12px; font-size:var(--texto-campo); }
.portal-cabecalho:has(.portal-trocar-clinica):not(:has(> img)) { grid-template-columns:minmax(0,1fr) auto; }
.portal-cabecalho:has(.portal-trocar-clinica):not(:has(> img)) :is(.portal-clinica-nome,.portal-trocar-clinica) { grid-column:1; }
.portal-cabecalho:has(.portal-trocar-clinica):not(:has(> img)) .portal-conta-link { grid-column:2; }

.ux-portal-instalar-dialogo { width:min(600px,calc(100vw - 32px)); max-width:none; max-height:calc(100dvh - 32px); margin:auto; padding:28px; overflow:auto; box-sizing:border-box; border:1px solid var(--gold); border-radius:8px; background:var(--cream); color:var(--navy); font:400 16px/1.6 var(--fonte-sans,system-ui,sans-serif); overflow-wrap:anywhere; }
.ux-portal-instalar-dialogo::backdrop { background:rgba(9,16,38,.65); }
.ux-portal-instalar-dialogo header { display:flex; align-items:flex-start; gap:20px; margin-bottom:20px; }
.ux-portal-instalar-dialogo h2 { margin:0; font:700 28px/1.2 var(--fonte-serif,serif); color:var(--navy); }
.ux-portal-instalar-dialogo header button { flex:none; width:auto; min-height:44px; margin:0; font-size:var(--texto-campo); }
.ux-portal-instalar-dialogo p { color:var(--navy); font-size:var(--texto-campo); line-height:1.6; }
.ux-portal-instalar-dialogo ol { padding-left:24px; margin:20px 0; }
.ux-portal-instalar-dialogo li { margin-bottom:18px; }
.ux-portal-instalar-dialogo li strong { display:block; }
.ux-portal-instalar-ja-instalado { padding-top:20px; border-top:1px solid var(--gold); margin-bottom:0; }
@media(max-width:480px) {
  .ux-portal-instalar-dialogo { padding:20px; }
  .ux-portal-instalar-dialogo header { gap:12px; }
  .ux-portal-instalar-dialogo h2 { font-size:var(--texto-numeral-hero); }
}

.portal-diretorio-entrada{margin-top:28px;padding-top:24px;border-top:1px solid var(--borda);min-width:0}.portal-diretorio-entrada h2{font-size:1.4rem;margin:0 0 12px}.portal-diretorio-entrada p{font-size:1rem;line-height:1.6;color:var(--texto-suave,#4a5060)}.portal-diretorio-entrada a{display:inline-flex;align-items:center;min-height:44px;font-size:1rem;font-weight:700;text-underline-offset:4px}

.portal-diretorio-entrada a,
.portal-diretorio-entrada a:visited {
  color: var(--navy);
}
.portal-diretorio-entrada a:is(:hover,:focus-visible) {
  color: var(--gold-texto);
}