/* Portal público: tarefa primeiro, estado sempre legível, mobile first. */
.publico { background: var(--bg); }
.publico-cabecalho { align-items: center; background: var(--surface); border-bottom: 1px solid var(--border); display: flex; gap: 16px; justify-content: space-between; min-height: 64px; padding: 10px max(16px, calc((100vw - 1180px) / 2)); position: sticky; top: 0; z-index: 100; }
.publico-marca { align-items: center; color: var(--text); display: inline-flex; font-size: 1rem; font-weight: 700; gap: 9px; min-width: 0; text-decoration: none; }
.publico-marca small { color: var(--text-2); display: block; font-size: .68rem; font-weight: 500; }
.publico-marca-simbolo { align-items: center; background: var(--primary); border-radius: 8px; color: #fff; display: inline-flex; height: 34px; justify-content: center; width: 34px; }
.publico-marca-simbolo svg { fill: none; height: 22px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; width: 22px; }
.publico-cabecalho-acoes { align-items: center; display: flex; gap: 8px; }
.botao-tema-toggle { align-items: center; background: var(--surface-2); border: 1px solid var(--border); border-radius: 9px; color: var(--text-2); cursor: pointer; display: inline-flex; height: 44px; min-height: 44px; min-width: 44px; justify-content: center; padding: 0; transition: all .15s ease; width: 44px; }
.botao-tema-toggle:hover, .botao-tema-toggle:focus-visible { background: color-mix(in srgb, var(--primary) 12%, var(--surface)); border-color: color-mix(in srgb, var(--primary) 28%, var(--border)); color: var(--primary); outline: none; }
.botao-tema-toggle svg { fill: none; height: 20px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 20px; }
.publico-menu-botao { background: var(--surface); border: 1px solid var(--border); border-radius: 8px; color: var(--text); font: inherit; font-weight: 600; min-height: 44px; padding: 8px 14px; }
.publico-nav { align-items: center; display: flex; gap: 12px; justify-content: space-between; min-width: 0; width: 100%; }
.publico-nav-publica, .publico-nav-conta { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; }
.publico-nav a, .link-botao, .publico-area-restrita { background: transparent; border: 0; color: var(--text-2); display: inline-flex; align-items: center; font: inherit; min-height: 44px; padding: 10px 8px; text-decoration: none; border-radius: 8px; transition: color .15s ease, background .15s ease; }
.publico-nav a:hover, .publico-nav a:focus-visible, .link-botao:hover, .link-botao:focus-visible, .publico-area-restrita:hover, .publico-area-restrita:focus-visible { color: var(--primary-ink); }
.publico-nav[hidden] { display: none !important; }
.publico-conteudo { margin: 0 auto; max-width: 1180px; padding: 28px 16px 56px; }
.publico-rodape { border-top: 1px solid var(--border); color: var(--text-2); font-size: .82rem; padding: 22px 16px; text-align: center; }

.entrada-hero { display: grid; gap: 24px; margin-bottom: 48px; }
.entrada-apresentacao { align-content: center; display: grid; min-width: 0; }
.entrada-apresentacao h1 { font-size: 2.25rem; letter-spacing: -.035em; line-height: .98; margin: 0; max-width: 14ch; }
.entrada-resumo { color: var(--text-2); font-size: 1.05rem; line-height: 1.6; margin: 20px 0 0; max-width: 54ch; }
.entrada-protocolo { color: var(--primary-ink); font-weight: 700; margin-top: 20px; width: fit-content; }
.entrada-consulta { align-self: center; background: var(--surface); border: 1px solid var(--border); border-radius: calc(var(--radius) + 4px); box-shadow: 0 18px 48px color-mix(in srgb, var(--text) 8%, transparent); display: grid; gap: 18px; padding: 24px; }
.entrada-consulta h2 { font-size: 1.35rem; line-height: 1.2; margin: 0; }
.entrada-consulta-etapa { color: var(--primary-ink); font-size: .78rem; font-weight: 800; letter-spacing: .08em; margin: 0 0 6px; text-transform: uppercase; }
.entrada-consulta .botao { width: 100%; }
.entrada-consulta-ajuda { color: var(--text-2); font-size: .85rem; margin: 0; text-align: center; }
.entrada-informacoes { border-top: 1px solid var(--border); padding-top: 36px; }
.entrada-informacoes-cabecalho h2 { margin: 0 0 22px; }
.abas-publicas { display: none; }
.abas-publicas-lista { min-width: 0; }
.aba-publica-painel { min-width: 0; }
.informacoes-expansiveis { display: grid; gap: 10px; }
.informacoes-expansiveis details { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 0 18px; }
.informacoes-expansiveis summary { cursor: pointer; font-weight: 700; min-height: 44px; padding: 14px 0; }
.informacoes-expansiveis details > div { color: var(--text-2); padding: 0 0 18px; }
.lista-informativa { color: var(--text-2); display: grid; gap: 10px; padding-left: 20px; }

/* Entrada municipal: serviço público contemporâneo, acolhedor e orientado à tarefa. */
.entrada-hero-municipal { align-items: center; background: linear-gradient(125deg, color-mix(in srgb, var(--primary) 7%, var(--surface)) 0%, var(--surface) 65%); border: 1px solid var(--border); border-radius: 24px; box-shadow: 0 18px 60px rgba(21, 36, 26, .07); margin-bottom: 28px; overflow: hidden; padding: 28px; position: relative; }
.entrada-hero-municipal::before { background: color-mix(in srgb, var(--primary) 9%, transparent); border-radius: 50%; content: ""; height: 280px; left: -110px; position: absolute; top: -150px; width: 280px; }
.entrada-hero-municipal > * { position: relative; z-index: 1; }
.entrada-selo { align-items: center; color: var(--primary-ink); display: flex; font-size: .72rem; font-weight: 800; gap: 8px; letter-spacing: .09em; margin: 0 0 18px; text-transform: uppercase; }
.entrada-selo span { background: var(--primary); border-radius: 50%; box-shadow: 0 0 0 5px color-mix(in srgb, var(--primary) 13%, transparent); height: 7px; width: 7px; }
.entrada-hero-municipal .entrada-apresentacao h1 { font-size: clamp(2.45rem, 5.2vw, 4.35rem); letter-spacing: -.055em; line-height: .98; max-width: 11ch; }
.entrada-hero-municipal .entrada-resumo { font-size: 1rem; max-width: 56ch; }
.entrada-beneficios { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 22px; }
.entrada-beneficios span { align-items: center; color: var(--text-2); display: inline-flex; font-size: .83rem; font-weight: 650; gap: 7px; }
.entrada-beneficios svg, .entrada-consulta-ajuda svg { fill: none; height: 17px; stroke: var(--primary); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 17px; }
.entrada-hero-municipal .entrada-protocolo { align-items: center; display: inline-flex; gap: 8px; margin-top: 24px; text-decoration: none; }
.entrada-hero-municipal .entrada-protocolo:hover span { transform: translateX(3px); }
.entrada-hero-municipal .entrada-protocolo span { transition: transform .15s var(--ease); }
.entrada-consulta-municipal { border-radius: 18px; box-shadow: 0 22px 55px rgba(21, 36, 26, .14); padding: 24px; }
.entrada-consulta-cabecalho { align-items: center; display: flex; gap: 13px; }
.entrada-consulta-cabecalho h2 { font-size: 1.25rem; }
.entrada-consulta-icone { align-items: center; background: color-mix(in srgb, var(--primary) 11%, var(--surface)); border-radius: 12px; color: var(--primary); display: flex; flex: 0 0 auto; height: 46px; justify-content: center; width: 46px; }
.entrada-consulta-icone svg { fill: none; height: 25px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.65; width: 25px; }
.entrada-consulta-botao { justify-content: space-between; }
.entrada-consulta-ajuda { align-items: center; display: flex; gap: 7px; line-height: 1.4; }
.entrada-consulta-ajuda svg { flex: 0 0 auto; }
.entrada-como-funciona { background: var(--surface); border: 1px solid var(--border); border-radius: 20px; margin-bottom: 28px; padding: 26px; }
.entrada-como-funciona header h2 { font-size: clamp(1.45rem, 3vw, 2rem); margin: 0; }
.entrada-passos { display: grid; gap: 12px; list-style: none; margin: 24px 0 0; padding: 0; }
.entrada-passos li { align-items: flex-start; background: var(--surface-2); border: 1px solid transparent; border-radius: 14px; display: flex; gap: 14px; padding: 17px; transition: border-color .15s var(--ease), transform .15s var(--ease); }
.entrada-passos li:hover { border-color: color-mix(in srgb, var(--primary) 28%, var(--border)); transform: translateY(-2px); }
.entrada-passos li > span { align-items: center; background: var(--primary); border-radius: 9px; color: #fff; display: flex; flex: 0 0 auto; font-size: .7rem; font-weight: 800; height: 34px; justify-content: center; width: 34px; }
.entrada-passos strong { display: block; font-size: .95rem; }
.entrada-passos p { color: var(--text-2); font-size: .84rem; line-height: 1.45; margin: 4px 0 0; }
.entrada-informacoes { background: var(--surface); border: 1px solid var(--border); border-radius: 20px; padding: 26px; }
.entrada-informacoes-cabecalho h2 { font-size: clamp(1.4rem, 3vw, 1.8rem); margin: 0 0 22px; }

.portal-abertura { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); display: grid; gap: 24px; margin-bottom: 40px; padding: 24px; }
.portal-abertura h1, .pagina-formulario h1, .cabecalho-pagina h1 { font-size: clamp(1.9rem, 4vw, 3rem); line-height: 1.1; margin: 0 0 12px; max-width: 18ch; }
.portal-abertura p, .texto-introdutorio, .cabecalho-pagina p { color: var(--text-2); max-width: 62ch; }
.regra-dia { align-self: end; border: 1px solid var(--border); border-radius: var(--radius); display: grid; gap: 4px; padding: 18px; }
.regra-dia strong { color: var(--primary-ink); font-size: 1.15rem; }
.regra-dia span { color: var(--text-2); font-size: .9rem; }
.secao-espacos h2, .resultado-disponibilidade h2 { font-size: 1.35rem; margin-bottom: 18px; }
.spaces-list { display: grid; gap: 20px; }
.cartao-espaco { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); display: flex; flex-direction: column; height: 100%; overflow: hidden; }
.cartao-espaco-capa { aspect-ratio: 16 / 9; align-items: center; background: var(--surface-2); color: var(--primary-ink); display: flex; font-size: 1.25rem; font-weight: 700; height: auto; justify-content: center; overflow: hidden; }
.cartao-espaco-capa img { aspect-ratio: 16 / 9; height: 100%; object-fit: cover; width: 100%; }
.cartao-espaco-corpo { display: flex; flex-direction: column; flex: 1 1 auto; gap: 10px; padding: 20px; }
.cartao-espaco-corpo > .botao { margin-top: auto; }
.cartao-espaco h3, .reserva-linha h2, .resumo-reserva h2 { font-size: 1.1rem; margin: 0; }
.cartao-espaco p { margin: 0; }
.situacao-disponibilidade { color: var(--success); font-size: .82rem; font-weight: 800; }
.cartao-espaco-localizacao, .texto-secundario { color: var(--text-2); font-size: .9rem; }
.botao { align-items: center; border: 1px solid transparent; border-radius: 8px; cursor: pointer; display: inline-flex; font: inherit; font-weight: 600; justify-content: center; min-height: 44px; padding: 9px 16px; text-decoration: none; transition: background-color .15s var(--ease), border-color .15s var(--ease), color .15s var(--ease); }
.botao-principal { background: var(--primary); color: #fff; }
.botao-principal:hover, .botao-principal:focus-visible { background: var(--primary-ink); color: #fff; }
.botao-secundario { background: var(--surface); border-color: var(--border); color: var(--text); }
.botao-secundario:hover, .botao-secundario:focus-visible { border-color: var(--primary); color: var(--primary-ink); }
.botao-perigo { background: transparent; border-color: var(--error); color: var(--error); }
.botao-perigo:hover, .botao-perigo:focus-visible { background: var(--error); color: #fff; }
.botao-link { color: var(--primary-ink); }
.botao-pequeno { min-height: 40px; padding: 7px 12px; }
.pagina-formulario { margin: 0 auto; max-width: 560px; }
.auth-page { align-items: stretch; display: grid; gap: 24px; margin: 8px auto 0; max-width: 1080px; }
.auth-apresentacao { background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 12%, var(--surface)) 0%, var(--surface) 70%); border: 1px solid var(--border); border-radius: 22px; display: flex; flex-direction: column; min-height: 100%; overflow: hidden; padding: 28px; position: relative; }
.auth-apresentacao::after { background: color-mix(in srgb, var(--primary) 9%, transparent); border-radius: 50%; bottom: -112px; content: ""; height: 270px; position: absolute; right: -95px; width: 270px; }
.auth-apresentacao > * { position: relative; z-index: 1; }
.auth-apresentacao .caminho { margin-bottom: 38px; text-decoration: none; width: fit-content; }
.auth-sobrelinha { color: var(--primary-ink); font-size: .72rem; font-weight: 850; letter-spacing: .1em; margin: 0 0 14px; text-transform: uppercase; }
.auth-apresentacao h1 { font-size: clamp(2.15rem, 5vw, 3.55rem); letter-spacing: -.05em; line-height: 1; margin: 0; max-width: 11ch; }
.auth-apresentacao > p:not(.auth-sobrelinha) { color: var(--text-2); line-height: 1.6; margin: 18px 0 0; max-width: 48ch; }
.auth-beneficios, .auth-passos { display: grid; gap: 12px; list-style: none; margin: 30px 0; padding: 0; }
.auth-beneficios li { align-items: center; color: var(--text-2); display: flex; font-size: .9rem; gap: 10px; }
.auth-beneficios span { align-items: center; background: var(--primary); border-radius: 50%; color: #fff; display: inline-flex; flex: 0 0 auto; font-size: .7rem; font-weight: 900; height: 20px; justify-content: center; width: 20px; }
.auth-passos li { align-items: flex-start; display: flex; gap: 12px; }
.auth-passos li > span { align-items: center; background: color-mix(in srgb, var(--primary) 12%, var(--surface)); border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--border)); border-radius: 9px; color: var(--primary-ink); display: inline-flex; flex: 0 0 auto; font-size: .76rem; font-weight: 800; height: 31px; justify-content: center; width: 31px; }
.auth-passos strong, .auth-passos small { display: block; }
.auth-passos strong { font-size: .9rem; }
.auth-passos small { color: var(--text-2); font-size: .82rem; line-height: 1.4; margin-top: 3px; }
.auth-ajuda { border-top: 1px solid var(--border); display: grid; gap: 4px; margin-top: auto; padding-top: 19px; }
.auth-ajuda strong { color: var(--primary-ink); font-size: .88rem; }
.auth-ajuda span { color: var(--text-2); font-size: .84rem; line-height: 1.45; }
.auth-card { align-self: center; background: var(--surface); border: 1px solid var(--border); border-radius: 22px; box-shadow: 0 22px 58px rgba(21, 36, 26, .10); padding: 26px; width: 100%; }
.auth-card-cabecalho { align-items: center; display: flex; gap: 13px; }
.auth-icone { align-items: center; background: color-mix(in srgb, var(--primary) 11%, var(--surface)); border-radius: 13px; color: var(--primary); display: flex; flex: 0 0 auto; height: 48px; justify-content: center; width: 48px; }
.auth-icone svg { fill: none; height: 25px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; width: 25px; }
.auth-card-cabecalho p { color: var(--primary-ink); font-size: .7rem; font-weight: 850; letter-spacing: .09em; margin: 0; text-transform: uppercase; }
.auth-card-cabecalho h2 { font-size: 1.35rem; margin: 3px 0 0; }
.auth-descricao { color: var(--text-2); font-size: .87rem; line-height: 1.45; margin: 18px 0 0; }
.auth-formulario { border: 0; border-radius: 0; box-shadow: none; gap: 16px; margin: 21px 0 0; padding: 0; }
.auth-campo { gap: 7px; }
.auth-campo label { color: var(--text); font-size: .87rem; font-weight: 700; }
.auth-campo input { border-radius: 10px; min-height: 48px; padding: 11px 13px; }
.auth-campo input::placeholder { color: color-mix(in srgb, var(--text-2) 72%, transparent); }
.auth-campo.campo-com-erro input { border-color: var(--error); }
.auth-submit { gap: 10px; margin-top: 5px; min-height: 48px; width: 100%; }
.auth-submit span { font-size: 1.15rem; transition: transform .15s var(--ease); }
.auth-submit:hover span { transform: translateX(3px); }
.auth-links { color: var(--text-2); font-size: .87rem; margin-top: 20px; text-align: center; }
.auth-links p { margin: 14px 0 0; }
.auth-links a { color: var(--primary-ink); font-weight: 750; }
.auth-termos { color: var(--text-2); font-size: .76rem; line-height: 1.45; margin: 18px 0 0; text-align: center; }
.auth-consent { align-items: flex-start; background: color-mix(in srgb, var(--primary) 5%, var(--surface)); border: 1px solid var(--border); border-radius: 12px; display: grid; gap: 10px; grid-template-columns: 20px minmax(0, 1fr); padding: 14px; }
.auth-consent input { accent-color: var(--primary); height: 18px; margin: 2px 0 0; width: 18px; }
.auth-consent label { color: var(--text-2); cursor: pointer; font-size: .78rem; font-weight: 500; line-height: 1.48; }
.auth-consent .erro-campo { grid-column: 1 / -1; }
.auth-consent.campo-com-erro { border-color: var(--error); }
.caminho { color: var(--text-2); font-size: .88rem; margin: 0 0 20px; }
.caminho a { color: var(--primary-ink); }
.formulario { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); display: grid; gap: 18px; margin-top: 24px; padding: 22px; }
.campo { display: grid; gap: 6px; }
.campo label { font-weight: 600; }
.campo input, .campo select { background: var(--surface-2); border: 1px solid var(--border); border-radius: 7px; color: var(--text); font: inherit; min-height: 44px; padding: 9px 11px; width: 100%; }
.campo input:focus, .campo select:focus { border-color: var(--primary); outline: 3px solid color-mix(in srgb, var(--primary) 28%, transparent); }
.erro-campo { color: var(--error); font-size: .88rem; margin: 0; }
.ajuda-formulario { color: var(--text-2); margin: 18px 0 0; }
.filtro-data { align-items: end; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); display: grid; gap: 12px; margin: 24px 0; padding: 16px; }
.resultado-disponibilidade { margin-top: 28px; }
.estado-vazio { background: var(--surface); border: 1px dashed var(--border); border-radius: var(--radius); padding: 28px 20px; text-align: center; }
.estado-vazio h2, .estado-vazio h3 { margin-top: 0; }
.estado-vazio p { color: var(--text-2); }
.cabecalho-pagina { align-items: flex-start; display: flex; gap: 20px; justify-content: space-between; margin-bottom: 24px; }
.cabecalho-pagina > .botao { flex: 0 0 auto; }
.minhas-reservas-page { margin: 0 auto; max-width: 1040px; }
.minhas-reservas-hero { align-items: stretch; background: linear-gradient(125deg, color-mix(in srgb, var(--primary) 9%, var(--surface)) 0%, var(--surface) 68%); border: 1px solid var(--border); border-radius: 23px; display: grid; gap: 24px; margin: 8px 0 28px; overflow: hidden; padding: 28px; position: relative; }
.minhas-reservas-hero::after { background: color-mix(in srgb, var(--primary) 9%, transparent); border-radius: 50%; content: ""; height: 250px; position: absolute; right: -125px; top: -125px; width: 250px; }
.minhas-reservas-hero > * { position: relative; z-index: 1; }
.minhas-reservas-hero .caminho { margin-bottom: 24px; }
.minhas-reservas-sobrelinha, .minhas-reservas-titulo-lista > div > p, .estado-vazio-sobrelinha { align-items: center; color: var(--primary-ink); display: flex; font-size: .7rem; font-weight: 850; gap: 7px; letter-spacing: .1em; margin: 0 0 12px; text-transform: uppercase; }
.minhas-reservas-sobrelinha span { color: var(--primary); font-size: .62rem; }
.minhas-reservas-hero h1 { font-size: clamp(2.35rem, 5vw, 3.6rem); letter-spacing: -.055em; line-height: .98; margin: 0; }
.minhas-reservas-hero-conteudo > p:last-child { color: var(--text-2); line-height: 1.55; margin: 16px 0 0; max-width: 58ch; }
.minhas-reservas-hero-acao { align-items: flex-start; background: var(--surface); border: 1px solid var(--border); border-radius: 17px; box-shadow: 0 12px 30px rgba(21, 36, 26, .08); display: grid; gap: 7px; padding: 20px; }
.minhas-reservas-hero-acao strong { font-size: 1rem; }
.minhas-reservas-hero-acao > span:not(.minhas-reservas-hero-icone) { color: var(--text-2); font-size: .83rem; line-height: 1.45; }
.minhas-reservas-hero-acao .botao { gap: 9px; justify-content: space-between; margin-top: 11px; width: 100%; }
.minhas-reservas-hero-icone { align-items: center; background: color-mix(in srgb, var(--primary) 11%, var(--surface)); border-radius: 11px; color: var(--primary); display: flex; height: 42px; justify-content: center; margin-bottom: 4px; width: 42px; }
.minhas-reservas-hero-icone svg, .estado-vazio-reservas-icone svg { fill: none; height: 23px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.75; width: 23px; }
.minhas-reservas-conteudo { background: color-mix(in srgb, var(--primary) 4%, var(--surface)); border: 1px solid var(--border); border-radius: 19px; box-shadow: 0 10px 32px rgba(21, 36, 26, .05); padding: 12px; }
.minhas-reservas-titulo-lista { align-items: center; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; display: flex; gap: 16px; justify-content: space-between; padding: 19px 20px; }
.minhas-reservas-titulo-lista > div > p { font-size: .67rem; margin-bottom: 5px; }
.minhas-reservas-titulo-lista h2 { font-size: 1.22rem; margin: 0; }
.minhas-reservas-titulo-lista > span { background: color-mix(in srgb, var(--primary) 9%, var(--surface)); border-radius: 999px; color: var(--primary-ink); font-size: .78rem; font-weight: 750; padding: 7px 11px; }
.lista-reservas-moderna { gap: 11px; margin-top: 11px; }
.reserva-linha-moderna { align-items: center; background: var(--surface); border: 1px solid var(--border); border-radius: 15px; box-shadow: 0 5px 15px rgba(21, 36, 26, .035); grid-template-columns: auto 84px minmax(0, 1fr); padding: 19px 20px; transition: border-color .18s var(--ease), box-shadow .18s var(--ease), transform .18s var(--ease); }
.reserva-linha-moderna:hover { border-color: color-mix(in srgb, var(--primary) 30%, var(--border)); box-shadow: 0 10px 22px rgba(21, 36, 26, .07); transform: translateY(-1px); }
.reserva-data-destaque { align-items: center; background: color-mix(in srgb, var(--primary) 9%, var(--surface)); border-radius: 13px; color: var(--primary-ink); display: flex; flex-direction: column; height: 66px; justify-content: center; line-height: 1; width: 62px; }
.reserva-data-destaque strong { font-size: 1.45rem; letter-spacing: -.04em; }
.reserva-data-destaque span { font-size: .66rem; font-weight: 850; margin-top: 3px; text-transform: uppercase; }
.reserva-data-destaque small { color: var(--text-2); font-size: .6rem; margin-top: 3px; }
.reserva-imagem { align-items: center; background: color-mix(in srgb, var(--primary) 8%, var(--surface)); border: 1px solid color-mix(in srgb, var(--primary) 13%, var(--border)); border-radius: 12px; color: var(--primary); display: flex; height: 68px; justify-content: center; overflow: hidden; width: 84px; }
.reserva-imagem img { height: 100%; object-fit: cover; width: 100%; }
.reserva-imagem svg { fill: none; height: 28px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.55; width: 28px; }
.reserva-informacoes h2 { font-size: 1.07rem; margin: 3px 0; }
.reserva-informacoes .data-reserva { color: var(--text-2); font-size: .83rem; }
.reserva-tipo { color: var(--primary-ink); font-size: .67rem; font-weight: 850; letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.reserva-linha-moderna .link-protocolo { font-size: .78rem; font-weight: 700; margin-top: 9px; text-decoration: none; }
.reserva-linha-moderna .link-protocolo span { display: inline-block; transition: transform .15s var(--ease); }
.reserva-linha-moderna .link-protocolo:hover span { transform: translate(2px, -2px); }
.reserva-situacao { align-self: center; }
.reserva-situacao .texto-secundario { line-height: 1.4; margin: 8px 0 0; max-width: 30ch; }
.botao-cancelar-reserva { align-self: center; font-size: .82rem; min-height: 38px; padding: 7px 11px; }
.estado-vazio-reservas { background: var(--surface); border: 1px dashed var(--border); border-radius: 15px; padding: 56px 24px; }
.estado-vazio-reservas-icone { align-items: center; background: color-mix(in srgb, var(--primary) 10%, var(--surface)); border-radius: 16px; color: var(--primary); display: inline-flex; height: 58px; justify-content: center; margin-bottom: 16px; width: 58px; }
.estado-vazio-reservas .estado-vazio-sobrelinha { justify-content: center; }
.estado-vazio-reservas h2 { font-size: 1.38rem; }
.estado-vazio-reservas p:not(.estado-vazio-sobrelinha) { margin: 8px auto 20px; max-width: 42ch; }
.estado-vazio-reservas .botao { gap: 9px; }
.lista-reservas { display: grid; gap: 12px; }
.reserva-linha { align-items: center; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); display: grid; gap: 14px; padding: 18px; }
.reserva-linha p { margin: 4px 0 0; }
.data-reserva { color: var(--text-2); }
.status { border-radius: 999px; display: inline-block; font-size: .82rem; font-weight: 700; padding: 4px 9px; }
.status-confirmada { background: color-mix(in srgb, var(--success) 14%, var(--surface)); color: var(--success); }
.status-aguardando_analise { background: color-mix(in srgb, var(--warning) 15%, var(--surface)); color: var(--warning); }
.status-recusada { background: color-mix(in srgb, var(--error) 14%, var(--surface)); color: var(--error); }
.status-cancelada_pelo_cidadao, .status-cancelada_pela_administracao, .status-cancelada_por_indisponibilidade { background: color-mix(in srgb, var(--error) 14%, var(--surface)); color: var(--error); }
.mensagens { display: grid; gap: 10px; margin-bottom: 20px; }
.mensagem { border: 1px solid var(--border); border-radius: 8px; padding: 12px 14px; }
.mensagem-success { border-color: var(--success); color: var(--success); }
.mensagem-error { border-color: var(--error); color: var(--error); }
.mensagem-info { border-color: var(--info); color: var(--info); }
.resumo-reserva { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); margin: 24px 0; padding: 18px; }
.resumo-reserva p { margin: 6px 0 0; }
.acoes-formulario { display: flex; flex-wrap: wrap; gap: 10px; }
.reserva-em-processamento { overflow: hidden; }
.reserva-loading[hidden] { display: none; }
.reserva-loading { align-items: center; background: rgba(10, 28, 18, .55); backdrop-filter: blur(5px); display: flex; inset: 0; justify-content: center; padding: 24px; position: fixed; z-index: 9999; }
.reserva-loading-card { align-items: center; background: var(--surface); border: 1px solid var(--border); border-radius: calc(var(--radius) + 6px); box-shadow: 0 24px 70px rgba(0, 0, 0, .2); display: flex; flex-direction: column; max-width: 390px; padding: 34px 28px; text-align: center; width: 100%; }
.reserva-loading-card strong { font-size: 1.08rem; margin-top: 18px; }
.reserva-loading-card p { color: var(--text-2); line-height: 1.5; margin: 7px 0 0; }
.reserva-spinner { animation: reserva-girar .75s linear infinite; border: 4px solid color-mix(in srgb, var(--primary) 18%, var(--surface)); border-radius: 50%; border-top-color: var(--primary); height: 46px; width: 46px; }
.botao:disabled { cursor: wait; opacity: .72; }
@keyframes reserva-girar { to { transform: rotate(360deg); } }
.resultado-protocolo { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); margin: 28px auto 0; max-width: 560px; padding: 22px; }
.resultado-protocolo h2 { margin-top: 0; }
.resultado-protocolo dl { display: grid; gap: 14px; margin: 20px 0 0; }
.resultado-protocolo dl > div { display: grid; gap: 4px; }
.resultado-protocolo dt { color: var(--text-2); font-size: .82rem; font-weight: 700; }
.resultado-protocolo dd { margin: 0; }
.protocolo-publico { color: var(--primary-ink); font-family: var(--font-mono, monospace); font-weight: 700; letter-spacing: .04em; }
.link-protocolo { color: var(--primary-ink); display: inline-block; font-size: .88rem; margin-top: 6px; }
.sr-only { height: 1px; margin: -1px; overflow: hidden; position: absolute; width: 1px; clip: rect(0, 0, 0, 0); }

