.gs-toast {
position: fixed;
left: 18px;
bottom: 18px;
z-index: 10000;
display: inline-flex;
align-items: center;
gap: 12px;
max-width: min(380px, calc(100vw - 36px));
padding: 14px 18px;
border-radius: var(--radius-md);
background: #2f8f5b;
color: var(--color-text-blanco);
font-size: var(--text-sm);
font-weight: var(--font-semibold);
line-height: 1.4;
box-shadow: 0 18px 44px rgba(35, 31, 32, .22);
opacity: 0;
transform: translateY(18px);
transition: opacity .24s ease, transform .24s cubic-bezier(.2, 0, .2, 1);
}

.gs-toast.is-error {
background: var(--color-rojo);
}

.gs-toast__mark {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
width: 24px;
height: 24px;
border-radius: 999px;
background: rgba(255, 255, 255, .18);
}

.gs-toast__mark::before {
content: "";
width: 10px;
height: 6px;
border-left: 2px solid currentColor;
border-bottom: 2px solid currentColor;
transform: rotate(-45deg) translate(1px, -1px);
}

.gs-toast.is-error .gs-toast__mark::before,
.gs-toast.is-error .gs-toast__mark::after {
content: "";
position: absolute;
width: 11px;
height: 2px;
border: 0;
border-radius: 999px;
background: currentColor;
transform: rotate(45deg);
}

.gs-toast.is-error .gs-toast__mark::after {
transform: rotate(-45deg);
}

.gs-toast__message {
display: block;
}

.gs-toast.is-visible {
opacity: 1;
transform: translateY(0);
}

@media (max-width: 480px) {
.gs-toast {
left: var(--space-sm);
right: var(--space-sm);
bottom: var(--space-sm);
max-width: none;
}
}
