/* ==========================================================================
   دردشة الفريق — صفحة #teamChatPage (أصناف tc-*)
   نقل لتصميم team-chat.html المرجعي (جذر المستودع) على توكنز Modernize:
   كل لون/ظلّ/حدّ من base.css/dark.css فيتكيّف مع الوضع الليلي تلقائياً.
   الأفاتارات المتدرّجة (tc-bg-*) زخرفية ثابتة في الوضعين.
   ========================================================================== */

/* ---- القشرة: عمود المحادثات + المحادثة + لوحة المحتوى ---- */
#teamChatPage .tc-shell {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr) 320px;
    /* ارتفاع الشاشة مطروحاً منه: حشوة main-content (20+20) + حشوة البطاقة
       (16+16) + الترويسة (70) + فجوة الصفحة (18) + هامش أمان. التمرير داخلي
       في كل عمود — تجربة دردشة لا صفحة تمتد للأسفل. */
    height: calc(100vh - 175px);
    min-height: 480px;
    background: var(--bg-main);
    border: 1px solid var(--border-main);
    border-radius: var(--pane-radius, 8px);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    /* حاضنة الأدراج: العمودان الجانبيان يصيران طبقات مطلقة داخل القشرة على
       الشاشات الصغيرة، فيقصّهما overflow ولا يزاحمان سُلّم تكديس المستند.
       isolation ضروري لا تجميلي: بدونه يتنافس 90/95 على مستوى المستند فتطفو
       الورقة فوق درج الشريط الجانبي (--z-sidebar: 60) لو فُتحا معاً على
       الجوال. بالعزل يبقى الرقمان تكديساً محلياً داخل القشرة كما تنصّ
       DESIGN.md، وتظلّ النوافذ (--z-modal) والقوائم العائمة فوقها. */
    position: relative;
    isolation: isolate;
}

/* ---- أفاتار عام + لوحة التدرّجات الزخرفية ---- */
#teamChatPage .tc-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #fff;
    font-weight: 800;
    font-size: 12px;
    flex: none;
}
#teamChatPage .tc-avatar.sm { width: 22px; height: 22px; font-size: 9.5px; }

#teamChatPage .tc-bg-1 { background: linear-gradient(135deg, var(--primary), var(--accent)); }
#teamChatPage .tc-bg-2 { background: linear-gradient(135deg, var(--danger, #EC7D63), var(--secondary)); }
#teamChatPage .tc-bg-3 { background: linear-gradient(135deg, var(--success), var(--accent)); }
#teamChatPage .tc-bg-4 { background: linear-gradient(135deg, var(--pending-text, #5B3FBF), var(--danger, #EC7D63)); }
#teamChatPage .tc-bg-5 { background: linear-gradient(135deg, var(--secondary), var(--danger, #EC7D63)); }
#teamChatPage .tc-bg-6 { background: linear-gradient(135deg, var(--primary-deep, #1E2A45), var(--primary)); }

/* ==========================================================================
   عمود المحادثات
   ========================================================================== */
#teamChatPage .tc-conv {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--surface-solid);
    border-inline-end: 1px solid var(--border-main);
    min-height: 0;
}

#teamChatPage .tc-conv-head {
    padding: 16px 18px 12px;
    border-bottom: 1px solid var(--border-main);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: none;
}
#teamChatPage .tc-conv-head h3 {
    margin: 0;
    font-size: 13.5px;
    font-weight: 800;
    color: var(--text-title);
}
/* مجموعة أزرار ترويسة العمود (إضافة + إغلاق الدرج) */
#teamChatPage .tc-head-group {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: none;
}
#teamChatPage .tc-add-btn {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid var(--border-main);
    background: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
    font-family: inherit;
}
#teamChatPage .tc-add-btn:hover {
    border-color: var(--primary);
    color: var(--primary);
    background: var(--light-primary);
}

#teamChatPage .tc-conv-list {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    /* بلوغ طرف القائمة لا يمرّر السحب للصفحة خلفها (scroll chaining) — نفس
       نمط درج الشريط الجانبي. يحمي أيضاً من ارتداد iOS فوق القشرة الثابتة. */
    overscroll-behavior: contain;
    padding: 12px 10px;
}

#teamChatPage .tc-sec-label {
    padding: 10px 12px 6px;
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-muted);
}

#teamChatPage .tc-chat-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 10px;
    cursor: pointer;
    transition: background 0.15s ease;
    margin-bottom: 2px;
    position: relative;
}
#teamChatPage .tc-chat-item:hover { background: var(--surface-hover); }
#teamChatPage .tc-chat-item:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: -2px;
}
#teamChatPage .tc-chat-item.active { background: var(--light-primary); }
#teamChatPage .tc-chat-item.active::before {
    content: '';
    position: absolute;
    inset-inline-start: 0;
    top: 8px;
    bottom: 8px;
    width: 3px;
    background: var(--primary);
    border-radius: 999px;
}

#teamChatPage .tc-chat-ico {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    flex: none;
    background: var(--bg-main);
    color: var(--text-secondary);
    font-weight: 800;
    font-size: 14px;
    font-family: var(--app-mono-family);
}
#teamChatPage .tc-chat-item.active .tc-chat-ico {
    background: var(--primary);
    color: #fff;
}

