/* Integración del componente PaymentCapsules con el Resumen existente. */
.dashboard-v2 .pcaps__link .as-icon { width: 16px; height: 16px; }
.dashboard-v2 .pcaps__foot-date { min-width: 0; }
.dashboard-v2 .pcaps__foot-value { flex-shrink: 0; white-space: nowrap; }
.dashboard-v2 .db-panel-head .as-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 32px; padding: 0 12px; flex-shrink: 0; border: 0; border-radius: 8px;
  background: var(--as-surface); color: var(--as-text-primary); cursor: pointer;
  box-shadow: inset 0 0 0 1px var(--as-border-strong);
  font: 500 13px/1 var(--as-font-sans); white-space: nowrap;
}
.dashboard-v2 .db-panel-head .as-btn:hover { background: var(--as-surface-hover); }
.dashboard-v2 .db-panel-head .as-btn:focus-visible { outline: none; box-shadow: var(--as-focus-ring); }
.dashboard-v2 .db-movement-avatar {
  width: 36px; height: 36px; display: grid; place-items: center; flex-shrink: 0;
  border-radius: 50%; background: var(--as-surface-hover); color: var(--as-success-600);
  box-shadow: inset 0 0 0 1px var(--as-border-default);
}
.dashboard-v2 .db-movement-avatar .as-icon { width: 17px; height: 17px; }
.dashboard-v2 .db-movement span small { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.dashboard-v2 .db-method-chip {
  display: inline-flex; align-items: center; min-height: 20px; padding: 2px 7px;
  border-radius: 999px; background: var(--as-surface-secondary); color: var(--as-text-secondary);
  font: 500 10px var(--as-font-mono); letter-spacing: .03em;
}
.dashboard-v2 .db-movement time { color: var(--as-text-muted); font-variant-numeric: tabular-nums; }
.dashboard-v2 .db-movement > b { color: var(--as-text-primary); }
@media (min-width: 1101px) {
  .dashboard-v2 .db-lower-grid { align-items: stretch; }
  .dashboard-v2 .pcaps { padding: 18px 22px; gap: 14px; }
  .dashboard-v2 .pcaps__chart { height: 140px; }
  .dashboard-v2 .db-movements-panel { padding: 18px 22px; }
  .dashboard-v2 .db-movement-list { margin-top: 10px; }
  .dashboard-v2 .db-movement { padding: 7px 0; }
  .dashboard-v2 .db-movement-avatar { width: 32px; height: 32px; }
}
@media (max-width: 680px) {
  .dashboard-v2 .db-movement-avatar { width: 34px; height: 34px; }
}

/* Selector Día | Mes de "Actividad de pagos" (vista local, sin preferencias). */
.dashboard-v2 .pcaps__chart { grid-template-columns: repeat(var(--pcaps-cols, 7), minmax(0, 1fr)); }
.dashboard-v2 .pcaps__titles { min-width: 0; }
.dashboard-v2 .pcaps__controls { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
/* Interruptor idéntico al filtro de estado de Clientes (.as-segmented):
   cápsula arena, opción activa en blanco con relieve suave. Sin naranja. */
.dashboard-v2 .pcaps__switch {
  display: inline-flex; gap: 4px; padding: 4px; border-radius: 12px;
  background: var(--as-surface-hover);
}
.dashboard-v2 .pcaps__switch-btn {
  min-width: 44px; height: 32px; padding: 0 14px; border: 0; border-radius: 9px;
  background: transparent; color: var(--as-text-secondary); cursor: pointer;
  font: 500 13px/1 var(--as-font-sans);
  transition: background .15s ease, color .15s ease;
}
.dashboard-v2 .pcaps__switch-btn:hover:not([aria-pressed="true"]) { color: var(--as-text-primary); background: var(--as-surface-secondary); }
.dashboard-v2 .pcaps__switch-btn[aria-pressed="true"] {
  background: var(--as-surface); color: var(--as-text-primary); font-weight: 600;
  box-shadow: 0 1px 2px rgba(28, 22, 18, .08);
}
.dashboard-v2 .pcaps__switch-btn:focus-visible { outline: none; box-shadow: var(--as-ring); }
@media (pointer: coarse), (max-width: 640px) {
  .dashboard-v2 .pcaps__switch-btn { height: 44px; min-width: 52px; }
  .dashboard-v2 .pcaps__controls { gap: 6px; }
}
/* En móvil los controles bajan a su propia fila: el total nunca se parte. */
@media (max-width: 480px) {
  .dashboard-v2 .pcaps__head { flex-direction: column; align-items: stretch; gap: 12px; }
  .dashboard-v2 .pcaps__controls { justify-content: space-between; }
  .dashboard-v2 .pcaps__total { white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) {
  .dashboard-v2 .pcaps__switch-btn { transition: none; }
}

/* Vista "Mes": 12 columnas parejas, barras más delgadas que las de "Día".
   min-width:0 es necesario porque .pcaps es un ítem de grid/flex: sin él, su
   ancho mínimo por defecto es el del contenido (12 columnas fijas) y el
   scroll horizontal de más abajo nunca se activa — en vez de eso empuja
   todo el documento. */
.dashboard-v2 .pcaps { min-width: 0; }
.dashboard-v2 .pcaps__chart--months { gap: 8px; min-width: 0; }
.dashboard-v2 .pcaps__chart--months .pcaps__track { max-width: 20px; }
.dashboard-v2 .pcaps__chart--months .pcaps__day { gap: 8px; }
.dashboard-v2 .pcaps__chart--months .pcaps__value { font-size: 10.5px; }
/* Mes futuro: atenuado y sin interacción (no hay dato que mostrar todavía). */
.dashboard-v2 .pcaps__chart--months .pcaps__day.is-future { opacity: .4; cursor: default; }
.dashboard-v2 .pcaps__chart--months .pcaps__day.is-future .pcaps__track { background: var(--as-surface-hover); }
/* En pantallas angostas, 12 columnas ya no leen bien apretadas: se reemplaza
   la rejilla pareja por scroll horizontal con columnas de ancho fijo, cada
   una con touch target correcto (≥44px). */
@media (max-width: 640px) {
  .dashboard-v2 .pcaps__chart--months {
    display: flex; overflow-x: auto; gap: 14px; padding-bottom: 4px;
    scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch;
  }
  .dashboard-v2 .pcaps__chart--months .pcaps__day {
    flex: 0 0 auto; width: 44px; scroll-snap-align: start;
  }
  .dashboard-v2 .pcaps__chart--months .pcaps__track { max-width: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .dashboard-v2 .pcaps__chart--months { scroll-behavior: auto; }
}