@charset "UTF-8";
/* Mi Dinero V9.7 · screen pieces and tools: Registrar, movements, spending by category, budget, debt and goal rows,
   the contents of every sheet (calendar, commitments, cards, accounts, plan, legal texts) and the reports. */
.register-form{display:grid;gap:18px}
.type-segment button{min-height:48px;font-size:var(--md-fs-l)}
.type-segment button.selected{background:var(--md-cta);color:#fff}
.more-types>summary{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;color:var(--md-brand-text);font-weight:700}
.more-types>summary::after{content:"";width:14px;height:14px;background:var(--md-chevron) center/14px no-repeat;transition:transform .2s}
.more-types[open]>summary::after{transform:rotate(180deg)}
.more-types .chip-row{justify-content:center;margin-top:6px}
.category-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:8px}
.category-tile{display:grid;justify-items:center;gap:6px;min-height:84px;padding:10px 4px;border-radius:var(--md-radius-m);background:var(--md-surface);box-shadow:inset 0 0 0 1px var(--md-line);font-size:var(--md-fs-s);font-weight:600;text-align:center;overflow-wrap:anywhere}
.category-tile.selected{background:var(--md-brand-soft);color:var(--md-brand-text);box-shadow:inset 0 0 0 2px var(--md-brand)}
.category-more{grid-column:1/-1;min-height:44px;color:var(--md-brand-text);font-weight:700}
.category-grid .empty-state{grid-column:1/-1}
.register-details .stack{margin-top:0}
#expense-summary,#movement-panel{display:grid;gap:16px}
.filter-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.card-form{display:grid;gap:12px;padding:16px;border-radius:var(--md-radius-l);background:var(--md-surface);box-shadow:var(--md-shadow-1)}

.movement-row{display:flex;align-items:center;gap:12px;width:100%;min-height:60px;padding:10px 16px;text-align:left;color:var(--md-ink)}
.movement-info{display:grid;flex:1;gap:2px;min-width:0}
.movement-info strong{overflow:hidden;font-weight:650;text-overflow:ellipsis;white-space:nowrap}
.movement-info small{font-size:var(--md-fs-s);color:var(--md-muted)}
.movement-value{flex-shrink:0;color:var(--md-good);font-weight:750;font-variant-numeric:tabular-nums;white-space:nowrap}
.movement-value.out{color:var(--md-ink)}

.donut{position:relative;width:min(220px,64vw);aspect-ratio:1;margin:0 auto;border-radius:50%}
.donut-hole{position:absolute;inset:22%;display:grid;place-items:center;border-radius:50%;background:var(--md-bg)}
.donut-hole img{width:72%;height:72%;object-fit:contain}
.donut-label{position:absolute;transform:translate(-50%,-50%);padding:2px 6px;border-radius:999px;background:var(--md-surface);font-size:11px;font-weight:800}
.expense-row{display:flex;align-items:center;gap:12px;padding:12px 16px}
.grow{display:grid;flex:1;gap:6px;min-width:0}
.expense-line{display:flex;justify-content:space-between;gap:8px}
.expense-line b{font-variant-numeric:tabular-nums}
.expense-row>small{width:40px;flex-shrink:0;color:var(--md-muted);font-weight:700;text-align:right}

.budget-row.over .row-value,.budget-row.over .row-body small{color:var(--md-over)}
.budget-row.over .track>span{background:var(--md-over-bar)}
.debt-row .track>span{background:var(--md-info-bar)}
.debt-row.util-watch .track>span,.debt-row.util-high .track>span{background:var(--md-watch-bar)}
.debt-row.util-over .track>span{background:var(--md-over-bar)}
.goal-row .track>span{background:var(--md-violet-bar)}
.goal-row.stage-complete .track>span{background:var(--md-good-bar)}
.goal-row.stage-complete .row-value{color:var(--md-good)}
.goal-icon{background:var(--md-violet-soft)}
.kind-ahorro,.kind-inversion{background:var(--md-violet-soft);color:var(--md-violet)}
#payments-preview.alert small{color:var(--md-over)}