#teamChatPage .tc-chat-meta { flex: 1; min-width: 0; }
#teamChatPage .tc-chat-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--text-title);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#teamChatPage .tc-chat-preview {
    font-size: 11.5px;
    color: var(--text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 1px;
}

#teamChatPage .tc-chat-side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
    flex: none;
}
#teamChatPage .tc-chat-time {
    font-size: 10px;
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}
#teamChatPage .tc-dot-online {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--success);
    box-shadow: 0 0 0 2px var(--surface-solid);
    flex: none;
}

#teamChatPage .tc-conv-foot {
    padding: 12px;
    border-top: 1px solid var(--border-main);
    flex: none;
}
#teamChatPage .tc-profile-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
}
#teamChatPage .tc-profile-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--text-title);
}
#teamChatPage .tc-profile-role {
    font-size: 10.5px;
    color: var(--text-muted);
    margin-top: 1px;
}
#teamChatPage .tc-profile-card .tc-dot-online { margin-inline-start: auto; }

/* ==========================================================================
   المحادثة الحالية
   ========================================================================== */
#teamChatPage .tc-main {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
    min-width: 0;
}

/* ---- الترويسة ---- */
#teamChatPage .tc-head {
    flex: none;
    background: var(--surface-solid);
    border-bottom: 1px solid var(--border-main);
    padding: 14px 22px;
    display: flex;
    align-items: center;
    gap: 14px;
    box-shadow: var(--shadow-sm);
}
#teamChatPage .tc-head-ico {
    width: 40px;
    height: 40px;
    border-radius: 11px;
    background: var(--primary);
    color: #fff;
    display: grid;
    place-items: center;
    font-family: var(--app-mono-family);
    font-weight: 700;
    font-size: 16px;
    flex: none;
}
#teamChatPage .tc-head-info { flex: 1; min-width: 0; }
#teamChatPage .tc-head-info h2 {
    margin: 0;
    font-size: 15px;
    font-weight: 800;
    color: var(--text-title);
    /* الاسم يُقصّ ولا يزحم أزرار الترويسة — بلا هذا يدفع اسمٌ طويل
       زرّ «محتوى القناة» خارج الشاشة على الجوال. */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#teamChatPage .tc-head-sub {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 2px;
    display: flex;
    align-items: center;
    gap: 6px;
}
#teamChatPage .tc-head-sub > span:last-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#teamChatPage .tc-pulse {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--success);
    flex: none;
    animation: tc-pulse 2s infinite;
}
@keyframes tc-pulse {
    0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--success) 60%, transparent); }
    50% { box-shadow: 0 0 0 6px transparent; }
}

#teamChatPage .tc-head-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: none;
}
#teamChatPage .tc-head-btn,
#teamChatPage .tc-top-action {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid var(--border-main);
    background: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: border-color 0.15s ease, color 0.15s ease;
    font-family: inherit;
}
#teamChatPage .tc-head-btn:hover,
#teamChatPage .tc-top-action:hover {
    border-color: var(--primary);
    color: var(--primary);
}

/* ---- مؤشّر المحتوى المخفيّ ----
   حين تنطوي لوحة القناة إلى درج/ورقة، يصير زرّها هو الأثر الوحيد لوجودها —
   فالشارة تحمل عدد ما ينتظر خلفه (مهام مفتوحة + ملاحظات) كي لا يبدو الزرّ
   بابَاً على فراغ ولا يختفي المحتوى بلا دليل. */
#teamChatPage .tc-panel-toggle,
#teamChatPage .tc-only-mobile { display: none; }
#teamChatPage .tc-panel-toggle { position: relative; }
#teamChatPage .tc-head-badge {
    position: absolute;
    top: -4px;
    inset-inline-end: -4px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--primary);
    color: #fff;
    border: 2px solid var(--surface-solid);
    font-size: 10px;
    font-weight: 800;
    line-height: 14px;
    text-align: center;
    font-variant-numeric: tabular-nums;
    pointer-events: none;
}
#teamChatPage .tc-head-badge[hidden] { display: none; }
/* نبضة واحدة عند وصول جديد أثناء المزامنة — لحظة معلومة لا حركة دائمة */
@keyframes tc-badge-bump {
    0% { transform: scale(1); }
    45% { transform: scale(1.3); }
    100% { transform: scale(1); }
}
#teamChatPage .tc-head-badge.bump { animation: tc-badge-bump 0.34s cubic-bezier(0.16, 1, 0.3, 1); }

/* زرّ إغلاق الورقة/الدرج — مخفيّ ما دام العمود جزءاً من الشبكة */
#teamChatPage .tc-sheet-close {
    display: none;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid var(--border-main);
    background: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    place-items: center;
    transition: border-color 0.15s ease, color 0.15s ease;
    font-family: inherit;
}
#teamChatPage .tc-sheet-close:hover {
    border-color: var(--primary);
    color: var(--primary);
}

/* ---- جسم المحادثة ---- */
#teamChatPage .tc-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    /* بلوغ طرف القائمة لا يمرّر السحب للصفحة خلفها (scroll chaining) — نفس
       نمط درج الشريط الجانبي. يحمي أيضاً من ارتداد iOS فوق القشرة الثابتة. */
    overscroll-behavior: contain;
    padding: 16px 22px 18px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

