/* --- FIX DEFINITIVO PARA TOAST FIFA --- */

/* Asegura que el contenedor no tape el header con un fondo blanco */
.fifa-toast {
    background: transparent !important;   /* el color queda en el header */
    border-radius: 25px !important;
    overflow: visible !important;
    min-width: 420px !important;
    box-shadow: 0 20px 40px rgba(0,0,0,0.5), 0 0 20px rgba(255,215,0,0.35) !important;
}

/* Borde y glow del contenedor según tipo */
.fifa-toast.fifa-toast-success { border: 4px solid #39ff14 !important; box-shadow: 0 0 28px #39ff14 !important; }
.fifa-toast.fifa-toast-danger  { border: 4px solid #ff073a !important; box-shadow: 0 0 28px #ff073a !important; }
.fifa-toast.fifa-toast-warning { border: 4px solid #ffd700 !important; box-shadow: 0 0 28px #ffd700 !important; }
.fifa-toast.fifa-toast-info    { border: 4px solid #00ffff !important; box-shadow: 0 0 28px #00ffff !important; }

/* Aplicar el degradado FUERTE directamente al header (más específico) */
.fifa-toast.fifa-toast-success > .toast-header {
    background: linear-gradient(145deg,#28a745,#20c997) !important;
}
.fifa-toast.fifa-toast-danger > .toast-header {
    background: linear-gradient(145deg,#c82333,#dc3545) !important; /* rojo intenso */
}
.fifa-toast.fifa-toast-warning > .toast-header {
    background: linear-gradient(145deg,#e0a800,#ffc107) !important;
}
.fifa-toast.fifa-toast-info > .toast-header {
    background: linear-gradient(145deg,#138496,#17a2b8) !important;
}

/* Refuerzos: texto, borde interno y clipping para evitar mezcla */
.fifa-toast .toast-header {
    color: #fff !important;
    font-weight: 900 !important;
    padding: 1.2rem 1.8rem !important;
    border-bottom: 3px dashed rgba(255,255,255,0.08) !important;
    background-clip: padding-box !important;
}

/* Cuerpo blanco y separado (sin transparencia) */
.fifa-toast .toast-body{
    background: linear-gradient(180deg,#ffffff,#f3f5f7);
    color:#222;
    padding:1.6rem 1.9rem;
    font-size:1.15rem;
    line-height:1.5;

    border-top:3px dashed rgba(0,0,0,0.12);

    box-shadow: inset 0 2px 6px rgba(0,0,0,0.05);

    border-bottom-left-radius:20px;
    border-bottom-right-radius:20px;
}

/* Asegura que el toast esté sobre el modal */
.toast-container { z-index: 2050 !important; }

/* Mantén la animación */
.fifa-toast.show{
    animation:
        slideInDown .5s cubic-bezier(.175,.885,.32,1.275),
        toastPulse 2.5s infinite .6s;
}
/* brillo que recorre el header */
.fifa-toast .toast-header{
    position:relative;
    overflow:hidden;
}

.fifa-toast .toast-header::after{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:120%;
    height:100%;
    background:linear-gradient(
        120deg,
        transparent 20%,
        rgba(255,255,255,0.6),
        transparent 80%
    );
    animation:toastShine 3s infinite;
}

@keyframes toastShine{
    0%{ left:-120%; }
    100%{ left:120%; }
}
/* efecto luz en el borde */
.fifa-toast{
    animation:toastPulse 2s infinite;
}

@keyframes toastPulse{
    0%{
        box-shadow:
        0 0 10px rgba(255,255,255,0.1),
        0 0 15px currentColor;
    }

    50%{
        box-shadow:
        0 0 25px currentColor,
        0 0 40px currentColor;
    }

    100%{
        box-shadow:
        0 0 10px rgba(255,255,255,0.1),
        0 0 15px currentColor;
    }
}
.fifa-toast-danger{
    animation:toastShake .45s ease-in-out;
}

@keyframes toastShake{
    0%{ transform:translateX(0); }
    20%{ transform:translateX(-6px); }
    40%{ transform:translateX(6px); }
    60%{ transform:translateX(-4px); }
    80%{ transform:translateX(4px); }
    100%{ transform:translateX(0); }
}
.fifa-toast-danger i{
    animation:iconPulse .8s infinite alternate;
}

@keyframes iconPulse{
    from{
        transform:scale(1);
    }
    to{
        transform:scale(1.2);
    }
}

.fifa-toast-danger .toast-body{
border-left:6px solid #ff073a;
}

.fifa-toast-success .toast-body{
border-left:6px solid #39ff14;
}

.fifa-toast-warning .toast-body{
border-left:6px solid #ffd700;
}

/* --- MEJORAS PARA TOAST EN MÓVILES (sin romper diseño FIFA) --- */
@media (max-width: 576px) {
    /* Contenedor del toast: ocupa todo el ancho, centrado */
    .toast-container {
        padding: 0.5rem !important;
        width: 100%;
        max-width: 100%;
        left: 0 !important;
        transform: none !important;
        text-align: center;
    }

    /* El toast en sí: ancho flexible, máximo 94%, y sobrescribe el min-width fijo */
    .fifa-toast {
        min-width: 0 !important;        /* ← clave: anula el 420px */
        width: 94%;
        max-width: 94%;
        margin: 0 auto;
        font-size: 0.9rem;
    }

    /* Ajuste de padding en el header para que no ocupe tanto espacio */
    .fifa-toast .toast-header {
        padding: 0.75rem 1rem !important;
    }

    /* Reduce el padding del cuerpo */
    .fifa-toast .toast-body {
        padding: 1rem 1.2rem !important;
        font-size: 1rem !important;
        word-break: break-word;
        white-space: normal;
    }

    /* Ajuste del título para que no se desborde */
    .toast-header strong {
        font-size: 0.9rem;
    }
}