/* ══════════════════════════════════════
   CONTABILIDAD.CSS
   ══════════════════════════════════════ */

/* ── Desglose row ── */
.contab-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1rem;
}
@media (max-width: 768px) {
  .contab-row { grid-template-columns: 1fr; }
}

/* ── Breakdown card ── */
.contab-breakdown-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.2rem 1.4rem;
  box-shadow: var(--shadow-sm);
}
.contab-breakdown-card h4 {
  font-size: .85rem;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .4px;
  margin-bottom: .9rem;
}
.contab-breakdown-items { display: flex; flex-direction: column; gap: .55rem; }
.contab-bitem {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .45rem .6rem;
  border-radius: var(--radius-sm);
  background: var(--bg);
  font-size: .88rem;
}
.contab-bitem-label { color: var(--text-muted); }
.contab-bitem-val { font-weight: 700; color: var(--text); }
.contab-bitem-total {
  background: var(--primary-light);
  border: 1px solid var(--primary);
}
.contab-bitem-total .contab-bitem-label { color: var(--primary); font-weight: 700; }
.contab-bitem-total .contab-bitem-val   { color: var(--primary); }

/* ── Indicator card ── */
.contab-indicator-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.2rem 1.4rem;
  box-shadow: var(--shadow-sm);
  display: flex;
  align-items: center;
  gap: 1rem;
}
.contab-ind-icon { font-size: 2.4rem; line-height: 1; }
.contab-ind-text { display: flex; flex-direction: column; gap: .3rem; }
.contab-ind-title { font-size: 1rem; font-weight: 700; color: var(--text); }
.contab-ind-sub   { font-size: .82rem; color: var(--text-muted); }

.contab-indicator-card.ok    { border-color: var(--green); background: #f0fdf4; }
.contab-indicator-card.ok .contab-ind-title { color: var(--green); }
.contab-indicator-card.warn  { border-color: var(--yellow); background: #fffbeb; }
.contab-indicator-card.warn .contab-ind-title { color: #b45309; }
.contab-indicator-card.bad   { border-color: var(--red); background: #fef2f2; }
.contab-indicator-card.bad .contab-ind-title { color: var(--red); }

/* ── Chart card ── */
.contab-chart-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.2rem 1.4rem;
  box-shadow: var(--shadow-sm);
  margin-bottom: 1rem;
}
.contab-chart-card h4 {
  font-size: .85rem;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .4px;
  margin-bottom: .9rem;
}

/* ── Section box (salarios / proveedores) ── */
.contab-section-box {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.2rem 1.4rem;
  box-shadow: var(--shadow-sm);
  margin-bottom: 1rem;
  overflow: visible;
}
.contab-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: .9rem;
}
.contab-section-header h4 {
  font-size: .85rem;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .4px;
  margin: 0;
}
.contab-section-total {
  font-size: .88rem;
  font-weight: 700;
  color: var(--text);
}
.contab-table-wrap { overflow-x: auto; overflow-y: visible; }

/* Badge can-pay */
.badge-ok  { background: #d1fae5; color: #065f46; border-radius: 99px; padding: .15rem .55rem; font-size: .78rem; font-weight: 700; }
.badge-bad { background: #fee2e2; color: #991b1b; border-radius: 99px; padding: .15rem .55rem; font-size: .78rem; font-weight: 700; }

/* Dark mode tweaks */
body.dark-mode .contab-indicator-card.ok   { background: #052e16; border-color: #16a34a; }
body.dark-mode .contab-indicator-card.warn { background: #1c1400; border-color: #d97706; }
body.dark-mode .contab-indicator-card.bad  { background: #1a060a; border-color: #dc2626; }
body.dark-mode .contab-breakdown-card,
body.dark-mode .contab-indicator-card,
body.dark-mode .contab-chart-card,
body.dark-mode .contab-section-box { background: var(--surface); border-color: var(--border); }
body.dark-mode .contab-bitem { background: var(--surface); }

/* Empty row */
td.empty-row {
  text-align: center;
  padding: 1.5rem;
  color: var(--text-muted);
  font-style: italic;
}