#teamChatPage .tc-day-divider {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 18px 22px 8px;
    color: var(--text-muted);
    font-size: 11px;
    font-weight: 700;
    flex: none;
}
#teamChatPage .tc-day-divider::before,
#teamChatPage .tc-day-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--border-main);
}

/* ---- الرسائل ---- */
#teamChatPage .tc-msg {
    display: flex;
    gap: 12px;
    padding: 8px 12px;
    border-radius: 12px;
    transition: background 0.15s ease;
}
#teamChatPage .tc-msg:hover { background: var(--surface-hover); }
#teamChatPage .tc-msg > .tc-avatar { align-self: flex-start; margin-top: 20px; }
#teamChatPage .tc-msg-stack { flex: 1; min-width: 0; }

#teamChatPage .tc-msg-head {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 2px;
    line-height: 1.2;
}
#teamChatPage .tc-msg-name {
    font-size: 13.5px;
    font-weight: 800;
    color: var(--text-title);
}
#teamChatPage .tc-msg-time {
    font-size: 11px;
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}

/* ---- تجميع رسائل المُرسِل نفسه ----
   الرسالة التالية لمرسلها نفسه بلا أفاتار ولا اسم — الوقت وحده في الترويسة —
   فتتراص تحت رسالته الأولى ولا يتشتت التدفق. الرسائل المتفرقة تفصل بمسافة. */
#teamChatPage .tc-msg + .tc-msg:not(.is-grouped) { margin-top: 10px; }
#teamChatPage .tc-msg.is-grouped { padding-top: 1px; }
#teamChatPage .tc-msg.is-grouped .tc-msg-head { margin-bottom: 0; }

#teamChatPage .tc-bubble {
    display: inline-block;
    max-width: 600px;
    padding: 10px 14px;
    background: var(--surface-solid);
    border: 1px solid var(--border-main);
    border-radius: 12px;
    border-top-right-radius: 4px;
    color: var(--text-main);
    font-size: 13.5px;
    line-height: 1.65;
    word-break: break-word;
}
#teamChatPage .tc-bubble p { margin: 0; }
#teamChatPage .tc-bubble p + p { margin-top: 6px; }
#teamChatPage .tc-bubble strong { font-weight: 700; color: var(--text-title); }
#teamChatPage .tc-mention {
    color: var(--primary);
    background: color-mix(in srgb, var(--primary) 12%, transparent);
    padding: 1px 6px;
    border-radius: 5px;
    font-weight: 700;
}

/* ---- بطاقة مهمّة داخل الرسالة ---- */
#teamChatPage .tc-task-card {
    margin-top: 6px;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid var(--border-main);
    background: var(--surface-solid);
    max-width: 480px;
    position: relative;
    overflow: hidden;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
#teamChatPage .tc-task-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}
#teamChatPage .tc-task-card::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    inset-inline-start: 0;
    width: 4px;
}
#teamChatPage .tc-task-card.high::before { background: var(--danger, #EC7D63); }
#teamChatPage .tc-task-card.mid::before { background: var(--warning); }
#teamChatPage .tc-task-card.low::before { background: var(--info); }
#teamChatPage .tc-task-card.done::before { background: var(--success); }
#teamChatPage .tc-task-card.done .tc-task-title {
    color: var(--text-muted);
    text-decoration: line-through;
}

#teamChatPage .tc-task-tags {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}
#teamChatPage .tc-task-tag {
    font-size: 10px;
    font-weight: 800;
    padding: 2px 8px;
    border-radius: 999px;
    letter-spacing: 0.3px;
}
#teamChatPage .tc-task-tag.high { background: var(--light-danger); color: var(--danger, #EC7D63); }
#teamChatPage .tc-task-tag.mid { background: var(--light-warning); color: var(--warning); }
#teamChatPage .tc-task-tag.low { background: var(--light-info); color: var(--info); }
#teamChatPage .tc-task-tag.done { background: var(--light-success); color: var(--success); }
#teamChatPage .tc-task-tag.id {
    background: var(--bg-main);
    color: var(--text-muted);
    font-family: var(--app-mono-family);
}

#teamChatPage .tc-task-title {
    font-size: 14px;
    font-weight: 800;
    color: var(--text-title);
    margin: 0 0 4px;
    line-height: 1.45;
}
#teamChatPage .tc-task-desc {
    font-size: 12.5px;
    color: var(--text-secondary);
    line-height: 1.55;
    margin: 0 0 10px;
}
#teamChatPage .tc-task-foot {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    font-size: 11.5px;
    color: var(--text-muted);
}
#teamChatPage .tc-meta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
#teamChatPage .tc-meta strong {
    color: var(--text-title);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
#teamChatPage .tc-task-check {
    margin-inline-start: auto;
    width: 26px;
    height: 26px;
    border-radius: 8px;
    border: 1.5px solid var(--border-main);
    background: var(--surface-solid);
    cursor: pointer;
    display: grid;
    place-items: center;
    color: transparent;
    transition: border-color 0.15s ease, background 0.15s ease;
    font-family: inherit;
    flex: none;
}
#teamChatPage .tc-task-check:hover { border-color: var(--success); }
#teamChatPage .tc-task-check.done {
    background: var(--success);
    border-color: var(--success);
    color: #fff;
}

