/**
 * Botones Squirrel — icono + texto y altura estándar en modales
 *
 * Referencia: modal "Cargar tablas auxiliares"
 * - gap icono/texto: 0.55rem (icono no pegado a las letras)
 * - padding horizontal generoso (icono no pegado al borde/círculo del botón)
 * - altura modal (btn normal): min-height 2.625rem
 *
 * IMPORTANTE: no forzar display:!important en .swal2-styled —
 * SweetAlert oculta deny/cancel con display:none y !important los volvería a mostrar.
 */

:root {
    --sq-btn-icon-gap: 0.55rem;
    --sq-modal-btn-min-height: 2.625rem;
    --sq-modal-btn-padding-y: 0.55rem;
    --sq-modal-btn-padding-x: 1.25rem;
    --sq-modal-btn-sm-min-height: 2.35rem;
    --sq-modal-btn-sm-padding-y: 0.45rem;
    --sq-modal-btn-sm-padding-x: 1.05rem;
}

/* —— Icono + texto: flex + gap (evita icono pegado a las letras) —— */
.sq-btn-with-icon,
.btn.sq-btn-with-icon,
.modal .btn.sq-btn-with-icon,
.modal-footer .btn.sq-btn-with-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sq-btn-icon-gap);
}

/*
 * Botones con <i>/<svg> + texto aunque no tengan .sq-btn-with-icon
 * (markup: <i class="fe ..."></i> Guardar)
 *
 * No usar :not(:has(> svg:only-child)): Feather deja el SVG como único
 * hijo elemento junto a un nodo de texto, y esa exclusión quitaba el gap.
 * Los solo-icono se cubren con .btn-icon / .btn-close.
 */
.btn:not(.btn-icon):not(.btn-close):not([class*="btn-close"]):has(> i),
.btn:not(.btn-icon):not(.btn-close):not([class*="btn-close"]):has(> svg),
.btn:not(.btn-icon):not(.btn-close):not([class*="btn-close"]):has(> [class^="ri-"]),
a.btn:not(.btn-icon):not(.btn-close):has(> i),
a.btn:not(.btn-icon):not(.btn-close):has(> svg),
a.btn:not(.btn-icon):not(.btn-close):has(> [class^="ri-"]),
.btn-link:not(.btn-icon):has(> i),
.btn-link:not(.btn-icon):has(> svg),
.dropdown-item:has(> i),
.dropdown-item:has(> svg),
.dropdown-item:has(> [class^="ri-"]) {
    display: inline-flex !important;
    align-items: center;
    gap: var(--sq-btn-icon-gap) !important;
}

.dropdown-item:has(> i),
.dropdown-item:has(> svg),
.dropdown-item:has(> [class^="ri-"]) {
    display: flex;
}

/* Si ya hay gap, anular me-1/me-2 del icono para no sumar márgenes */
.btn:not(.btn-icon) > i.me-1,
.btn:not(.btn-icon) > i.me-2,
.btn:not(.btn-icon) > i.me-3,
.btn:not(.btn-icon) > svg.me-1,
.btn:not(.btn-icon) > svg.me-2,
.btn:not(.btn-icon) > svg.me-3,
.btn:not(.btn-icon) > i,
.btn:not(.btn-icon) > svg,
.btn:not(.btn-icon) > [class^="ri-"],
a.btn:not(.btn-icon) > i.me-1,
a.btn:not(.btn-icon) > i.me-2,
a.btn:not(.btn-icon) > i.me-3,
a.btn:not(.btn-icon) > i,
a.btn:not(.btn-icon) > svg,
.btn-link > i,
.btn-link > svg,
.dropdown-item > i,
.dropdown-item > svg,
.dropdown-item > [class^="ri-"],
.sq-btn-with-icon > i.me-1,
.sq-btn-with-icon > i.me-2,
.sq-btn-with-icon > i.me-3,
.modal .btn > i.me-1,
.modal .btn > i.me-2,
.modal .btn > i.me-3,
.modal .btn > svg.me-1,
.modal .btn > svg.me-2,
.modal .btn > svg.me-3 {
    margin-right: 0 !important;
    margin-left: 0 !important;
    margin-inline: 0 !important;
    flex-shrink: 0;
}

.sq-btn-with-icon > i,
.sq-btn-with-icon > svg,
.btn:not(.btn-icon) > i:first-child,
a.btn:not(.btn-icon) > i:first-child,
.app-swal .swal2-styled > i,
.app-swal .swal2-styled > svg {
    font-size: 1.05em;
    line-height: 1;
    flex-shrink: 0;
}

.sq-btn-with-icon > span,
.app-swal .swal2-styled > span {
    line-height: 1.2;
}

