/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* MainLayout styles are centralized in wwwroot/css/design-system.css
   (sections 3 LAYOUT SHELL & 4 SIDEBAR NAVIGATION). This scoped file is
   intentionally empty so the central, theme-aware design system wins. */
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* NavMenu styles are centralized in wwwroot/css/design-system.css
   (section 4 SIDEBAR NAVIGATION). This scoped file is intentionally empty
   so the central, theme-aware design system wins. */
/* /Components/Pages/AI/AIKpiDashboard.razor.rz.scp.css */
/* Styles centralized in wwwroot/css/ai-kpi-dashboard.css (theme-aware).
   This scoped file is intentionally empty so the central sheet wins. */
/* /Components/Pages/AI/AIPaymentCopilot.razor.rz.scp.css */
/* Styles centralized in wwwroot/css/ai-payment-copilot.css (theme-aware).
   This scoped file is intentionally empty so the central sheet wins. */
/* /Components/Pages/Notifications.razor.rz.scp.css */
/* Styles centralized in wwwroot/css/notifications.css (theme-aware).
   This scoped file is intentionally empty so the central sheet wins. */
/* /Components/Pages/PublicReceipt.razor.rz.scp.css */
.loading-container[b-tl0v0n399c] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 20px;
}

.spinner[b-tl0v0n399c] {
    width: 50px;
    height: 50px;
    border: 5px solid var(--ds-border);
    border-top: 5px solid var(--ds-brand-500);
    border-radius: 50%;
    animation: spin-b-tl0v0n399c 1s linear infinite;
}

@keyframes spin-b-tl0v0n399c {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-container p[b-tl0v0n399c] {
    font-size: 16px;
    color: var(--ds-text-secondary);
    font-family: 'Tahoma', sans-serif;
}

.error-container[b-tl0v0n399c] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 15px;
    padding: 20px;
    text-align: center;
}

.error-icon[b-tl0v0n399c] {
    font-size: 48px;
}

.error-container h3[b-tl0v0n399c] {
    font-size: 24px;
    color: var(--ds-danger);
    font-family: 'Tahoma', sans-serif;
    margin: 0;
}

.error-container p[b-tl0v0n399c] {
    font-size: 16px;
    color: var(--ds-text-secondary);
    font-family: 'Tahoma', sans-serif;
    margin: 0;
}
/* /Components/Pages/ReceiptVerify.razor.rz.scp.css */
/* ================================================================
   استعلام اصالت رسید — صفحهٔ عمومی و ناشناس.
   کسی که این را باز می‌کند کاربرِ سامانه نیست: با گوشی، از رویِ کاغذ، و
   احتمالاً یک بار در عمرش. پس یک کارت، یک ورودی، یک دکمه.
   رنگ هیچ‌جا تنها حاملِ معنا نیست — هر حالت نشانه و متن هم دارد.
   ================================================================ */