/* ---- بطاقة ملاحظة داخل الرسالة ---- */
#teamChatPage .tc-note-card {
    margin-top: 6px;
    padding: 12px 14px 14px;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--light-warning), color-mix(in srgb, var(--warning) 6%, transparent));
    border: 1px solid color-mix(in srgb, var(--warning) 20%, transparent);
    max-width: 460px;
    position: relative;
}
#teamChatPage .tc-note-card.pinned {
    background: linear-gradient(135deg, var(--light-warning), color-mix(in srgb, var(--warning) 10%, transparent));
    border-color: var(--warning);
}
#teamChatPage .tc-note-pin {
    position: absolute;
    top: 10px;
    inset-inline-end: 12px;
    color: var(--warning);
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
#teamChatPage .tc-note-title {
    font-size: 13px;
    font-weight: 800;
    color: var(--text-title);
    margin: 0 0 4px;
    padding-inline-end: 60px;
}
#teamChatPage .tc-note-body {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.65;
    margin: 0;
}
#teamChatPage .tc-note-foot {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px dashed color-mix(in srgb, var(--warning) 30%, transparent);
    font-size: 11px;
    color: var(--text-muted);
}

/* ---- التفاعلات ---- */
#teamChatPage .tc-reactions {
    margin-top: 6px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
#teamChatPage .tc-reaction {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    background: var(--surface-solid);
    border: 1px solid var(--border-main);
    border-radius: 999px;
    font-size: 11.5px;
    color: var(--text-secondary);
    cursor: pointer;
    font-weight: 600;
    font-family: inherit;
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
#teamChatPage .tc-reaction:hover { border-color: var(--primary); color: var(--primary); }
#teamChatPage .tc-reaction.acted {
    background: color-mix(in srgb, var(--primary) 10%, transparent);
    border-color: var(--primary);
    color: var(--primary);
}
#teamChatPage .tc-count { font-variant-numeric: tabular-nums; }

/* ---- رسالة نظام ---- */
#teamChatPage .tc-msg.system { gap: 8px; align-items: center; }
#teamChatPage .tc-msg.system .tc-bubble {
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    border-color: color-mix(in srgb, var(--accent) 30%, transparent);
    color: var(--text-main);
    font-size: 12.5px;
    border-top-right-radius: 12px;
    padding: 8px 12px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
#teamChatPage .tc-sys-ico {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--accent);
    color: #fff;
    display: grid;
    place-items: center;
    flex: none;
}

/* ---- مؤشّر الكتابة (يُفعَّل عند ربط الدردشة بخادم) ---- */
#teamChatPage .tc-typing {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    margin: 4px 22px 0;
    color: var(--text-muted);
    font-size: 11.5px;
    flex: none;
}
#teamChatPage .tc-typing[hidden] { display: none; }
#teamChatPage .tc-typing-dots {
    display: inline-flex;
    gap: 3px;
}
#teamChatPage .tc-typing-dots span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--text-muted);
    animation: tc-typing-dot 1.4s infinite ease-in-out;
}
#teamChatPage .tc-typing-dots span:nth-child(2) { animation-delay: 0.2s; }
#teamChatPage .tc-typing-dots span:nth-child(3) { animation-delay: 0.4s; }
@keyframes tc-typing-dot {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.4; }
    30% { transform: translateY(-4px); opacity: 1; }
}

/* ==========================================================================
   شريط الكتابة
   ========================================================================== */
#teamChatPage .tc-composer {
    flex: none;
    background: var(--surface-solid);
    border-top: 1px solid var(--border-main);
    padding: 14px 22px 16px;
}

#teamChatPage .tc-modes {
    display: flex;
    gap: 6px;
    margin-bottom: 10px;
}
#teamChatPage .tc-mode-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border-radius: 999px;
    border: 1px solid var(--border-main);
    background: var(--surface-solid);
    color: var(--text-secondary);
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
#teamChatPage .tc-mode-btn:hover { border-color: var(--primary); color: var(--primary); }
#teamChatPage .tc-mode-btn.active {
    background: var(--light-primary);
    border-color: var(--primary);
    color: var(--primary);
}
#teamChatPage .tc-mode-btn[data-mode='task'].active,
#teamChatPage .tc-mode-btn[data-mode='note'].active {
    background: var(--light-warning);
    border-color: var(--warning);
    color: var(--warning);
}

#teamChatPage .tc-composer-card {
    border: 1px solid var(--border-main);
    border-radius: 14px;
    padding: 12px 14px;
    background: var(--bg-main);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
#teamChatPage .tc-composer-card:focus-within {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 14%, transparent);
    background: var(--surface-solid);
}
#teamChatPage .tc-composer-card[data-mode='task'],
#teamChatPage .tc-composer-card[data-mode='note'] {
    border-color: color-mix(in srgb, var(--warning) 30%, transparent);
    background: var(--light-warning);
}

#teamChatPage .tc-composer textarea {
    width: 100%;
    border: none;
    background: transparent;
    outline: none;
    resize: none;
    font-family: inherit;
    font-size: 13.5px;
    color: var(--text-main);
    line-height: 1.6;
    min-height: 24px;
    max-height: 140px;
}
#teamChatPage .tc-composer textarea::placeholder { color: var(--placeholder); }