/* Revisão e acompanhamento seguem a mesma linguagem do portal municipal. */
.fluxo-reserva, .pagina-protocolo { align-items: center; display: grid; gap: 28px; margin: 12px auto 0; max-width: 1040px; }
.fluxo-reserva-intro h1, .protocolo-apresentacao h1 { font-size: clamp(2.25rem, 5vw, 3.65rem); letter-spacing: -.05em; line-height: 1; margin: 0 0 18px; max-width: 12ch; }
.fluxo-garantias { display: grid; gap: 14px; margin-top: 28px; }
.fluxo-garantias > div { align-items: flex-start; display: flex; gap: 12px; }
.fluxo-garantias svg { background: color-mix(in srgb, var(--primary) 10%, var(--surface)); border-radius: 10px; fill: none; flex: 0 0 auto; height: 38px; padding: 9px; stroke: var(--primary); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 38px; }
.fluxo-garantias strong, .fluxo-garantias small { display: block; }
.fluxo-garantias strong { font-size: .9rem; }
.fluxo-garantias small { color: var(--text-2); line-height: 1.4; margin-top: 2px; }
.formulario-confirmacao { border-radius: 20px; box-shadow: 0 22px 55px rgba(21, 36, 26, .11); margin: 0; padding: 25px; }
.formulario-confirmacao-topo, .protocolo-formulario header { align-items: center; border-bottom: 1px solid var(--border); display: flex; gap: 13px; padding-bottom: 18px; }
.formulario-confirmacao-topo > span, .protocolo-formulario-icone { align-items: center; background: color-mix(in srgb, var(--primary) 11%, var(--surface)); border-radius: 12px; color: var(--primary); display: flex; flex: 0 0 auto; height: 46px; justify-content: center; width: 46px; }
.formulario-confirmacao-topo svg, .protocolo-formulario-icone svg { fill: none; height: 25px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; width: 25px; }
.formulario-confirmacao-topo p, .protocolo-formulario header p { color: var(--primary-ink); font-size: .7rem; font-weight: 800; letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.formulario-confirmacao-topo h2, .protocolo-formulario header h2 { font-size: 1.3rem; margin: 1px 0 0; }
.formulario-confirmacao-campos { display: grid; gap: 13px; }
.termos-reserva-aceite { align-items: start; background: color-mix(in srgb, var(--primary) 5%, var(--surface)); border: 1px solid var(--border); border-radius: 12px; display: grid; gap: 6px 10px; grid-template-columns: 20px minmax(0, 1fr); padding: 13px 14px; }
.termos-reserva-aceite input { accent-color: var(--primary); height: 18px; margin: 2px 0 0; width: 18px; }
.termos-reserva-aceite label { color: var(--text); cursor: pointer; font-size: .8rem; font-weight: 700; line-height: 1.35; }
.termos-reserva-aceite a { color: var(--primary-ink); font-size: .78rem; font-weight: 800; grid-column: 2; text-underline-offset: 3px; width: fit-content; }
.termos-reserva-aceite .erro-campo { grid-column: 1 / -1; }
.termos-reserva-aceite.campo-com-erro { box-shadow: inset 0 0 0 1px var(--error); }
.pagina-termos { margin: 8px auto; max-width: 880px; }
.pagina-termos-cabecalho { background: linear-gradient(120deg, color-mix(in srgb, var(--primary) 11%, var(--surface)), var(--surface)); border: 1px solid var(--border); border-radius: 21px 21px 0 0; padding: 30px 34px; }
.pagina-termos-cabecalho > p:not(.caminho) { color: var(--primary-ink); font-size: .7rem; font-weight: 850; letter-spacing: .1em; margin: 18px 0 8px; text-transform: uppercase; }
.pagina-termos-cabecalho h1 { font-size: clamp(2rem, 5vw, 3rem); line-height: 1.05; margin: 0; }
.pagina-termos-cabecalho span { color: var(--text-2); display: block; line-height: 1.55; margin-top: 11px; }
.pagina-termos-conteudo { background: var(--surface); border: 1px solid var(--border); border-radius: 0 0 21px 21px; border-top: 0; color: var(--text-2); font-size: .91rem; line-height: 1.62; padding: 30px 34px; }
.pagina-termos-conteudo h3 { color: var(--text); font-size: 1.22rem; margin: 0 0 10px; }
.pagina-termos-conteudo h4 { color: var(--text); font-size: 1rem; margin: 26px 0 8px; }
.pagina-termos-conteudo p { margin: 0; }
.pagina-termos-conteudo ol, .pagina-termos-conteudo ul { display: grid; gap: 12px; margin: 16px 0 0; padding-left: 24px; }
.campo-confirmacao-resumo{background:var(--surface-2);border:1px solid var(--border);border-radius:14px;display:grid;gap:14px;padding:16px}
.resumo-item{display:grid;gap:4px}
.resumo-rotulo{color:var(--text-2);font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.resumo-valor-destaque{color:var(--text);font-size:1.25rem;font-weight:800;line-height:1.2;margin:0}
.resumo-subtexto{color:var(--text-2);font-size:.875rem}
.resumo-grade{display:grid;gap:12px;grid-template-columns:1fr 1fr}
.resumo-valor{align-items:center;color:var(--text);display:flex;font-size:1rem;font-weight:700;gap:6px;margin:0}
.resumo-valor svg{fill:none;flex:0 0 auto;height:18px;stroke:var(--primary);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8;width:18px}
.resumo-acoes{border-top:1px dashed var(--border);padding-top:10px}
.link-trocar-opcao{align-items:center;color:var(--primary);display:inline-flex;font-size:.85rem;font-weight:700;gap:4px;text-decoration:none}
.link-trocar-opcao:hover,.link-trocar-opcao:focus-visible{text-decoration:underline}
.link-trocar-opcao svg{fill:none;height:14px;stroke:currentColor;stroke-width:2.2;width:14px}
@media (max-width:480px){.resumo-grade{grid-template-columns:1fr}}
.formulario-confirmacao-aviso { align-items: flex-start; background: color-mix(in srgb, var(--info) 7%, var(--surface)); border-radius: 11px; color: var(--text-2); display: flex; font-size: .8rem; gap: 9px; padding: 12px; }
.formulario-confirmacao-aviso svg { fill: none; flex: 0 0 auto; height: 18px; stroke: var(--info); stroke-linecap: round; stroke-width: 1.8; width: 18px; }
.formulario-confirmacao-aviso p { line-height: 1.45; margin: 0; }
.formulario-confirmacao-botao { justify-content: space-between; }
.pagina-protocolo { background: linear-gradient(125deg, color-mix(in srgb, var(--primary) 7%, var(--surface)), var(--surface)); border: 1px solid var(--border); border-radius: 24px; padding: 28px; }
.protocolo-formulario { border-radius: 18px; box-shadow: 0 18px 45px rgba(21, 36, 26, .11); margin: 0; }
.protocolo-campo input { font-family: var(--font-mono, monospace); font-size: 1.02rem; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
.protocolo-formulario .botao { justify-content: space-between; }
.protocolo-formulario .entrada-consulta-ajuda { display: block; line-height: 1.45; text-align: center; }
.protocolo-formulario .entrada-consulta-ajuda strong { white-space: nowrap; }
.resultado-protocolo-moderno { border-radius: 20px; box-shadow: 0 15px 45px rgba(21, 36, 26, .08); margin-top: 24px; max-width: 1040px; padding: 26px; }
.resultado-protocolo-moderno > header { align-items: center; border-bottom: 1px solid var(--border); display: flex; gap: 16px; justify-content: space-between; padding-bottom: 18px; }
.resultado-protocolo-moderno > header h2 { margin: 0; }
.resultado-protocolo-moderno dl { grid-template-columns: 1fr; }
.resultado-protocolo-moderno dl > div { background: var(--surface-2); border-radius: 12px; padding: 15px; }
.resultado-protocolo-moderno .resultado-protocolo-destaque { grid-column: 1 / -1; }
.resultado-protocolo-moderno dd small { color: var(--text-2); display: block; font-size: .78rem; margin-top: 3px; }
.resultado-protocolo-moderno > footer { align-items: center; border-top: 1px solid var(--border); display: flex; gap: 14px; justify-content: space-between; margin-top: 18px; padding-top: 18px; }
.resultado-protocolo-acoes { display: flex; flex-wrap: wrap; gap: 9px; }
.autenticidade-reserva { background: var(--surface); border: 1px solid var(--border); border-radius: 22px; box-shadow: 0 18px 55px rgba(21,36,26,.08); margin: 12px auto; max-width: 980px; overflow: hidden; padding: 28px; }
.autenticidade-reserva > header { align-items: flex-start; border-bottom: 1px solid var(--border); display: flex; gap: 16px; padding-bottom: 24px; }
.autenticidade-reserva h1 { font-size: clamp(1.8rem,4vw,2.7rem); line-height: 1.05; margin: 2px 0 8px; }
.autenticidade-reserva header p:last-child { color: var(--text-2); margin: 0; }
.autenticidade-check { align-items:center;background:color-mix(in srgb,var(--success) 13%,var(--surface));border-radius:50%;color:var(--success);display:flex;flex:0 0 auto;font-size:1.4rem;font-weight:900;height:48px;justify-content:center;width:48px; }
.autenticidade-reserva-grid { display:grid;gap:22px;margin-top:24px; }
.autenticidade-reserva dl { display:grid;gap:10px;margin:0; }
.autenticidade-reserva dl div { background:var(--surface-2);border-radius:11px;padding:13px; }
.autenticidade-reserva dt { color:var(--text-2);font-size:.72rem;font-weight:750;text-transform:uppercase; }
.autenticidade-reserva dd { font-weight:700;margin:3px 0 0; }
.autenticidade-reserva dd small { color:var(--text-2);display:block;font-size:.76rem;font-weight:500;margin-top:2px; }
.autenticidade-reserva aside { background:color-mix(in srgb,var(--primary) 6%,var(--surface));border:1px solid var(--border);border-radius:14px;padding:18px; }
.autenticidade-reserva aside code { display:block;font-size:.73rem;overflow-wrap:anywhere; }
.autenticidade-reserva aside p:not(.entrada-consulta-etapa), .autenticidade-reserva aside small { color:var(--text-2);font-size:.8rem;line-height:1.5; }
.autenticidade-reserva > footer { display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;margin-top:24px; }

/* Disponibilidade: busca curta, resultado escaneável e ação evidente. */
.pagina-disponibilidade { --disponibilidade-sombra: 0 18px 48px color-mix(in srgb, var(--text) 8%, transparent); }
.disponibilidade-hero { align-items: center; background: linear-gradient(125deg, color-mix(in srgb, var(--primary) 8%, var(--surface)) 0%, var(--surface) 68%); border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--border)); border-radius: calc(var(--radius) + 5px); overflow: hidden; padding: 24px 28px; position: relative; }
.disponibilidade-hero::after { background: color-mix(in srgb, var(--primary) 6%, transparent); border-radius: 50%; content: ""; height: 150px; position: absolute; right: -55px; top: -85px; width: 150px; }
.disponibilidade-hero > div:first-child { position: relative; z-index: 1; }
.disponibilidade-hero .caminho { margin-bottom: 14px; }
.disponibilidade-hero h1 { font-size: clamp(1.75rem, 3vw, 2.35rem); letter-spacing: -.035em; max-width: none; }
.disponibilidade-hero > div > p:last-child { font-size: .94rem; line-height: 1.5; margin-bottom: 0; max-width: 70ch; }
.disponibilidade-etapa { align-items: center; color: var(--primary-ink) !important; display: flex; font-size: .7rem !important; font-weight: 800; gap: 7px; letter-spacing: .08em; margin: 0 0 8px; text-transform: uppercase; }
.disponibilidade-etapa span { align-items: center; background: var(--primary); border-radius: 50%; color: #fff; display: inline-flex; font-size: .6rem; height: 22px; justify-content: center; letter-spacing: 0; width: 22px; }
.disponibilidade-ilustracao { align-items: center; background: color-mix(in srgb, var(--primary) 10%, var(--surface)); border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--border)); border-radius: 20px; color: var(--primary); display: none; height: 82px; justify-content: center; transform: rotate(3deg); width: 82px; z-index: 1; }
.disponibilidade-ilustracao svg { height: 42px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; width: 42px; }

