/*
 * Toast notifications (custom, Ayat Global): AIZ.plugins.notify → bootstrap-notify.
 * White card, coloured round icon, thin progress line. Top right on computers, top centre on phones.
 * Loaded after aiz-core.css / aiz-seller.css, so it wins over the old .aiz-notify rules.
 */
.aiz-notify.aiz-toast {
    --toast: #3b82f6;
    --toast-soft: rgba(59, 130, 246, .12);
    display: flex !important;
    align-items: flex-start;
    gap: 12px;
    width: 380px;
    max-width: calc(100vw - 40px);
    margin: 0 !important;
    padding: 14px 44px 16px 14px;
    border: 0;
    border-radius: 14px;
    background: #fff !important;
    color: #1f2937 !important;
    box-shadow: 0 18px 40px -14px rgba(15, 23, 42, .35), 0 0 0 1px rgba(15, 23, 42, .06);
    overflow: hidden;
    font-size: 14px;
    line-height: 1.45;
    font-weight: 500;
}
.aiz-notify.aiz-toast.alert-success { --toast: #16a34a; --toast-soft: rgba(22, 163, 74, .12); }
.aiz-notify.aiz-toast.alert-danger { --toast: #e11d48; --toast-soft: rgba(225, 29, 72, .12); }
.aiz-notify.aiz-toast.alert-warning { --toast: #d97706; --toast-soft: rgba(217, 119, 6, .14); }
.aiz-notify.aiz-toast.alert-info { --toast: #0284c7; --toast-soft: rgba(2, 132, 199, .12); }
.aiz-notify.aiz-toast.alert-primary { --toast: var(--primary, #e62e04); --toast-soft: var(--soft-primary, rgba(230, 46, 4, .12)); }
.aiz-notify.aiz-toast.alert-dark,
.aiz-notify.aiz-toast.alert-secondary,
.aiz-notify.aiz-toast.alert-light { --toast: #374151; --toast-soft: rgba(55, 65, 81, .1); }

.aiz-toast .aiz-toast-icon {
    flex: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--toast-soft);
    color: var(--toast);
    font-size: 18px;
}
.aiz-toast .aiz-toast-icon i { font-weight: 900; }
.aiz-toast .aiz-toast-text { flex: 1 1 auto; min-width: 0; padding-top: 5px; word-break: break-word; }

/* Close button (bootstrap-notify puts inline positions on it) */
.aiz-notify.aiz-toast .close {
    position: absolute !important;
    top: 12px !important;
    right: 10px !important;
    left: auto !important;
    width: 28px;
    height: 28px;
    padding: 0;
    margin: 0;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: #9ca3af !important;
    font-size: 15px;
    opacity: 1;
    text-shadow: none;
    transition: background .15s, color .15s;
}
.aiz-notify.aiz-toast .close::before { display: none !important; }
.aiz-notify.aiz-toast .close:hover { background: #f3f4f6; color: #111827 !important; }

/* Time left */
.aiz-notify.aiz-toast .progress {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    border-radius: 0;
    background: transparent;
}
.aiz-notify.aiz-toast .progress-bar { background: var(--toast) !important; opacity: .85; transition: width 1s linear; }

/* In / out */
@keyframes aiz-toast-in { from { opacity: 0; transform: translateY(-12px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes aiz-toast-out { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateX(24px); } }
.aiz-toast.aiz-toast-in { animation: aiz-toast-in .28s cubic-bezier(.2, .8, .2, 1) both; }
.aiz-toast.aiz-toast-out { animation: aiz-toast-out .25s ease-in both; }

/* Right to left */
[dir="rtl"] .aiz-notify.aiz-toast { padding: 14px 14px 16px 44px; }
[dir="rtl"] .aiz-notify.aiz-toast .close { right: auto !important; left: 10px !important; }
[dir="rtl"] .aiz-toast.aiz-toast-out { animation-name: aiz-toast-out-rtl; }
@keyframes aiz-toast-out-rtl { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateX(-24px); } }

/* Phones: full width at the top, under the notch */
@media (max-width: 575.98px) {
    .aiz-notify.aiz-toast {
        left: 12px !important;
        right: 12px !important;
        width: auto;
        max-width: none;
        margin-top: env(safe-area-inset-top, 0px) !important;
    }
    .aiz-toast.aiz-toast-out { animation-name: aiz-toast-out-up; }
    @keyframes aiz-toast-out-up { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(-16px); } }
}

@media (prefers-reduced-motion: reduce) {
    .aiz-toast.aiz-toast-in,
    .aiz-toast.aiz-toast-out { animation-duration: .01s; }
}