#teamChatPage .tc-composer-extra {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--border-main);
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}
#teamChatPage .tc-composer-extra[hidden] { display: none; }
#teamChatPage .tc-xtra-field {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    background: var(--surface-solid);
    border: 1px solid var(--border-main);
    border-radius: 999px;
    font-size: 12px;
    color: var(--text-secondary);
    font-weight: 700;
}
#teamChatPage .tc-xtra-field input,
#teamChatPage .tc-xtra-field select {
    border: none;
    background: transparent;
    outline: none;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    color: var(--text-title);
    min-width: 60px;
}
#teamChatPage .tc-xtra-field svg { color: var(--text-muted); }

#teamChatPage .tc-composer-tools {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--border-main);
}
#teamChatPage .tc-tool-btn {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: none;
    background: transparent;
    color: var(--text-muted);
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    font-family: inherit;
}
#teamChatPage .tc-tool-btn:hover {
    background: var(--surface-hover);
    color: var(--primary);
}

#teamChatPage .tc-composer-side {
    margin-inline-start: auto;
    display: flex;
    align-items: center;
    gap: 8px;
}
#teamChatPage .tc-send-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 18px;
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: 999px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: var(--shadow-primary);
    transition: background 0.15s ease, transform 0.15s ease;
}
#teamChatPage .tc-send-btn:hover { background: var(--primary-hover); transform: translateY(-1px); }
#teamChatPage .tc-send-btn[data-mode='task'],
#teamChatPage .tc-send-btn[data-mode='note'] {
    background: var(--warning);
    box-shadow: rgb(145 158 171 / 18%) 0px 0px 2px 0px,
        color-mix(in srgb, var(--warning) 20%, transparent) 0px 12px 24px -4px;
}

/* ==========================================================================
   لوحة مهام وملاحظات القناة
   ========================================================================== */
#teamChatPage .tc-panel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--surface-solid);
    border-inline-start: 1px solid var(--border-main);
    min-height: 0;
}

#teamChatPage .tc-panel-head {
    padding: 14px 18px 0;
    flex: none;
}
#teamChatPage .tc-panel-head h3 {
    margin: 0;
    font-size: 13.5px;
    font-weight: 800;
    color: var(--text-title);
}
#teamChatPage .tc-panel-head .tc-head-group {
    justify-content: space-between;
    margin-bottom: 12px;
}
#teamChatPage .tc-panel-tabs {
    display: flex;
    gap: 4px;
    border-bottom: 1px solid var(--border-main);
}
#teamChatPage .tc-panel-tab {
    flex: 1;
    padding: 9px 6px;
    font-size: 12px;
    font-weight: 700;
    color: var(--text-muted);
    border: none;
    background: transparent;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    font-family: inherit;
    transition: color 0.15s ease, border-color 0.15s ease;
}
#teamChatPage .tc-panel-tab.active {
    color: var(--primary);
    border-bottom-color: var(--primary);
}
#teamChatPage .tc-panel-tab:hover { color: var(--text-title); }
/* عدّاد داخل التبويب: يفصل «٣ مهام» عن «٥ ملاحظات» بينما تجمعهما شارة الزرّ */
#teamChatPage .tc-panel-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
#teamChatPage .tc-tab-n {
    min-width: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-muted) 16%, transparent);
    color: var(--text-secondary);
    font-size: 10.5px;
    font-weight: 800;
    line-height: 16px;
    font-variant-numeric: tabular-nums;
}
#teamChatPage .tc-tab-n[hidden] { display: none; }
#teamChatPage .tc-panel-tab.active .tc-tab-n {
    background: color-mix(in srgb, var(--primary) 14%, transparent);
    color: var(--primary);
}

#teamChatPage .tc-panel-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    /* بلوغ طرف القائمة لا يمرّر السحب للصفحة خلفها (scroll chaining) — نفس
       نمط درج الشريط الجانبي. يحمي أيضاً من ارتداد iOS فوق القشرة الثابتة. */
    overscroll-behavior: contain;
    padding: 14px 14px 16px;
}
#teamChatPage .tc-panel-body[hidden] { display: none; }

#teamChatPage .tc-list-item {
    background: var(--surface-solid);
    border: 1px solid var(--border-main);
    border-radius: 12px;
    padding: 11px 12px;
    margin-bottom: 8px;
    position: relative;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
#teamChatPage .tc-list-item:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

#teamChatPage .tc-list-item.task::before {
    content: '';
    position: absolute;
    top: 10px;
    bottom: 10px;
    inset-inline-start: 4px;
    width: 3px;
    border-radius: 999px;
}
#teamChatPage .tc-list-item.task.high::before { background: var(--danger, #EC7D63); }
#teamChatPage .tc-list-item.task.mid::before { background: var(--warning); }
#teamChatPage .tc-list-item.task.low::before { background: var(--info); }
#teamChatPage .tc-list-item.task.done::before { background: var(--success); }
#teamChatPage .tc-list-item.task.done .tc-item-title {
    color: var(--text-muted);
    text-decoration: line-through;
}

#teamChatPage .tc-item-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--text-title);
    margin: 0 0 6px;
    line-height: 1.45;
}
#teamChatPage .tc-item-desc {
    font-size: 11.5px;
    color: var(--text-secondary);
    line-height: 1.5;
    margin: 0 0 8px;
}
#teamChatPage .tc-item-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    color: var(--text-muted);
    flex-wrap: wrap;
}
#teamChatPage .tc-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}
#teamChatPage .tc-meta-item.due.soon {
    color: var(--warning);
    font-weight: 700;
}
#teamChatPage .tc-meta-item.is-done {
    color: var(--success);
    font-weight: 700;
}

