/* ==== apoio.css · só em body[data-css~="apoio"] ==== */
:where(body[data-css~="apoio"]) /* =====================================================================
   rendaacessivel.pt · apoio.css (só a página de cada apoio à renda)
   Usa os tokens e as peças do base.css; aqui fica só o que é desta página:
   a ordem no telemóvel, :where(body[data-css~="apoio"]) o «Serve-me?» em três toques, :where(body[data-css~="apoio"]) a conta do «Quanto dá»
   com as barras, :where(body[data-css~="apoio"]) o «Depois de aprovado» e a caixa final (só no telemóvel).
   font-size só com var(--t-*).
   ===================================================================== */

/* a ficha do apoio usa a grelha do concurso: no telemóvel, :where(body[data-css~="apoio"]) título, :where(body[data-css~="apoio"]) subtítulo,
   :where(body[data-css~="apoio"]) cartão de acção e SÓ DEPOIS os factos e o resto (base.css põe o cartão com order:1).
   Assim o botão de pedir fica no primeiro ecrã a 390 x 844. */
.apoio .concurso-grelha > .concurso-principal > .depois{ order:2; }
:where(body[data-css~="apoio"]) .apoio .heroi-sub{ max-width:44ch; }
:where(body[data-css~="apoio"]) .apoio h1{ max-width:18ch; }

/* secções dentro da coluna de leitura */
:where(body[data-css~="apoio"]) .apoio-sec{ margin-top:var(--e-7); }
:where(body[data-css~="apoio"]) .apoio-sec > h2{ margin-bottom:var(--e-2); }
:where(body[data-css~="apoio"]) .apoio-sec > .entrada-sec{ color:var(--tinta-2); margin-bottom:var(--e-4); max-width:var(--larg-texto); }

:where(body[data-css~="apoio"]) /* cartão de acção de um apoio: aberto todo o ano, :where(body[data-css~="apoio"]) sem contagem */
.accao .accao-quando{ margin-top:0; }
:where(body[data-css~="apoio"]) .accao .chip-aberto{ margin-top:var(--e-3); }
:where(body[data-css~="apoio"]) .accao-burla{ margin-top:var(--e-3); padding-top:var(--e-3); border-top:1px solid var(--linha); font-size:var(--t-apoio); color:var(--tinta-2); }
:where(body[data-css~="apoio"]) .accao-lista{ list-style:none; margin:var(--e-4) 0 0; padding:0; display:grid; gap:var(--e-2); font-size:var(--t-apoio); color:var(--tinta-2); }
:where(body[data-css~="apoio"]) .accao-lista li{ display:grid; grid-template-columns:22px 1fr; gap:var(--e-2); }
:where(body[data-css~="apoio"]) .accao-lista .i{ width:18px; height:18px; margin-top:3px; color:var(--oliva); }