.pagina-disponibilidade .filtro-data { align-items: center; border-radius: calc(var(--radius) + 4px); box-shadow: 0 10px 30px color-mix(in srgb, var(--text) 7%, transparent); gap: 14px; margin: 14px auto 28px; max-width: 920px; padding: 16px 18px; position: relative; z-index: 2; }
.filtro-data-icone { align-items: center; background: color-mix(in srgb, var(--primary) 11%, var(--surface)); border-radius: 12px; color: var(--primary-ink); display: none; height: 48px; justify-content: center; width: 48px; }
.filtro-data-icone svg, .pagina-disponibilidade .botao svg, .resultado-data svg, .cartao-espaco-detalhes svg { fill: none; flex: 0 0 auto; height: 19px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 19px; }
.pagina-disponibilidade .filtro-data .campo { gap: 5px; }
.pagina-disponibilidade .filtro-data label { font-size: .82rem; }
.pagina-disponibilidade .filtro-data input { background: var(--surface); font-weight: 650; }
.pagina-disponibilidade .filtro-data .botao { gap: 9px; white-space: nowrap; }

.resultado-cabecalho { align-items: end; display: flex; gap: 18px; justify-content: space-between; margin-bottom: 16px; }
.resultado-disponibilidade .resultado-cabecalho h2 { font-size: clamp(1.35rem, 3vw, 1.7rem); margin: 2px 0 0; }
.resultado-legenda { color: var(--primary-ink); font-size: .72rem; font-weight: 800; letter-spacing: .09em; margin: 0; text-transform: uppercase; }
.resultado-data { align-items: center; background: var(--surface); border: 1px solid var(--border); border-radius: 999px; color: var(--text-2); display: flex; font-size: .86rem; font-weight: 700; gap: 7px; margin: 0; padding: 8px 13px; }
.pagina-disponibilidade .spaces-list { gap: 24px; }
.pagina-disponibilidade .cartao-espaco { border-radius: calc(var(--radius) + 5px); box-shadow: 0 8px 28px color-mix(in srgb, var(--text) 6%, transparent); transition: border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease); }
.pagina-disponibilidade .cartao-espaco:hover { border-color: color-mix(in srgb, var(--primary) 35%, var(--border)); box-shadow: var(--disponibilidade-sombra); transform: translateY(-3px); }
.pagina-disponibilidade .cartao-espaco-capa { position: relative; }
.pagina-disponibilidade .cartao-espaco-capa::after { background: linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, .3)); bottom: 0; content: ""; left: 0; pointer-events: none; position: absolute; right: 0; top: 0; }
.pagina-disponibilidade .situacao-disponibilidade { align-items: center; backdrop-filter: blur(8px); background: rgba(255, 255, 255, .94); border-radius: 999px; bottom: 14px; box-shadow: 0 4px 15px rgba(0, 0, 0, .12); display: flex; gap: 7px; left: 14px; padding: 7px 11px; position: absolute; z-index: 1; }
.pagina-disponibilidade .situacao-disponibilidade span { background: var(--success); border-radius: 50%; box-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 15%, transparent); height: 7px; width: 7px; }
.pagina-disponibilidade .cartao-espaco-corpo { gap: 12px; padding: 22px; }
.pagina-disponibilidade .cartao-espaco h3 { font-size: 1.3rem; letter-spacing: -.02em; }
.cartao-espaco-tipo { color: var(--primary-ink) !important; font-size: .72rem; font-weight: 800; letter-spacing: .07em; margin-top: -7px !important; text-transform: uppercase; }
.pagina-disponibilidade .cartao-espaco-corpo > p { color: var(--text-2); line-height: 1.55; }
.cartao-espaco-detalhes { border-bottom: 1px solid var(--border); border-top: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 12px 0; }
.cartao-espaco-detalhes p { align-items: center; color: var(--text-2); display: flex; font-size: .84rem; gap: 7px; }
.cartao-espaco-detalhes svg { color: var(--primary); height: 17px; width: 17px; }
.pagina-disponibilidade .cartao-espaco .botao { gap: 9px; justify-content: space-between; margin-top: 2px; }
.pagina-disponibilidade .cartao-espaco .botao svg { transition: transform .15s var(--ease); }
.pagina-disponibilidade .cartao-espaco .botao:hover svg { transform: translateX(3px); }
.pagina-disponibilidade .estado-vazio { grid-column: 1 / -1; padding: 46px 24px; }
.estado-vazio-icone { align-items: center; background: color-mix(in srgb, var(--primary) 10%, var(--surface)); border-radius: 18px; color: var(--primary); display: inline-flex; height: 62px; justify-content: center; margin-bottom: 14px; width: 62px; }
.estado-vazio-icone svg { height: 30px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; width: 30px; }