/* Sheet contents. */
.dialog-description{color:var(--md-muted)}
.detail-total{display:block;font-size:var(--md-fs-2xl);font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.detail-total small{font-size:var(--md-fs-m);font-weight:600;color:var(--md-muted)}
.detail-list{display:grid}
.detail-list h3{padding:8px 0 4px;font-size:var(--md-fs-m)}
.detail-list>p{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--md-line)}
.detail-list>p b{font-variant-numeric:tabular-nums;white-space:nowrap}
.detail-list>p.helper{display:block;padding:4px 0 10px}
.dialog-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.dialog-actions .button{min-height:48px;font-size:var(--md-fs-m)}
.plan-preview{padding:12px 14px;border-radius:var(--md-radius-m);background:var(--md-violet-soft);color:var(--md-violet);font-size:var(--md-fs-s);font-weight:650}
.plan-preview:empty{display:none}
.control-pig{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--md-radius-l);background:var(--md-hero);color:var(--md-ink);font-size:var(--md-fs-s)}
.control-pig img{flex-shrink:0;width:56px;height:56px;border-radius:var(--md-radius-s);object-fit:contain}
.control-actions{display:flex;flex-wrap:wrap;gap:8px}
.control-actions .button{min-height:44px;padding:8px 14px;font-size:var(--md-fs-s)}
.control-totals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.control-totals>div{display:grid;gap:2px;padding:12px;border-radius:var(--md-radius-m);background:var(--md-surface-2)}
.control-totals small{font-size:var(--md-fs-xs);color:var(--md-muted)}
.control-totals strong{font-variant-numeric:tabular-nums}
.control-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--md-line)}
.control-row small{display:block;font-size:var(--md-fs-s);color:var(--md-muted)}
.control-row b{font-variant-numeric:tabular-nums;white-space:nowrap}
.control-payment{display:grid;gap:8px;padding:12px 14px;border-radius:var(--md-radius-m);background:var(--md-surface-2)}
.control-payment>div:first-child{display:grid;gap:2px}
.control-payment small{color:var(--md-muted)}
.control-payment .tag{justify-self:start}
/* Each commitment keeps its two actions, as text buttons, so the list reads first. */
.control-payment .control-actions{gap:16px}
.control-payment .button{padding:0;background:none;box-shadow:none}
.control-payment.overdue{background:var(--md-over-soft)}
.control-payment.paid{opacity:.75}
.control-category{display:grid;gap:8px;padding:12px 0;border-bottom:1px solid var(--md-line)}
.control-category>div:first-child{display:flex;align-items:center;gap:10px}
.control-category small{color:var(--md-muted)}
.control-swatch{display:grid;place-items:center;width:36px;height:36px;border-radius:var(--md-radius-s);color:#fff}
.calendar-heading{padding-top:6px;font-size:var(--md-fs-l)}
.calendar-filter{display:flex;align-items:center;justify-content:space-between;gap:8px}
.payment-calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;text-align:center}
.payment-calendar>strong{font-size:var(--md-fs-xs);color:var(--md-muted)}
.calendar-day{display:grid;justify-items:center;min-height:48px;padding:4px 0;border-radius:var(--md-radius-s);background:var(--md-surface-2);font-size:var(--md-fs-s);font-weight:700}
.calendar-day small{font-size:10px;font-weight:500;color:var(--md-muted)}
.calendar-day.overdue{background:var(--md-over-soft);color:var(--md-over)}
.calendar-day.selected{box-shadow:inset 0 0 0 2px var(--md-brand)}
.credit-card{display:grid;gap:8px;padding:18px;border-radius:var(--md-radius-l);background:var(--md-hero-night);color:var(--md-on-hero)}
.credit-card small{color:var(--md-on-hero-muted)}
.credit-card-name{font-weight:750}
.credit-card .track{background:var(--md-hero-chip)}
.credit-card.util-watch .track>span,.credit-card.util-high .track>span{background:var(--md-watch-bar)}
.credit-card.util-over .track>span{background:var(--md-over-bar)}
.credit-card-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.credit-card-values>div{display:grid;gap:2px;min-width:0}
.credit-card-values b{overflow-wrap:anywhere;font-size:var(--md-fs-s)}
.afford-result{display:grid;gap:12px}
.afford-result.over .control-pig{background:var(--md-over-soft)}
.afford-result.tight .control-pig{background:var(--md-watch-soft)}
.alert-device{display:grid;gap:8px;padding-top:8px}
.pause-item{display:grid;gap:2px;padding:10px 0;border-bottom:1px solid var(--md-line)}
.pause-item p{font-size:var(--md-fs-s);color:var(--md-muted)}
.pause-item .text-button{justify-self:start;padding:0}
.legal-doc{display:grid;gap:8px}
.legal-doc h3{padding-top:8px;font-size:var(--md-fs-m)}
.legal-doc p{font-size:var(--md-fs-s);color:var(--md-muted)}
.legal-draft{padding:10px 12px;border-radius:var(--md-radius-s);background:var(--md-watch-soft);color:var(--md-watch);font-weight:650}
.wealth-meaning{font-size:var(--md-fs-s);color:var(--md-muted)}

