/* =============================================
   swal-custom.css — Horasdia
   Sobreescribe SweetAlert2 para un estilo
   compacto y corporativo coherente con el DS.
   Incluir en header.php o scriptsFooter.php
   ============================================= */

/* ── Overlay ──────────────────────────────── */
.swal2-container {
    font-family: 'DM Sans', sans-serif !important;
}

/* ── Popup principal ──────────────────────── */
.swal2-popup {
    font-family: 'DM Sans', sans-serif !important;
    border-radius: 14px !important;
    padding: 1.5rem 1.75rem 1.25rem !important;
    width: auto !important;
    max-width: 380px !important;
    min-width: 280px !important;
    box-shadow: 0 8px 32px rgba(13,31,51,.14), 0 2px 8px rgba(13,31,51,.08) !important;
    border: 1px solid #d6e4f0 !important;
    background: #ffffff !important;
}

/* Posición top — pequeño margen desde arriba */
.swal2-container.swal2-top,
.swal2-container.swal2-top-center {
    padding-top: 56px !important;   /* deja espacio al navbar */
}

/* ── Icono ────────────────────────────────── */
.swal2-icon {
    width: 48px !important;
    height: 48px !important;
    margin: 0 auto .75rem !important;
    border-width: 2px !important;
    font-size: 1.1rem !important;
}
.swal2-icon .swal2-icon-content {
    font-size: 1.5rem !important;
}

/* Colores icono por tipo */

/* ── Success ── */
.swal2-icon.swal2-success {
    border-color: #16a34a !important;
    color: #16a34a !important;
}
.swal2-icon.swal2-success .swal2-success-ring {
    border-color: rgba(22,163,74,.25) !important;
    width: 48px !important;
    height: 48px !important;
    top: -1px !important;
    left: -1px !important;
}
.swal2-icon.swal2-success [class^='swal2-success-line'] {
    background-color: #16a34a !important;
}
.swal2-icon.swal2-success .swal2-success-line-tip {
    width: 13px !important;
    top: 26px !important;
    left: 7px !important;
}
.swal2-icon.swal2-success .swal2-success-line-long {
    width: 22px !important;
    top: 22px !important;
    right: 6px !important;
}
.swal2-icon.swal2-success .swal2-success-fix {
    width: 7px !important;
    left: 22px !important;
    top: 6px !important;
}

/* ── Error ── */
.swal2-icon.swal2-error {
    border-color: #dc2626 !important;
    color: #dc2626 !important;
}
.swal2-icon.swal2-error [class^='swal2-x-mark-line'] {
    background-color: #dc2626 !important;
    width: 22px !important;
    top: 22px !important;
}
.swal2-icon.swal2-error .swal2-x-mark-line-left {
    left: 11px !important;
}
.swal2-icon.swal2-error .swal2-x-mark-line-right {
    right: 11px !important;
}
.swal2-icon.swal2-warning {
    border-color: #d97706 !important;
    color: #d97706 !important;
}
.swal2-icon.swal2-info {
    border-color: #297ecb !important;
    color: #297ecb !important;
}
.swal2-icon.swal2-question {
    border-color: #297ecb !important;
    color: #297ecb !important;
}

/* ── Título ───────────────────────────────── */
.swal2-title {
    font-family: 'DM Sans', sans-serif !important;
    font-size: .97rem !important;
    font-weight: 700 !important;
    color: #0d1f33 !important;
    padding: 0 0 .35rem !important;
    margin: 0 !important;
    line-height: 1.3 !important;
}

/* ── Texto / html content ─────────────────── */
.swal2-html-container,
.swal2-content {
    font-family: 'DM Sans', sans-serif !important;
    font-size: .82rem !important;
    color: #5a7494 !important;
    margin: 0 0 .25rem !important;
    padding: 0 !important;
    line-height: 1.55 !important;
}

/* ── Separador invisible ──────────────────── */
.swal2-actions {
    margin-top: 1.1rem !important;
    gap: .5rem !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
}

/* ── Botones — reset base ─────────────────── */
.swal2-actions button,
.swal2-confirm,
.swal2-cancel,
.swal2-deny {
    font-family: 'DM Sans', sans-serif !important;
    font-size: .8rem !important;
    font-weight: 700 !important;
    padding: .48rem 1.1rem !important;
    border-radius: 8px !important;
    border: none !important;
    cursor: pointer !important;
    transition: background .16s ease, transform .14s ease, box-shadow .16s ease !important;
    letter-spacing: .1px !important;
    line-height: 1 !important;
}
.swal2-actions button:focus {
    box-shadow: none !important;
    outline: none !important;
}
.swal2-actions button:hover {
    transform: translateY(-1px) !important;
}
.swal2-actions button:active {
    transform: translateY(0) !important;
}

/* Botones con clases Bootstrap — respetamos los colores del DS */
.swal2-actions .btn.btn-success,
.swal2-actions button.btn.btn-success {
    background: #16a34a !important;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(22,163,74,.28) !important;
}
.swal2-actions .btn.btn-success:hover {
    background: #15803d !important;
}

