/* BS-7355: shared admin toast, moved out of backstage-admin/style.css so event-admin pages
   (crew-staff-groups header) get it too. The var() fallbacks are the theme's :root values,
   so the toast looks the same on pages that never load the theme stylesheet. */
.cbs-toasts-wrapper {
    position: fixed;
    /* BS-7827: above every popup — the React Modal (1000) and the mobile sheets (999999) —
       so a toast fired while one is open (Generate Invoice from the mobile Actions sheet)
       is seen, not hidden behind it. */
    z-index: 1000000;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.cbs-toast {
    width: 400px;
    position: relative;
    overflow: hidden;
    border-radius: 4px;
    padding: 16px 17px;
    margin-bottom: 10px;
    background: var(--gray--light, #313440);
    justify-content: space-between;
    animation: cbs_toast_show 0.3s ease forwards;
    display: flex;
    align-items: center;
    color: var(--cfbc-white, #FFFFFF);
}

.cbs-toast.--hide {
    animation: cbs_toast_hide 0.3s ease forwards;
}

.cbs-toast::before {
    position: absolute;
    content: '';
    height: 3px;
    width: 100%;
    bottom: 0;
    left: 0;
    animation: cbs_toast_progress 4s linear forwards;
}

.cbs-toast.--success::before {
    background: var(--success, #32CD32);
}

.cbs-toast.--error::before {
    background: var(--error, #FF4500);
}

.cbs-toast.--warning::before {
    background: var(--warning, #e9bd0c);
}

.cbs-toast__icon .dashicons {
    font-size: 28px;
    width: 28px;
    height: 28px;
}

.cbs-toast.--success .cbs-toast__icon {
    color: var(--success, #32CD32);
}

.cbs-toast.--error .cbs-toast__icon {
    color: var(--error, #FF4500);
}

.cbs-toast.--warning .cbs-toast__icon {
    color: var(--warning, #e9bd0c);
}

.cbs-toast__text {
    flex: 1;
    margin: 0 10px;
}

.cbs-toast__close {
    cursor: pointer;
}

@keyframes cbs_toast_hide {
    100% { transform: translateY(40%); }
}

@keyframes cbs_toast_show {
    0% { transform: translateY(20%); }
    100% { transform: translateY(0%); }
}

@keyframes cbs_toast_progress {
    100% { width: 0%; }
}