/* Small additions on top of Volt */

body { background: #F2F4F6; }

.nav-label {
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #9CA3AF;
  padding: 1rem .75rem .35rem;
}

.avatar-initials {
  width: 2rem; height: 2rem;
  display: inline-flex; align-items: center; justify-content: center;
  background: #1F2937; color: #f0bc74; font-weight: 700; font-size: .875rem;
}

/* Stat cards */
.stat-card .icon-shape { flex-shrink: 0; }
.min-w-0 { min-width: 0; }
.table td.text-wrap { min-width: 7rem; }
.table > :not(caption) > * > * { padding-left: .85rem; padding-right: .85rem; }
.table > :not(caption) > * > *:first-child { padding-left: 1.5rem; }
.stat-card .stat-label { font-size: .8rem; color: #6B7280; margin-bottom: .15rem; }
.stat-card .stat-value { font-weight: 800; font-size: 1.35rem; margin-bottom: .15rem; line-height: 1.2; }
.stat-card .stat-sub { font-size: .78rem; color: #6B7280; }
.icon-shape-success { background: rgba(16, 185, 129, .12); color: #10B981; }
.icon-shape-danger  { background: rgba(225, 29, 72, .1);   color: #E11D48; }
.icon-shape-info    { background: rgba(35, 97, 206, .1);   color: #2361ce; }

/* Tables */
.table td, .table th { vertical-align: middle; }
.table .num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.table tfoot td { font-weight: 700; border-top: 2px solid #E5E7EB; }
.table .actions { white-space: nowrap; text-align: right; }
.btn-icon { padding: .25rem .45rem; line-height: 1; }
.btn-icon svg { width: 1rem; height: 1rem; }
.row-selected td { background: #FFF8EC !important; }
.empty-state { padding: 2.5rem 1rem; text-align: center; color: #6B7280; }

.chart-box { position: relative; height: 300px; }
.chart-box.pie { height: 280px; }

/* Toasts */
.toast-area { position: fixed; top: 1rem; right: 1rem; z-index: 2000; display: flex; flex-direction: column; gap: .5rem; max-width: calc(100vw - 2rem); }
.toast-msg { background: #1F2937; color: #fff; padding: .75rem 1rem; border-radius: .5rem; box-shadow: 0 .5rem 1rem rgba(0,0,0,.15); font-size: .875rem; }
.toast-msg.error { background: #E11D48; }

/* Page header */
.page-head { gap: .75rem; }
.page-head h1 { font-size: 1.4rem; }

/* Mobile */
@media (max-width: 575.98px) {
  .content { padding: 0 .75rem; }
  .stat-card .stat-value { font-size: 1.15rem; }
  .page-head .btn { width: 100%; }
  .table { font-size: .85rem; }
}

/* Safe areas for installed app on notched phones */
@supports (padding: env(safe-area-inset-top)) {
  .navbar-theme-primary { padding-top: calc(.5rem + env(safe-area-inset-top)); }
  main.content { padding-bottom: env(safe-area-inset-bottom); }
}

/* Top bar fixes */
#yearSelect { min-width: 8.5rem; padding-right: 2.25rem; }
#userName { color: #1F2937 !important; }

/* Dashboard: income-by-source legend (HTML, never cropped) */
.chart-box.pie { height: 220px; }
.pie-legend { list-style: none; padding: 0; margin: 1rem 0 0; font-size: .82rem; }
.pie-legend li { display: flex; align-items: center; gap: .5rem; padding: .3rem 0; border-bottom: 1px solid #F2F4F6; }
.pie-legend li:last-child { border-bottom: 0; }
.pie-legend .dot { width: .65rem; height: .65rem; border-radius: 50%; flex-shrink: 0; }
.pie-legend .lbl { flex: 1; min-width: 0; color: #374151; }
.pie-legend .amt { font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pie-legend .pct { width: 3.2rem; text-align: right; color: #6B7280; font-variant-numeric: tabular-nums; }

/* Jobs: expandable list */
.job-item { border-bottom: 1px solid #E5E7EB; }
.job-item:last-child { border-bottom: 0; }
.job-head { width: 100%; display: flex; align-items: center; gap: .75rem; padding: 1rem 1.5rem; background: none; border: 0; text-align: left; }
.job-head:hover { background: #F9FAFB; }
.job-item.open > .job-head { background: #F9FAFB; }
.job-chevron { font-size: 1.4rem; line-height: 1; color: #6B7280; transition: transform .15s; width: 1rem; }
.job-item.open .job-chevron { transform: rotate(90deg); }
.job-main { flex: 1; min-width: 0; }
.job-sum { text-align: right; white-space: nowrap; }
.job-body { padding: 0 0 1rem; background: #fff; }
.job-tools { display: flex; align-items: center; gap: .5rem; padding: .75rem 1.5rem 0; flex-wrap: wrap; }
@media (max-width: 575.98px) {
  .job-head { padding: .85rem 1rem; flex-wrap: wrap; }
  .job-sum { width: 100%; text-align: left; padding-left: 1.75rem; }
  .job-tools { padding: .75rem 1rem 0; }
}

/* India Payment: loan equation */
.loan-eq { display: flex; align-items: flex-end; gap: 1rem; flex-wrap: wrap; }
.loan-eq .loan-op { font-size: 1.5rem; color: #9CA3AF; padding-bottom: .1rem; }
@media (max-width: 575.98px) { .loan-eq { flex-direction: column; align-items: flex-start; gap: .25rem; } .loan-eq .loan-op { display: none; } }
.pie-wrap { display: flex; align-items: center; gap: 2rem; }
.pie-wrap .chart-box.pie { flex: 0 0 240px; height: 240px; }
.pie-wrap .pie-legend { flex: 1; margin: 0; }
@media (max-width: 767.98px) {
  .pie-wrap { flex-direction: column; align-items: stretch; gap: 1rem; }
  .pie-wrap .chart-box.pie { flex-basis: auto; height: 220px; }
}

/* Dashboard: tappable stat cards */
.stat-link { display: block; height: 100%; color: inherit; text-decoration: none; }
.stat-link .stat-card { transition: transform .12s, box-shadow .12s; }
.stat-link:hover .stat-card, .stat-link:focus-visible .stat-card { transform: translateY(-2px); box-shadow: 0 .5rem 1rem rgba(31, 41, 55, .12) !important; }
.stat-link:active .stat-card { transform: translateY(0); }
.stat-go { margin-left: auto; padding-left: .5rem; font-size: 1.5rem; line-height: 1; color: #9CA3AF; }
.stat-card .stat-value { white-space: nowrap; }
.stat-link .icon-shape { width: 3rem; height: 3rem; }
.stat-link .stat-card .card-body { padding: 1.25rem; }