@media (min-width: 640px) {
  .abas-publicas { display: grid; grid-template-columns: minmax(190px, .34fr) minmax(0, 1fr); }
  .informacoes-expansiveis { display: none; }
  .abas-publicas-lista { border-right: 1px solid var(--border); display: grid; align-content: start; }
  .abas-publicas-lista a { border-left: 3px solid transparent; color: var(--text-2); min-height: 44px; padding: 12px 18px; text-decoration: none; }
  .abas-publicas-lista a[aria-selected="true"] { border-left-color: var(--primary); color: var(--primary-ink); font-weight: 800; }
  .aba-publica-painel { min-height: 180px; padding: 8px 32px 28px; }
}

@media (min-width: 768px) {
  .minhas-reservas-hero { grid-template-columns: minmax(0, 1fr) minmax(255px, .42fr); padding: 38px; }
  .lista-reservas-moderna .reserva-linha-moderna { gap: 12px; grid-template-columns: 62px 76px minmax(220px, 1fr) max-content auto; }
  .reserva-imagem { height: 64px; width: 76px; }
  .auth-page { grid-template-columns: minmax(0, 1.05fr) minmax(360px, .82fr); }
  .auth-apresentacao { min-height: 590px; padding: 42px; }
  .auth-card { padding: 34px; }
  .portal-abertura { grid-template-columns: minmax(0, 1.4fr) minmax(240px, .6fr); padding: 44px; }
  .spaces-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filtro-data { align-items: end; grid-template-columns: minmax(220px, 320px) auto; }
  .reserva-linha { grid-template-columns: minmax(0, 1fr) auto auto; }
  .disponibilidade-ilustracao { display: flex; }
  .pagina-disponibilidade .filtro-data { grid-template-columns: 48px minmax(220px, 1fr) auto; padding: 20px 22px; }
  .filtro-data-icone { display: flex; }
  .fluxo-reserva, .pagina-protocolo { grid-template-columns: minmax(0, 1fr) minmax(360px, .82fr); }
  .resultado-protocolo-moderno dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .autenticidade-reserva-grid { grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr); }
}