/* ---------- Serve-me? três toques ---------- */
:where(body[data-css~="apoio"]) .serve{ display:grid; gap:var(--e-5); }
:where(body[data-css~="apoio"]) .serve fieldset + fieldset{ padding-top:var(--e-5); border-top:1px solid var(--linha); }
:where(body[data-css~="apoio"]) .serve .opcoes{ grid-template-columns:1fr; margin-top:var(--e-3); }
:where(body[data-css~="apoio"]) .serve .opcao{ min-height:var(--alvo); justify-content:flex-start; text-align:left; padding-inline:20px; }
:where(body[data-css~="apoio"]) .serve-espera{ font-size:var(--t-apoio); color:var(--tinta-2); padding:var(--e-4) 20px; border:1.5px dashed var(--linha); border-radius:var(--r-campo); }
:where(body[data-css~="apoio"]) .veredicto .lig + .lig{ margin-left:0; }
:where(body[data-css~="apoio"]) .serve-cab{ margin-bottom:0; }
:where(body[data-css~="apoio"]) .serve-pes{ display:flex; flex-wrap:wrap; gap:0 var(--e-4); }
:where(body[data-css~="apoio"]) .serve-pes:not(:has(button:not([hidden]))){ display:none; }
/* telemóvel: uma pergunta de cada vez (ESPEC, .pergunta); quando acaba, fica só o veredicto */
@media (max-width:639.98px){
  :where(body[data-css~="apoio"]) .serve.passo-a-passo fieldset:not(.atual){ display:none; }
  :where(body[data-css~="apoio"]) .serve.passo-a-passo fieldset + fieldset{ padding-top:0; border-top:0; }
  :where(body[data-css~="apoio"]) .serve.passo-a-passo:not(.acabou) #veredicto:has(.serve-espera){ display:none; }}
:where(body[data-css~="apoio"]) .regras{ margin-top:var(--e-4); }
:where(body[data-css~="apoio"]) .regras .pontos{ margin-top:0; }
:where(body[data-css~="apoio"]) .veredicto-saidas{ display:flex; flex-wrap:wrap; gap:0 var(--e-4); }

/* ---------- Quanto dá: a conta e as barras ---------- */
:where(body[data-css~="apoio"]) .conta{ background:var(--branco); border:1px solid var(--linha); border-radius:var(--r-cartao); padding:var(--e-5) 20px; }
:where(body[data-css~="apoio"]) .conta-linha{ display:grid; gap:6px; max-width:18rem; }
:where(body[data-css~="apoio"]) .conta-euro{ position:relative; }
:where(body[data-css~="apoio"]) .conta-euro .entrada{ padding-right:48px; font-family:var(--serifa); font-size:var(--t-3); }
:where(body[data-css~="apoio"]) .conta-euro span{ position:absolute; right:18px; top:50%; transform:translateY(-50%); color:var(--tinta-2); pointer-events:none; }
:where(body[data-css~="apoio"]) .conta-resultado{ margin-top:var(--e-5); padding-top:var(--e-5); border-top:1px solid var(--linha); }
:where(body[data-css~="apoio"]) .conta-resultado .t-rotulo{ display:block; }
:where(body[data-css~="apoio"]) .conta-valor{ font-family:var(--serifa); font-size:var(--t-2); line-height:1.15; margin-top:var(--e-1); }
:where(body[data-css~="apoio"]) .conta-valor small{ font-family:var(--letra); font-size:var(--t-apoio); color:var(--tinta-2); margin-left:4px; }
:where(body[data-css~="apoio"]) .conta-nota{ font-size:var(--t-apoio); color:var(--tinta-2); margin-top:var(--e-1); }

:where(body[data-css~="apoio"]) .barras{ list-style:none; margin:var(--e-5) 0 0; padding:0; display:grid; gap:var(--e-3); }
:where(body[data-css~="apoio"]) .barras-titulo{ font-size:var(--t-apoio); font-weight:600; color:var(--tinta); margin-top:var(--e-5); }
:where(body[data-css~="apoio"]) .barras-legenda{ font-size:var(--t-apoio); color:var(--tinta-2); }
:where(body[data-css~="apoio"]) .barras li{ display:grid; grid-template-columns:4.2rem 1fr 6.6rem; gap:var(--e-3); align-items:center; font-size:var(--t-apoio); }
:where(body[data-css~="apoio"]) .barras .ano{ color:var(--tinta-2); }
:where(body[data-css~="apoio"]) .barras .trilho{ height:14px; border-radius:var(--r-pilula); background:var(--cal-2); overflow:hidden; }
:where(body[data-css~="apoio"]) .barras .enche{ display:block; height:100%; border-radius:var(--r-pilula); background:var(--madeira-esc); }
:where(body[data-css~="apoio"]) .barras .quanto{ text-align:right; white-space:nowrap; color:var(--tinta-2); }
:where(body[data-css~="apoio"]) .barras .quanto b{ color:var(--tinta); font-weight:700; }

:where(body[data-css~="apoio"]) .pontos{ list-style:none; margin:var(--e-4) 0 0; padding:0; display:grid; gap:var(--e-3); max-width:var(--larg-texto); }
:where(body[data-css~="apoio"]) .pontos li{ display:grid; grid-template-columns:24px 1fr; gap:var(--e-3); }
:where(body[data-css~="apoio"]) .pontos .i{ width:20px; height:20px; margin-top:4px; color:var(--oliva); }
:where(body[data-css~="apoio"]) .pontos.cuidado .i{ color:var(--telha-esc); }

/* ---------- Como se pede ---------- */
:where(body[data-css~="apoio"]) .apoio .passos li{ font-size:var(--t-corpo); }
:where(body[data-css~="apoio"]) .apoio .passos li::before{ font-size:var(--t-3); line-height:1.1; }
:where(body[data-css~="apoio"]) .passo-aviso{ display:block; font-size:var(--t-apoio); color:var(--tinta-2); margin-top:2px; }
:where(body[data-css~="apoio"]) .aprovado{ margin-top:var(--e-5); padding-top:var(--e-4); border-top:1px solid var(--linha); max-width:var(--larg-texto); }
:where(body[data-css~="apoio"]) .aprovado p{ margin-top:var(--e-2); }


/* o botão outra vez */
:where(body[data-css~="apoio"]) .outra-vez{ display:grid; gap:var(--e-2); justify-items:start; padding:var(--e-5) 20px; background:var(--cal-2); border-radius:var(--r-cartao); }
:where(body[data-css~="apoio"]) .outra-vez-t{ font-family:var(--serifa); font-size:var(--t-3); }
:where(body[data-css~="apoio"]) .burla{ display:grid; grid-template-columns:22px 1fr; gap:var(--e-2); margin-top:var(--e-2); padding-top:var(--e-3); border-top:1px solid var(--linha-forte); font-size:var(--t-apoio); color:var(--tinta-2); }
:where(body[data-css~="apoio"]) .burla .i{ width:18px; height:18px; margin-top:3px; color:var(--tinta-2); }

/* ajuda (cobrança desligada: sem preços nem prazo de revisão) */
:where(body[data-css~="apoio"]) .ajuda-bloco{ display:grid; gap:var(--e-3); justify-items:start; margin-top:var(--e-6); padding-top:var(--e-5); border-top:1px solid var(--linha); }

:where(body[data-css~="apoio"]) /* ---------- Fim da página: partilha, :where(body[data-css~="apoio"]) outros apoios, :where(body[data-css~="apoio"]) fontes ---------- */
.fim-grelha{ display:grid; gap:var(--e-7); }
:where(body[data-css~="apoio"]) .fontes{ font-size:var(--t-apoio); color:var(--tinta-2); max-width:var(--larg-texto); margin-top:var(--e-7); }
:where(body[data-css~="apoio"]) .fontes p + p{ margin-top:var(--e-3); }
:where(body[data-css~="apoio"]) .fontes details{ margin-top:var(--e-3); }
:where(body[data-css~="apoio"]) .fontes summary{ cursor:pointer; min-height:var(--alvo); display:inline-flex; align-items:center; font-weight:600; color:var(--telha-esc); }
:where(body[data-css~="apoio"]) .fontes ul{ margin:var(--e-2) 0 0; padding-left:1.2em; }
:where(body[data-css~="apoio"]) .fontes li{ padding-block:4px; }

@media (min-width:640px){
  :where(body[data-css~="apoio"]) .serve .opcoes{ grid-template-columns:repeat(3,1fr); }
  :where(body[data-css~="apoio"]) .serve .opcao{ justify-content:center; text-align:center; padding-inline:var(--e-3); }
  :where(body[data-css~="apoio"]) .conta,:where(body[data-css~="apoio"]) .outra-vez{ padding:var(--e-6); }
  :where(body[data-css~="apoio"]) .serve-cab,:where(body[data-css~="apoio"]) .serve-pes{ display:none !important; }
  /* quatro factos numa linha (o base.css faz 3 x 2 para seis) */
  :where(body[data-css~="apoio"]) .apoio .factos.quatro{ grid-template-columns:repeat(4,1fr); }
  :where(body[data-css~="apoio"]) .apoio .factos.quatro .facto{ border-bottom:0; padding-left:var(--e-4); border-left:1px solid var(--linha); }
  :where(body[data-css~="apoio"]) .apoio .factos.quatro .facto:first-child{ padding-left:0; border-left:0; }
  :where(body[data-css~="apoio"]) .conta-topo{ display:grid; grid-template-columns:18rem 1fr; gap:var(--e-6); align-items:end; }
  :where(body[data-css~="apoio"]) .conta-topo .conta-resultado{ margin-top:0; padding-top:0; border-top:0; }
  :where(body[data-css~="apoio"]) .barras li{ grid-template-columns:4.8rem 1fr 7rem; }}
@media (min-width:1024px){
  :where(body[data-css~="apoio"]) .apoio .concurso-grelha{ margin-top:var(--e-2); }
  :where(body[data-css~="apoio"]) .outra-vez{ display:none; }  :where(body[data-css~="apoio"]) /* o cartão ao lado, :where(body[data-css~="apoio"]) preso, :where(body[data-css~="apoio"]) já é o último gesto */
  .fim-grelha{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--e-8); align-items:start; }}
