.config-wrap {
  margin-bottom: 40px;
}

.config-section--first {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.config-header {
  margin-bottom: 18px;
}

.config-empty,
.config-error {
  margin: 0;
}

.config-error {
  color: #c62828;
}

.config-wrap .title-secondary__list {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.config-add-card {
  width: 100%;
  border: 1px dashed rgba(13, 33, 54, 0.2);
  background: rgba(226, 226, 226, 0);
  color: #637080;
  appearance: none;
  font: inherit;
  transition:
    border-color 0.2s ease,
    background-color 0.2s ease,
    color 0.2s ease,
    transform 0.2s ease;
}

.config-add-card .title-secondary__main {
  width: 100%;
  justify-content: flex-start;
  gap: 10px;
}

.config-add-card .title-secondary__meta {
  text-align: left;
}

.config-add-card .title-secondary__icon {
  background: rgba(148, 148, 148, 0.137);
  color: #526070;
}

.config-add-card .title-secondary__name {
  color: inherit;
  margin: 0;
  text-transform: lowercase;
}

.config-add-card:hover {
  border-color: rgba(13, 33, 54, 0.45);
  background: rgba(13, 33, 54, 0.06);
  color: #374455;
  transform: translateY(-1px);
}

.config-add-card:focus-visible {
  outline: 0;
  border-color: var(--indigo, #8d7eff);
  box-shadow: 0 0 0 4px rgba(241, 239, 255, 0.2);
}

.config-card__icon--ingreso {
  background: var(--lime, #cfff04);
  color: #263300;
}

.config-card__icon--gasto {
  background: var(--indigo, #8d7eff);
  color: #ffffff;
}

.config-card__icon--cuenta {
  background: var(--midnight, #0b4550);
  color: #ffffff;
}

.config-card__saldo {
  margin: 4px 0 0;
  font-size: 12px;
  color: #5d6b7a;
}

.config-card__shared {
  display: inline-block;
  margin-left: 4px;
  color: var(--indigo, #8d7eff);
  vertical-align: middle;
}

.config-card__shared i {
  font-size: 11px;
  line-height: 1;
}

/* Permite que el tooltip desborde el contenedor truncado */
[data-cuenta-item-id] .title-secondary__name {
  overflow: visible;
}

.config-draggable-card {
  cursor: grab;
}

.config-draggable-card:active {
  cursor: grabbing;
}

.config-sortable-ghost {
  opacity: 0.35;
}

.config-sortable-chosen {
  transform: rotate(-1deg);
}

.spindi-swal-popup {
  border: 1px solid var(--gray, #edebee);
  border-radius: 18px;
  box-shadow: 0 16px 40px rgba(11, 69, 80, 0.18);
  font-family: "Poppins", sans-serif;
  padding: 22px 22px 18px;
}

.spindi-swal-title {
  color: var(--black, #1b1c1e);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.spindi-swal-content {
  color: #5d6b7a;
  font-size: 14px;
  line-height: 1.45;
}

.spindi-swal-actions {
  margin-top: 16px;
  gap: 8px;
}

.spindi-swal-btn {
  border: 1px solid transparent;
  border-radius: 999px;
  font-family: "Poppins", sans-serif;
  font-size: 13px;
  font-weight: 600;
  padding: 10px 18px;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    opacity 0.15s ease;
}

.spindi-swal-btn:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 4px rgba(141, 126, 255, 0.22);
}

.spindi-swal-btn--cancel {
  background: #f7f6f8;
  color: #374455;
  border-color: #e2dfe5;
}

.spindi-swal-btn--cancel:hover {
  transform: translateY(-1px);
  background: #efecf2;
}

.spindi-swal-btn--confirm {
  background: #c62828;
  color: #ffffff;
  border-color: #c62828;
}

.spindi-swal-btn--confirm:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(198, 40, 40, 0.25);
  background: #b71c1c;
  border-color: #b71c1c;
}

.spindi-swal-icon.swal2-warning {
  border-color: rgba(198, 40, 40, 0.35);
  color: #c62828;
}
