/*
 * «مدیریت وظایف کارمندان» و «وظایف من» (تسک ۱۴۰۵/۰۷/۱۰/۰۱).
 *
 * A plain stylesheet loaded at the end of the head, like the panel's other
 * four: the deploy does not build assets, so a rule written into the compiled
 * theme would never reach production.
 */

/* ── «وظایف من» در هدر پنل (بند ۲۳، ۲۴، ۲۷، ۲۸) ───────────────────────── */

.fi-my-tasks-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.35rem 0.7rem;
    margin-inline-end: 0.5rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(31, 121, 87, 0.35);
    background-color: rgba(31, 121, 87, 0.08);
    color: #15603f;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
}

.dark .fi-my-tasks-link {
    border-color: rgba(52, 211, 153, 0.35);
    background-color: rgba(16, 185, 129, 0.12);
    color: #a7f3d0;
}

.fi-my-tasks-link:hover {
    background-color: rgba(31, 121, 87, 0.16);
}

.fi-my-tasks-icon {
    width: 1.1rem;
    height: 1.1rem;
    flex: none;
}

.fi-my-tasks-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 0.3rem;
    border-radius: 999px;
    background-color: #dc2626;
    color: #fff;
    font-size: 0.6875rem;
    font-weight: 700;
}

.fi-my-tasks-badge[hidden] {
    display: none;
}

/*
 * The pulse of بند ۲۷: «پررنگ → بسیار آرام کم‌رنگ → بسیار آرام پررنگ», one
 * cycle in seven seconds — far slower than the monitoring lights, which run in
 * well under two. It never blinks, never flashes and never disappears: the
 * floor is 0.72 opacity, so the entry is readable at every moment of the
 * cycle.
 */
@keyframes fi-my-tasks-breath {
    0%   { opacity: 1; }
    50%  { opacity: 0.72; }
    100% { opacity: 1; }
}

.fi-my-tasks-link[data-state="open"] {
    animation: fi-my-tasks-breath 7s ease-in-out infinite;
}

/* بند ۲۸ — فوری یا عقب‌افتاده: تأکید بیشتر، با همان ریتم آرام. */
.fi-my-tasks-link[data-state="attention"] {
    border-color: rgba(220, 38, 38, 0.55);
    background-color: rgba(220, 38, 38, 0.1);
    color: #991b1b;
    animation: fi-my-tasks-breath 6s ease-in-out infinite;
}

.dark .fi-my-tasks-link[data-state="attention"] {
    color: #fecaca;
}

/* بند ۲۸ — بدون کار باز: بدون هیچ Animation. */
.fi-my-tasks-link[data-state="idle"] {
    animation: none;
}

@media (prefers-reduced-motion: reduce) {
    .fi-my-tasks-link {
        animation: none !important;
    }
}

@media (max-width: 640px) {
    /* بند ۵۳ — روی موبایل عنوان جمع می‌شود ولی خود دسترسی و نشان می‌مانند. */
    .fi-my-tasks-label {
        display: none;
    }
}

/* ── صفحه «وظایف من» ──────────────────────────────────────────────────── */

.fi-my-tasks-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.fi-my-tasks-summary-item {
    display: inline-flex;
    align-items: baseline;
    gap: 0.35rem;
    font-size: 0.8125rem;
    color: #4b5563;
}

.dark .fi-my-tasks-summary-item {
    color: #d1d5db;
}

.fi-my-tasks-summary-value {
    font-size: 1.05rem;
    font-weight: 700;
    color: #1f7957;
}

.dark .fi-my-tasks-summary-value {
    color: #6ee7b7;
}

.fi-my-tasks-readonly {
    font-size: 0.75rem;
    color: #b45309;
}

.fi-my-tasks-reminders {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 0.9rem;
}

.fi-my-tasks-reminder {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(234, 88, 12, 0.35);
    background-color: rgba(234, 88, 12, 0.08);
    font-size: 0.8125rem;
}

.fi-my-tasks-reminder-icon {
    width: 1.1rem;
    height: 1.1rem;
    color: #ea580c;
    flex: none;
}

.fi-my-tasks-reminder-text {
    flex: 1 1 auto;
}

.fi-my-tasks-reminder-time {
    margin-inline-start: 0.5rem;
    color: #6b7280;
}

.fi-my-tasks-reminder-close {
    border: 0;
    background: none;
    color: #6b7280;
    font-size: 0.75rem;
    cursor: pointer;
}

.fi-my-tasks-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(107, 114, 128, 0.2);
}

.fi-my-tasks-tab {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.75rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(107, 114, 128, 0.25);
    background-color: transparent;
    color: #4b5563;
    font-size: 0.8125rem;
    cursor: pointer;
}

.dark .fi-my-tasks-tab {
    color: #d1d5db;
}

.fi-my-tasks-tab[data-active="true"] {
    border-color: #1f7957;
    background-color: rgba(31, 121, 87, 0.12);
    color: #15603f;
    font-weight: 700;
}

.dark .fi-my-tasks-tab[data-active="true"] {
    color: #a7f3d0;
}

.fi-my-tasks-tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.1rem;
    height: 1.1rem;
    padding: 0 0.25rem;
    border-radius: 999px;
    background-color: rgba(107, 114, 128, 0.18);
    font-size: 0.6875rem;
    font-weight: 700;
}