/* Plan del mes. */
#budget-plan{display:grid;gap:8px}
#budget-upcoming{display:grid;gap:16px}
.plan-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:8px 0;border-bottom:1px solid var(--md-line);font-size:var(--md-fs-s)}
.plan-row small{display:block;color:var(--md-muted)}
.plan-row b{min-width:84px;font-variant-numeric:tabular-nums;text-align:right}
.plan-head small{text-align:right;color:var(--md-muted)}
.plan-note{font-weight:650}

/* Reportes. */
#report-panel{display:grid;gap:16px}
.card{display:grid;gap:10px;padding:16px;border-radius:var(--md-radius-l);background:var(--md-surface);box-shadow:var(--md-shadow-1)}
.card h3{font-size:var(--md-fs-l)}
.figure-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.figure-grid>div{display:grid;gap:2px;padding:12px;border-radius:var(--md-radius-m);background:var(--md-surface-2)}
.figure-grid small{font-size:var(--md-fs-xs);color:var(--md-muted)}
.figure-grid strong{overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.figure-grid .is-good strong{color:var(--md-good)}
.trend-stat{display:flex;justify-content:space-between;gap:12px;font-size:var(--md-fs-s)}
.trend-stat b{font-variant-numeric:tabular-nums}
.report-chart{display:flex;align-items:flex-end;gap:6px;height:150px;padding-top:16px}
.report-column{display:grid;flex:1;grid-template-rows:auto 1fr auto;justify-items:center;gap:4px;height:100%;min-width:0}
.report-column>b{font-size:10px}
.report-column>small{font-size:10px;color:var(--md-muted)}
.report-bars{display:flex;align-items:flex-end;gap:2px;height:100%}
.bar{display:block;width:10px;min-height:2px;border-radius:4px 4px 0 0}
.bar.income,.dot.income{background:var(--md-good-bar)}
.bar.expense,.dot.expense{background:var(--md-over-bar)}
.bar.net{background:var(--md-violet-bar)}
.bar.negative{background:var(--md-watch-bar)}
.report-legend{display:flex;align-items:center;gap:6px;font-size:var(--md-fs-xs);color:var(--md-muted)}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%}
.report-table{display:grid;font-size:var(--md-fs-s)}
.report-tr{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:6px;padding:8px 0;border-bottom:1px solid var(--md-line);font-variant-numeric:tabular-nums}
.report-tr>span:not(:first-child){text-align:right}
.report-tr.head{font-size:var(--md-fs-xs);font-weight:700;color:var(--md-muted)}
.report-filters .segment{max-width:280px}