/* Abdifatah Finance — monthly tracker additions.
   Scoped to .finance / .fin-dialog and fin-m-* classes only; reuses the existing --fin-* variables
   (light and dark) and the existing card motion. No global or Sales/Inventory selectors. */

.finance .fin-m-monthpicker{display:inline-flex;align-items:center;gap:4px}
.finance .fin-m-monthpicker select{padding:7px 8px}
.finance .fin-m-step{padding:7px 8px}
.finance .fin-m-step.prev svg{transform:scaleX(-1)}
.fin-dialog .fin-m-monthpicker{display:flex;gap:6px}
.fin-dialog .fin-m-monthpicker select{flex:1}

.finance .fin-m-closed-badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:650;color:#9a3412;background:#fff4e5;border:1px solid #fed7aa;border-radius:999px;padding:3px 9px}
.dark .finance .fin-m-closed-badge{color:#fdba74;background:rgba(154,52,18,.18);border-color:rgba(253,186,116,.35)}
.finance .fin-m-close-ctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.finance .fin-m-muted,.fin-dialog .fin-m-muted{color:var(--fin-muted);font-size:12px}
.finance .fin-m-setup{border:1px dashed var(--fin-border);border-radius:10px;padding:10px 12px;background:var(--fin-soft)}
.finance .fin-m-notice{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid #bbf7d0;background:#f0fdf4;color:#166534;border-radius:10px;padding:10px 12px;margin:10px 0;font-size:13px}
.dark .finance .fin-m-notice{background:rgba(22,101,52,.18);border-color:rgba(134,239,172,.3);color:#86efac}
.finance .fin-m-notice button{padding:4px;border:0;background:transparent;color:inherit}

.finance .fin-m-h3{font-size:13px;font-weight:650;margin:22px 0 4px;color:var(--fin-text)}
.finance .fin-m-h3 small,.finance .fin-m-card h3 small{font-weight:500;color:var(--fin-muted);font-size:11px}
.finance .fin-m-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
.finance .fin-m-stat small{display:block;color:var(--fin-muted);font-size:11px;line-height:1.35}
.finance .fin-m-stat.fin-m-good strong{color:#12794f}
.dark .finance .fin-m-stat.fin-m-good strong{color:#4ade80}
.finance .fin-m-stat.fin-m-bad strong:not(.fin-negative){color:#cc1834}
.finance .fin-m-good-text{color:#12794f}
.finance .fin-m-in{color:#12794f}
.finance .fin-m-out{color:inherit}
.dark .finance .fin-m-in,.dark .finance .fin-m-good-text{color:#4ade80}

.finance .fin-m-budget-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border:1px dashed var(--fin-border);border-radius:12px;padding:14px;background:var(--fin-soft);margin:8px 0 6px}
.finance .fin-m-budget-summary>div{display:flex;flex-direction:column;gap:2px}
.finance .fin-m-budget-summary span{font-size:12px;color:var(--fin-muted)}
.finance .fin-m-budget-summary b{font-size:20px;font-weight:650;letter-spacing:-.4px}
.finance .fin-m-budget-summary .fin-m-over b{color:#e00020}
.finance .fin-m-budget-summary .fin-m-ok b{color:#12794f}
.dark .finance .fin-m-budget-summary .fin-m-ok b{color:#4ade80}
.finance .fin-m-budget-summary p{grid-column:1/-1;margin:0}
.finance .fin-m-flag{color:#b45309;font-weight:600}
.finance .fin-m-flag.over{color:#e00020}

.finance .fin-m-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}
.finance .fin-m-card{border:1px solid var(--fin-border);border-radius:12px;padding:16px;background:var(--fin-bg);min-width:0;margin-top:14px;animation:fin-enter .22s ease-out}
.finance .fin-m-grid2 .fin-m-card{margin-top:0}
.finance .fin-m-card h3{font-size:13px;font-weight:650;margin:0 0 10px}
.finance .fin-m-card .fin-comparison{margin:0 0 10px}
.finance table.fin-m-table{min-width:460px}
.finance .fin-m-table td:not(:first-child),.finance .fin-m-table th:not(:first-child){white-space:nowrap}
.finance .fin-m-table tfoot th{background:var(--fin-soft);color:var(--fin-text)}
.finance .fin-m-table tr.fin-m-current td{background:var(--fin-soft);font-weight:600}
.finance .fin-m-cat{display:inline-flex;align-items:center;gap:6px}
.finance .fin-m-cat .fin-color-icon{width:24px;height:24px;min-width:24px;padding:5px;border-radius:7px;box-sizing:border-box}
.finance .fin-m-cat .fin-color-icon svg{width:14px;height:14px;flex:none}
.finance .fin-m-tag,.fin-dialog .fin-m-tag{display:inline-flex;align-items:center;gap:3px;margin-left:6px;padding:1px 6px;border-radius:5px;font-size:10px;font-weight:600;background:var(--fin-soft);color:var(--fin-muted);border:1px solid var(--fin-border);white-space:nowrap}
.finance .fin-m-tag.warn{color:#b45309;background:#fffbeb;border-color:#fde68a}
.finance .fin-m-tag.over{color:#cc1834;background:#fff0f3;border-color:#ffd4d9}
.dark .finance .fin-m-tag.warn{background:rgba(180,83,9,.16);border-color:rgba(253,230,138,.3);color:#fcd34d}
.dark .finance .fin-m-tag.over{background:rgba(204,24,52,.16);border-color:rgba(255,212,217,.25);color:#fda4af}
.finance .fin-m-link{border:0!important;background:transparent!important;padding:0!important;color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.finance .fin-m-link:hover{color:#d90018!important}

.finance .fin-m-bars{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.finance .fin-m-bars li>div{display:flex;justify-content:space-between;gap:10px;font-size:12px}
.finance .fin-m-bars li b small{color:var(--fin-muted);font-weight:500;margin-left:4px}
.finance .fin-m-bars li i{display:block;height:6px;border-radius:99px;background:linear-gradient(90deg,#ef4444,#f87171);margin-top:4px;transition:width .3s cubic-bezier(.16,1,.3,1)}
.finance .fin-m-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.finance .fin-m-list li{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:9px 0;border-bottom:1px solid var(--fin-border);font-size:12px}
.finance .fin-m-list li:last-child{border-bottom:0}
.finance .fin-m-list li small{display:block;color:var(--fin-muted);font-size:11px;font-weight:400}
.finance .fin-m-list li b{text-align:right;white-space:nowrap}
.finance .fin-m-empty{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:22px;border:1px dashed var(--fin-border);border-radius:12px;margin:12px 0}

.finance .fin-m-budget-values{grid-template-columns:repeat(2,minmax(0,1fr))}
.finance .fin-m-progress-over{accent-color:#e00020}
.finance .fin-m-note-inline{color:var(--fin-muted)}
.finance .fin-m-uncat{opacity:.9}
.finance .fin-m-hist{color:var(--fin-muted);border-top:1px dashed var(--fin-border);padding-top:6px;margin-top:4px;display:block}
.finance .fin-m-refunded{display:block;color:var(--fin-muted);font-size:10px}
.finance .fin-m-refund-btn{font-size:11px!important;padding:5px 8px!important}
.finance .fin-m-lock-note{display:inline-flex;align-items:center;gap:4px;color:var(--fin-muted)}
.finance tr.fin-m-locked-row td{background:color-mix(in srgb,var(--fin-soft) 60%,transparent)}
.finance .fin-badge.refund{color:#7c3aed;background:#f5f3ff}
.finance .fin-badge.adjustment{color:#92400e;background:#fffbeb}

.fin-dialog .fin-m-check{display:flex;align-items:center;gap:8px;flex-direction:row}
.fin-dialog .fin-m-month-warning{display:flex;flex-direction:column;gap:3px;border:1px solid #fde68a;background:#fffbeb;color:#92400e;border-radius:10px;padding:10px 12px;font-size:12px}
.dark .fin-dialog .fin-m-month-warning{background:rgba(180,83,9,.16);border-color:rgba(253,230,138,.3);color:#fcd34d}
.fin-dialog .fin-m-bullets{margin:0 0 4px 18px;padding:0;font-size:12px;color:var(--fin-muted);list-style:disc}

@media (max-width:900px){
  .finance .fin-m-grid2{grid-template-columns:minmax(0,1fr)}
  .finance .fin-m-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .finance .fin-m-budget-summary{grid-template-columns:minmax(0,1fr)}
  .finance .fin-m-budget-summary b{font-size:18px}
  .finance .fin-m-monthpicker{width:100%}
  .finance .fin-m-monthpicker select{flex:1}
  .finance .fin-m-overview-title{flex-direction:column;align-items:stretch}
  .finance .fin-m-close-ctl{justify-content:flex-start}
}
@media (prefers-reduced-motion:reduce){
  .finance .fin-m-card{animation:none}
  .finance .fin-m-bars li i{transition:none}
}
