/* =====================================================================
   فونت ایران‌سنس — یک‌جا برای کل سایت و همه خروجی‌ها
   ---------------------------------------------------------------------
   قبلاً 'IRANSans' در font-family نوشته شده بود ولی هیچ @font-face
   نداشت؛ یعنی هیچ‌وقت لود نمی‌شد و عملاً بی‌اثر بود. اینجا واقعاً
   ثبت می‌شود: اول فونت نصب‌شده روی سیستم، بعد فایل محلی /fonts/.
   اگر فایل فونت موجود نباشد، مرورگر بی‌صدا سراغ وزیرمتن می‌رود.
   راهنمای گذاشتن فایل‌ها: wwwroot/fonts/README-FONT-FA.txt
   ===================================================================== */
@font-face {
    font-family: 'IRANSans';
    src: local('IRANSansX'), local('IRANSansX Regular'), local('IRANSans'), local('IRANSans Regular'),
         url('/fonts/IRANSansX-Regular.woff2') format('woff2'),
         url('/fonts/IRANSansX-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'IRANSans';
    src: local('IRANSansX Medium'), local('IRANSans Medium'),
         url('/fonts/IRANSansX-Medium.woff2') format('woff2'),
         url('/fonts/IRANSansX-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'IRANSans';
    src: local('IRANSansX Bold'), local('IRANSans Bold'),
         url('/fonts/IRANSansX-Bold.woff2') format('woff2'),
         url('/fonts/IRANSansX-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'IRANSans';
    src: local('IRANSansX Black'), local('IRANSans Black'),
         url('/fonts/IRANSansX-Black.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

:root {
    /* یک متغیر واحد: هرجای سایت و خروجی‌ها از همین استفاده می‌کند */
    --daovi-font: 'IRANSans', 'IRANSansX', 'Vazirmatn', Tahoma, Arial, sans-serif;
    /* تم روشن اجباری: وگرنه در حالت تاریک سیستم، کمبوباکس‌ها و لیست
       بازشوی آنها را مرورگر خاکستری/تیره می‌کشد */
    color-scheme: light only;
}

html, body, .daovi-font {
    /* ایران‌سنس اول، بعد وزیرمتن (Google Fonts) و در آخر Tahoma — تعریف
       @font-face بالای همین فایل است، پس 'IRANSans' واقعاً لود می‌شود.
       نکته: preflight تیلویند هم روی html فونت می‌گذارد؛ این فایل بعد از
       tailwind.css لود می‌شود پس همین قاعده برنده است */
    font-family: var(--daovi-font) !important;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.progress-step-active {
    background-color: #3a7bd5;
    color: white;
}

.hero-pattern {
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%232d4a77' fill-opacity='0.2'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.status-pending { background-color: #FEF3C7; color: #92400E; }
.status-active { background-color: #DCFCE7; color: #166534; }
.status-closed { background-color: #E5E7EB; color: #1F2937; }
.status-urgent { background-color: #FEE2E2; color: #991B1B; }
.case-status-won { background-color: #DCFCE7; color: #166534; }
.case-status-pending { background-color: #FEF3C7; color: #92400E; }
.case-status-lost { background-color: #FEE2E2; color: #991B1B; }
.case-status-settled { background-color: #DBEAFE; color: #1E40AF; }

.chart-container {
    position: relative;
    height: 200px;
    width: 100%;
}

.case-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.stat-card { transition: all 0.3s ease; }
.stat-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.progress-bar-track {
    height: 8px;
    border-radius: 4px;
    background-color: #E5E7EB;
    overflow: hidden;
}

.progress-value {
    height: 100%;
    border-radius: 4px;
}

.upload-area {
    border: 2px dashed #cbd5e0;
    transition: all 0.3s ease;
}

.upload-area:hover, .upload-area.dragover {
    border-color: #4299e1;
    background-color: #ebf8ff;
}

.tab-active {
    border-bottom: 3px solid #1e40af;
    color: #1e40af;
    font-weight: 600;
}

/* ===== ناوبار صفحه اصلی (طراحی از صفر) ===== */
.home-header {
    background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: 0 1px 0 rgba(15, 23, 42, .06), 0 8px 24px rgba(15, 23, 42, .06);
}

.home-nav-link {
    position: relative;
    color: #475569;
    font-weight: 500;
    font-size: .95rem;
    padding: .35rem 0;
    transition: color .25s, transform .25s;
}

.home-nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 50%;
    transform: translateX(50%);
    width: 0;
    height: 2.5px;
    border-radius: 2px;
    background: linear-gradient(90deg, #2e6bff, #6fd4ff);
    transition: width .3s ease;
}

.home-nav-link:hover { color: #14337f; transform: translateY(-2px); }
.home-nav-link:hover::after, .home-nav-link.is-active::after { width: 100%; }
.home-nav-link.is-active { color: #14337f; font-weight: 700; }

.home-btn-login {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-weight: 700;
    font-size: .9rem;
    color: #14337f;
    padding: .5rem 1.15rem;
    border: 1.5px solid #e2e8f0;
    border-radius: 999px;
    transition: all .25s;
}

.home-btn-login:hover {
    border-color: #2e6bff;
    color: #2e6bff;
    background: #eef4ff;
    transform: translateY(-1px);
}

.home-btn-signup {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-weight: 800;
    font-size: .9rem;
    color: #fff;
    padding: .55rem 1.35rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #2e6bff, #14337f);
    box-shadow: 0 8px 20px rgba(46, 107, 255, .35);
    transition: transform .25s, box-shadow .25s;
}

.home-btn-signup:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(46, 107, 255, .5);
}

/* افکت جاروی نور */
.btn-shine { position: relative; overflow: hidden; }
.btn-shine::after {
    content: '';
    position: absolute;
    top: 0; bottom: 0;
    width: 45%;
    right: -65%;
    background: linear-gradient(100deg, transparent, rgba(255,255,255,.5), transparent);
    transform: skewX(20deg);
    transition: right .55s ease;
}
.btn-shine:hover::after { right: 120%; }

/* همبرگر → ضربدر */
.nav-toggle { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; }
.burger { display: block; width: 22px; height: 17px; position: relative; }
.burger span {
    position: absolute; right: 0; left: 0; height: 2.5px; border-radius: 2px;
    background: #14337f;
    transition: transform .35s cubic-bezier(.22,1,.36,1), opacity .2s, top .35s;
}
.burger span:nth-child(1) { top: 0; }
.burger span:nth-child(2) { top: 7px; }
.burger span:nth-child(3) { top: 14px; }
.burger.is-open span:nth-child(1) { top: 7px; transform: rotate(45deg); }
.burger.is-open span:nth-child(2) { opacity: 0; }
.burger.is-open span:nth-child(3) { top: 7px; transform: rotate(-45deg); }

/* منوی موبایل با ورود پلکانی */
.mobile-menu {
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s ease;
}
.mobile-menu.is-open { max-height: 480px; padding-bottom: .5rem; }
.mobile-link {
    display: block;
    text-align: center;
    padding: .65rem 0;
    color: #475569;
    font-weight: 500;
    opacity: 0;
    transform: translateY(10px);
    transition: opacity .35s, transform .35s;
    transition-delay: 0s;
}
.mobile-menu.is-open .mobile-link {
    opacity: 1;
    transform: none;
    transition-delay: var(--d, 0s);
}
.mobile-link:hover { color: #2e6bff; }

/* ===== هیرو با عکس حرفه‌ای ===== */
.hero-photo {
    background-color: #0a1f5c;
    background-image:
        linear-gradient(140deg, rgba(10,31,92,.93) 0%, rgba(29,78,216,.86) 48%, rgba(46,107,255,.78) 100%),
        url('https://images.unsplash.com/photo-1505664194779-8beaceb93744?auto=format&fit=crop&w=1920&q=70');
    background-size: cover;
    background-position: center 35%;
    background-repeat: no-repeat;
}

/* ===== بخش ۴ قدم با عکس پس‌زمینه ===== */
.steps-photo {
    background-color: #0a1f5c;
    background-image:
        linear-gradient(140deg, rgba(10,31,92,.94), rgba(29,78,216,.88)),
        url('https://images.unsplash.com/photo-1589994965851-a8f479c573a9?auto=format&fit=crop&w=1600&q=60');
    background-size: cover;
    background-position: center;
}

@media (max-width: 768px) {
    .hero-photo, .steps-photo { background-attachment: scroll; }
}

/* ===== صفحه اصلی مینیمال: پس‌زمینه حرفه‌ای هیرو ===== */
.hero-min {
    position: relative;
    background-color: #fff;
    background-image:
        linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.88) 55%, rgba(255,255,255,.97) 100%),
        url('img/photo-1505664194779-8beaceb93744.webp');
    background-size: cover;
    background-position: center 40%;
    background-repeat: no-repeat;
}

/* ===== انیمیشن‌های ورود ===== */
@keyframes rise-in {
    from { opacity: 0; transform: translateY(26px); }
    to   { opacity: 1; transform: none; }
}

.anim-hero > * { animation: rise-in .7s cubic-bezier(.22,1,.36,1) both; }
.anim-hero > *:nth-child(1) { animation-delay: .05s; }
.anim-hero > *:nth-child(2) { animation-delay: .15s; }
.anim-hero > *:nth-child(3) { animation-delay: .25s; }
.anim-hero > *:nth-child(4) { animation-delay: .35s; }
.anim-hero > *:nth-child(5) { animation-delay: .45s; }

/* reveal هنگام اسکرول (با IntersectionObserver در site.js) */
.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1);
    transition-delay: var(--rd, 0s);
}
.reveal.visible { opacity: 1; transform: none; }

/* شناوری آرام لکه آبی هیرو */
@keyframes blob-drift {
    0%, 100% { transform: translate(-50%, 0) scale(1); }
    50%      { transform: translate(-50%, 14px) scale(1.06); }
}
.hero-blob { animation: blob-drift 9s ease-in-out infinite; }

/* میکرواینترکشن آیکون کارت‌ها */
.icon-pop { transition: transform .35s cubic-bezier(.34,1.56,.64,1); }
.group:hover .icon-pop { transform: translateY(-4px) rotate(-5deg) scale(1.08); }

/* دکمه‌ها: حالت فشردن */
a[style*="--accent"]:active, button:active { transform: scale(.97); }

@media (prefers-reduced-motion: reduce) {
    .anim-hero > *, .hero-blob { animation: none !important; }
    .reveal { opacity: 1; transform: none; transition: none; }
}

/* ============================================================
   ویجت شناور هوش مصنوعی حقوقی همداد (در همه پنل‌ها)
   ============================================================ */
.pas-chat-widget { position: fixed; bottom: 22px; left: 22px; z-index: var(--z-chat); }

/* دکمه شناور */
.pas-chat-fab {
    position: relative;
    width: 58px; height: 58px;
    border: none; border-radius: 50%;
    background: linear-gradient(135deg, #2e6bff, #14337f);
    color: #fff; font-size: 22px;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(46, 107, 255, .45);
    display: flex; align-items: center; justify-content: center;
    transition: transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s;
}
.pas-chat-fab:hover { transform: translateY(-3px) scale(1.05); box-shadow: 0 14px 32px rgba(46, 107, 255, .55); }
.pas-chat-fab:active { transform: scale(.95); }
.pas-chat-fab.is-open { background: #1e293b; z-index: 1; }

/* نبض دور دکمه برای جلب توجه */
.pas-chat-fab-pulse {
    position: absolute; inset: 0;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(46, 107, 255, .5);
    animation: pas-pulse 2.4s ease-out infinite;
}
@keyframes pas-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(46, 107, 255, .5); }
    70%  { box-shadow: 0 0 0 16px rgba(46, 107, 255, 0); }
    100% { box-shadow: 0 0 0 0 rgba(46, 107, 255, 0); }
}

/* پنل چت */
.pas-chat-panel {
    position: fixed;
    left: 22px;
    bottom: 94px;
    width: min(420px, calc(100vw - 44px));
    height: min(680px, calc(100dvh - 120px));
    background: #fff;
    border: 1px solid #dbe3f0;
    border-radius: 18px;
    box-shadow: 0 18px 48px rgba(15, 23, 42, .16);
    display: flex; flex-direction: column;
    overflow: hidden;
    z-index: var(--z-chat);
    opacity: 0; transform: translateY(14px) scale(.985);
    pointer-events: none;
    transition: opacity .22s cubic-bezier(.22,1,.36,1), transform .22s cubic-bezier(.22,1,.36,1);
}
.pas-chat-panel.open { opacity: 1; transform: none; pointer-events: auto; }

/* ===== وضعیت «باز» =====
   کلاس is-open روی wrapper و فقط توسط جاوااسکریپت گذاشته می‌شود؛ چون بلیزور
   هیچ‌وقت این کلاس را در درخت رندر خودش ندارد، رندرهای بعدی پاکش نمی‌کنند و
   پنل بی‌اجازه بسته نمی‌شود. */
.pas-chat-widget.is-open .pas-chat-panel { opacity: 1; transform: none; pointer-events: auto; }
.pas-chat-widget.is-open .pas-chat-fab { background: #1e293b; z-index: 1; }
.pas-chat-widget.is-open .pas-chat-fab-pulse { display: none; }

/* دکمه شناور فقط یک آیکن دارد: آیکنِ هوش مصنوعی. پیش‌تر یک آیکن فلش هم
   کنارش بود که در حالت باز نمایش داده می‌شد و روی بعضی مرورگرها هر دو
   با هم دیده می‌شدند. */
.pas-chat-fab-icon { display: inline-block; }

/* اسپینر کوچک تا وقتی رابط چت داخل iframe بالا می‌آید */
.pas-chat-frame-loading {
    position: absolute; inset: 0; background: #fff; z-index: 2;
    display: flex; align-items: center; justify-content: center;
    gap: 8px; color: #64748b; font-size: 13px;
}

.pas-chat-panel-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 14px;
    background: linear-gradient(135deg, #2e6bff, #14337f);
    color: #fff; flex-shrink: 0;
}
.pas-chat-panel-title { font-weight: 700; font-size: 16px; display: flex; align-items: center; gap: 8px; }
.pas-chat-panel-head-actions { display: flex; gap: 4px; }
.pas-chat-head-btn {
    width: 44px; min-width: 44px; height: 44px; border-radius: 10px;
    border: none; background: rgba(255,255,255,.15); color: #fff;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
    font-size: 13px; text-decoration: none;
    transition: background-color .2s;
}
.pas-chat-head-btn:hover { background: rgba(255,255,255,.3); }

.pas-chat-frame-wrap { flex: 1; min-height: 0; background: #fff; position: relative; }
.pas-chat-frame-wrap iframe { width: 100%; height: 100%; border: 0; display: block; }

/* موبایل: پنل مثل یک صفحه گفتگوی واقعی تمام‌صفحه است. */
@media (max-width: 640px) {
    .pas-chat-widget { bottom: 16px; left: 16px; }
    .pas-chat-panel { inset: 0; width: 100vw; height: 100dvh; border: 0; border-radius: 0; box-shadow: none; }
    .pas-chat-fab.is-open { visibility: hidden; }
    .pas-chat-widget.is-open .pas-chat-fab { visibility: hidden; }
}

@media (prefers-reduced-motion: reduce) {
    .pas-chat-fab-pulse { animation: none; }
    .pas-chat-panel { transition: opacity .01ms; }
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* ============================================================
   لایه بهبود UI/UX سراسری — بدون نیاز به تغییر مارک‌آپ صفحه‌ها
   ============================================================ */

/* --- حس لمسی دکمه‌ها: هاور نرم و فشردگی هنگام کلیک --- */
button, a, select, input[type="checkbox"] {
    transition: background-color .18s ease, color .18s ease, border-color .18s ease,
                box-shadow .18s ease, transform .12s ease, opacity .18s ease;
}
button:active:not(:disabled) {
    transform: scale(.97);
}

/* --- کارت‌ها: بالا آمدن ملایم هنگام هاور (فقط کارت‌هایی که خودشان hover دارند) --- */
.hover\:shadow-md:hover, .hover\:shadow-lg:hover {
    transform: translateY(-2px);
}
.rounded-lg.shadow-sm {
    transition: box-shadow .2s ease, transform .2s ease;
}

/* --- فرم‌ها: مرز بنفش ملایم هنگام هاور، پیش از فوکوس --- */
input:hover:not(:focus):not([type="checkbox"]), select:hover:not(:focus), textarea:hover:not(:focus) {
    border-color: #a5b4fc;
}

/* --- دسترس‌پذیری: حلقه فوکوس واضح برای کار با کیبورد --- */
:focus-visible {
    outline: 2px solid #4f46e5;
    outline-offset: 2px;
    border-radius: 4px;
}

/* --- جدول‌ها ---
   قاعده‌ی قبلی به هر قابی که جدول داشت «max-height: 70vh + اسکرول عمودی»
   می‌داد. نتیجه‌اش دو نوار اسکرول تودرتو در یک صفحه بود: کاربر صفحه را
   پایین می‌برد ولی جدول سر جایش می‌ماند و زیر جدول فضای خالی می‌دید
   («اسکرول می‌خورد و هیچی نیست» — پرداخت حق‌الوکاله، امور مالی و…).
   حالا جدول با خودِ صفحه اسکرول می‌شود: یک نوار اسکرول، بدون فضای مرده.
   اسکرول افقی جدول‌های پهن سر جایش است. */
.overflow-x-auto:has(> table) {
    max-height: none;
    overflow-y: visible;
}
/* سرستون‌ها دیگر چسبان نیستند؛ در حالت چسبان زیر ناوبارِ چسبان پنهان
   می‌شدند و ردیف اول جدول بریده به نظر می‌رسید. */
.overflow-x-auto thead th {
    position: static;
    background: #f9fafb;
}

/* --- پنجره‌های مودال: باز شدن نرم به‌جای پرش --- */
@keyframes modalOverlayIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes modalCardIn {
    from { opacity: 0; transform: translateY(14px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
.fixed.inset-0.z-50 {
    animation: modalOverlayIn .18s ease;
}
.fixed.inset-0.z-50 > .bg-white {
    animation: modalCardIn .22s ease;
}

/* --- اسکرول‌بار باریک و مرتب --- */
* {
    scrollbar-width: thin;
    scrollbar-color: #c7d2fe transparent;
}
*::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
*::-webkit-scrollbar-thumb {
    background: #c7d2fe;
    border-radius: 8px;
}
*::-webkit-scrollbar-thumb:hover {
    background: #818cf8;
}
*::-webkit-scrollbar-track {
    background: transparent;
}

/* --- رنگ انتخاب متن هماهنگ با هویت سایت --- */
::selection {
    background: #e0e7ff;
    color: #312e81;
}

/* --- اسکرول نرم صفحه --- */
html {
    scroll-behavior: smooth;
}

/* --- ارقام هم‌عرض برای مبالغ و تاریخ‌ها (تراز بهتر در جدول‌ها) --- */
table td, .font-mono {
    font-variant-numeric: tabular-nums;
}

/* ============================================================
   رسپانسیو سراسری — موبایل و تبلت
   ============================================================ */
@media (max-width: 640px) {
    /* سربرگ صفحه‌ها (عنوان + دکمه) روی موبایل زیر هم بچینند نه له شوند */
    .flex.justify-between.items-center.mb-6 {
        flex-wrap: wrap;
        gap: .75rem;
    }
    .flex.justify-between.items-center.mb-6 > button,
    .flex.justify-between.items-center.mb-6 > a.bg-indigo-600 {
        width: 100%;
        text-align: center;
    }

    /* حاشیه صفحه‌ها روی موبایل کمتر تا محتوا جای بیشتری داشته باشد */
    .min-h-screen > .p-6 {
        padding: .75rem;
    }

    /* جدول‌ها روی موبایل: فونت و فاصله فشرده‌تر */
    table th, table td {
        padding-right: .75rem !important;
        padding-left: .75rem !important;
        font-size: .8rem;
    }

    /* عنوان‌های بزرگ کمی کوچک‌تر */
    h2.text-2xl { font-size: 1.25rem; }

    /* پنجره‌های مودال: تمام عرض با کمی حاشیه و اسکرول داخلی */
    .fixed.inset-0.z-50 > .bg-white {
        max-height: 92vh;
        overflow-y: auto;
    }
}

@media (max-width: 768px) {
    /* کارت‌های آماری در تبلت عمودی دو ستونه شوند (به‌جای یک ستون کش‌آمده) */
    .grid.grid-cols-1.md\:grid-cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* لمس راحت‌تر روی موبایل: هدف‌های کلیک حداقل ۴۴ پیکسل */
@media (pointer: coarse) {
    button, a.rounded-lg, input, select {
        min-height: 44px;
    }
}

/* --- احترام به تنظیم «کاهش حرکت» سیستم‌عامل کاربر --- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
    html { scroll-behavior: auto; }
}
/* =====================================================================
   1) Mobile Navigation Drawer
   ===================================================================== */
.dnav-overlay {
    position: fixed; inset: 0; z-index: var(--z-chat);
    background: rgba(15, 23, 42, .5);
    -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
    opacity: 0; transition: opacity .24s ease;
}
.dnav-overlay.is-open { opacity: 1; }

.dnav {
    position: fixed; top: 0; right: 0; bottom: 0; z-index: var(--z-drawer);
    width: min(86vw, 340px);
    height: 100vh;
    height: 100dvh;
    max-height: 100dvh;
    display: flex; flex-direction: column;
    background: #fff;
    box-shadow: -18px 0 44px rgba(15, 23, 42, .18);
    transform: translateX(100%);
    transition: transform .28s cubic-bezier(.22, 1, .36, 1);
    overscroll-behavior: contain;
    will-change: transform;
}
.dnav.is-open { transform: translateX(0); }

.dnav-head {
    flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between;
    gap: 10px; padding: 12px 16px; padding-top: max(12px, env(safe-area-inset-top));
    border-bottom: 1px solid #eef2f7; background: #fff;
}
.dnav-brand { display: flex; align-items: center; gap: 8px; min-width: 0; }
.dnav-brand img { width: 30px; height: 30px; flex: 0 0 auto; }
.dnav-brand span { font-weight: 800; font-size: 15px; color: #3730a3; white-space: nowrap; }

.dnav-close {
    flex: 0 0 auto; width: 44px; height: 44px; display: grid; place-items: center;
    border: 0; border-radius: 12px; background: #f1f5f9; color: #475569;
    font-size: 15px; cursor: pointer; transition: background .18s ease, transform .12s ease;
}
.dnav-close:hover { background: #e2e8f0; color: #0f172a; }
.dnav-close:active { transform: scale(.94); }

.dnav-user {
    flex: 0 0 auto; display: flex; align-items: center; gap: 10px;
    padding: 12px 16px; border-bottom: 1px solid #eef2f7; background: #f8fafc;
}
.dnav-user-avatar {
    width: 38px; height: 38px; flex: 0 0 auto; border-radius: 50%;
    background: #4f46e5; color: #fff; font-weight: 700; display: grid; place-items: center;
}
.dnav-user-text { min-width: 0; }
.dnav-user-name { font-size: 13.5px; font-weight: 700; color: #1e293b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dnav-user-role { font-size: 11.5px; color: #64748b; }

.dnav-search { flex: 0 0 auto; padding: 12px 16px 4px; position: relative; }
.dnav-search input {
    width: 100%; font-size: 16px; padding: 11px 40px 11px 12px;
    border: 1px solid #e2e8f0; border-radius: 12px; background: #f8fafc; outline: none;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.dnav-search input:focus { border-color: #6366f1; background: #fff; box-shadow: 0 0 0 3px rgba(99, 102, 241, .14); }
.dnav-search i {
    /* قبلاً top:50% روی خودِ wrapperِ padding-dar حساب می‌شد و آیکن
       چند پیکسل بالاتر از وسط input می‌افتاد و روی متن می‌نشست */
    position: absolute; top: 12px; bottom: 4px; right: 28px;
    display: flex; align-items: center;
    color: #94a3b8; font-size: 13px; pointer-events: none;
}

.dnav-scroll {
    flex: 1 1 auto; min-height: 0;
    overflow-y: auto; overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 6px 0 14px;
}
.dnav-scroll::-webkit-scrollbar { width: 6px; }
.dnav-scroll::-webkit-scrollbar-thumb { background: #dbe2ea; border-radius: 99px; }

.dnav-group { padding: 14px 16px 6px; font-size: 11px; font-weight: 800; letter-spacing: .02em; color: #94a3b8; }

.dnav-link {
    display: flex; align-items: center; gap: 11px;
    min-height: 48px; padding: 0 16px;
    font-size: 14px; color: #334155; text-decoration: none;
    border-inline-start: 3px solid transparent;
    transition: background .16s ease, color .16s ease, border-color .16s ease;
}
.dnav-link i { width: 20px; flex: 0 0 auto; text-align: center; color: #94a3b8; font-size: 14px; transition: color .16s ease; }
.dnav-link span { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dnav-link:hover, .dnav-link:focus-visible { background: #f5f7ff; color: #3730a3; }
.dnav-link:hover i, .dnav-link:focus-visible i { color: #4f46e5; }
.dnav-link:active { background: #eef2ff; }
.dnav-link.is-active { background: #eef2ff; color: #3730a3; font-weight: 700; border-inline-start-color: #4f46e5; }
.dnav-link.is-active i { color: #4f46e5; }
.dnav-link.is-accent { color: #4338ca; font-weight: 600; }
.dnav-link.is-accent i { color: #6366f1; }

.dnav-count {
    flex: 0 0 auto; min-width: 20px; height: 20px; padding: 0 6px;
    border-radius: 99px; background: #ef4444; color: #fff;
    font-size: 10.5px; font-weight: 800; display: grid; place-items: center;max-width:35px;
}
.dnav-sep { height: 1px; margin: 10px 16px; background: #eef2f7; }

.dnav-foot {
    flex: 0 0 auto; padding: 10px 16px;
    padding-bottom: max(10px, env(safe-area-inset-bottom));
    border-top: 1px solid #eef2f7; background: #fff;
}
.dnav-logout {
    width: 100%; min-height: 46px;
    display: flex; align-items: center; justify-content: center; gap: 8px;
    border: 1px solid #fecaca; border-radius: 12px;
    background: #fef2f2; color: #dc2626;
    font-family: inherit; font-size: 14px; font-weight: 700; cursor: pointer;
    transition: background .18s ease, transform .12s ease;
}
.dnav-logout:hover { background: #fee2e2; }
.dnav-logout:active { transform: scale(.985); }

.dnav-trigger {
    position: relative; width: 44px; height: 44px;
    display: grid; place-items: center;
    border: 0; border-radius: 12px; background: transparent; color: #475569;
    cursor: pointer; transition: background .18s ease;
}
.dnav-trigger:hover { background: #f1f5f9; color: #0f172a; }
.dnav-trigger-dot {
    position: absolute; top: 5px; left: 5px;
    width: 18px; height: 18px; padding: 0;
    border-radius: 50%; background: #ef4444; color: #fff;
    font-size: 9.5px; font-weight: 800; line-height: 1;
    display: grid; place-items: center; box-sizing: border-box;
}

body.dnav-locked { position: fixed; inset-inline: 0; width: 100%; overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
    .dnav, .dnav-overlay { transition: none; }
}

/* =====================================================================
   2) Push permission card
   ===================================================================== */
.dpush-prompt {
    position: fixed; z-index: var(--z-toast);
    inset-inline-start: 18px;
    bottom: max(18px, env(safe-area-inset-bottom));
    width: 340px; max-width: calc(100vw - 32px);
    background: #fff; border: 1px solid #e2e8f0; border-radius: 16px;
    box-shadow: 0 18px 46px rgba(15, 23, 42, .18);
    padding: 14px; display: flex; gap: 11px;
    opacity: 0; transform: translateY(14px);
    animation: dpush-in .3s cubic-bezier(.22, 1, .36, 1) forwards;
}
@keyframes dpush-in { to { opacity: 1; transform: none; } }

.dpush-icon {
    width: 38px; height: 38px; flex: 0 0 auto; border-radius: 12px;
    background: #eef2ff; color: #4f46e5; display: grid; place-items: center; font-size: 15px;
}
.dpush-body { flex: 1 1 auto; min-width: 0; }
.dpush-title { font-size: 13.5px; font-weight: 800; color: #1e293b; }
.dpush-text { font-size: 12px; color: #64748b; line-height: 1.75; margin-top: 3px; }
.dpush-actions { display: flex; gap: 8px; margin-top: 11px; flex-wrap: wrap; }

.dpush-btn {
    min-height: 44px; padding: 0 14px; border: 0; border-radius: 10px;
    background: #4f46e5; color: #fff; font-family: inherit;
    font-size: 12.5px; font-weight: 700; cursor: pointer;
    transition: background .18s ease, transform .12s ease;
}
.dpush-btn:hover { background: #4338ca; }
.dpush-btn:active { transform: scale(.97); }
.dpush-btn:disabled { opacity: .6; cursor: default; }
.dpush-btn.is-ghost { background: #f1f5f9; color: #475569; }
.dpush-btn.is-ghost:hover { background: #e2e8f0; }

.dpush-panel { border: 1px solid #e2e8f0; border-radius: 14px; padding: 16px; background: #fff; }
.dpush-pill { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 99px; font-size: 11.5px; font-weight: 700; }
.dpush-pill.is-on { background: #dcfce7; color: #15803d; }
.dpush-pill.is-off { background: #fef3c7; color: #92400e; }
.dpush-pill.is-blocked { background: #fee2e2; color: #b91c1c; }
.dpush-steps { font-size: 12px; color: #475569; line-height: 2; padding-inline-start: 18px; list-style: disc; }

@media (max-width: 640px) {
    .dpush-prompt { inset-inline: 16px; width: auto; }
}

/* =====================================================================
   3) Mobile + accessibility baseline
   ===================================================================== */
html { -webkit-text-size-adjust: 100%; }
body { overflow-x: hidden; }  /* تکمیل و اصلاح قطعی در mobile-fixes.css */

a:focus-visible, button:focus-visible, [role="button"]:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
    outline: 2px solid #4f46e5; outline-offset: 2px; border-radius: 6px;
}

.sr-only-x {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

@media (max-width: 767px) {
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select, textarea { font-size: 16px; }
    .dnav-trigger, .dnav-close, .dnav-logout { min-height: 44px; min-width: 44px; }
    .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* (حذف شد) پنل هوش مصنوعی همیشه تمام‌صفحه است */

/* کشوی بسته نباید با Tab قابل فوکوس باشد */
.dnav { visibility: hidden; transition: transform .28s cubic-bezier(.22,1,.36,1), visibility 0s linear .28s; }
.dnav.is-open { visibility: visible; transition: transform .28s cubic-bezier(.22,1,.36,1), visibility 0s; }

/* =====================================================================
   4) جعبه‌های متن و کمبوباکس‌ها — حذف پس‌زمینه خاکستری
   مشکل: مرورگر به <select> پس‌زمینه پیش‌فرض خاکستری (buttonface) می‌دهد،
   پس در یک ردیف، ورودی‌های متنی سفید و کمبوباکس‌ها خاکستری دیده می‌شدند.
   حالا همه سفید و هم‌شکل‌اند و فلش کمبوباکس دستی (سمت چپ در RTL) کشیده می‌شود.
   ===================================================================== */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]),
select,
textarea {
    background-color: #fff;
    color: #111827;
}

/* ---------------------------------------------------------------------
   کمبوباکس سفید — قطعی
   چرا !important: بعضی صفحه‌ها کلاس‌های tailwind (مثل bg-gray-50/bg-gray-100)
   روی <select> دارند و کلاس همیشه از سلکتور المانی قوی‌تر است؛ نتیجه‌اش
   همان کمبوباکس‌های خاکستری بود. فیلد غیرفعال از این قاعده مستثناست.
   --------------------------------------------------------------------- */
select:not(:disabled):not([readonly]),
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]):not(:disabled):not([readonly]),
textarea:not(:disabled):not([readonly]) {
    background-color: #fff !important;
}

/* لیست بازشوی کمبوباکس هم سفید بماند (ویندوز پیش‌فرض خاکستری می‌دهد) */
select option,
select optgroup,
datalist option {
    background-color: #fff;
    color: #111827;
    font-family: var(--daovi-font);
}

/* فونت ایران‌سنس روی همه کنترل‌های فرم؛ مرورگر پیش‌فرض فونت سیستم می‌گذارد */
button, input, select, textarea, optgroup, option {
    font-family: var(--daovi-font);
}

/* فیلد غیرفعال باید دیده شود که غیرفعال است */
input:disabled, select:disabled, textarea:disabled,
input[readonly], textarea[readonly] {
    background-color: #f9fafb;
    color: #6b7280;
    cursor: not-allowed;
}

/* ---------------------------------------------------------------------
   کمبوباکس (select) — یک قاعده‌ی پایه برای کل سامانه
   ---------------------------------------------------------------------
   خواسته: فلش مثلثی همیشه سمت چپ کادر، و هیچ‌وقت به متن/مقدار انتخاب‌شده
   نچسبد. سه اشکالی که در نسخه قبل باقی مانده بود:

     ۱) عرض ناحیه‌ی رزروشده (۲.۲۵rem) از خود آیکن (۱rem) فقط ۰.۵rem بیشتر
        بود؛ با متن بلند، حرف آخر تقریباً روی فلش می‌نشست.
     ۲) select هیچ text-overflow نداشت، پس مقدار بلند بریده نمی‌شد و از زیر
        فلش رد می‌شد (مخصوصاً در کادرهای باریک فیلترها).
     ۳) قاعده روی select[multiple] و select[size>1] هم اعمال می‌شد؛ آن‌ها
        فلش ندارند ولی padding چپ می‌گرفتند و متنشان تو رفته بود.

   راه‌حل: یک «ناحیه‌ی فلش» مستقل به عرض ۲.۷۵rem در سمت چپ رزرو می‌شود، با
   یک خط جداکننده‌ی نازک که مرز آن را مشخص می‌کند؛ متن هرگز داخل آن ناحیه
   نمی‌رود و در صورت بلندی با «…» بریده می‌شود. جهت (RTL/LTR) فقط روی
   text-align اثر دارد، نه روی جای فلش — پس فلش در هر شرایطی چپ می‌ماند.
   --------------------------------------------------------------------- */

:root {
    /* عرض ناحیه فلش و فاصله‌اش از لبه — یک جا تغییر می‌کند، همه‌جا اعمال می‌شود */
    --daovi-select-gutter: 2.75rem;
    --daovi-select-arrow-inset: .9rem;
}

select:not([multiple]):not([size]),
select:not([multiple])[size="1"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    /* دو لایه: ۱) آیکن فلش  ۲) خط جداکننده‌ی ناحیه فلش از متن */
    background-image:
        url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"),
        linear-gradient(to bottom, transparent 22%, #e5e7eb 22%, #e5e7eb 78%, transparent 78%);
    background-repeat: no-repeat, no-repeat;
    background-position:
        left var(--daovi-select-arrow-inset) center,
        left var(--daovi-select-gutter) center !important;
    background-size: 1rem 1rem, 1px 100%;

    /* جای فلش با اولویت قطعی رزرو می‌شود تا کلاس‌های tailwind (px-4، pl-3 …)
       نتوانند آن را بردارند. سمت متن عمداً !important نیست تا صفحه‌ها بتوانند
       فاصله‌ی دلخواه خودشان را بدهند. */
    padding-left: calc(var(--daovi-select-gutter) + .5rem) !important;
    padding-inline-end: .875rem;

    /* مقدار بلند بریده می‌شود، از زیر فلش رد نمی‌شود */
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;

    text-align: right;
    cursor: pointer;
}

/* فیلدهای لاتین/عددی که خودشان LTR هستند: متن از چپ می‌چیند، ولی چون ناحیه
   فلش هم چپ است، متن از بعد از همان ناحیه شروع می‌شود (روی فلش نمی‌افتد). */
select[dir="ltr"]:not([multiple]),
[dir="ltr"] select:not([multiple]) {
    text-align: left;
}

/* فلش کمبوباکس غیرفعال کم‌رنگ‌تر می‌شود (همان آیکن با رنگ روشن‌تر) */
select:disabled:not([multiple]):not([size]) {
    background-image:
        url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"),
        linear-gradient(to bottom, transparent 22%, #eef0f3 22%, #eef0f3 78%, transparent 78%);
    cursor: not-allowed;
}

/* چند‌انتخابی و لیست بازِ چندردیفه فلش ندارند: هیچ ناحیه‌ای رزرو نمی‌شود */
select[multiple],
select[size]:not([size="1"]) {
    -webkit-appearance: listbox;
    appearance: listbox;
    background-image: none;
    padding-left: .875rem !important;
    padding-inline-end: .875rem;
    text-overflow: clip;
    white-space: normal;
    cursor: default;
}

/* کمبوباکس‌های سفارشی (دراپ‌داون‌هایی که select واقعی نیستند) هم از همان
   اندازه‌ها استفاده کنند تا چیدمان سایت یکدست بماند. */
.daovi-combo,
[role="combobox"]:not(input) {
    position: relative;
    padding-left: calc(var(--daovi-select-gutter) + .5rem);
    padding-inline-end: .875rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.daovi-combo > .daovi-combo-arrow,
[role="combobox"]:not(input) > .daovi-combo-arrow {
    position: absolute;
    left: var(--daovi-select-arrow-inset);
    top: 50%;
    transform: translateY(-50%);
    width: 1rem;
    height: 1rem;
    color: #6b7280;
    pointer-events: none;
}

select::-ms-expand { display: none; }

/* placeholder یکدست و خواناتر */
input::placeholder, textarea::placeholder { color: #9ca3af; opacity: 1; }

/* =====================================================================
   5) سربرگ سامانه — نام «همداد» هرگز دو خط نشود
   در پنل مدیر تعداد آیتم‌های منو زیاد است و نام سایت زیر فشار flex
   شکسته می‌شد. حالا لوگو/نام کوچک نمی‌شود و منو جای خودش را می‌گیرد.
   ===================================================================== */
/* برند «همداد» نه به لوگو می‌چسبد و نه به منوی ناوبار.
   فاصله‌ها با gap و margin منطقی (RTL/LTR) گرفته شده‌اند تا به build شدن
   کلاس‌های tailwind (mr-2 و …) وابسته نباشند. */
.daovi-brand {
    flex: 0 0 auto;
    white-space: nowrap;
    margin-inline-end: 1.25rem;
}
.daovi-brand > a { column-gap: .6rem; }
.daovi-brand img { flex: 0 0 auto; }
.daovi-brand span {
    white-space: nowrap;
    /* mr-2 حذف می‌شود؛ فاصله از gap می‌آید تا در هر دو جهت یکسان باشد */
    margin-right: 0 !important;
    margin-left: 0 !important;
    line-height: 1.9;
}
@media (min-width: 1280px) { .daovi-brand { margin-inline-end: 1.75rem; } }
@media (min-width: 1536px) { .daovi-brand { margin-inline-end: 2.25rem; } }
/* ---------------------------------------------------------------------
   منوی افقی ناوبار — «داشبورد» دیگر نصفه نمی‌شود
   مشکل: کانتینر منو min-width:0 داشت و flex آن را فشرده می‌کرد؛ آخرین
   آیتم (داشبورد) زیر جعبه جست‌وجو می‌رفت و نصف دیده می‌شد.
   راه‌حل: منو هرگز فشرده نمی‌شود (flex:0 0 auto) و در عوض ابزارهای سمت
   چپ (جست‌وجو و نام کاربر) کوچک می‌شوند. فاصله و اندازه فونت هم پله‌ای
   با عرض صفحه تنظیم می‌شود تا در ۱۰۲۴px هم همه آیتم‌ها کامل جا شوند.
   --------------------------------------------------------------------- */
.daovi-navlinks {
    flex: 0 0 auto;
    min-width: 0;
    column-gap: .65rem;
    font-size: .78rem;
    white-space: nowrap;
}

@media (min-width: 1280px) { .daovi-navlinks { column-gap: .95rem; font-size: .82rem; } }
@media (min-width: 1536px) { .daovi-navlinks { column-gap: 1.3rem; font-size: .875rem; } }

.daovi-navlinks .navbar-item,
.daovi-navlinks > a { white-space: nowrap; }

/* ابزارهای سمت چپ ناوبار: اینها کوچک می‌شوند، نه منو */
.daovi-navtools { flex: 0 1 auto; min-width: 0; }

/* نام بلند کاربر، ناوبار را نمی‌شکند */
.daovi-navuser {
    max-width: 5.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (min-width: 1280px) { .daovi-navuser { max-width: 6.5rem; } }
@media (min-width: 1536px) { .daovi-navuser { max-width: 11rem; } }

/* هیچ‌کدام از ابزارها فشرده و روی‌هم نمی‌افتند */
.daovi-navtools > * { flex: 0 0 auto; }

/* زیر ۱۲۸۰px جا تنگ است: آیکن‌های «دریافت اپلیکیشن» و «راهنما» و عنوان نقش
   پنهان می‌شوند (هر دو از منوی پروفایل و کشوی موبایل هم در دسترس‌اند) */
.daovi-navtool-extra, .daovi-navrole { display: none; }
@media (min-width: 1280px) {
    .daovi-navtool-extra { display: inline-flex; }
    .daovi-navrole { display: block; }
}

/* =====================================================================
   جعبه جست‌وجوی ناوبار (دسکتاپ)
   ---------------------------------------------------------------------
   باگ گزارش‌شده: متن placeholder روی آیکن ذره‌بین می‌افتاد.
   علت واقعی: مارک‌آپ به کلاس‌های tailwindِ pr-10 / w-44 / lg:w-52 /
   xl:w-72 تکیه داشت ولی هیچ‌کدام در خروجی buildشده wwwroot/tailwind.css
   نبودند (فایل build قدیمی است)، پس input هیچ padding سمت راست نداشت.
   راه‌حل ریشه‌ای: جعبه جست‌وجو به CSS اختصاصی و منطقی (padding-inline)
   منتقل شد تا دیگر به build شدن یا نشدن tailwind وابسته نباشد.
   ===================================================================== */
/* جعبه جست‌وجو جمع‌وجور و «ثابت» است.
   باگ گزارش‌شده: با کلیک روی جعبه، عرضش بزرگ می‌شد (قاعده focus-within) و
   ناوبار در لحظه تایپ تکان می‌خورد. آن قاعده حذف شد؛ عرض در حالت عادی و
   حالت فوکوس دقیقاً یکی است و فقط رنگ حاشیه/هاله تغییر می‌کند. */
.daovi-navsearch {
    position: relative;
    /* زیر ۱۲۸۰px جا برای هم منو و هم جعبه جست‌وجو نیست؛ آنجا فقط آیکن
       ذره‌بین نشان داده می‌شود (لینک به /search) و منو کامل می‌ماند */
    display: none;
    flex: 0 1 auto;
    min-width: 0;
    width: 9rem;
}

@media (min-width: 1280px) { .daovi-navsearch { display: block; width: 8rem; } }
@media (min-width: 1536px) { .daovi-navsearch { width: 12rem; } }

/* آیکن جست‌وجو فقط وقتی جعبه جست‌وجو پنهان است دیده می‌شود */
.daovi-searchicon { display: inline-flex; }
@media (min-width: 1280px) { .daovi-searchicon { display: none; } }

.daovi-navsearch input {
    width: 100%;
    box-sizing: border-box;
    /* padding منطقی: در RTL خودش سمت راست می‌شود و آیکن هرگز روی متن نمی‌افتد */
    padding-inline-start: 1.95rem;
    padding-inline-end: .6rem;
    padding-block: .4rem;
    font-family: inherit;
    font-size: .8125rem;
    line-height: 1.25rem;
    color: #1e293b;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: .5rem;
    outline: none;
    text-overflow: ellipsis;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.daovi-navsearch input::placeholder { color: #94a3b8; }

.daovi-navsearch input:focus {
    border-color: #6366f1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, .18);
}

.daovi-navsearch > i {
    position: absolute;
    inset-inline-start: .7rem;
    inset-block: 0;
    display: flex;
    align-items: center;
    color: #9ca3af;
    font-size: .8125rem;
    pointer-events: none;
}

/* روی نمایشگر‌های باریک‌تر از xl جا تنگ است: جعبه کوچک‌تر ولی هنوز خوانا */
@media (max-width: 1023px) {
    .daovi-navsearch input { font-size: .78rem; padding-inline-start: 1.8rem; }
    .daovi-navsearch > i { inset-inline-start: .6rem; font-size: .75rem; }
}


/* =====================================================================
   9) منوی «مدیریت سامانه» — دیگر اسکرول نمی‌خورد
   مشکل: منو max-h:70vh + overflow-y:auto داشت و مدیر برای رسیدن به
   «تنظیمات سامانه» باید داخل پاپ‌آپ اسکرول می‌کرد.
   راه‌حل: بدون اسکرول؛ ردیف‌ها جمع‌وجورتر (۱۴ آیتم ≈ ۴۰۰px) تا در
   ارتفاع‌های معمول کامل جا شود.
   ===================================================================== */
.daovi-adminmenu {
    max-height: none !important;
    overflow: visible !important;
    /* منو پهن‌تر شد تا عنوان‌های بلند راحت جا شوند */
    min-width: 15rem !important;
}
/* ردیف‌ها دیگر ریز نیستند: فونت و فاصله‌ها خوانا و کلیک‌پذیر */
.daovi-adminmenu > a {
    padding-top: .45rem !important;
    padding-bottom: .45rem !important;
    padding-inline: 1.1rem !important;
    font-size: .92rem !important;
    line-height: 1.75 !important;
}
.daovi-adminmenu > .border-t {
    margin-top: .3rem !important;
    margin-bottom: .3rem !important;
}
/* روی نمایشگرهای بلند حتی بزرگ‌تر */
@media (min-height: 880px) {
    .daovi-adminmenu > a {
        padding-top: .55rem !important;
        padding-bottom: .55rem !important;
        font-size: .98rem !important;
    }
}
/* روی نمایشگرهای کوتاه، به‌جای بریده شدن، منو اسکرول می‌خورد */
@media (max-height: 760px) {
    .daovi-adminmenu {
        max-height: calc(100vh - 6rem) !important;
        overflow-y: auto !important;
    }
}

/* =====================================================================
   10) کمبوباکس‌ها — لیست بازشو سفید و با فونت سایت
   مشکل: مرورگر (ویندوز) لیست بازشوی <select> را خاکستری buttonface و با
   فونت سیستم می‌کشد؛ قاعده‌های قبلی بدون !important بودند و برنده نمی‌شدند.
   ===================================================================== */
select {
    color-scheme: light only;
    font-size: .875rem;
    line-height: 1.6;
    /* متن کمبوباکس هرگز دو خطی نشود؛ بلندش با … کوتاه می‌شود */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

select option,
select optgroup,
datalist option {
    background-color: #fff !important;
    color: #111827 !important;
    font-family: var(--daovi-font) !important;
    font-size: .875rem !important;
    line-height: 1.9;
    padding: .35rem .6rem;
}

/* گزینه انتخاب‌شده/زیر نشانگر: خاکستری سیستمی نه، بنفش ملایم خودمان */
select option:checked,
select option:hover,
select option:focus {
    background-color: #eef2ff !important;
    background-image: linear-gradient(#eef2ff, #eef2ff) !important;
    color: #312e81 !important;
    font-weight: 500;
}

select option:disabled {
    color: #9ca3af !important;
    background-color: #fff !important;
}

/* مرورگرهای جدید (Chrome/Edge 135+): لیست بازشو کاملاً با CSS خودمان
   کشیده می‌شود، پس دیگر هیچ خاکستری سیستمی باقی نمی‌ماند */
@supports (appearance: base-select) {
    select, ::picker(select) {
        appearance: base-select;
    }

    select {
        background-image: none;
        /* در این حالت فلش یک المان واقعی است، پس padding دستی لازم نیست */
        padding-left: .875rem !important;
        padding-inline-end: .875rem !important;
        display: flex;
        flex-direction: row;          /* RTL + row  ⇒  آیکن در انتهای خط = چپ */
        align-items: center;
        /* فاصله‌ی قطعی بین متن و فلش — «چسبیدن» در این حالت هم رخ نمی‌دهد */
        gap: .9rem;
        white-space: nowrap;
        overflow: hidden;
    }

    /* در قاب‌های LTR جهت فلکس برعکس می‌شود تا آیکن باز هم چپ بماند */
    select[dir="ltr"], [dir="ltr"] select {
        flex-direction: row-reverse;
    }

    /* متن انتخاب‌شده تمام فضای آزاد را می‌گیرد تا فلش به لبه پایانی بچسبد
       (باگ قبلی: margin-inline-end: auto روی فلش، آن را وسط کادر می‌نشاند) */
    select::selectedcontent {
        display: block;
        flex: 1 1 auto;
        min-width: 0;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        text-align: start;
    }

    select::picker-icon {
        flex: 0 0 auto;
        margin: 0;
        color: #6b7280;
        transition: transform .18s ease;
    }
    select:open::picker-icon { transform: rotate(180deg); }

    ::picker(select) {
        background: #fff;
        color: #111827;
        font-family: var(--daovi-font);
        font-size: .875rem;
        border: 1px solid #e5e7eb;
        border-radius: .5rem;
        box-shadow: 0 10px 25px rgba(15, 23, 42, .12);
        padding: .25rem;
        margin-top: .25rem;
    }

    ::picker(select) option {
        padding: .45rem .7rem;
        border-radius: .375rem;
        cursor: pointer;
    }
    ::picker(select) option:hover { background-color: #f5f3ff !important; }
    ::picker(select) option:checked { background-color: #eef2ff !important; color: #312e81 !important; }
    ::picker(select) option::checkmark { color: #4f46e5; }
}


/* =====================================================================
   11) پیام قطع بودن سرویس هوش مصنوعی — وسط کادر گفتگو، بدون جزئیات سرور
   ===================================================================== */
.ai-offline {
    display: block;
    width: 100%;
    text-align: center;
    color: #b91c1c;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: .5rem;
    padding: .75rem 1rem;
    font-weight: 700;
}

@supports (max-height: 100dvh) {
    @media (max-height: 760px) { .daovi-adminmenu { max-height: calc(100dvh - 6rem) !important; } }
}