.toast-container {
     position: fixed;
     bottom: 1rem;
     right: 1rem;
     z-index: 1050;
     display: flex;
     flex-direction: column;
     gap: 1rem;
 }

 .toast {
     display: flex;
     align-items: center;
     background-color: var(--rf-toast-bg);
     color: var(--rf-toast-text);
     border-radius: var(--pico-border-radius);
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
     padding: 5px 10px;
     border-left: 7px solid;
     width: 300px;
     animation: fade-in 0.5s ease, slide-up 0.5s ease;
     transition: transform 0.6s ease, opacity 0.6s ease;
     opacity: 1;
 }

 .toast-content p {
     margin: 0;
     font-size: 0.875rem;
     color: var(--rf-toast-content-text);
 }

 .toast-content .toast-timestamp {
     font-size: 0.75rem;
     color: var(--rf-toast-timestamp-text);
 }

 .toast-notice {
     border-color: var(--rf-toast-notice-border);
 }

 .toast-alert {
     border-color: var(--rf-toast-alert-border);
 }

 /* Animations */
 @keyframes fade-in {
     from {
         opacity: 0;
     }

     to {
         opacity: 1;
     }
 }

 @keyframes slide-up {
     from {
         transform: translateY(10px);
     }

     to {
         transform: translateY(0);
     }
 }

 .toast.hide {
     transform: translateX(100%);
     /* Mueve el toast fuera de la pantalla */
     opacity: 0;
 }

 @keyframes fade-out {
     from {
         opacity: 1;
     }

     to {
         opacity: 0;
     }
 }

@keyframes slide-down {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(10px);
    }
}