.rv-page[b-sdhx05s274] {
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem 1rem;
    background: var(--ds-bg, #f1f5f9);
    color: var(--ds-text, #0f172a);
    font-family: Vazirmatn, Tahoma, sans-serif;
}

.rv-card[b-sdhx05s274] {
    width: 100%;
    max-width: 30rem;
    background: var(--ds-elevated, #fff);
    border: 1px solid var(--ds-border, #e2e8f0);
    border-radius: var(--ds-r-lg, 0.75rem);
    box-shadow: var(--ds-shadow-md, 0 4px 16px rgba(15, 23, 42, 0.08));
    padding: 1.5rem;
}

.rv-title[b-sdhx05s274] {
    margin: 0 0 1.25rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--ds-text, #0f172a);
}

.rv-state[b-sdhx05s274],
.rv-lede[b-sdhx05s274],
.rv-help[b-sdhx05s274],
.rv-note[b-sdhx05s274] {
    color: var(--ds-text-secondary, #475569);
    line-height: 1.8;
}

.rv-issuer[b-sdhx05s274] { margin: 0 0 0.75rem; font-size: 0.9rem; color: var(--ds-text-secondary, #475569); }
.rv-lede[b-sdhx05s274] { margin: 0 0 1.25rem; font-size: 0.92rem; }

/* ── فرمِ چالش ───────────────────────────────────────────────── */

.rv-form[b-sdhx05s274] { display: flex; flex-direction: column; }

/* برچسبِ دیده‌شدنی، نه فقط placeholder: کاربر وسطِ تایپ هم باید بداند چه می‌خواهیم. */
.rv-label[b-sdhx05s274] { font-size: 0.88rem; font-weight: 600; margin-bottom: 0.4rem; }

.rv-input[b-sdhx05s274] {
    /* ۱۶ پیکسل تا سافاریِ iOS هنگام فوکوس صفحه را زوم نکند؛ ۴۸ پیکسل ارتفاع برای لمس. */
    font: inherit;
    font-size: 1rem;
    min-height: 3rem;
    padding: 0.6rem 0.8rem;
    border: 1px solid var(--ds-border-md, #cbd5e1);
    border-radius: var(--ds-r-md, 0.5rem);
    background: var(--ds-raised, #fff);
    color: var(--ds-text, #0f172a);
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    letter-spacing: 0.04em;
    transition: border-color 180ms ease, box-shadow 180ms ease;
}

.rv-input:focus-visible[b-sdhx05s274] {
    outline: none;
    border-color: var(--ds-brand-500, #2563eb);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18);
}

.rv-input[aria-invalid="true"][b-sdhx05s274] { border-color: var(--ds-danger, #dc2626); }
.rv-input:disabled[b-sdhx05s274] { opacity: 0.5; cursor: not-allowed; }

.rv-help[b-sdhx05s274] { margin: 0.45rem 0 0; font-size: 0.8rem; }

/* خطا زیرِ همان فیلد می‌نشیند، نه بالای صفحه. */
.rv-error[b-sdhx05s274] {
    margin: 0.5rem 0 0;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ds-danger, #dc2626);
    line-height: 1.7;
}

.rv-submit[b-sdhx05s274] {
    margin-top: 1.1rem;
    min-height: 3rem;
    border: 1px solid var(--ds-brand-600, #1d4ed8);
    border-radius: var(--ds-r-md, 0.5rem);
    background: var(--ds-brand-500, #2563eb);
    color: #fff;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
    transition: background 180ms ease;
}

.rv-submit:hover:not(:disabled)[b-sdhx05s274] { background: var(--ds-brand-600, #1d4ed8); }
.rv-submit:focus-visible[b-sdhx05s274] { outline: 2px solid var(--ds-brand-700, #1e40af); outline-offset: 2px; }
.rv-submit:disabled[b-sdhx05s274] { opacity: 0.45; cursor: not-allowed; }

/* ── نتیجه ──────────────────────────────────────────────────── */

.rv-result[b-sdhx05s274] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    padding: 0.9rem 1rem;
    border-radius: var(--ds-r-md, 0.5rem);
    border: 1px solid transparent;
    margin-bottom: 1.25rem;
}

.rv-result__icon[b-sdhx05s274] {
    flex-shrink: 0;
    width: 1.6rem;
    height: 1.6rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-weight: 700;
    font-size: 0.95rem;
}

.rv-result__title[b-sdhx05s274] { display: block; font-size: 0.95rem; margin-bottom: 0.3rem; }
.rv-result__text[b-sdhx05s274] { margin: 0; font-size: 0.85rem; line-height: 1.8; }

.rv-result--found[b-sdhx05s274] {
    background: rgba(22, 163, 74, 0.10);
    border-color: rgba(22, 163, 74, 0.32);
    color: var(--ds-success, #15803d);
}
.rv-result--found .rv-result__icon[b-sdhx05s274] { background: var(--ds-success, #15803d); color: #fff; }

.rv-result--unknown[b-sdhx05s274] {
    background: rgba(220, 38, 38, 0.09);
    border-color: rgba(220, 38, 38, 0.30);
    color: var(--ds-danger, #dc2626);
}
.rv-result--unknown .rv-result__icon[b-sdhx05s274] { background: var(--ds-danger, #dc2626); color: #fff; }

/* ── ارقامِ معتبر ───────────────────────────────────────────── */

.rv-facts[b-sdhx05s274] {
    margin: 0;
    border: 1px solid var(--ds-border, #e2e8f0);
    border-radius: var(--ds-r-md, 0.5rem);
    overflow: hidden;
}

.rv-fact[b-sdhx05s274] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    padding: 0.6rem 0.85rem;
    border-bottom: 1px solid var(--ds-border, #e2e8f0);
}
.rv-fact:last-child[b-sdhx05s274] { border-bottom: none; }

.rv-fact dt[b-sdhx05s274] { font-size: 0.82rem; color: var(--ds-text-muted, #64748b); font-weight: 600; }
.rv-fact dd[b-sdhx05s274] { margin: 0; font-size: 0.9rem; font-weight: 600; text-align: left; word-break: break-word; }

/* ارقام چپ‌چین و tabular تا یکان‌ها زیرِ هم بیفتند و مقایسه با کاغذ سریع باشد. */
.rv-num[b-sdhx05s274] {
    direction: ltr;
    unicode-bidi: isolate;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
}

/* مبلغ همان چیزی است که استعلام‌کننده اول از همه می‌سنجد. */
.rv-fact--amount[b-sdhx05s274] { background: var(--ds-raised, #f8fafc); }
.rv-fact--amount dd[b-sdhx05s274] { font-size: 1.05rem; }

.rv-note[b-sdhx05s274] { margin: 1rem 0 0; font-size: 0.8rem; }

@media (max-width: 380px) {
    .rv-card[b-sdhx05s274] { padding: 1.15rem; }
    .rv-fact[b-sdhx05s274] { flex-direction: column; gap: 0.15rem; }
    .rv-fact dd[b-sdhx05s274] { text-align: right; }
}

@media (prefers-reduced-motion: reduce) {
    .rv-input[b-sdhx05s274], .rv-submit[b-sdhx05s274] { transition: none; }
}
/* /Components/Shared/DsAmountInput.razor.rz.scp.css */
/* Read-back line under an amount field: the grouped figure in Persian digits, so an operator
   can verify a 10-digit rial amount without counting zeros. */
.ds-amount-preview[b-kclnwyh87t] {
    margin-block-start: 0.25rem;
    font-size: 0.82rem;
    color: var(--ds-text-muted);
    font-variant-numeric: tabular-nums;
    unicode-bidi: isolate;
}

.ds-amount-preview strong[b-kclnwyh87t] {
    font-weight: 600;
    color: var(--ds-text);
}
/* /Components/Shared/NotificationBell.razor.rz.scp.css */
/* Theme-aware via central --ds-* tokens (scoped to NotificationBell). */
.notification-bell-container[b-hzdlyj8mxc] { position: relative; }

.notification-bell-btn[b-hzdlyj8mxc] { position: relative; color: var(--ds-text-secondary); padding: 8px 12px; font-size: 1.25rem; transition: all 0.3s ease; }
.notification-bell-btn:hover[b-hzdlyj8mxc] { color: var(--ds-brand-500); transform: scale(1.1); }

.notification-badge[b-hzdlyj8mxc] { position: absolute; top: 0; right: 0; background: var(--ds-danger); color: #fff; border-radius: 10px; padding: 2px 6px; font-size: 0.65rem; font-weight: 600; min-width: 18px; text-align: center; animation: pulse-b-hzdlyj8mxc 2s infinite; }
@keyframes pulse-b-hzdlyj8mxc { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.1); } }

/* The bell sits at the LEFT edge of the header, so anchoring the panel's right edge
   (right: 0) made it extend 380px further left — straight off the screen. Anchor the
   left edge instead so it opens into the page, and clamp the width to the viewport. */
.notification-dropdown[b-hzdlyj8mxc] { position: absolute; top: calc(100% + 10px); left: 0; right: auto; background: var(--ds-elevated); border: 1px solid var(--ds-border); border-radius: 12px; box-shadow: var(--ds-shadow-lg); width: 380px; max-width: calc(100vw - 20px); max-height: 600px; display: flex; flex-direction: column; z-index: 1050; animation: slideDown-b-hzdlyj8mxc 0.3s ease-out; }
@keyframes slideDown-b-hzdlyj8mxc { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }

.notification-header[b-hzdlyj8mxc] { padding: 16px 20px; border-bottom: 1px solid var(--ds-border); display: flex; justify-content: space-between; align-items: center; }
.notification-header h6[b-hzdlyj8mxc] { margin: 0; font-weight: 600; color: var(--ds-text); }
.notification-header .btn-link[b-hzdlyj8mxc] { font-size: 0.8rem; padding: 0; color: var(--ds-brand-500); }

.notification-list[b-hzdlyj8mxc] { overflow-y: auto; max-height: 450px; }
.notification-item[b-hzdlyj8mxc] { display: flex; align-items: start; padding: 14px 20px; border-bottom: 1px solid var(--ds-border); cursor: pointer; transition: background 0.2s ease; position: relative; }
.notification-item:hover[b-hzdlyj8mxc] { background: var(--ds-hover); }
.notification-item.unread[b-hzdlyj8mxc] { background: var(--ds-brand-50); }
.notification-item.unread:hover[b-hzdlyj8mxc] { background: var(--ds-brand-100); }

.notification-icon[b-hzdlyj8mxc] { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-left: 12px; flex-shrink: 0; }
.notification-icon i[b-hzdlyj8mxc] { font-size: 1.1rem; color: #fff; }
.notification-success[b-hzdlyj8mxc] { background: linear-gradient(135deg, #28a745 0%, #20c997 100%); }
.notification-warning[b-hzdlyj8mxc] { background: linear-gradient(135deg, #ffc107 0%, #ff9800 100%); }
.notification-error[b-hzdlyj8mxc] { background: linear-gradient(135deg, #dc3545 0%, #c82333 100%); }
.notification-info[b-hzdlyj8mxc] { background: linear-gradient(135deg, #17a2b8 0%, #3b82f6 100%); }

.notification-content[b-hzdlyj8mxc] { flex: 1; }
.notification-title[b-hzdlyj8mxc] { font-weight: 600; font-size: 0.9rem; color: var(--ds-text); margin-bottom: 4px; }
.notification-message[b-hzdlyj8mxc] { font-size: 0.85rem; color: var(--ds-text-secondary); margin-bottom: 6px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.notification-time[b-hzdlyj8mxc] { font-size: 0.75rem; color: var(--ds-text-muted); }
.unread-indicator[b-hzdlyj8mxc] { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); width: 8px; height: 8px; background: var(--ds-brand-500); border-radius: 50%; }

.empty-state[b-hzdlyj8mxc] { text-align: center; padding: 40px 20px; color: var(--ds-text-muted); }
.empty-state i[b-hzdlyj8mxc] { font-size: 3rem; margin-bottom: 12px; }
.empty-state p[b-hzdlyj8mxc] { margin: 0; font-size: 0.95rem; }

.notification-footer[b-hzdlyj8mxc] { padding: 12px 20px; border-top: 1px solid var(--ds-border); text-align: center; }
.notification-footer .btn-link[b-hzdlyj8mxc] { color: var(--ds-brand-500); text-decoration: none; font-size: 0.9rem; }
.notification-footer .btn-link:hover[b-hzdlyj8mxc] { text-decoration: underline; }

@media (max-width: 576px) {
  .notification-dropdown[b-hzdlyj8mxc] { position: fixed; top: 60px; right: 10px; left: 10px; width: auto; }
  .notification-item[b-hzdlyj8mxc] { padding: 12px 16px; }
  .notification-header[b-hzdlyj8mxc], .notification-footer[b-hzdlyj8mxc] { padding: 12px 16px; }
}
[dir="rtl"] .notification-bell-btn[b-hzdlyj8mxc] { margin-left: 0; margin-right: 0; }
[dir="rtl"] .notification-icon[b-hzdlyj8mxc] { margin-left: 0; margin-right: 12px; }
[dir="rtl"] .unread-indicator[b-hzdlyj8mxc] { right: auto; left: 8px; }
/* /Components/Shared/NotificationPermissionPrompt.razor.rz.scp.css */
.notification-permission-banner[b-dijpqosxum] {
    position: fixed;
    top: 70px;
    right: 20px;
    background: linear-gradient(135deg, var(--ds-brand-600) 0%, var(--ds-brand-800) 100%);
    color: white;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    z-index: 1050;
    max-width: 420px;
    animation: slideInRight-b-dijpqosxum 0.4s ease-out;
}

@keyframes slideInRight-b-dijpqosxum {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

.permission-content[b-dijpqosxum] {
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.permission-content > i[b-dijpqosxum] {
    font-size: 2rem;
    flex-shrink: 0;
}

.permission-text[b-dijpqosxum] {
    flex: 1;
}

.permission-text h6[b-dijpqosxum] {
    margin: 0 0 4px 0;
    font-weight: 600;
    font-size: 1.1rem;
}

.permission-text p[b-dijpqosxum] {
    margin: 0;
    font-size: 0.9rem;
    opacity: 0.95;
}

.permission-actions[b-dijpqosxum] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex-shrink: 0;
}

.permission-actions .btn[b-dijpqosxum] {
    white-space: nowrap;
    padding: 8px 16px;
}

/* Mobile responsive */
@media (max-width: 576px) {
    .notification-permission-banner[b-dijpqosxum] {
        right: 10px;
        left: 10px;
        max-width: none;
        top: 60px;
    }

    .permission-content[b-dijpqosxum] {
        flex-direction: column;
        text-align: center;
        padding: 16px;
    }

    .permission-actions[b-dijpqosxum] {
        flex-direction: row;
        width: 100%;
    }

    .permission-actions .btn[b-dijpqosxum] {
        flex: 1;
    }
}
/* /Components/Shared/PersianDatePicker.razor.rz.scp.css */
.persian-date-picker-nullable[b-uyd4s55c59] {
    position: relative;
}

.date-input-wrapper[b-uyd4s55c59] {
    position: relative;
    cursor: pointer;
}

.date-input[b-uyd4s55c59] {
    cursor: pointer;
    padding-right: 2.5rem;
    background-color: var(--ds-surface);
}

.calendar-icon[b-uyd4s55c59] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--ds-brand-500);
    font-size: 1.1rem;
    pointer-events: none;
}

.picker-backdrop[b-uyd4s55c59] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 1040;
    backdrop-filter: blur(2px);
}

.date-picker-dropdown[b-uyd4s55c59] {
    position: fixed;
    z-index: 1050;
    background: var(--ds-elevated);
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    padding: 1.25rem;
    min-width: 320px;
}

.picker-header[b-uyd4s55c59] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--ds-border);
}

.btn-nav[b-uyd4s55c59] {
    background: var(--ds-elevated);
    border: 2px solid var(--ds-border-md);
    border-radius: 8px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-nav:hover[b-uyd4s55c59] {
        background: var(--ds-brand-500);
        color: white;
        border-color: var(--ds-brand-500);
        transform: scale(1.1);
    }

.header-title[b-uyd4s55c59] {
    display: flex;
    gap: 0.625rem;
    align-items: center;
}

.month-select[b-uyd4s55c59],
.year-select[b-uyd4s55c59] {
    border: 2px solid var(--ds-border-md);
    border-radius: 8px;
    padding: 0.375rem 0.75rem;
    font-weight: 600;
    color: var(--ds-text);
    background: var(--ds-elevated);
    cursor: pointer;
    font-size: 0.95rem;
    transition: all 0.2s ease;
}

    .month-select:hover[b-uyd4s55c59],
    .year-select:hover[b-uyd4s55c59] {
        border-color: var(--ds-brand-500);
        box-shadow: 0 2px 8px rgba(102, 126, 234, 0.15);
    }

    .month-select:focus[b-uyd4s55c59],
    .year-select:focus[b-uyd4s55c59] {
        outline: none;
        border-color: var(--ds-brand-500);
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

.weekdays[b-uyd4s55c59] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0.25rem;
    margin-bottom: 0.625rem;
}

.weekday[b-uyd4s55c59] {
    text-align: center;
    font-weight: 700;
    color: var(--ds-brand-500);
    padding: 0.625rem;
    font-size: 0.9rem;
    border-radius: 6px;
    background: var(--ds-brand-50);
}

    .weekday.friday[b-uyd4s55c59] {
        color: var(--ds-danger);
        background: rgba(220,38,38,0.08);
    }

.days-grid[b-uyd4s55c59] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0.3rem;
}

.day[b-uyd4s55c59] {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    transition: all 0.2s ease;
    color: var(--ds-text);
}

    .day:not(.empty):hover[b-uyd4s55c59] {
        background: var(--ds-brand-50);
        transform: scale(1.05);
    }

    .day.empty[b-uyd4s55c59] {
        cursor: default;
        pointer-events: none;
    }

    .day.today[b-uyd4s55c59] {
        border: 2px solid var(--ds-brand-500);
        color: var(--ds-brand-500);
    }

    .day.selected[b-uyd4s55c59] {
        background: linear-gradient(135deg, var(--ds-brand-500) 0%, var(--ds-brand-800) 100%);
        color: white;
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
    }

.picker-footer[b-uyd4s55c59] {
    display: flex;
    gap: 0.5rem;
    justify-content: space-between;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 2px solid var(--ds-border);
}

.btn-today[b-uyd4s55c59],
.btn-clear[b-uyd4s55c59] {
    flex: 1;
    border: 2px solid var(--ds-border-md);
    background: var(--ds-elevated);
    border-radius: 8px;
    padding: 0.5rem;
    cursor: pointer;
    font-weight: 600;
    color: var(--ds-text);
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
}

    .btn-today:hover[b-uyd4s55c59] {
        background: var(--ds-brand-500);
        color: white;
        border-color: var(--ds-brand-500);
        transform: translateY(-2px);
    }

    .btn-clear:hover[b-uyd4s55c59] {
        background: var(--ds-hover);
        border-color: var(--ds-border-lg);
        transform: translateY(-2px);
    }

/* Responsive adjustments */
@@media (max-width: 768px) {
    .date-picker-dropdown[b-uyd4s55c59] {
        min-width: 300px;
    }
}

/* /Components/Shared/PersianDateTimePicker.razor.rz.scp.css */
.persian-datetime-picker[b-dqx0dw1njc] {
    direction: rtl;
    text-align: right;
}

.persian-datetime-picker .form-select[b-dqx0dw1njc] {
    text-align: center;
}

.persian-datetime-picker small[b-dqx0dw1njc] {
    display: block;
    text-align: center;
    margin-top: 2px;
}

.persian-datetime-picker .row[b-dqx0dw1njc] {
    margin-bottom: 10px;
}
/* /Components/Shared/SkeletonLoader.razor.rz.scp.css */
/* Skeleton Loader Styles */
.skeleton-container[b-2iqkobqa26] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.skeleton-card[b-2iqkobqa26] {
    background: var(--ds-elevated);
    border-radius: 0.5rem;
    padding: 1.5rem;
    border: 1px solid var(--ds-border);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    animation: fadeIn-b-2iqkobqa26 0.3s ease-out;
}

/* Shimmer Animation */
@keyframes shimmer-b-2iqkobqa26 {
    0% {
        background-position: -1000px 0;
    }
    100% {
        background-position: 1000px 0;
    }
}

@keyframes pulse-b-2iqkobqa26 {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

@keyframes fadeIn-b-2iqkobqa26 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.skeleton-header[b-2iqkobqa26] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.skeleton-title[b-2iqkobqa26] {
    width: 60%;
    height: 24px;
    background: linear-gradient(90deg, var(--ds-raised) 25%, var(--ds-hover) 50%, var(--ds-raised) 75%);
    background-size: 1000px 100%;
    animation: shimmer-b-2iqkobqa26 2s infinite linear;
    border-radius: 4px;
}

.skeleton-badges[b-2iqkobqa26] {
    display: flex;
    gap: 0.5rem;
}

.skeleton-badge[b-2iqkobqa26] {
    width: 60px;
    height: 20px;
    background: linear-gradient(90deg, var(--ds-raised) 25%, var(--ds-hover) 50%, var(--ds-raised) 75%);
    background-size: 1000px 100%;
    animation: shimmer-b-2iqkobqa26 2s infinite linear;
    border-radius: 12px;
}

.skeleton-content[b-2iqkobqa26] {
    margin-bottom: 1rem;
}

.skeleton-line[b-2iqkobqa26] {
    height: 16px;
    background: linear-gradient(90deg, var(--ds-raised) 25%, var(--ds-hover) 50%, var(--ds-raised) 75%);
    background-size: 1000px 100%;
    animation: shimmer-b-2iqkobqa26 2s infinite linear;
    border-radius: 4px;
    margin-bottom: 0.5rem;
}

.skeleton-line.short[b-2iqkobqa26] {
    width: 70%;
}

.skeleton-meta[b-2iqkobqa26] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
}

.skeleton-text[b-2iqkobqa26] {
    width: 100px;
    height: 14px;
    background: linear-gradient(90deg, var(--ds-raised) 25%, var(--ds-hover) 50%, var(--ds-raised) 75%);
    background-size: 1000px 100%;
    animation: shimmer-b-2iqkobqa26 2s infinite linear;
    border-radius: 4px;
}

.skeleton-actions[b-2iqkobqa26] {
    display: flex;
    gap: 0.5rem;
}

.skeleton-button[b-2iqkobqa26] {
    width: 100px;
    height: 36px;
    background: linear-gradient(90deg, var(--ds-raised) 25%, var(--ds-hover) 50%, var(--ds-raised) 75%);
    background-size: 1000px 100%;
    animation: shimmer-b-2iqkobqa26 2s infinite linear;
    border-radius: 1.5rem;
}

/* Stagger animation delays */
.skeleton-card:nth-child(1)[b-2iqkobqa26] {
    animation-delay: 0s;
}
.skeleton-card:nth-child(2)[b-2iqkobqa26] {
    animation-delay: 0.05s;
}
.skeleton-card:nth-child(3)[b-2iqkobqa26] {
    animation-delay: 0.1s;
}
.skeleton-card:nth-child(4)[b-2iqkobqa26] {
    animation-delay: 0.15s;
}
.skeleton-card:nth-child(5)[b-2iqkobqa26] {
    animation-delay: 0.2s;
}
.skeleton-card:nth-child(n+6)[b-2iqkobqa26] {
    animation-delay: 0.25s;
}
/* /Components/Shared/WebPushToggle.razor.rz.scp.css */
.webpush-card[b-qi2c1ztipx] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 1rem 1.15rem;
    margin-bottom: 1rem;
    background: var(--ds-surface);
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-r-lg);
    box-shadow: var(--ds-shadow-xs);
}

.webpush-card > .bi[b-qi2c1ztipx] {
    font-size: 1.35rem;
    color: var(--ds-brand-500);
    flex-shrink: 0;
    line-height: 1.4;
}

.webpush-card--muted > .bi[b-qi2c1ztipx] {
    color: var(--ds-text-muted);
}

.webpush-body[b-qi2c1ztipx] {
    flex: 1;
    min-width: 0;
}

.webpush-card strong[b-qi2c1ztipx] {
    display: block;
    color: var(--ds-text);
    font-weight: 700;
    font-size: 0.95rem;
    margin-bottom: 0.2rem;
}

.webpush-card p[b-qi2c1ztipx] {
    color: var(--ds-text-muted);
    font-size: 0.85rem;
    line-height: 1.6;
    margin: 0;
}

.webpush-message[b-qi2c1ztipx] {
    margin-top: 0.5rem !important;
    font-weight: 600;
}

.webpush-message.is-success[b-qi2c1ztipx] {
    color: var(--ds-success);
}

.webpush-message.is-error[b-qi2c1ztipx] {
    color: var(--ds-danger);
}

.webpush-actions[b-qi2c1ztipx] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
}
/* /Components/Shared/WorkflowVisualizer.razor.rz.scp.css */
/* Workflow Visualizer Styles */
.workflow-visualizer[b-4hr1ggkizx] {
    background: var(--ds-elevated);
    border-radius: 0.75rem;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border: 1px solid var(--ds-border);
}

.workflow-header[b-4hr1ggkizx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--ds-border);
}

.workflow-header h5[b-4hr1ggkizx] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--ds-text);
}

.workflow-name[b-4hr1ggkizx] {
    font-size: 0.9rem;
    color: var(--ds-text-secondary);
    background: var(--ds-raised);
    padding: 0.25rem 0.75rem;
    border-radius: 1rem;
}

/* Current State Card */
.current-state-card[b-4hr1ggkizx] {
    margin-bottom: 1.5rem;
}

.state-badge[b-4hr1ggkizx] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border-radius: 0.5rem;
    color: white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s;
}

.state-badge:hover[b-4hr1ggkizx] {
    transform: translateY(-2px);
}

.state-icon[b-4hr1ggkizx] {
    font-size: 2rem;
    line-height: 1;
}

.state-info[b-4hr1ggkizx] {
    flex: 1;
}

.state-name[b-4hr1ggkizx] {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.state-description[b-4hr1ggkizx] {
    font-size: 0.85rem;
    opacity: 0.9;
}

/* Transitions Section */
.transitions-section[b-4hr1ggkizx] {
    margin-top: 1.5rem;
}

.transitions-title[b-4hr1ggkizx] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--ds-text);
    margin-bottom: 1rem;
}

.transitions-grid[b-4hr1ggkizx] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1rem;
}

.transition-button[b-4hr1ggkizx] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 1rem;
    border: 2px solid;
    border-radius: 0.5rem;
    background: var(--ds-elevated);
    cursor: pointer;
    transition: all 0.3s;
    text-align: right;
    width: 100%;
}

.transition-button:hover:not(:disabled)[b-4hr1ggkizx] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.transition-button:disabled[b-4hr1ggkizx] {
    opacity: 0.6;
    cursor: not-allowed;
}

.transition-icon[b-4hr1ggkizx] {
    font-size: 1.5rem;
}

.transition-name[b-4hr1ggkizx] {
    font-weight: 600;
    font-size: 1rem;
}

.transition-desc[b-4hr1ggkizx] {
    font-size: 0.85rem;
    color: var(--ds-text-secondary);
}

.transition-arrow[b-4hr1ggkizx] {
    font-size: 0.8rem;
    color: var(--ds-text-secondary);
    font-weight: 500;
}

/* Transition Types */
.transition-approve[b-4hr1ggkizx] {
    border-color: var(--ds-success);
    color: var(--ds-success);
}

.transition-approve:hover:not(:disabled)[b-4hr1ggkizx] {
    background: var(--ds-success);
    color: var(--ds-text-on-brand);
}

.transition-reject[b-4hr1ggkizx] {
    border-color: var(--ds-danger);
    color: var(--ds-danger);
}

.transition-reject:hover:not(:disabled)[b-4hr1ggkizx] {
    background: var(--ds-danger);
    color: var(--ds-text-on-brand);
}

.transition-cancel[b-4hr1ggkizx] {
    border-color: var(--ds-warning);
    color: var(--ds-warning);
}

.transition-cancel:hover:not(:disabled)[b-4hr1ggkizx] {
    background: var(--ds-warning);
    color: var(--ds-text-on-brand);
}

.transition-submit[b-4hr1ggkizx] {
    border-color: var(--ds-brand-500);
    color: var(--ds-brand-500);
}

.transition-submit:hover:not(:disabled)[b-4hr1ggkizx] {
    background: var(--ds-brand-500);
    color: var(--ds-text-on-brand);
}

.transition-review[b-4hr1ggkizx] {
    border-color: var(--ds-violet);
    color: var(--ds-violet);
}

.transition-review:hover:not(:disabled)[b-4hr1ggkizx] {
    background: var(--ds-violet);
    color: var(--ds-text-on-brand);
}

.transition-default[b-4hr1ggkizx] {
    border-color: var(--ds-text-secondary);
    color: var(--ds-text-secondary);
}

.transition-default:hover:not(:disabled)[b-4hr1ggkizx] {
    background: var(--ds-text-secondary);
    color: var(--ds-text-on-brand);
}

/* History Section */
.history-section[b-4hr1ggkizx] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 2px solid var(--ds-border);
}

.history-title[b-4hr1ggkizx] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--ds-text);
    margin-bottom: 1rem;
}

.history-timeline[b-4hr1ggkizx] {
    position: relative;
    padding-right: 2rem;
}

.history-timeline[b-4hr1ggkizx]::before {
    content: '';
    position: absolute;
    right: 0.5rem;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--ds-border);
}

.history-item[b-4hr1ggkizx] {
    position: relative;
    margin-bottom: 1.5rem;
    padding-right: 2rem;
}

.history-dot[b-4hr1ggkizx] {
    position: absolute;
    right: 0;
    top: 0.25rem;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: var(--ds-success);
    border: 3px solid var(--ds-elevated);
    box-shadow: 0 0 0 2px var(--ds-success);
}

.history-item.failed .history-dot[b-4hr1ggkizx] {
    background: var(--ds-danger);
    box-shadow: 0 0 0 2px var(--ds-danger);
}

.history-content[b-4hr1ggkizx] {
    background: var(--ds-raised);
    padding: 1rem;
    border-radius: 0.5rem;
    border-right: 3px solid var(--ds-success);
}

.history-item.failed .history-content[b-4hr1ggkizx] {
    border-right-color: var(--ds-danger);
}

.history-action[b-4hr1ggkizx] {
    font-weight: 600;
    color: var(--ds-text);
    margin-bottom: 0.5rem;
}

.history-transition[b-4hr1ggkizx] {
    font-size: 0.85rem;
    color: var(--ds-text-secondary);
    margin-right: 0.5rem;
}

.history-comment[b-4hr1ggkizx] {
    font-size: 0.9rem;
    color: var(--ds-text);
    margin-bottom: 0.5rem;
    font-style: italic;
}

.history-meta[b-4hr1ggkizx] {
    display: flex;
    gap: 1rem;
    font-size: 0.8rem;
    color: var(--ds-text-secondary);
    margin-top: 0.5rem;
}

.history-error[b-4hr1ggkizx] {
    background: rgba(220,38,38,0.10);
    color: var(--ds-danger);
    padding: 0.5rem;
    border-radius: 0.25rem;
    margin-top: 0.5rem;
    font-size: 0.85rem;
}

/* Responsive */
@media (max-width: 768px) {
    .transitions-grid[b-4hr1ggkizx] {
        grid-template-columns: 1fr;
    }

    .workflow-header[b-4hr1ggkizx] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
}

/* Animation */
@keyframes fadeInScale-b-4hr1ggkizx {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.workflow-visualizer[b-4hr1ggkizx] {
    animation: fadeInScale-b-4hr1ggkizx 0.3s ease-out;
}

.transition-button[b-4hr1ggkizx] {
    animation: fadeInScale-b-4hr1ggkizx 0.3s ease-out backwards;
}

.transition-button:nth-child(1)[b-4hr1ggkizx] { animation-delay: 0.05s; }
.transition-button:nth-child(2)[b-4hr1ggkizx] { animation-delay: 0.1s; }
.transition-button:nth-child(3)[b-4hr1ggkizx] { animation-delay: 0.15s; }
.transition-button:nth-child(4)[b-4hr1ggkizx] { animation-delay: 0.2s; }
.transition-button:nth-child(n+5)[b-4hr1ggkizx] { animation-delay: 0.25s; }