/* Tu servicio: estado claro y acción visible sin ocupar toda la pantalla. */
.client-next-action{
  --service-tone:var(--jade);
  position:relative;isolation:isolate;overflow:hidden;min-width:0;
  display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:18px;row-gap:5px;
  margin:0 0 14px;padding:15px 17px;
  border:1px solid color-mix(in srgb,var(--service-tone) 35%,var(--line));border-radius:18px;
  background:linear-gradient(120deg,color-mix(in srgb,var(--service-tone) 11%,var(--surface)),var(--surface) 68%);
  box-shadow:0 9px 25px rgba(0,0,0,.10);overflow-wrap:anywhere;
}
.client-next-action::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:0;width:3px;background:var(--service-tone);opacity:.8}
.client-next-action-heading{grid-column:1;grid-row:1;display:flex;align-items:center;gap:7px;margin-bottom:1px}
.client-next-action-heading .activity-kicker{color:var(--service-tone);font-size:.64rem;letter-spacing:.10em}
.client-next-action-heading svg{width:16px;height:16px;color:var(--service-tone)}
.client-next-action h2{grid-column:1;grid-row:2;margin:0;color:var(--text);font-size:clamp(1.05rem,4vw,1.22rem);font-weight:800;letter-spacing:-.025em;line-height:1.2}
.client-next-action p{grid-column:1;grid-row:3;margin:0;color:var(--muted);font-size:.82rem;line-height:1.38}
.client-next-action small{grid-column:1;grid-row:4;color:var(--muted);font-size:.75rem;line-height:1.35}
.client-next-action>.btn{grid-column:2;grid-row:1 / 5;align-self:center;justify-self:end;min-height:44px;padding:.65rem .9rem;border-radius:12px;font-size:.8rem;white-space:normal}
.client-next-action>.btn:focus-visible{outline:3px solid var(--service-tone);outline-offset:3px}
.client-next-action:has([data-renewal-mark-read])>.btn[data-next-action]{grid-row:1 / 3}
.client-next-action>.btn[data-renewal-mark-read]{grid-row:3 / 5}
.client-next-action[data-tone="pending"]{--service-tone:#6598d0}
.client-next-action[data-tone="warning"]{--service-tone:#d5a15a}
.client-next-action[data-tone="success"]{--service-tone:#55ad89}
.client-next-progress{grid-column:1 / -1;grid-row:5;display:flex;gap:10px;list-style:none;padding:0;margin:7px 0 0;color:var(--muted);font-size:.73rem}
.client-next-progress li{flex:1;min-width:0;padding-top:7px;border-top:3px solid var(--line);border-radius:2px;line-height:1.3}
.client-next-progress li:first-child{border-color:#55ad89}
.client-next-progress [aria-current]{border-color:var(--service-tone);color:var(--text);font-weight:700}
@media(max-width:480px){
  .client-next-action{grid-template-columns:minmax(0,1fr);gap:5px;padding:13px 15px}
  .client-next-action-heading,.client-next-action h2,.client-next-action p,.client-next-action small,.client-next-action>.btn,.client-next-progress{grid-column:1;grid-row:auto}
  .client-next-action>.btn,.client-next-action:has([data-renewal-mark-read])>.btn[data-next-action],.client-next-action>.btn[data-renewal-mark-read]{grid-row:auto;justify-self:start;margin-top:4px}
  .client-next-progress{gap:8px}
}
.client-access-steps[hidden],.client-access-notices[hidden]{display:none!important}