/* —— Altura + padding estándar en modales (incluye clientes / expedientes / facturación / cobranza) —— */
.modal .btn:not(.btn-sm):not(.btn-lg):not(.btn-icon):not(.btn-close):not([class*="btn-close"]),
.modal-footer .btn:not(.btn-sm):not(.btn-lg):not(.btn-icon):not(.btn-close),
.modal .btn-precarga-primary,
.modal .btn-precarga-secondary {
    min-height: var(--sq-modal-btn-min-height);
    padding-top: var(--sq-modal-btn-padding-y) !important;
    padding-bottom: var(--sq-modal-btn-padding-y) !important;
    padding-left: var(--sq-modal-btn-padding-x) !important;
    padding-right: var(--sq-modal-btn-padding-x) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sq-btn-icon-gap) !important;
    border-radius: 0.65rem;
    font-weight: 600;
    line-height: 1.25;
}

/* btn-sm en footers de expediente/factura: antes sin padding-x → icono pegado al borde */
.modal .btn.btn-sm:not(.btn-icon):not(.btn-close):not([class*="btn-close"]),
.modal-footer .btn.btn-sm:not(.btn-icon):not(.btn-close) {
    min-height: var(--sq-modal-btn-sm-min-height);
    padding-top: var(--sq-modal-btn-sm-padding-y) !important;
    padding-bottom: var(--sq-modal-btn-sm-padding-y) !important;
    padding-left: var(--sq-modal-btn-sm-padding-x) !important;
    padding-right: var(--sq-modal-btn-sm-padding-x) !important;
    gap: var(--sq-btn-icon-gap) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.55rem;
    font-weight: 600;
    line-height: 1.25;
}

/* SweetAlert alineado al mismo estándar */
.app-swal .swal2-styled {
    align-items: center;
    justify-content: center;
    gap: var(--sq-btn-icon-gap);
    margin: 0.15rem !important;
    min-height: var(--sq-modal-btn-min-height);
    padding-top: var(--sq-modal-btn-padding-y);
    padding-bottom: var(--sq-modal-btn-padding-y);
    padding-left: var(--sq-modal-btn-padding-x);
    padding-right: var(--sq-modal-btn-padding-x);
    border-radius: 0.65rem;
    font-weight: 600;
}

.app-swal .swal2-styled.swal2-confirm,
.app-swal .swal2-styled.swal2-deny:not([style*="display: none"]),
.app-swal .swal2-styled.swal2-cancel:not([style*="display: none"]) {
    display: inline-flex;
}

.app-swal .swal2-actions {
    gap: 0.55rem;
    flex-wrap: wrap;
}

.app-swal .swal2-deny[style*="display: none"],
.app-swal .swal2-cancel[style*="display: none"],
.app-swal .swal2-confirm[style*="display: none"] {
    display: none !important;
}

.modal-precarga-auxiliar .btn-precarga-primary,
.modal-precarga-auxiliar .btn-precarga-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sq-btn-icon-gap);
    min-height: var(--sq-modal-btn-min-height);
    padding-left: var(--sq-modal-btn-padding-x) !important;
    padding-right: var(--sq-modal-btn-padding-x) !important;
}

.modal-precarga-auxiliar .btn-precarga-primary .ri,
.modal-precarga-auxiliar .btn-precarga-primary .fe,
.modal-precarga-auxiliar .btn-precarga-secondary .fe,
.modal-precarga-auxiliar .btn-precarga-secondary .ri {
    font-size: 1.1rem;
    line-height: 1;
    flex-shrink: 0;
}

/*
 * Refuerzo en páginas de clientes / expedientes / facturación / cobranza
 * (modales + CTAs de página: Feather convierte <i> en <svg> y pierde me-*)
 */
.clientes-report-page .btn:not(.btn-icon):not(.btn-close):has(> i),
.clientes-report-page .btn:not(.btn-icon):not(.btn-close):has(> svg),
.clientes-report-page a.btn:not(.btn-icon):has(> i),
.clientes-report-page a.btn:not(.btn-icon):has(> svg),
.page-cobranza .btn:not(.btn-icon):not(.btn-close):has(> i),
.page-cobranza .btn:not(.btn-icon):not(.btn-close):has(> svg),
.page-cobranza a.btn:not(.btn-icon):has(> i),
.page-cobranza a.btn:not(.btn-icon):has(> svg),
.registro-pago-page .btn:not(.btn-icon):not(.btn-close):has(> i),
.registro-pago-page .btn:not(.btn-icon):not(.btn-close):has(> svg),
.facturas-report-page .btn:not(.btn-icon):not(.btn-close):has(> i),
.facturas-report-page .btn:not(.btn-icon):not(.btn-close):has(> svg),
[class*="expediente"] .modal .btn:not(.btn-icon):not(.btn-close):has(> i),
[class*="expediente"] .modal .btn:not(.btn-icon):not(.btn-close):has(> svg) {
    display: inline-flex !important;
    align-items: center;
    gap: var(--sq-btn-icon-gap) !important;
}

.clientes-report-page .btn:not(.btn-icon) > i,
.clientes-report-page .btn:not(.btn-icon) > svg,
.page-cobranza .btn:not(.btn-icon) > i,
.page-cobranza .btn:not(.btn-icon) > svg,
.registro-pago-page .btn:not(.btn-icon) > i,
.registro-pago-page .btn:not(.btn-icon) > svg {
    margin-inline: 0 !important;
    flex-shrink: 0;
}