@media (min-width: 900px) {
  .entrada-hero { align-items: stretch; grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr); min-height: 420px; padding: 36px 0 20px; }
  .entrada-apresentacao h1 { font-size: 4rem; }
  .entrada-consulta { padding: 30px; }
  .pagina-disponibilidade .cartao-espaco:only-child { display: grid; grid-column: 1 / -1; grid-template-columns: minmax(360px, .9fr) minmax(320px, 1.1fr); }
  .pagina-disponibilidade .cartao-espaco:only-child .cartao-espaco-capa { aspect-ratio: auto; min-height: 300px; }
  .pagina-disponibilidade .cartao-espaco:only-child .cartao-espaco-corpo { align-content: center; padding: 30px; }
  .pagina-disponibilidade .cartao-espaco:only-child h3 { font-size: 1.65rem; }
  .entrada-hero.entrada-hero-municipal { grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr); min-height: 480px; padding: 48px 52px; }
  .entrada-hero-municipal .entrada-apresentacao h1 { font-size: clamp(3.4rem, 4.3vw, 4.35rem); }
  .entrada-passos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; }
}

@media (max-width: 640px) {
  .auth-apresentacao { min-height: auto; }
  .auth-apresentacao .caminho { margin-bottom: 28px; }
  .auth-apresentacao h1 { font-size: 2.3rem; }
  .auth-beneficios, .auth-passos { margin: 24px 0; }
  .auth-card { border-radius: 18px; padding: 22px; }
  .publico-cabecalho { align-items: center; flex-direction: row; flex-wrap: wrap; }
  .publico-nav { align-items: stretch; border-top: 1px solid var(--border); flex-basis: 100%; flex-direction: column; padding-top: 10px; }
  .publico-nav-publica, .publico-nav-conta { align-items: stretch; flex-direction: column; }
  .publico-nav a, .link-botao { min-height: 44px; padding: 11px 8px; text-align: left; }
  .cabecalho-pagina { align-items: flex-start; flex-direction: column; }
  .minhas-reservas-hero { border-radius: 18px; padding: 23px; }
  .minhas-reservas-hero .caminho { margin-bottom: 20px; }
  .minhas-reservas-hero h1 { font-size: 2.45rem; }
  .minhas-reservas-conteudo { padding: 9px; }
  .minhas-reservas-titulo-lista { align-items: flex-start; flex-direction: column; padding: 18px; }
  .reserva-linha-moderna { gap: 15px; padding: 18px; }
  .reserva-situacao { grid-column: 1 / -1; }
  .botao-cancelar-reserva { grid-column: 1 / -1; justify-self: start; }
}

