/*
 * Every floating message at the top of the panel — one look, from every path
 * that makes one (تسک ۱۴۰۵/۰۷/۳۰/۰۱، بند ۱۴ و ۱۵).
 *
 * Filament's own messages, after a reload or after a Livewire request without
 * one, are all drawn as `.fi-no-notification`; the panel's few scripted notices
 * (the expired-page notice, the news draft's autosave) take the class
 * `.baligpa-toast` and read the same rules. No management colours a message of
 * its own, so a page or feature built tomorrow gets this without asking.
 *
 * - the whole box yellow #fbbf24, not only its edge;
 * - the title pure black, weight 700; the body dark #3f3f46, weight 400;
 * - the close button dark #18181b; Vazirmatn throughout;
 * - which kind it is stays clear: the status icon in its own colour on a white
 *   circle, and a stripe of that colour along the start edge.
 *
 * Only floating messages (`:not(.fi-inline)`): the bell's list, a confirmation
 * window and the error under a field are other things and are not touched.
 * Where the tray sits, how long a message stays, how several stack and how one
 * is closed are Filament's, unchanged.
 */

:root {
    --baligpa-toast-bg: #fbbf24;
    --baligpa-toast-title: #000000;
    --baligpa-toast-body: #3f3f46;
    --baligpa-toast-close: #18181b;
}

.fi-no-notification:not(.fi-inline),
:where(.dark) .fi-no-notification:not(.fi-inline),
.baligpa-toast {
    background-color: var(--baligpa-toast-bg) !important;
    color: var(--baligpa-toast-title) !important;
    font-family: 'Vazirmatn', var(--font-family, sans-serif) !important;
    --tw-ring-color: rgba(0, 0, 0, 0.12) !important;
    max-width: min(24rem, calc(100vw - 2rem)) !important;
    border-inline-start: 6px solid #18181b;
}

/* Filament paints a tinted inner box over the card; on yellow it must not. */
.fi-no-notification:not(.fi-inline) > div {
    background: transparent !important;
}

.fi-no-notification:not(.fi-inline).fi-status-success,
.baligpa-toast[data-status='success'] {
    border-inline-start-color: rgb(var(--success-700, 21 128 61));
}

.fi-no-notification:not(.fi-inline).fi-status-danger,
.baligpa-toast[data-status='danger'] {
    border-inline-start-color: rgb(var(--danger-700, 185 28 28));
}

.fi-no-notification:not(.fi-inline).fi-status-warning,
.baligpa-toast[data-status='warning'] {
    border-inline-start-color: rgb(var(--warning-800, 146 64 14));
}

.fi-no-notification:not(.fi-inline).fi-status-info,
.baligpa-toast[data-status='info'] {
    border-inline-start-color: rgb(var(--info-700, 29 78 216));
}

.fi-no-notification:not(.fi-inline) .fi-no-notification-title,
:where(.dark) .fi-no-notification:not(.fi-inline) .fi-no-notification-title,
.baligpa-toast .baligpa-toast-title {
    color: var(--baligpa-toast-title) !important;
    font-weight: 700 !important;
    overflow-wrap: anywhere;
}

.fi-no-notification:not(.fi-inline) .fi-no-notification-body,
:where(.dark) .fi-no-notification:not(.fi-inline) .fi-no-notification-body,
.fi-no-notification:not(.fi-inline) .fi-no-notification-date,
:where(.dark) .fi-no-notification:not(.fi-inline) .fi-no-notification-date,
.baligpa-toast .baligpa-toast-body {
    color: var(--baligpa-toast-body) !important;
    font-weight: 400 !important;
    overflow: visible !important;
    overflow-wrap: anywhere;
}

/* The kind of message: its icon, in its own colour, on a white circle. */
.fi-no-notification:not(.fi-inline) .fi-no-notification-icon,
.baligpa-toast .baligpa-toast-icon {
    background: #ffffff;
    border-radius: 9999px;
    padding: 2px;
    box-sizing: content-box;
    flex: none;
}

.fi-no-notification:not(.fi-inline).fi-status-success .fi-no-notification-icon,
.baligpa-toast[data-status='success'] .baligpa-toast-icon {
    color: rgb(var(--success-600, 22 163 74)) !important;
}

.fi-no-notification:not(.fi-inline).fi-status-danger .fi-no-notification-icon,
.baligpa-toast[data-status='danger'] .baligpa-toast-icon {
    color: rgb(var(--danger-600, 220 38 38)) !important;
}

.fi-no-notification:not(.fi-inline).fi-status-warning .fi-no-notification-icon,
.baligpa-toast[data-status='warning'] .baligpa-toast-icon {
    color: rgb(var(--warning-600, 217 119 6)) !important;
}

.fi-no-notification:not(.fi-inline).fi-status-info .fi-no-notification-icon,
.baligpa-toast[data-status='info'] .baligpa-toast-icon {
    color: rgb(var(--info-600, 37 99 235)) !important;
}

.fi-no-notification:not(.fi-inline) .fi-no-notification-close-btn,
.fi-no-notification:not(.fi-inline) .fi-no-notification-close-btn svg,
:where(.dark) .fi-no-notification:not(.fi-inline) .fi-no-notification-close-btn,
.baligpa-toast .baligpa-toast-close {
    color: var(--baligpa-toast-close) !important;
    opacity: 1 !important;
}

.fi-no-notification:not(.fi-inline) .fi-no-notification-close-btn:hover,
.fi-no-notification:not(.fi-inline) .fi-no-notification-close-btn:focus-visible {
    background: rgba(0, 0, 0, 0.1) !important;
    border-radius: 0.375rem;
}

/* Links and buttons inside a message stay readable on yellow. */
.fi-no-notification:not(.fi-inline) .fi-no-notification-actions a,
.fi-no-notification:not(.fi-inline) .fi-no-notification-actions .fi-link {
    color: #000000 !important;
    text-decoration: underline;
}