#teamChatPage .tc-item-check {
    position: absolute;
    top: 11px;
    inset-inline-end: 12px;
    width: 22px;
    height: 22px;
    border-radius: 7px;
    border: 1.5px solid var(--border-main);
    background: var(--surface-solid);
    cursor: pointer;
    display: grid;
    place-items: center;
    color: transparent;
    transition: border-color 0.15s ease, background 0.15s ease;
    font-family: inherit;
}
#teamChatPage .tc-item-check:hover { border-color: var(--success); }
#teamChatPage .tc-item-check.done {
    background: var(--success);
    border-color: var(--success);
    color: #fff;
}

#teamChatPage .tc-list-item.note {
    background: linear-gradient(135deg, var(--light-warning), color-mix(in srgb, var(--warning) 4%, transparent));
    border-color: color-mix(in srgb, var(--warning) 20%, transparent);
}
#teamChatPage .tc-list-item.note.pinned {
    background: linear-gradient(135deg, var(--light-warning), color-mix(in srgb, var(--warning) 8%, transparent));
    border-color: var(--warning);
}
#teamChatPage .tc-list-item.note .tc-item-title { padding-inline-end: 60px; font-size: 12.5px; }
#teamChatPage .tc-item-body {
    font-size: 12px;
    color: var(--text-secondary);
    line-height: 1.5;
    margin: 0 0 6px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
#teamChatPage .tc-note-pin-mini {
    position: absolute;
    top: 10px;
    inset-inline-end: 12px;
    color: var(--warning);
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

/* ==========================================================================
   حالة الفراغ + البحث + النوافذ المنبثقة (أعضاء/إيموجي)
   ========================================================================== */
#teamChatPage .tc-empty {
    margin: auto;
    text-align: center;
    color: var(--text-muted);
    padding: 28px 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}
#teamChatPage .tc-empty[hidden] { display: none; }
#teamChatPage .tc-empty-title {
    margin: 6px 0 0;
    font-size: 13px;
    font-weight: 800;
    color: var(--text-secondary);
}
#teamChatPage .tc-empty-sub { font-size: 11.5px; }
#teamChatPage .tc-panel-body .tc-empty { padding: 26px 12px; }

#teamChatPage .tc-conv-empty {
    padding: 18px 14px;
    font-size: 11.5px;
    color: var(--text-muted);
    text-align: center;
}

/* ---- البحث في المحادثة (شريط يتوسّع في الترويسة) ---- */
#teamChatPage .tc-head-search {
    flex: 1;
    min-width: 120px;
    max-width: 320px;
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--bg-main);
    border: 1px solid var(--border-main);
    border-radius: 999px;
    padding: 3px 4px 3px 12px;
}
#teamChatPage .tc-head-search[hidden] { display: none; }
#teamChatPage .tc-head-search input {
    flex: 1;
    min-width: 0;
    border: none;
    background: transparent;
    outline: none;
    font-family: inherit;
    font-size: 12.5px;
    color: var(--text-main);
}
#teamChatPage .tc-head-search input::placeholder { color: var(--placeholder); }
#teamChatPage .tc-head-search button {
    width: 26px;
    height: 26px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    display: grid;
    place-items: center;
    flex: none;
    font-family: inherit;
}
#teamChatPage .tc-head-search button:hover {
    background: var(--surface-hover);
    color: var(--danger, #EC7D63);
}

/* ---- النوافذ المنبثقة ---- */
#teamChatPage .tc-head-actions { position: relative; }
#teamChatPage .tc-pop {
    position: absolute;
    top: calc(100% + 10px);
    inset-inline-end: 0;
    width: 264px;
    background: var(--surface-solid);
    border: 1px solid var(--border-main);
    border-radius: 14px;
    box-shadow: var(--shadow-lg, var(--shadow-md));
    padding: 12px 14px;
    z-index: 70;
}
#teamChatPage .tc-pop[hidden] { display: none; }
#teamChatPage .tc-pop-title {
    font-size: 12px;
    font-weight: 800;
    color: var(--text-title);
    margin: 0 0 10px;
}
#teamChatPage .tc-member-row {
    display: flex;
    align-items: center;
    gap: 10px;
}
#teamChatPage .tc-member-meta strong {
    display: block;
    font-size: 12.5px;
    color: var(--text-title);
}
#teamChatPage .tc-member-meta span { font-size: 11px; color: var(--text-muted); }
#teamChatPage .tc-pop-note {
    margin: 10px 0 0;
    padding-top: 8px;
    border-top: 1px dashed var(--border-main);
    font-size: 11px;
    color: var(--text-muted);
    line-height: 1.6;
}

/* ---- منتقي الإيموجي (يفتح فوق شريط الكتابة) ---- */
#teamChatPage .tc-composer-tools { position: relative; }
#teamChatPage .tc-pop-emoji {
    top: auto;
    bottom: calc(100% + 10px);
    inset-inline-start: 0;
    inset-inline-end: auto;
    width: auto;
}
#teamChatPage .tc-emoji-grid {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 2px;
}
#teamChatPage .tc-emoji-grid button {
    border: none;
    background: transparent;
    font-size: 16px;
    line-height: 1.4;
    cursor: pointer;
    border-radius: 8px;
    padding: 3px 2px;
    font-family: inherit;
    transition: background 0.15s ease, transform 0.15s ease;
}
#teamChatPage .tc-emoji-grid button:hover {
    background: var(--surface-hover);
    transform: scale(1.18);
}