/* ==========================================================================
   Seleção de Horários de Reserva
   ========================================================================== */
.selecao-horario { max-width: 860px; margin: 0 auto; }
.selecao-horario > p:not(.caminho):not(.entrada-selo) { color: var(--text-2); line-height: 1.55; }
.selecao-horario form { margin-top: 1.5rem; padding: 1.5rem; border: 1px solid var(--border); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow); }
.selecao-horario-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .75rem; margin-top: 1rem; }
.selecao-horario-bloco { min-height: 76px; border: 1px solid var(--border); border-radius: 12px; padding: .85rem; text-align: left; background: var(--surface-2); color: var(--text); font-family: inherit; transition: all .15s ease; }
.selecao-horario-bloco strong, .selecao-horario-bloco span { display: block; }
.selecao-horario-bloco strong { font-size: .95rem; font-family: "JetBrains Mono", monospace; }
.selecao-horario-bloco span { font-size: .78rem; margin-top: .3rem; font-weight: 650; }
.selecao-horario-bloco.vago { cursor: pointer; }
.selecao-horario-bloco.vago:hover, .selecao-horario-bloco.vago.selecionado { border-color: var(--primary); background: color-mix(in srgb, var(--primary) 12%, var(--surface)); box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 30%, transparent); }
.selecao-horario-bloco.vago span { color: var(--success); }
.selecao-horario-bloco.ocupado { opacity: .55; background: var(--surface-2); border-style: dashed; cursor: not-allowed; }
.selecao-horario-bloco.ocupado span { color: var(--error); }
.selecao-horario-escolha { min-height: 1.5rem; margin: 1.25rem 0; color: var(--primary-ink); font-weight: 700; }
.selecao-horario-acoes { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; border-top: 1px solid var(--border); padding-top: 1.25rem; }