.swal2-actions .btn.btn-danger,
.swal2-actions button.btn.btn-danger {
    background: #dc2626 !important;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(220,38,38,.25) !important;
}
.swal2-actions .btn.btn-danger:hover {
    background: #b91c1c !important;
}

.swal2-actions .btn.btn-warning,
.swal2-actions button.btn.btn-warning {
    background: #d97706 !important;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(217,119,6,.25) !important;
}
.swal2-actions .btn.btn-warning:hover {
    background: #b45309 !important;
}

.swal2-actions .btn.btn-primary,
.swal2-actions button.btn.btn-primary {
    background: #297ecb !important;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(41,126,203,.28) !important;
}
.swal2-actions .btn.btn-primary:hover {
    background: #1b5fa0 !important;
}

.swal2-actions .btn.btn-secondary,
.swal2-actions button.btn.btn-secondary {
    background: #f4f7fb !important;
    color: #5a7494 !important;
    border: 1.5px solid #d6e4f0 !important;
    box-shadow: none !important;
}
.swal2-actions .btn.btn-secondary:hover {
    background: #d6e4f0 !important;
    color: #0d1f33 !important;
}

/* me y ms spacing en botones */
.swal2-actions .me-2 { margin-right: .5rem !important; }
.swal2-actions .ms-2 { margin-left:  .5rem !important; }

/* ── Timer progress bar ───────────────────── */
.swal2-timer-progress-bar {
    background: #297ecb !important;
    height: 3px !important;
    border-radius: 0 0 14px 14px !important;
}
.swal2-timer-progress-bar-container {
    border-radius: 0 0 14px 14px !important;
    overflow: hidden !important;
}

/* ── Animación de entrada más sutil ──────── */
.swal2-show {
    animation: swalFadeIn .2s ease both !important;
}
.swal2-hide {
    animation: swalFadeOut .15s ease both !important;
}
@keyframes swalFadeIn {
    from { opacity: 0; transform: translateY(-10px) scale(.97); }
    to   { opacity: 1; transform: translateY(0)     scale(1); }
}
@keyframes swalFadeOut {
    from { opacity: 1; transform: translateY(0)     scale(1); }
    to   { opacity: 0; transform: translateY(-6px)  scale(.97); }
}

/* ── Overlay más sutil ────────────────────── */
.swal2-backdrop-show {
    background: rgba(10,30,56,.35) !important;
    backdrop-filter: blur(2px) !important;
}

/* ── Fix especificidad alta para botones Bootstrap dentro de Swal ── */
/* Necesario cuando buttonsStyling: false — Bootstrap gana sin esto  */
.swal2-container .swal2-popup .swal2-actions .btn {
    font-family: 'DM Sans', sans-serif !important;
    font-size: .8rem !important;
    font-weight: 700 !important;
    padding: .48rem 1.1rem !important;
    border-radius: 8px !important;
    line-height: 1 !important;
    transition: background .16s ease, transform .14s ease !important;
    box-shadow: none !important;
}
.swal2-container .swal2-popup .swal2-actions .btn:hover {
    transform: translateY(-1px) !important;
}
.swal2-container .swal2-popup .swal2-actions .btn-success {
    background-color: #16a34a !important;
    border-color: #16a34a !important;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(22,163,74,.28) !important;
}
.swal2-container .swal2-popup .swal2-actions .btn-success:hover {
    background-color: #15803d !important;
    border-color: #15803d !important;
}
.swal2-container .swal2-popup .swal2-actions .btn-danger {
    background-color: #dc2626 !important;
    border-color: #dc2626 !important;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(220,38,38,.25) !important;
}
.swal2-container .swal2-popup .swal2-actions .btn-danger:hover {
    background-color: #b91c1c !important;
    border-color: #b91c1c !important;
}
.swal2-container .swal2-popup .swal2-actions .btn-warning {
    background-color: #d97706 !important;
    border-color: #d97706 !important;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(217,119,6,.25) !important;
}
.swal2-container .swal2-popup .swal2-actions .btn-warning:hover {
    background-color: #b45309 !important;
    border-color: #b45309 !important;
}
.swal2-container .swal2-popup .swal2-actions .btn-primary {
    background-color: #297ecb !important;
    border-color: #297ecb !important;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(41,126,203,.28) !important;
}
.swal2-container .swal2-popup .swal2-actions .btn-primary:hover {
    background-color: #1b5fa0 !important;
    border-color: #1b5fa0 !important;
}
.swal2-container .swal2-popup .swal2-actions .btn-secondary {
    background-color: #f4f7fb !important;
    border-color: #d6e4f0 !important;
    border-width: 1.5px !important;
    color: #5a7494 !important;
    box-shadow: none !important;
}
.swal2-container .swal2-popup .swal2-actions .btn-secondary:hover {
    background-color: #d6e4f0 !important;
    color: #0d1f33 !important;
}