/* zero2hero — admin › Pagos (registros) — page-scoped */

/* Date presets + active-filter chips */
#admin-registros .reg-presets { display: flex; flex-wrap: wrap; gap: 0.4rem; }
#admin-registros .reg-presets .btn { border-radius: var(--adm-radius-sm); }
#admin-registros .reg-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
#admin-registros .reg-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.22rem 0.35rem 0.22rem 0.7rem;
  border: 1px solid var(--adm-violet-line);
  background: var(--adm-violet-soft);
  color: var(--adm-violet-deep);
  border-radius: var(--adm-radius-sm);
  font-size: 0.78rem;
  font-weight: 600;
  max-width: 100%;
}
#admin-registros .reg-chip > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#admin-registros .reg-chip__x {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 0;
  background: transparent;
  color: var(--adm-violet-strong);
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  flex: 0 0 auto;
}
#admin-registros .reg-chip__x:hover { background: var(--adm-danger-soft); color: var(--adm-danger); }
#admin-registros .reg-chip__x:focus-visible { outline: none; box-shadow: var(--adm-ring); }

/* Charts: loading dim + empty overlay */
#admin-registros .admin-chart-wrap { transition: opacity 0.18s var(--adm-ease); }
#admin-registros .admin-chart-wrap.is-loading { opacity: 0.45; pointer-events: none; }
#admin-registros .reg-chart-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  text-align: center;
  color: var(--adm-muted);
  font-size: 0.85rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.85));
  border-radius: var(--adm-radius-sm);
  pointer-events: none;
}
#admin-registros .reg-chart-empty i { display: block; font-size: 1.2rem; color: var(--adm-muted-2); margin-bottom: 0.3rem; }
#admin-registros .reg-chart-caption { color: var(--adm-muted); font-size: 0.8rem; margin: 0.6rem 0 0; }

/* Table tooling */
#admin-registros .reg-table-wrap { max-height: 640px; overflow: auto; }
#admin-registros .reg-table-wrap thead th { position: sticky; top: 0; z-index: 2; }
#admin-registros .reg-sort {
  background: transparent;
  border: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}
#admin-registros .reg-sort i { font-size: 0.65rem; opacity: 0.45; }
#admin-registros th[aria-sort="ascending"] .reg-sort i,
#admin-registros th[aria-sort="descending"] .reg-sort i { opacity: 1; color: var(--adm-violet); }
#admin-registros .reg-ref {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  max-width: 100%;
}
#admin-registros .reg-ref code {
  font-family: var(--adm-font-mono);
  font-size: 0.72rem;
  color: var(--adm-text-2);
  background: var(--adm-surface-3);
  border: 1px solid var(--adm-border);
  border-radius: 6px;
  padding: 0.15rem 0.4rem;
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#admin-registros .reg-date { white-space: nowrap; }
#admin-registros .reg-date small { display: block; color: var(--adm-muted); font-size: 0.74rem; }
#admin-registros .reg-email { word-break: break-all; }
#admin-registros .reg-amount { font-weight: 700; white-space: nowrap; }
#admin-registros .reg-amount small { color: var(--adm-muted); font-weight: 500; }
#admin-registros .reg-pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.8rem;
  margin-top: 0.8rem;
  color: var(--adm-muted);
  font-size: 0.8rem;
}
#admin-registros .reg-pager__size { display: inline-flex; align-items: center; gap: 0.4rem; margin-left: auto; }
#admin-registros .reg-pager__size .form-select { width: auto; min-width: 5.5rem; }
#admin-registros .reg-pager__nav { display: inline-flex; gap: 0.3rem; }
#admin-registros .reg-updated { color: var(--adm-muted); font-size: 0.76rem; }

/* search icon must not overlap placeholder (skin raises form-control specificity) */
body.adm-body #admin-registros .adm-toolbar__search .form-control { padding-left: 2.3rem !important; }

/* Mobile: rows become stacked cards */
@media (max-width: 575.98px) {
  #admin-registros .reg-table-wrap { max-height: none; }
  #admin-registros .reg-table thead { display: none; }
  #admin-registros .reg-table tbody tr { display: block; border: 1px solid var(--adm-border); border-radius: var(--adm-radius-sm); margin-bottom: 0.6rem; background: var(--adm-surface); }
  #admin-registros .reg-table tbody tr > td { display: flex; gap: 0.6rem; justify-content: space-between; align-items: flex-start; border-bottom: 1px solid var(--adm-border) !important; padding: 0.5rem 0.75rem !important; }
  #admin-registros .reg-table tbody tr > td:last-child { border-bottom: 0 !important; }
  #admin-registros .reg-table tbody tr > td[data-label="Programa"] { flex-wrap: wrap; }
  #admin-registros .reg-table tbody tr > td[data-label="Programa"] > div { flex: 1 1 100%; min-width: 0; overflow-wrap: anywhere; }
  #admin-registros .reg-table tbody tr > td.reg-empty-cell { display: block; }
  #admin-registros .reg-table tbody td[data-label]::before {
    content: attr(data-label);
    font-family: var(--adm-font-mono);
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--adm-muted);
    flex: 0 0 auto;
    padding-top: 0.15rem;
  }
  #admin-registros .reg-table td.text-end { text-align: right; }
  #admin-registros .reg-ref code { max-width: 150px; }
  #admin-registros .reg-pager__size { margin-left: 0; }
}