/* ---- قائمة الإشارة لزميل (@mention) فوق بطاقة الكتابة ---- */
#teamChatPage .tc-composer-card { position: relative; }
#teamChatPage .tc-mention-pop {
    position: absolute;
    bottom: calc(100% + 8px);
    inset-inline: 0;
    background: var(--surface-solid);
    border: 1px solid var(--border-main);
    border-radius: 14px;
    box-shadow: var(--shadow-lg, var(--shadow-md));
    padding: 8px;
    z-index: 80;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
#teamChatPage .tc-mention-pop[hidden] { display: none; }
#teamChatPage .tc-mention-pop .tc-pop-title { margin: 2px 8px 6px; }
#teamChatPage .tc-mention-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 10px;
    border: none;
    background: transparent;
    border-radius: 10px;
    cursor: pointer;
    font-family: inherit;
    text-align: start;
    transition: background 0.12s ease;
}
#teamChatPage .tc-mention-item:hover,
#teamChatPage .tc-mention-item.active {
    background: var(--light-primary);
}
#teamChatPage .tc-mention-meta { display: flex; flex-direction: column; min-width: 0; }
#teamChatPage .tc-mention-meta strong {
    font-size: 12.5px;
    color: var(--text-title);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#teamChatPage .tc-mention-meta span { font-size: 11px; color: var(--text-muted); }

/* ---- الحذف (محادثة/رسالة/مهمة/ملاحظة) ----
   أزرار الحذف مخفية حتى التحويم لكن مساحتها محجوزة دائماً في التدفق كي
   لا يقفز التخطيط عند ظهورها؛ في اللوحة مطلقة بجانب زر الإنجاز. على
   أجهزة اللمس (لا hover) تظهر بشفافية مخفّضة دائماً. */
#teamChatPage .tc-msg-del,
#teamChatPage .tc-chat-del,
#teamChatPage .tc-task-del {
    width: 22px;
    height: 22px;
    flex: none;
    padding: 0;
    border-radius: 6px;
    border: 1px solid transparent;
    background: transparent;
    color: var(--text-muted);
    display: inline-grid;
    place-items: center;
    cursor: pointer;
    font-family: inherit;
    opacity: 0;
    transition: opacity 0.12s ease, color 0.12s ease, background 0.12s ease, border-color 0.12s ease;
}
#teamChatPage .tc-msg-del { margin-inline-start: auto; align-self: center; }
#teamChatPage .tc-msg:hover .tc-msg-del,
#teamChatPage .tc-msg-del:focus-visible,
#teamChatPage .tc-chat-item:hover .tc-chat-del,
#teamChatPage .tc-chat-del:focus-visible,
#teamChatPage .tc-task-card:hover .tc-task-del,
#teamChatPage .tc-task-del:focus-visible {
    opacity: 1;
}
#teamChatPage .tc-msg-del:hover,
#teamChatPage .tc-chat-del:hover,
#teamChatPage .tc-task-del:hover,
#teamChatPage .tc-item-del:hover {
    color: var(--danger, #EC7D63);
    background: color-mix(in srgb, var(--danger, #EC7D63) 10%, transparent);
}
#teamChatPage .tc-chat-del,
#teamChatPage .tc-task-del {
    border-color: var(--border-main);
    background: var(--surface-solid);
}
#teamChatPage .tc-chat-del:hover,
#teamChatPage .tc-task-del:hover { border-color: var(--danger, #EC7D63); }

#teamChatPage .tc-item-del {
    position: absolute;
    top: 11px;
    inset-inline-end: 38px; /* بجانب زر الإنجاز (end:12 + عرض 22) */
    width: 22px;
    height: 22px;
    padding: 0;
    border-radius: 6px;
    border: 1px solid var(--border-main);
    background: var(--surface-solid);
    color: var(--text-muted);
    display: grid;
    place-items: center;
    cursor: pointer;
    font-family: inherit;
    opacity: 0;
    transition: opacity 0.12s ease, color 0.12s ease, background 0.12s ease, border-color 0.12s ease;
}
/* الملاحظات بلا زر إنجاز — زر الحذف في موضع الإنجاز نفسه */
#teamChatPage .tc-list-item.note .tc-item-del { inset-inline-end: 12px; }
#teamChatPage .tc-list-item:hover .tc-item-del,
#teamChatPage .tc-item-del:focus-visible { opacity: 1; }
#teamChatPage .tc-item-del:hover { border-color: var(--danger, #EC7D63); }
#teamChatPage .tc-list-item .tc-item-title { padding-inline-end: 36px; }

@media (pointer: coarse) {
    #teamChatPage .tc-msg-del,
    #teamChatPage .tc-chat-del,
    #teamChatPage .tc-task-del,
    #teamChatPage .tc-item-del {
        opacity: 0.6;
    }
}