@media print{
  :where(body[data-css~="apoio"]) .serve,:where(body[data-css~="apoio"]) .conta,:where(body[data-css~="apoio"]) .outra-vez,:where(body[data-css~="apoio"]) .ajuda-bloco,:where(body[data-css~="apoio"]) .fim-grelha .partilha,:where(body[data-css~="apoio"]) .alternar{ display:none !important; }}

:where(body[data-css~="apoio"]) /* na faixa de cal escura, :where(body[data-css~="apoio"]) o «alternar» leva fundo branco para se ver como um só controlo */
.secao-cal2 .alternar{ background:var(--branco); border:1px solid var(--linha); }
:where(body[data-css~="apoio"]) .fim{ border-top:1px solid var(--linha); }
:where(body[data-css~="apoio"]) .fim-grelha .lista-linhas{ margin-top:var(--e-4); }
:where(body[data-css~="apoio"]) .fim-grelha h2{ font-size:var(--t-3); }
:where(body[data-css~="apoio"]) .fim{ margin-top:var(--e-8); }
/* no telemóvel os dois textos da partilha não cabem numa linha: ficam um por baixo do outro */
@media (max-width:639.98px){
  :where(body[data-css~="apoio"]) #partilha .alternar{ display:grid; grid-template-columns:1fr; border-radius:20px; }
  :where(body[data-css~="apoio"]) #partilha .alternar button{ justify-content:flex-start; }}

:where(body[data-css~="apoio"]) /* o rodapé cola ao último bloco, :where(body[data-css~="apoio"]) que já traz o seu espaço (estava num style="" no HTML) */
.rodape{ margin-top:0; }

/* ---- 2.ª passagem do revisor (27/09) ---- */
:where(body[data-css~="apoio"]) /* o botão da caixa de acção cabe numa linha: o texto não parte, :where(body[data-css~="apoio"]) a seta encolhe */
.accao .bt-bloco{ white-space:nowrap; padding-inline:var(--e-3); gap:8px; }
:where(body[data-css~="apoio"]) .accao .bt-bloco .i{ flex:0 1 20px; min-width:12px; }
/* numa página de quatro câmaras o chip diz de qual é: «Loures · Fecha em 3 dias» */
:where(body[data-css~="apoio"]) .chip-dono{ display:inline-flex; align-items:center; flex-wrap:wrap; gap:6px; margin-top:var(--e-3); font-size:var(--t-apoio); color:var(--tinta-2); }
:where(body[data-css~="apoio"]) .chip-dono b{ color:var(--tinta); }
:where(body[data-css~="apoio"]) .chip-dono .chip{ margin-top:0; }
:where(body[data-css~="apoio"]) /* a dúvida que pesa na decisão fica à vista, :where(body[data-css~="apoio"]) por baixo do chip */
.accao-aviso{ display:grid; grid-template-columns:22px 1fr; gap:var(--e-2); margin:var(--e-3) 0 0; font-size:var(--t-apoio); color:var(--tinta-2); }
:where(body[data-css~="apoio"]) .accao-aviso .i{ width:18px; height:18px; margin-top:3px; color:var(--telha-esc); }
/* migalhas: a quebra cai ENTRE itens e nenhuma linha começa pelo separador */
:where(body[data-css~="apoio"]) .apoio .migalhas li{ white-space:nowrap; }
:where(body[data-css~="apoio"]) .apoio .migalhas li + li::before{ content:none; }
:where(body[data-css~="apoio"]) .apoio .migalhas li:not(:last-child)::after{ content:"/"; margin-left:8px; color:var(--linha-forte); }
/* cabeçalho a 375 px: o Menu passava 3 px da margem (remendo igual ao das legais; o defeito é do _base.css, ver PEDIDOS) */
@media (max-width:400px){
  :where(body[data-css~="apoio"]) .topo .caixa{ gap:6px; }
  :where(body[data-css~="apoio"]) .marca{ flex:0 1 auto; min-width:0; gap:8px; }
  :where(body[data-css~="apoio"]) .marca > span{ min-width:0; }
  :where(body[data-css~="apoio"]) .marca-desc{ overflow:hidden; text-overflow:ellipsis; }}