.fi-my-tasks-list {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.fi-my-tasks-empty {
    padding: 1.5rem;
    text-align: center;
    color: #6b7280;
    font-size: 0.875rem;
}

/* ── کارت وظیفه (بند ۳۳ و ۳۴) ─────────────────────────────────────────── */

.fi-task-card {
    position: relative;
    padding: 0.9rem 1.1rem 0.9rem 0.9rem;
    padding-inline-start: 1.2rem;
    border-radius: 0.75rem;
    border: 1px solid rgba(107, 114, 128, 0.22);
    background-color: #fff;
    overflow: hidden;
}

.dark .fi-task-card {
    background-color: rgba(31, 41, 55, 0.6);
    border-color: rgba(107, 114, 128, 0.35);
}

/* هویت رنگی روی نوار کناری می‌نشیند، نه روی کل کارت (بند ۳۴). */
.fi-task-accent {
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background-color: var(--task-accent, #9ca3af);
}

.fi-task-card[data-overdue="true"] {
    border-color: rgba(220, 38, 38, 0.45);
}

.fi-task-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    margin-bottom: 0.5rem;
}

.fi-task-title {
    flex: 1 1 14rem;
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: #111827;
}

.dark .fi-task-title {
    color: #f3f4f6;
}

.fi-task-marks {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
}

.fi-task-level,
.fi-task-status,
.fi-task-type,
.fi-task-overdue,
.fi-task-new {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 600;
    white-space: nowrap;
}

.fi-task-level {
    color: #fff;
    background-color: var(--task-accent, #9ca3af);
}

.fi-task-level-icon,
.fi-task-type-icon {
    width: 0.85rem;
    height: 0.85rem;
}

.fi-task-status {
    border: 1px solid rgba(107, 114, 128, 0.35);
    color: #374151;
}

.dark .fi-task-status {
    color: #e5e7eb;
}

.fi-task-status[data-task-status="in_progress"] { border-color: #0284c7; color: #0369a1; }
.fi-task-status[data-task-status="paused"] { border-color: #ea580c; color: #c2410c; }
.fi-task-status[data-task-status="awaiting_approval"] { border-color: #7c3aed; color: #6d28d9; }
.fi-task-status[data-task-status="done"] { border-color: #16a34a; color: #15803d; }

.fi-task-overdue {
    background-color: rgba(220, 38, 38, 0.12);
    color: #b91c1c;
}

.fi-task-new {
    background-color: rgba(31, 121, 87, 0.14);
    color: #15603f;
}

.fi-task-type {
    border: 1px dashed rgba(107, 114, 128, 0.4);
    color: #6b7280;
}

.fi-task-body {
    margin: 0.4rem 0 0.6rem;
    font-size: 0.875rem;
    line-height: 1.9;
    color: #374151;
}

.dark .fi-task-body {
    color: #d1d5db;
}

.fi-task-body ul { list-style: disc; padding-inline-start: 1.2rem; }
.fi-task-body ol { list-style: decimal; padding-inline-start: 1.2rem; }
.fi-task-body a { color: #1f7957; text-decoration: underline; }

.fi-task-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 1.1rem;
    margin: 0 0 0.6rem;
}

.fi-task-fact {
    display: inline-flex;
    align-items: baseline;
    gap: 0.3rem;
    font-size: 0.75rem;
}

.fi-task-fact dt {
    color: #6b7280;
}

.fi-task-fact dd {
    margin: 0;
    font-weight: 600;
    color: #374151;
}

.dark .fi-task-fact dd {
    color: #e5e7eb;
}

.fi-task-fact[data-overdue="true"] dd {
    color: #b91c1c;
}

.fi-task-links {
    margin-bottom: 0.6rem;
}

.fi-task-links-label {
    display: block;
    margin-bottom: 0.25rem;
    font-size: 0.6875rem;
    color: #6b7280;
}

.fi-task-links ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.fi-task-links a {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.55rem;
    border-radius: 0.4rem;
    border: 1px solid rgba(31, 121, 87, 0.35);
    color: #15603f;
    font-size: 0.75rem;
    text-decoration: none;
}

.dark .fi-task-links a {
    color: #a7f3d0;
    border-color: rgba(52, 211, 153, 0.35);
}

.fi-task-link-icon {
    width: 0.8rem;
    height: 0.8rem;
}

.fi-task-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    padding-top: 0.6rem;
    border-top: 1px dashed rgba(107, 114, 128, 0.25);
}

.fi-task-action {
    padding: 0.3rem 0.8rem;
    border-radius: 0.45rem;
    border: 1px solid rgba(31, 121, 87, 0.4);
    background-color: rgba(31, 121, 87, 0.06);
    color: #15603f;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
}

.fi-task-action-done {
    border-color: rgba(22, 163, 74, 0.5);
    background-color: rgba(22, 163, 74, 0.1);
    color: #15803d;
}

.fi-task-note {
    font-size: 0.6875rem;
    color: #6b7280;
}

/* ── Timeline و جدول مخاطبان ──────────────────────────────────────────── */

.fi-task-timeline {
    margin-top: 0.6rem;
    padding-top: 0.6rem;
    border-top: 1px dashed rgba(107, 114, 128, 0.25);
}

.fi-task-timeline-title {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.6875rem;
    color: #6b7280;
}

.fi-task-timeline ol {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.fi-task-timeline li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    color: #4b5563;
}

.dark .fi-task-timeline li {
    color: #d1d5db;
}

.fi-task-event-icon {
    width: 0.85rem;
    height: 0.85rem;
    flex: none;
}

.fi-task-event-label {
    font-weight: 600;
}

.fi-task-event-time,
.fi-task-event-actor,
.fi-task-event-detail {
    color: #6b7280;
}

.fi-task-recipients table {
    width: 100%;
    font-size: 0.8125rem;
    border-collapse: collapse;
}

.fi-task-recipients th,
.fi-task-recipients td {
    padding: 0.4rem 0.5rem;
    border-bottom: 1px solid rgba(107, 114, 128, 0.2);
    text-align: start;
}

.fi-task-recipients th {
    font-weight: 700;
    color: #6b7280;
}

.fi-task-recipients td[data-recipient-seen="no"] {
    color: #b45309;
}

@media (max-width: 640px) {
    .fi-task-card {
        padding-inline-end: 0.75rem;
    }

    .fi-task-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .fi-task-action {
        width: 100%;
        text-align: center;
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
 * مرحله دوم — تسک ۱۴۰۵/۰۷/۱۱/۰۲
 *
 * هویت بصری یکپارچه (بند ۷ تا ۱۴ و ۲۳)، هدر صفحه ویرایش (بند ۳)، و بازطراحی
 * اطلاعات لیست مدیریت (بند ۱۵ تا ۲۳).
 *
 * همه‌چیز روی کلاس‌هایی نوشته شده که فقط همین مدیریت روی عناصر خودش می‌گذارد،
 * پس این فایل — که سراسر پنل بارگذاری می‌شود — روی هیچ صفحهٔ دیگری اثر ندارد.
 * ═══════════════════════════════════════════════════════════════════════════ */

/* ── ردیف «آیکون + متن» گزینه‌ها (بند ۸، ۱۰، ۱۱، ۱۲، ۱۴) ───────────────── */

.fi-task-opt {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
}

.fi-task-opt-icon {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
}

.fi-task-opt-icon svg {
    width: 1.1rem;
    height: 1.1rem;
}

.fi-task-opt-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* دایرهٔ رنگی سطح اهمیت. قطرش را هر جا که استفاده می‌شود خودِ آن‌جا تعیین
   می‌کند (`--fi-task-dot-size`)، تا در هدر صفحه ویرایش «تقریباً هم‌اندازه
   ارتفاع فونت عنوان» باشد بدون آنکه این فایل بداند آن فونت چند است (بند ۳). */
.fi-task-dot {
    display: inline-block;
    flex: none;
    width: var(--fi-task-dot-size, 0.75rem);
    height: var(--fi-task-dot-size, 0.75rem);
    border-radius: 999px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
}

.dark .fi-task-dot {
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18);
}

/* عنوانِ دارای آیکون — «نوع یادآوری» و «کانال‌های یادآوری» (بند ۱۲ و ۱۴). */
.fi-task-heading {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.fi-task-heading-icon {
    display: inline-flex;
}

.fi-task-heading-icon svg {
    width: 1rem;
    height: 1rem;
}

/* ── گزینه‌های Select فیلامنت (Choices.js) ─────────────────────────────── */

/* Choices هر گزینه را داخل عنصر خودش می‌گذارد؛ این دو قاعده فقط جا باز
   می‌کنند تا آیکون و متن در یک خط بنشینند و ارتفاع ردیف تغییر نکند. */
.choices__list .fi-task-opt,
.choices__item .fi-task-opt {
    width: 100%;
}

/* ── «اولویت نمایش» با رقم فارسی (بند ۶) ──────────────────────────────── */

/* جعبه دیگر `type=number` نیست، پس مرورگر فلش‌های بالا/پایین را نمی‌کشد و
   جهت متن باید صریح گفته شود تا «۱۲» وارونه خوانده نشود. */
.fi-task-priority-input {
    direction: ltr;
    text-align: center;
}

/* ── «کانال‌های یادآوری»: فاصلهٔ نصف‌شده (بند ۱۴) ──────────────────────── */

/* فیلامنت به شبکهٔ CheckboxList فاصلهٔ `1rem` می‌دهد؛ اینجا نصف می‌شود تا
   سه کانال جمع‌وجورتر و آشکارا یک مجموعه دیده شوند. */
.fi-task-channels {
    column-gap: 0.5rem;
}

/* ── روزهای هفته در یک ردیف (بند ۱۳) ──────────────────────────────────── */

/* ستون‌ها را خود فیلد می‌دهد (`columns(['lg' => 7])`)؛ این فقط فاصله را کم
   می‌کند تا هفت روز در عرض واقعی صفحه جا شوند و نشکنند. */
.fi-task-weekdays {
    column-gap: 0.5rem;
    row-gap: 0.4rem;
}

/* ── هدر صفحه ویرایش (بند ۳) ──────────────────────────────────────────── */

.fi-task-edit-title {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    /* حدود ۲۵٪ کوچک‌تر از اندازهٔ فعلی هدر — نسبی، تا هدر صفحات دیگر پنل
       دست‌نخورده بماند. */
    font-size: 0.75em;
    line-height: 1.6;
}

.fi-task-edit-prefix {
    color: #111827;
}

.dark .fi-task-edit-prefix {
    color: #ffffff;
}

.fi-task-edit-name {
    color: rgb(var(--warning-600, 217 119 6));
}

.dark .fi-task-edit-name {
    color: rgb(var(--warning-400, 251 191 36));
}

/* ── عنوان و تعداد لیست مدیریت (بند ۱۵) ───────────────────────────────── */

.fi-task-total-sep {
    color: rgb(var(--gray-400, 156 163 175));
    font-weight: 400;
    margin-inline: 0.35rem;
}

.dark .fi-task-total-sep {
    color: rgb(var(--gray-600, 75 85 99));
}

.fi-task-total {
    color: rgb(var(--warning-600, 217 119 6));
}

.dark .fi-task-total {
    color: rgb(var(--warning-400, 251 191 36));
}

/* ── ردیف‌های جدول (بند ۱۵، ۱۹، ۲۲) ───────────────────────────────────── */

.fi-task-title-cell {
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
}

.fi-task-title {
    color: rgb(var(--warning-600, 217 119 6));
    font-weight: 500;
}

.dark .fi-task-title {
    color: rgb(var(--warning-400, 251 191 36));
}

/* رنگ یکی‌درمیان کار `->striped()` است؛ اینجا فقط Hover یک پله جدا می‌شود،
   وگرنه روی ردیف زوج هیچ تفاوتی دیده نمی‌شد (بند ۱۹). */
.fi-ta-row.fi-task-row:hover > .fi-ta-cell {
    background-color: rgb(229 231 235);
}

.dark .fi-ta-row.fi-task-row:hover > .fi-ta-cell {
    background-color: rgba(255, 255, 255, 0.08);
}

/* ── سلول‌های ساخته‌شده با ViewColumn ──────────────────────────────────── */

/* `.fi-ta-col` یک ردیف flex است، پس ریشهٔ هر view باید تمام عرض را بگیرد
   وگرنه محتوا به لبهٔ ستون می‌چسبد. */
.fi-task-cell {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.fi-task-creator {
    justify-content: center;
}

.fi-task-count {
    font-variant-numeric: tabular-nums;
}

.fi-task-all-staff,
.fi-task-role {
    display: inline-block;
    padding: 0.05rem 0.4rem;
    border-radius: 0.375rem;
    font-size: 0.75rem;
    background-color: rgba(107, 114, 128, 0.14);
    color: rgb(var(--gray-700, 55 65 81));
}

.dark .fi-task-all-staff,
.dark .fi-task-role {
    background-color: rgba(255, 255, 255, 0.08);
    color: rgb(var(--gray-200, 229 231 235));
}

.fi-task-roles,
.fi-task-avatars {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    flex-wrap: wrap;
}

.fi-task-avatar-slot {
    display: inline-flex;
}

.fi-task-avatar-slot .pm-option-avatar {
    height: 1.5rem;
    width: 1.5rem;
}

.fi-task-avatar-more {
    font-size: 0.75rem;
    color: rgb(var(--gray-500, 107 114 128));
}

.fi-task-creator-none {
    color: rgb(var(--gray-400, 156 163 175));
}

/* ── متن Tooltip ستون «نوع» (بند ۲۱) ──────────────────────────────────── */

.fi-task-tip-line {
    display: block;
    position: relative;
    text-align: right;
    /* تسک ۰۹، بند ۴ — a long line wraps inside the box rather than running
       past it; the box keeps tippy's own width limit and edge handling. */
    white-space: normal;
    overflow-wrap: anywhere;
    padding-inline-start: 0.8em;
}

/* تسک ۰۹، بند ۴ — twice the space between items. Between two lines of text
   the space is the line's leading (its line-height less its font size); one
   more leading on top of the next item doubles it, at any font size and
   without making the type larger. A wrapped item keeps its own lines tight. */
.fi-task-tip-line + .fi-task-tip-line {
    margin-top: calc(1lh - 1em);
}

/* A small white dot at the start of each item — the start only, so a wrapped
   item has one dot, on its first line. A faint ring keeps it visible on the
   light theme's white box. */
.fi-task-tip-line::before {
    content: '';
    position: absolute;
    inset-inline-start: 0;
    top: calc(0.5lh - 0.2em);
    width: 0.4em;
    height: 0.4em;
    border-radius: 9999px;
    background: #ffffff;
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.35);
}

.fi-task-tip-label {
    opacity: 0.7;
}

/* ── موبایل (بند ۲۵) ──────────────────────────────────────────────────── */

@media (max-width: 640px) {
    /* آواتارها نباید جدول را سرریز کنند. */
    .fi-task-avatars {
        max-width: 100%;
    }

    .fi-task-edit-title {
        flex-wrap: wrap;
    }
}

/* آواتار داخل سلول‌ها با همان Markup «ادغام» کشیده می‌شود
   (`PickerAvatar::render()`)، اما قواعدش آن‌جا به‌صورت یک بلوک <style> کنار
   خودِ صفحه می‌آید. اینجا همان چند قاعده، محدود به سلول‌های همین جدول. */
.fi-task-avatar-slot .pm-option-avatar {
    border-radius: 999px;
    object-fit: cover;
    flex: none;
}

.fi-task-avatar-slot .pm-option-avatar-fallback {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgb(229 231 235);
    color: rgb(107 114 128);
}

.dark .fi-task-avatar-slot .pm-option-avatar-fallback {
    background: rgba(255, 255, 255, 0.1);
    color: rgb(156 163 175);
}

.fi-task-avatar-slot .pm-option-avatar-fallback svg {
    height: 0.9rem;
    width: 0.9rem;
}

/* ══ تسک ۱۴۰۵/۰۷/۲۵ شمارهٔ ۰۳ — بازطراحی فرم، لیست و «وظایف من» ══════════ */

/* بند ۴.۱ و ۹.۲ — عنوان صفحه‌های ایجاد، ویرایش، «وظایف من» و «وظایف کارمندان»
   دو‌سوم اندازهٔ پیشین (۳۰ پیکسل ← ۲۰ پیکسل؛ روی موبایل ۲۴ ← ۱۶). */
.fi-resource-employee-tasks.fi-resource-create-record-page .fi-header-heading,
.fi-resource-employee-tasks.fi-resource-edit-record-page .fi-header-heading,
.fi-page:has([data-my-tasks]) .fi-header-heading {
    font-size: 1rem;
    line-height: 1.5rem;
}

@media (min-width: 640px) {
    .fi-resource-employee-tasks.fi-resource-create-record-page .fi-header-heading,
    .fi-resource-employee-tasks.fi-resource-edit-record-page .fi-header-heading,
    .fi-page:has([data-my-tasks]) .fi-header-heading {
        font-size: 1.25rem;
        line-height: 1.75rem;
    }
}

/* بند ۴.۲ و ۴.۵ — مراحل جمع‌وجور: فقط محتوای مرحلهٔ جاری، فاصله‌های کمتر. */
.fi-task-wizard .fi-fo-wizard-step {
    padding: 1rem 1.25rem;
}

.fi-task-wizard .fi-fo-wizard-header-step-button {
    padding: 0.6rem 0.9rem;
}

.fi-task-wizard .fi-fo-wizard-header-step-label {
    font-size: 0.8125rem;
}

/* بند ۴.۶ — شمارهٔ مراحل با رقم فارسی («۰۱» به‌جای «01»). عدد را خود فیلامنت
   می‌نویسد؛ اینجا همان جایگاه با رقم فارسی دوباره کشیده می‌شود. */
.fi-task-wizard .fi-fo-wizard-header-step-indicator {
    font-size: 0 !important;
}

.fi-task-wizard .fi-fo-wizard-header-step-indicator::after {
    font-size: 0.875rem;
}

.fi-task-wizard .fi-fo-wizard-header > li:nth-child(1) .fi-fo-wizard-header-step-indicator::after {
    content: '۰۱';
}

.fi-task-wizard .fi-fo-wizard-header > li:nth-child(2) .fi-fo-wizard-header-step-indicator::after {
    content: '۰۲';
}

.fi-task-wizard .fi-fo-wizard-header > li:nth-child(3) .fi-fo-wizard-header-step-indicator::after {
    content: '۰۳';
}

.fi-task-wizard .fi-fo-wizard-header > li:nth-child(4) .fi-fo-wizard-header-step-indicator::after {
    content: '۰۴';
}

.fi-task-wizard .fi-fo-wizard-header > li:nth-child(5) .fi-fo-wizard-header-step-indicator::after {
    content: '۰۵';
}

.fi-task-wizard .fi-fo-wizard-header > li:nth-child(6) .fi-fo-wizard-header-step-indicator::after {
    content: '۰۶';
}

/* بند ۴.۴ — خلاصهٔ تجمیعی: یک خط برای هر مرحله، جزئیات بلند تاشونده. */
.fi-task-summary {
    border: 1px solid rgba(31, 121, 87, 0.35);
    border-radius: 0.75rem;
    background-color: rgba(31, 121, 87, 0.05);
    padding: 0.6rem 0.9rem;
    font-size: 0.8125rem;
    max-height: 14rem;
    overflow-y: auto;
}

.dark .fi-task-summary {
    background-color: rgba(31, 121, 87, 0.12);
}

.fi-task-summary-head {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-weight: 700;
    color: #15603f;
    margin-bottom: 0.35rem;
}

.dark .fi-task-summary-head {
    color: #a7f3d0;
}

.fi-task-summary-icon {
    width: 1.1rem;
    height: 1.1rem;
}

.fi-task-summary-groups {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.fi-task-summary-group {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.25rem 0.6rem;
    min-width: 0;
}

.fi-task-summary-step {
    font-weight: 700;
    white-space: nowrap;
}

.fi-task-summary-items {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.15rem 0.75rem;
    min-width: 0;
}

.fi-task-summary-item {
    overflow-wrap: anywhere;
}

.fi-task-summary-label {
    opacity: 0.7;
}

.fi-task-summary-more summary {
    cursor: pointer;
    color: #1f7957;
    overflow-wrap: anywhere;
}

.fi-task-summary-more dl {
    margin: 0.25rem 0 0.25rem 0;
    padding-inline-start: 0.75rem;
}

.fi-task-summary-more dt {
    font-weight: 600;
}

.fi-task-summary-more dd {
    margin: 0 0 0.25rem 0;
    overflow-wrap: anywhere;
}

/* بند ۴.۶ — «اولویت نمایش» راست‌چین، با رقم فارسی و لاتین یکسان؛ و محتوای
   فیلدهای نوع، اهمیت و الگوها هم راست‌چین. */
.fi-task-priority-input {
    direction: rtl;
    text-align: right;
}

.fi-task-rtl-field .choices__inner,
.fi-task-rtl-field .choices__list--single,
.fi-task-rtl-field .choices__item,
.fi-task-rtl-field button,
.fi-task-rtl-field select {
    text-align: right;
    direction: rtl;
}

/* بند ۵.۱ — «اجازه ویرایش این وظیفه» برای هر کارمند. */
.fi-task-editors {
    row-gap: 0.4rem;
}

/* بند ۸.۱ — آواتار سازنده و مخاطبان دو برابر (۲۴ ← ۴۸ پیکسل). */
.fi-task-avatar-slot .pm-option-avatar {
    height: 3rem;
    width: 3rem;
}

.fi-task-avatar-slot .pm-option-avatar-fallback svg {
    height: 1.8rem;
    width: 1.8rem;
}

.fi-task-row > td {
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
}

/* بند ۸.۲ — ستون عنوان سه برابر عرض پیشین (اندازه‌گیری‌شده: ۲۴۷ ← ۷۴۰ پیکسل)؛ عنوان بلند با «…» کوتاه می‌شود
   و متن کامل روی Hover (و `title` برای فشار طولانی در موبایل) می‌آید. */
.fi-ta-table th.fi-task-title-col,
.fi-ta-table td.fi-task-title-col {
    width: 46.25rem;
    min-width: 46.25rem;
    max-width: 46.25rem;
}

/* A table cell ignores `max-width`, so the width is held by what is inside it:
   without this a long title pushes the column out and runs over its neighbours. */
.fi-ta-table td.fi-task-title-col .fi-ta-col-wrp,
.fi-ta-table td.fi-task-title-col .fi-ta-text {
    width: 44rem;
    max-width: 44rem;
    min-width: 0;
    overflow: hidden;
}

/* Every wrapper between the cell and the words has to be allowed to shrink,
   or the words never reach the edge that draws the «…». */
.fi-ta-table td.fi-task-title-col .fi-ta-text > div,
.fi-ta-table td.fi-task-title-col .fi-ta-text-item,
.fi-ta-table td.fi-task-title-col .fi-ta-text-item-label {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
}

.fi-ta-table td.fi-task-title-col .fi-task-title-cell {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.fi-ta-table td.fi-task-title-col .fi-task-title {
    flex: 1 1 auto;
}

.fi-ta-table td.fi-task-title-col .fi-ta-text > p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fi-ta-table td.fi-task-title-col .fi-task-title-cell {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    overflow: hidden;
}

.fi-ta-table td.fi-task-title-col .fi-task-title,
.fi-ta-table td.fi-task-title-col .fi-ta-text-description {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* بند ۸.۳ — ستون «نوع» جای کامل عبارت نوع را دارد. */
.fi-ta-table th.fi-task-type-col,
.fi-ta-table td.fi-task-type-col {
    min-width: 9.5rem;
}

/* بند ۸.۴ — عملیات فقط با آیکون؛ آیکون غیرفعال کم‌رنگ است و دلیلش را می‌گوید. */
.fi-ta-table td.fi-task-op .fi-ta-icon-item {
    width: 1.35rem;
    height: 1.35rem;
}

.fi-ta-table td.fi-task-op[data-task-op-state="off"] .fi-ta-icon-item {
    opacity: 0.35;
    cursor: not-allowed;
}

/* بند ۹.۲ — دکمه‌های تب‌مانند، آیکون و شمارنده ۲۰٪ بزرگ‌تر. */
.fi-my-tasks-tab {
    gap: 0.48rem;
    padding: 0.48rem 0.9rem;
    font-size: 0.975rem;
}

.fi-my-tasks-tab-count {
    min-width: 1.32rem;
    height: 1.32rem;
    padding: 0 0.3rem;
    font-size: 0.825rem;
}

.fi-my-tasks-summary-item {
    font-size: 1.05em;
}

/* بند ۱۰ — انتخاب کارمند در «وظایف کارمندان». */
.fi-staff-tasks-picker {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    margin-bottom: 1rem;
    padding: 0.6rem 0.9rem;
    border-radius: 0.75rem;
    border: 1px solid rgba(107, 114, 128, 0.25);
}

.fi-staff-tasks-picker-label {
    font-weight: 700;
}

.fi-staff-tasks-picker-select {
    min-width: 16rem;
    max-width: 100%;
    border-radius: 0.5rem;
    border: 1px solid rgba(107, 114, 128, 0.35);
    padding: 0.35rem 0.6rem;
    background-color: transparent;
}

.fi-staff-tasks-viewing-note {
    opacity: 0.65;
    font-size: 0.8125rem;
}

@media (max-width: 767px) {
    /* بند ۴.۵ — on a phone the six steps are one row that scrolls sideways,
       not six stacked rows above the form. */
    .fi-task-wizard .fi-fo-wizard-header {
        display: flex;
        overflow-x: auto;
    }

    .fi-task-wizard .fi-fo-wizard-header > li {
        flex: 0 0 auto;
        border-top-width: 0 !important;
    }

    .fi-task-wizard .fi-fo-wizard-header-step-button {
        padding: 0.5rem 0.6rem;
        gap: 0.4rem;
    }

    .fi-task-wizard .fi-fo-wizard-header-step-indicator {
        font-size: 0.75rem;
    }

    .fi-task-wizard .fi-fo-wizard-header-step-icon-ctn,
    .fi-task-wizard .fi-fo-wizard-header-step-button > div:first-child {
        width: 2rem;
        height: 2rem;
    }
}

@media (max-width: 640px) {
    .fi-ta-table th.fi-task-title-col,
    .fi-ta-table td.fi-task-title-col {
        width: 16rem;
        min-width: 16rem;
        max-width: 16rem;
    }

    .fi-ta-table td.fi-task-title-col .fi-ta-col-wrp,
    .fi-ta-table td.fi-task-title-col .fi-ta-text {
        width: 14rem;
        max-width: 14rem;
    }

    .fi-staff-tasks-picker-select {
        min-width: 0;
        width: 100%;
    }
}

/* ── تسک ۰۴ — ردیف یادآوری‌ها، تب «یادآوری‌ها» و کارت‌ها ───────────────────── */

/* بند ۴.۳ — one and a half times the old row, parts split by vertical rules. */
.fi-my-tasks-reminder {
    flex-wrap: wrap;
    min-height: 3rem;
    padding-block: 0.75rem;
}

.fi-my-tasks-reminder-line {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.fi-my-tasks-reminder-label {
    color: #dc2626;
    font-weight: 700;
}

.fi-my-tasks-reminder-day,
.fi-my-tasks-reminder-clock {
    color: #16a34a;
    font-weight: 600;
    white-space: nowrap;
}

.fi-my-tasks-reminder-sep {
    width: 1px;
    height: 1rem;
    background: currentColor;
    opacity: 0.3;
    flex: none;
}

.fi-my-tasks-reminder-channel {
    border-bottom: 2px solid var(--channel-status, #94a3b8);
    white-space: nowrap;
}

.fi-my-tasks-reminder-title {
    font-weight: 600;
    min-width: 0;
    overflow-wrap: anywhere;
}

.fi-my-tasks-reminder-title:hover {
    text-decoration: underline;
}

.fi-my-tasks-reminder-details {
    flex: 1 0 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1.25rem;
    margin: 0.35rem 1.6rem 0 0;
    font-size: 0.78rem;
}

.fi-my-tasks-reminder-detail {
    display: flex;
    gap: 0.35rem;
}

.fi-my-tasks-reminder-detail dt {
    color: #6b7280;
}

.fi-my-tasks-reminder-meta {
    color: #6b7280;
}

.fi-my-tasks-reminder-key {
    font-family: ui-monospace, monospace;
    color: #6b7280;
}

.fi-my-tasks-history {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.fi-my-tasks-more {
    align-self: center;
    border: 1px solid rgba(22, 163, 74, 0.4);
    border-radius: 0.5rem;
    padding: 0.4rem 1rem;
    color: #16a34a;
    background: none;
    cursor: pointer;
}

/* بند ۴.۴ — the type's icon beside the title, and a bell for the reminder. */
.fi-task-title {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.fi-task-title-icon {
    width: 1.1rem;
    height: 1.1rem;
    flex: none;
    color: var(--task-accent, #16a34a);
}

.fi-task-fact-icon {
    display: inline-block;
    width: 0.95rem;
    height: 0.95rem;
    margin-inline-end: 0.25rem;
    vertical-align: -0.15rem;
    color: #f59e0b;
}

@media (max-width: 639px) {
    .fi-my-tasks-reminder-sep {
        display: none;
    }
}

/* ── تسک ۰۴، بند ۵ — فهرست مدیریت وظایف ─────────────────────────────────── */

/* بند ۵.۱ — the title column as wide as its titles and about a centimetre
   more, no longer a fixed 46rem of mostly empty space; what it gives up goes
   to the columns that need it. A long title still ends in «…». */
.fi-ta-table th.fi-task-title-col,
.fi-ta-table td.fi-task-title-col {
    /* As narrow as its longest title allows (1% is the table's way of
       saying "shrink to the content"), never wider than 28rem of title. */
    width: 1%;
    min-width: 0;
    max-width: none;
    padding-inline-end: 1cm;
}

.fi-ta-table td.fi-task-title-col .fi-ta-col-wrp,
.fi-ta-table td.fi-task-title-col .fi-ta-text {
    width: max-content;
    min-width: 10rem;
    max-width: 28rem;
}

.fi-ta-table td.fi-task-title-col .fi-task-title-cell {
    white-space: nowrap;
}

.fi-task-avatar-link {
    cursor: pointer;
}

/* The description under the title starts where the title's words start, not
   under the level dot. */
.fi-ta-table td.fi-task-title-col .fi-ta-text > p {
    padding-inline-start: calc(0.8em + 0.4rem);
}

a.fi-task-title:hover {
    text-decoration: underline;
}

/* بند ۵.۲ — avatars overlap by a third of their width, first on the right. */
.fi-task-avatars-stacked {
    flex-wrap: nowrap;
    gap: 0;
}

.fi-task-avatars-stacked .fi-task-avatar-slot {
    position: relative;
    border-radius: 999px;
    box-shadow: 0 0 0 2px #fff;
}

.dark .fi-task-avatars-stacked .fi-task-avatar-slot {
    box-shadow: 0 0 0 2px rgb(24 24 27);
}

.fi-task-avatars-stacked .fi-task-avatar-slot + .fi-task-avatar-slot {
    margin-inline-start: -0.5rem;
}

.fi-task-avatars-stacked .fi-task-avatar-slot:hover {
    z-index: 2;
}

.fi-task-avatars-stacked .fi-task-avatar-more {
    margin-inline-start: 0.35rem;
    cursor: help;
}

/* ── تسک ۰۴، بند ۶ — فرم وظیفه ─────────────────────────────────────────── */

/* بند ۶.۱ — «خلاصه وظیفه» closed by default; open, green headings and one
   fact per line beneath each. */
details.fi-task-summary > summary {
    cursor: pointer;
    list-style: none;
}

details.fi-task-summary > summary::-webkit-details-marker {
    display: none;
}

.fi-task-summary-chevron {
    width: 1rem;
    height: 1rem;
    margin-inline-start: auto;
    transition: transform 0.15s ease;
}

details.fi-task-summary[open] .fi-task-summary-chevron {
    transform: rotate(180deg);
}

.fi-task-summary-stacked {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: 0.9rem 1.5rem;
    padding-top: 0.75rem;
}

.fi-task-summary-stacked .fi-task-summary-group {
    display: block;
}

.fi-task-summary-stacked .fi-task-summary-step {
    color: #16a34a;
    font-weight: 700;
    font-size: 0.875rem;
    margin-bottom: 0.3rem;
}

.fi-task-summary-lines {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-size: 0.8125rem;
}

.fi-task-summary-lines .fi-task-summary-value {
    overflow-wrap: anywhere;
}

/* بند ۶.۳ — the help window: centred title, green bold questions. */
.fi-task-step-help {
    margin-bottom: -0.5rem;
}

.fi-modal-window:has([data-step-help-body]) .fi-modal-heading.fi-legacy {
    text-align: center;
    width: 100%;
}

.fi-task-help {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.fi-task-help-q {
    color: #16a34a;
    font-weight: 700;
}

.fi-task-help-a {
    font-weight: 400;
    line-height: 1.8;
}

/* بند ۶.۴ — the step markers green, at two thirds of their size; active,
   completed and not-yet-reached still read differently. */
.fi-task-wizard .fi-fo-wizard-header-step-icon-ctn {
    width: 1.6667rem !important;
    height: 1.6667rem !important;
}

.fi-task-wizard .fi-fo-wizard-header-step-icon {
    width: 1rem !important;
    height: 1rem !important;
}

.fi-task-wizard .fi-fo-wizard-header-step.fi-completed .fi-fo-wizard-header-step-icon-ctn {
    background-color: #16a34a !important;
    border-color: #16a34a !important;
}

.fi-task-wizard .fi-fo-wizard-header-step.fi-active .fi-fo-wizard-header-step-icon-ctn {
    border-color: #16a34a !important;
}

.fi-task-wizard .fi-fo-wizard-header-step.fi-active .fi-fo-wizard-header-step-indicator::after,
.fi-task-wizard .fi-fo-wizard-header-step.fi-active .fi-fo-wizard-header-step-label {
    color: #16a34a !important;
}

.fi-task-wizard .fi-fo-wizard-header-step-indicator::after {
    font-size: 0.75rem;
}

/* بند ۶.۵ — the people the task is for, beside its title in the heading. */
.fi-task-edit-sep {
    width: 1px;
    height: 1.1em;
    background: currentColor;
    opacity: 0.35;
    margin-inline: 0.35rem;
}

.fi-task-edit-avatars {
    display: inline-flex;
    align-items: center;
}

.fi-task-edit-avatars .fi-task-avatar-slot .pm-option-avatar {
    width: 1.75rem;
    height: 1.75rem;
}

.fi-task-sends-note,
.fi-task-sends-empty {
    font-size: 0.8125rem;
    color: #6b7280;
}

.fi-task-sends-table {
    width: 100%;
    margin-block: 0.4rem;
    font-size: 0.8125rem;
    border-collapse: collapse;
}

.fi-task-sends-table th,
.fi-task-sends-table td {
    padding: 0.3rem 0.5rem;
    border-bottom: 1px solid rgba(107, 114, 128, 0.2);
    text-align: start;
}

.fi-modal-window:has([data-step-help-body]) .fi-modal-header > div,
.fi-modal-window:has([data-step-help-body]) .fi-modal-heading {
    flex: 1 1 auto;
    width: 100%;
    text-align: center;
}

/* ── تسک ۰۵ — مدیریت وظایف مدیران ───────────────────────────────────────── */

/* بند ۴.۳ — every reminder box: the panel's warning yellow, black text and a
   black border; «یادآوری:» red, the day dark green, the clock and channels
   black. The shades are the darker ones of each family, so the text keeps its
   contrast on yellow in the light and dark themes alike. */
.fi-my-tasks-reminder,
.dark .fi-my-tasks-reminder {
    background-color: #fcd34d;
    border: 1px solid #000;
    color: #000;
}

.fi-my-tasks-reminder .fi-my-tasks-reminder-icon {
    color: #000;
}

.fi-my-tasks-reminder .fi-my-tasks-reminder-label {
    color: #b91c1c;
}

.fi-my-tasks-reminder .fi-my-tasks-reminder-day {
    color: #14532d;
    font-weight: 700;
}

.fi-my-tasks-reminder .fi-my-tasks-reminder-clock,
.fi-my-tasks-reminder .fi-my-tasks-reminder-channels,
.fi-my-tasks-reminder .fi-my-tasks-reminder-title,
.fi-my-tasks-reminder .fi-my-tasks-reminder-close,
.fi-my-tasks-reminder .fi-my-tasks-reminder-detail dt,
.fi-my-tasks-reminder .fi-my-tasks-reminder-meta,
.fi-my-tasks-reminder .fi-my-tasks-reminder-key {
    color: #000;
}

.fi-my-tasks-reminder .fi-my-tasks-reminder-sep {
    opacity: 0.6;
}

/* بند ۷.۳ — the type's name at two thirds of its size, further from the faces. */
.fi-ta-table td.fi-task-type-col .fi-task-opt-label {
    font-size: 0.6667em;
}

.fi-ta-table td.fi-task-type-col {
    padding-inline-end: 1.25rem;
}

/* بند ۸ — the right to edit, on the corner of each face. */
.fi-task-avatar-slot {
    position: relative;
}

.fi-task-edit-badge {
    position: absolute;
    bottom: -0.2rem;
    inset-inline-start: -0.2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 0.85rem;
    height: 0.85rem;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15);
    pointer-events: none;
}

.fi-task-edit-badge svg {
    width: 0.7rem;
    height: 0.7rem;
}

.fi-task-edit-badge-on {
    color: #16a34a;
}

.fi-task-edit-badge-off {
    color: #dc2626;
}

/* بند ۹ — the managers with tasks, under the title: one face and its count
   each, most first, green rules between them, scrolling sideways when there
   are many. */
.fi-task-managers-row {
    display: flex;
    padding-inline: 1rem;
    border-bottom: 1px solid rgba(107, 114, 128, 0.15);
    font-size: 0.875rem;
    align-items: stretch;
    overflow-x: auto;
    max-width: 100%;
    padding-block: 0.25rem;
    scrollbar-width: thin;
}

/* تسک ۰۶، بند ۸ — what the number under each face counts. */
.fi-task-managers-note {
    margin: 0;
    padding: 0.125rem 1rem 0.375rem;
    font-size: 0.75rem;
    line-height: 1.6;
    color: rgb(75, 85, 99);
}

.dark .fi-task-managers-note {
    color: rgb(209, 213, 219);
}

.fi-task-manager {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    flex: none;
    padding-inline: 0.75rem;
    cursor: default;
}

.fi-task-manager + .fi-task-manager {
    border-inline-start: 2px solid #16a34a;
}

.fi-task-managers-row .fi-task-manager-avatar .pm-option-avatar {
    width: 2.25rem;
    height: 2.25rem;
}

.fi-task-manager-count {
    font-weight: 700;
    line-height: 1;
    color: #111827;
}

.dark .fi-task-manager-count {
    color: #fff;
}

/* بند ۱۰.۱ — the description's editor at about half its old height to start
   with; it still grows with the text. */
.fi-task-editor-compact trix-editor {
    min-height: 6rem !important;
}

/* بند ۱۰.۱ و ۱۱ — the step closer to its buttons, and «مرحله قبل» and «مرحله
   بعدی» side by side rather than at the two ends of the form. */
.fi-task-wizard .fi-fo-wizard-step {
    padding-bottom: 0.5rem;
}

.fi-task-wizard > div:last-child {
    justify-content: flex-start;
    padding-top: 0;
    padding-bottom: 0.75rem;
}

.fi-resource-employee-tasks .fi-form-actions {
    margin-top: -0.5rem;
}

/* بند ۱۱.۱ — the Persian numeral and the tick at the exact centre of each
   circle, on a desktop and a phone alike. */
.fi-task-wizard .fi-fo-wizard-header-step-icon-ctn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.fi-task-wizard .fi-fo-wizard-header-step-indicator {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    line-height: 1 !important;
}

.fi-task-wizard .fi-fo-wizard-header-step-indicator::after {
    display: block;
    line-height: 1;
}

.fi-task-wizard .fi-fo-wizard-header-step-icon {
    margin: auto;
}

/* بند ۱۲ — the group switch's explanation, smaller than the other helpers.
   تسک ۰۶ (پذیرش نهایی), بند ۹ — two thirds of 14px came out at 9.3px, which
   is not readable on a desktop or a phone; 12px is the smallest size the
   panel uses for running text, so it stays the smaller note without being
   unreadable. */
.fi-task-small-help {
    font-size: 0.75rem;
    line-height: 1.7;
}

/* بند ۱۳ و ۱۴.۲ — headings in the panel's yellow. */
.fi-task-label-yellow {
    color: rgb(var(--warning-500, 245 158 11));
    font-weight: 600;
}

/* بند ۱۴.۲ — شنبه first on the right, half the old distance between days,
   wrapping in order on a phone. */
.fi-task-weekdays {
    display: flex !important;
    flex-wrap: wrap;
    gap: 0.4rem 1.25rem !important;
}

.fi-task-weekdays > * {
    flex: none;
}

/* ── «افزودن یادآوری» و «افزودن لینک» کنار سوابق همان فیلد (تسک ۰۹، بند ۳) ── */

/* The label row of the two repeaters: the history icon at the right, the add
   button right beside it — not pushed to the far left by justify-between. */
[data-task-add-beside-history] > div > div:first-child {
    justify-content: flex-start;
    column-gap: 0.5rem;
}

[data-task-add-beside-history] > div > div:first-child > .fi-fo-field-wrp-hint {
    margin-inline-start: 0;
}

/* On a create form there is no history icon yet; the empty group would still
   take a gap, so the button would stand off the right edge. */
[data-task-add-beside-history] > div > div:first-child > .fi-information-history-label-group:not(:has(*)) {
    display: none;
}

/* The repeater's own copy, centred under the rows, is the same action: hidden
   so there is exactly one «افزودن» per field. */
[data-task-add-beside-history] .fi-fo-repeater > div:last-child:has(> .fi-ac-action),
[data-task-add-beside-history] .fi-fo-repeater > div:last-child:has(> .fi-btn) {
    display: none;
}