/* ══════════════════════════════════════════════════════════════════
   الإشعارات — fnv-toast (2026-09-23 · طلبُ المالك: «ظهور هذا الاشعار بهذا تصميم، يجب اعادة تصميم وادخال عليه افكار»)
   ⚖ شريطٌ معكوسُ اللون أسفلَ الشاشة: حبرٌ على سطحٍ مقلوب يفصله عن الصفحة بلا ظلّ (§4أ) · حوافُّ حادّة · وبلا لونِ حالةٍ
     كتليّ (§4ب): الحالُ شكلُ الأيقونة وحدَه (مصمتةٌ للنجاح والخطأ · مفرّغةٌ للتنبيه والمعلومة · والعلامةُ نفسُها ✓ أو !).
   ⛔ ولا حدَّ بدايةٍ للخطأ: حدٌّ بلون السطح على الحافّة الخارجيّة يذوب في الصفحة فيبدو الإشعارُ أضيقَ لا أبرز (قِيس بلقطة).
   ⚖ الرموزُ برجوعٍ إلى ألوان النظام (`CanvasText` · `Canvas`): لوحةُ الإدارة لا تُحمّل finviro-base فتبقى مقروءةً بلا hex.
   ⚖ الموضعُ أسفلَ الوسط: لا يغطّي شريطَ المؤشّرات ولا عنوانَ الصفحة (عطبُ اللقطة) · وعلى الهاتف فوق زرّ «أقسام الصفحة» العائم.
   ══════════════════════════════════════════════════════════════════ */

/* منطقتا البثّ لقارئ الشاشة — نُقلتا من <style> الجزء (القاعدة 1) */
.fnv-notify-sr,
.fnv-toast__sr {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.fnv-toasts {
    --fnv-toast-ink: var(--fnv-ink, CanvasText);
    --fnv-toast-paper: var(--fnv-surface, Canvas);
    --fnv-toast-dim: color-mix(in srgb, var(--fnv-toast-paper) 72%, var(--fnv-toast-ink));
    /* ⚖ `popover` يضع أنماطَه (إطارٌ وحشوةٌ ووسطُ الشاشة) — تُلغى هنا كلُّها */
    position: fixed;
    inset: auto 0 calc(24px + env(safe-area-inset-bottom, 0px)) 0;
    z-index: var(--z-toast);
    display: none;
    flex-direction: column;
    gap: 8px;
    width: min(460px, calc(100% - 24px));
    height: auto;
    margin: 0 auto;
    padding: 0;
    border: 0;
    overflow: visible;
    background: transparent;
    color: var(--fnv-toast-paper);
    pointer-events: none;
}
/* بلا `popover` (متصفّحٌ أقدم): يظهر حين يحمل إشعاراً · ومعه: حين يُفتح في الطبقة العليا */
.fnv-toasts:not([popover]):not(:empty),
.fnv-toasts:is(:popover-open) { display: flex; }

.fnv-toast {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px;
    padding-block: 12px 14px;
    padding-inline: 14px 4px;
    background: var(--fnv-toast-ink);
    color: var(--fnv-toast-paper);
    font-family: var(--fnv-font-body, inherit);
    font-size: .9375rem;
    line-height: 1.75;
    pointer-events: auto;
    opacity: 1;
    transform: none;
    transition: opacity .18s ease-out, transform .18s ease-out;
}
@starting-style {
    .fnv-toast { opacity: 0; transform: translateY(8px); }
}
.fnv-toast.is-leaving { opacity: 0; transform: translateY(4px); }

/* الأيقونةُ عمودٌ في الشبكة لا طبقةٌ مطلقة ⇒ لا تغطّي النصّ أبداً (عطبُ اللقطة: علامةُ الصحّ فوق «been») */
.fnv-toast__ic {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin-top: 1px;
    border: 2px solid var(--fnv-toast-paper);
    background: transparent;
    color: var(--fnv-toast-paper);
    font-size: 1.0625rem;
    line-height: 1;
}
.fnv-toast[data-status="success"] .fnv-toast__ic,
.fnv-toast[data-status="error"] .fnv-toast__ic {
    background: var(--fnv-toast-paper);
    color: var(--fnv-toast-ink);
}

.fnv-toast__b { min-width: 0; padding-top: 3px; }
.fnv-toast__m { font-weight: 700; overflow-wrap: anywhere; }
.fnv-toast__l {
    margin: 4px 0 0;
    padding-inline-start: 18px;
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.8;
    color: var(--fnv-toast-dim);
}
.fnv-toast__a {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    margin-top: 2px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--fnv-toast-paper);
    font: inherit;
    font-size: .875rem;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

/* زرُّ الإغلاق: 44×44 للّمس (كان 28 بإطارٍ رماديّ) · بلا إطار · يشتدّ عند التحويم */
.fnv-toast__x {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-block: -9px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--fnv-toast-dim);
    font-size: 1.125rem;
    cursor: pointer;
}
.fnv-toast__x:hover { color: var(--fnv-toast-paper); }
.fnv-toast__x:focus-visible,
.fnv-toast__a:focus-visible {
    outline: 2px solid var(--fnv-toast-paper);
    outline-offset: -2px;
    color: var(--fnv-toast-paper);
}

/* الوقتُ الباقي: خطٌّ بسمك 2px يتوقّف مع المؤقّت (تحت المؤشّر · عند التركيز · والتبويبُ مخفيّ) */
.fnv-toast__bar {
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    height: 2px;
    background: var(--fnv-toast-dim);
    transform-origin: right;
    animation: fnv-toast-left var(--fnv-toast-ms, 5s) linear forwards;
}
.fnv-toast__bar:dir(ltr) { transform-origin: left; }
.fnv-toast.is-paused .fnv-toast__bar { animation-play-state: paused; }
@keyframes fnv-toast-left {
    from { transform: scaleX(1); }
    to { transform: scaleX(0); }
}

/* الهاتف: بعرض الشاشة ناقصاً الهامش · وفوق زرّ «أقسام الصفحة» العائم (قِيس: أسفلُه 16px وارتفاعُه 44 · وفقاعةُ الدعم مخفيّةٌ في الإعداد) */
@media (max-width: 767.98px) {
    .fnv-toasts {
        inset-block-end: calc(88px + env(safe-area-inset-bottom, 0px));
        width: calc(100% - 24px);
    }
}

/* ⚖ حركةٌ أقلّ: تلاشٍ بلا انزلاق · وخطُّ الوقت لا يتحرّك (المدّةُ باقيةٌ ويوقفها المؤشّر) */
@media (prefers-reduced-motion: reduce) {
    .fnv-toast { transition: opacity .1s linear; }
    @starting-style {
        .fnv-toast { transform: none; }
    }
    .fnv-toast.is-leaving { transform: none; }
    .fnv-toast__bar { display: none; }
}