/* Financeiro — as abas do dia a dia (app-extras.js): fichas de categoria,
   a bolinha de paga, os selos e o cartão do objetivo com a barra. */

.fichas{display:flex;gap:7px;overflow-x:auto;padding:2px 0 12px;margin:0 -2px;scrollbar-width:none}
.fichas::-webkit-scrollbar{display:none}
.ficha{flex:none;border:1px solid var(--linha);background:var(--cartao);border-radius:999px;
padding:7px 12px;font-size:13px;font-weight:600;color:var(--tinta-2);white-space:nowrap}
.ficha[aria-pressed="true"]{background:var(--cor);border-color:var(--cor);color:#fff}

.item-val.apagada{color:var(--tinta-3);font-weight:600}
.selo-corte,.selo-sit{display:inline-block;font-size:11px;font-weight:700;border-radius:6px;padding:1px 6px;
margin-left:4px;background:var(--ambar-claro);color:var(--ambar);vertical-align:1px}
.selo-sit{background:var(--grade);color:var(--tinta-2)}
.selo-sit.ruim{background:var(--neg-claro);color:var(--neg)}
.selo-sit.bom{background:var(--pos-claro);color:var(--pos)}

.marca{flex:none;width:28px;height:28px;border-radius:50%;border:2px solid var(--cor-borda);
display:grid;place-items:center;margin-right:2px;color:#fff;background:var(--cartao)}
.marca.feita{background:var(--pos);border-color:var(--pos)}
.marca svg{width:16px;height:16px}

.objetivo{display:flex;gap:12px;width:100%;text-align:left;background:var(--cartao);border-radius:16px;
box-shadow:var(--sombra);padding:12px;margin-bottom:10px;align-items:center}
.objetivo-foto{flex:none;width:76px;height:76px;border-radius:12px;overflow:hidden;background:var(--grade)}
.objetivo-foto img{width:100%;height:100%;object-fit:cover;display:block}
.objetivo-meio{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.barra{display:block;height:8px;border-radius:99px;background:var(--grade);overflow:hidden;margin-top:4px}
.barra span{display:block;height:100%;background:var(--g-patrimonio);border-radius:99px}

.campo.marcar{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--tinta-2);font-size:14px}
.campo.marcar input{width:22px;height:22px;accent-color:var(--cor)}
.opc{font-weight:500;color:var(--tinta-3)}
.foto-campo{display:flex;align-items:center;gap:12px}
.foto-ver{flex:none;width:64px;height:64px;border-radius:12px;overflow:hidden;background:var(--grade)}
.foto-ver img{width:100%;height:100%;object-fit:cover;display:block}
.foto-campo .btn-linha{flex:1}

/* As partes do app na folha Sua conta e o Desativar no fim das abas
   Retenção e Independência (app-partes.js, 14/11/2026). */
.partes-tit{margin-top:18px!important;font-weight:700}
.partes{margin-top:8px;display:grid;gap:8px}
.parte-nome{flex:1;min-width:0;display:flex;flex-direction:column}
.parte-nome small{font-size:12.5px;font-weight:500;color:var(--tinta-3)}
.chave-liga{flex:none;position:relative;width:44px;height:26px;border-radius:99px;
background:var(--cor-borda);transition:background .15s}
.chave-liga::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
background:#fff;box-shadow:0 1px 2px rgba(21,32,43,.25);transition:transform .15s}
.parte[aria-checked="true"] .chave-liga{background:var(--pos)}
.parte[aria-checked="true"] .chave-liga::after{transform:translateX(18px)}
.btn-linha.desligar{color:var(--tinta-2);justify-content:center}
@media (prefers-reduced-motion:reduce){.chave-liga,.chave-liga::after{transition:none}}