/* ==========================================================================
   Modo Escuro (Dark Mode) - Portal do Cidadão
   ========================================================================== */
[data-theme="dark"] .publico-cabecalho {
  background: var(--surface);
  border-bottom-color: var(--border);
}
[data-theme="dark"] .entrada-hero-municipal,
[data-theme="dark"] .minhas-reservas-hero,
[data-theme="dark"] .disponibilidade-hero,
[data-theme="dark"] .pagina-protocolo {
  background: linear-gradient(135deg, #132419 0%, #16211b 75%);
  border-color: var(--border);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.45);
}
[data-theme="dark"] .auth-apresentacao {
  background: linear-gradient(145deg, #15261b 0%, #16211b 70%);
  border-color: var(--border);
}
[data-theme="dark"] .pagina-termos-cabecalho {
  background: linear-gradient(120deg, #15261b, #16211b);
  border-color: var(--border);
}
[data-theme="dark"] .entrada-como-funciona,
[data-theme="dark"] .entrada-informacoes,
[data-theme="dark"] .portal-abertura,
[data-theme="dark"] .auth-card,
[data-theme="dark"] .minhas-reservas-conteudo,
[data-theme="dark"] .minhas-reservas-titulo-lista,
[data-theme="dark"] .reserva-linha-moderna,
[data-theme="dark"] .cartao-espaco,
[data-theme="dark"] .formulario,
[data-theme="dark"] .formulario-confirmacao,
[data-theme="dark"] .resultado-protocolo-moderno,
[data-theme="dark"] .autenticidade-reserva,
[data-theme="dark"] .pagina-termos-conteudo {
  background: var(--surface);
  border-color: var(--border);
}
[data-theme="dark"] .entrada-passos li,
[data-theme="dark"] .campo-confirmacao,
[data-theme="dark"] .resultado-protocolo-moderno dl > div,
[data-theme="dark"] .autenticidade-reserva dl div {
  background: var(--surface-2);
  border-color: var(--border);
}
[data-theme="dark"] .pagina-disponibilidade .situacao-disponibilidade {
  background: rgba(22, 33, 27, 0.95);
  border: 1px solid var(--border);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
}
[data-theme="dark"] .situacao-disponibilidade {
  color: var(--primary-ink);
}
[data-theme="dark"] .resultado-data {
  background: var(--surface-2);
  border-color: var(--border);
  color: var(--text);
}
[data-theme="dark"] .entrada-consulta-icone,
[data-theme="dark"] .auth-icone,
[data-theme="dark"] .minhas-reservas-hero-icone,
[data-theme="dark"] .filtro-data-icone,
[data-theme="dark"] .protocolo-formulario-icone,
[data-theme="dark"] .estado-vazio-icone,
[data-theme="dark"] .estado-vazio-reservas-icone {
  background: color-mix(in srgb, var(--primary) 18%, var(--surface));
  color: var(--primary);
}
[data-theme="dark"] .reserva-data-destaque {
  background: color-mix(in srgb, var(--primary) 16%, var(--surface));
  color: var(--primary-ink);
}
[data-theme="dark"] .status-confirmada {
  background: color-mix(in srgb, var(--success) 20%, var(--surface));
  color: var(--primary-ink);
}
[data-theme="dark"] .status-aguardando_analise {
  background: color-mix(in srgb, var(--warning) 22%, var(--surface));
  color: var(--warning);
}
[data-theme="dark"] .status-recusada,
[data-theme="dark"] .status-cancelada_pelo_cidadao,
[data-theme="dark"] .status-cancelada_pela_administracao,
[data-theme="dark"] .status-cancelada_por_indisponibilidade {
  background: color-mix(in srgb, var(--error) 22%, var(--surface));
  color: var(--error);
}
[data-theme="dark"] .campo input,
[data-theme="dark"] .campo select {
  background: var(--surface-2);
  border-color: var(--border);
  color: var(--text);
}
[data-theme="dark"] .campo input:focus,
[data-theme="dark"] .campo select:focus {
  background: var(--surface);
  border-color: var(--primary);
}
[data-theme="dark"] .publico-rodape {
  border-top-color: var(--border);
}