/* ==========================================================================
   الاستجابة — العمودان الجانبيان ينطويان، ولا يختفيان
   --------------------------------------------------------------------------
   كانا `display: none` تحت العتبات: لوحة القناة (مهام + ملاحظات) تحت 1100px
   وقائمة المحادثات تحت 768px — بلا زرّ ولا أثر، فيفقد مستخدم الجوال المحتوى
   ولا يستطيع حتى تبديل المحادثة. صارا الآن طبقتَين تُستدعيان من زرّ:
     · 769–1100px — لوحة القناة درج ينزلق من حافة نهاية السطر (موضعها نفسه
       على سطح المكتب، فلا ينتقل المحتوى مكاناً في ذهن المستخدم).
     · ≤768px — العمودان ورقتان ترتفعان من الأسفل، أقرب لمدى الإبهام.
   كلاهما `position: absolute` داخل `.tc-shell` (لا `fixed`): القشرة ذات ارتفاع
   ثابت و`overflow: hidden` فتقصّ الانزلاق وحدها، ولا حاجة لقفل سكرول الصفحة
   ولا لاقتحام سُلّم z المستند — 90/95 تكديس محلّي كما تنصّ DESIGN.md.
   ========================================================================== */

#teamChatPage .tc-scrim {
    display: none;
    position: absolute;
    inset: 0;
    z-index: 90;
    background: color-mix(in srgb, var(--primary-deep, #1e2a45) 34%, transparent);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.24s ease, visibility 0.24s ease;
    /* السحب على الغشاء لا يحرّك الرسائل تحته (لمس iOS) */
    touch-action: none;
}
#teamChatPage .tc-scrim.is-on {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

@media (max-width: 1100px) {
    #teamChatPage .tc-shell {
        grid-template-columns: 240px minmax(0, 1fr);
        height: calc(100vh - 160px);
    }
    #teamChatPage .tc-scrim { display: block; }
    #teamChatPage .tc-panel-toggle { display: grid; }

    #teamChatPage .tc-panel {
        position: absolute;
        z-index: 95;
        top: 0;
        bottom: 0;
        inset-inline-end: 0;
        width: min(340px, 86%);
        box-shadow: var(--shadow-lg, var(--shadow-md));
        /* الافتراض RTL: العمود على الحافة اليسرى فالإخفاء إزاحة سالبة.
           نظيره لـ LTR في i18n.css (نفس نمط درج الشريط الجانبي). */
        transform: translateX(-100%);
        visibility: hidden;
        pointer-events: none;
        transition: transform 0.26s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.26s;
    }
    #teamChatPage .tc-panel.is-open {
        transform: translateX(0);
        visibility: visible;
        pointer-events: auto;
    }
    #teamChatPage .tc-panel .tc-sheet-close { display: grid; }
}

@media (max-width: 768px) {
    #teamChatPage .tc-shell {
        grid-template-columns: minmax(0, 1fr);
        height: calc(100vh - 140px);
        min-height: 420px;
    }
    #teamChatPage .tc-only-mobile { display: grid; }

    /* ورقتان سفليتان بالهندسة نفسها — لغة حركة واحدة على الجوال */
    #teamChatPage .tc-conv,
    #teamChatPage .tc-panel {
        position: absolute;
        z-index: 95;
        inset-inline: 0;
        top: auto;
        bottom: 0;
        width: auto;
        height: min(78%, 540px);
        border: 1px solid var(--border-main);
        border-bottom: none;
        /* --radius-xl هو نصف قطر الألواح الكبيرة، ولا يتقلّص على الجوال (DESIGN.md) */
        border-radius: var(--radius-xl, 16px) var(--radius-xl, 16px) 0 0;
        box-shadow: var(--shadow-lg, var(--shadow-md));
        transform: translateY(100%);
        visibility: hidden;
        pointer-events: none;
        transition: transform 0.26s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.26s;
    }
    #teamChatPage .tc-conv.is-open,
    #teamChatPage .tc-panel.is-open {
        transform: translateY(0);
        visibility: visible;
        pointer-events: auto;
    }
    #teamChatPage .tc-conv .tc-sheet-close,
    #teamChatPage .tc-panel .tc-sheet-close { display: grid; }
    /* الورقة تُغلق بزرّها أو بالغشاء — زرّ «محادثة جديدة» يكفيه العمود */
    #teamChatPage .tc-conv-head { padding: 14px 16px 12px; }
    #teamChatPage .tc-panel-head { padding: 14px 16px 0; }

    #teamChatPage .tc-head { padding: 12px; flex-wrap: wrap; }
    #teamChatPage .tc-head-search { max-width: none; order: 5; flex-basis: 100%; }
    #teamChatPage .tc-body { padding: 10px 12px 12px; }
    #teamChatPage .tc-composer { padding: 10px 12px; }
    #teamChatPage .tc-bubble { max-width: 88%; }
}

/* تقليل الحركة: الحركات الزخرفية فقط — لا خصائص تخطيط هنا (يحرسها
   tests/touch-targets.test.js). */
@media (prefers-reduced-motion: reduce) {
    #teamChatPage .tc-pulse,
    #teamChatPage .tc-typing-dots span {
        animation: none;
    }
    #teamChatPage .tc-task-card,
    #teamChatPage .tc-list-item,
    #teamChatPage .tc-send-btn,
    #teamChatPage .tc-emoji-grid button,
    #teamChatPage .tc-scrim,
    #teamChatPage .tc-conv,
    #teamChatPage .tc-panel {
        transition: none;
    }
    #teamChatPage .tc-head-badge.bump { animation: none; }
}