/* صفحة مهام المشروع بتصميم مضغوط (scripts/patch-task-page-compact.mjs). */

/* التبويبات: رقائق متجاورة بعرض محتواها، ولكل تبويب لونه وأيقونته (الألوان من BINA_taskTabStyle). */
#root [data-feature="elegant-project-tabs-v1"] { padding: 8px !important; }
#root [data-feature="elegant-project-tabs-v1"] > div { display: flex !important; flex-wrap: wrap; gap: 6px !important; }
#root [data-feature="elegant-project-tabs-v1"] button {
  flex: 1 1 auto;
  min-height: 38px !important;
  padding: 5px 10px 5px 12px !important;
  gap: 8px !important;
  font-size: 13px !important;
  white-space: nowrap;
}
#root [data-feature="elegant-project-tabs-v1"] button svg,
#root [data-feature="elegant-project-tabs-v1"] button img {
  box-sizing: content-box;
  width: 16px !important;
  height: 16px !important;
  padding: 5px;
  border-radius: 9px;
  color: var(--tab-color, #475569) !important;
  background: var(--tab-tint, #f1f5f9);
  transition: transform .2s ease;
}
#root [data-feature="elegant-project-tabs-v1"] button:hover svg { transform: rotate(-8deg) scale(1.1); }
#root [data-feature="elegant-project-tabs-v1"] button[style*="gradient"] svg {
  color: #fff !important;
  background: rgba(255, 255, 255, .22);
}
#root [data-feature="elegant-project-tabs-v1"] button:not([style*="gradient"]):hover {
  background: var(--tab-tint, #f8fafc) !important;
  border-color: var(--tab-color, #94a3b8) !important;
}

/* نشر الخطة والعرض التقديمي في سطر واحد بحجم صغير. */
#root [data-task-actions] { margin-inline-start: auto; }
#root [data-task-actions] > button,
#root [data-task-actions] .tp-trigger {
  min-height: 34px;
  padding: 6px 12px !important;
  border-radius: 10px !important;
  font-size: 12.5px !important;
}
#root [data-task-actions] svg { width: 15px; height: 15px; }

/* أرقام المهام: شريط واحد من رقائق صغيرة (الرقم ثم الوصف ثم النسبة). */
#root [data-task-stats] { gap: 6px !important; }
#root [data-task-stats] > div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 10px !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
#root [data-task-stats] > div > p { margin: 0 !important; white-space: nowrap; }
#root [data-task-stats] > div > p:first-child { font-size: 17px !important; line-height: 1.2; }
#root [data-task-stats] > div > p:nth-child(3) { font-size: 10px !important; opacity: .85; }
#root [data-task-stats] > div > p:nth-child(3)::before { content: "("; }
#root [data-task-stats] > div > p:nth-child(3)::after { content: ")"; }

/* شريط العرض والفرز والتحديد. */
#root [data-task-toolbar] { gap: 6px !important; }
#root [data-task-toolbar] button { padding-block: 5px !important; font-size: 12.5px !important; }
#root [data-task-toolbar] > div:first-child button { padding-inline: 10px !important; }
#root [data-task-toolbar] > button,
#root [data-task-toolbar] > div:not(:first-child) { min-height: 34px; padding-block: 3px !important; }
#root [data-task-toolbar] svg { width: 15px; height: 15px; }

/* البحث والفلاتر. */
#root [data-task-filters] { padding: 10px 12px !important; }
#root [data-task-filters] > * + * { margin-top: 8px !important; }
#root [data-task-filters] select,
#root [data-task-filters] input,
#root [data-task-filters] details { padding-block: 6px !important; font-size: 13px; }
#root [data-task-filters] .gap-3 { gap: 8px !important; }

#root [data-task-legend] { margin-bottom: 0 !important; }
#root [data-task-stats] ~ .min-h-\[36px\] { min-height: 0 !important; }

/* المهام اليومية والمؤقتة: ترويسة أقصر ومسافات أقل. */
#root [data-task-section] { margin: 10px 0 14px !important; border-width: 1px !important; border-radius: 14px !important; }
#root [data-task-section] > div:first-child { padding: 10px 16px !important; }
#root [data-task-section] > div:first-child span.h-10 { width: 32px; height: 32px; border-radius: 10px; }
#root [data-task-section] > div:first-child span.h-10 svg { width: 16px; height: 16px; }
#root [data-task-section] h3 { font-size: 15px !important; }
#root [data-task-section] h3 + p { font-size: 11px; }
#root [data-task-section="daily"] > .grid { padding: 10px !important; gap: 8px !important; }
#root [data-task-section="daily"] article { padding: 10px 12px !important; }
#root [data-task-section="daily-empty"] {
  display: flex !important;
  margin: 6px 0 10px !important;
  padding: 8px 12px !important;
  border: 1px solid #ddd6fe !important;
  background: #f5f3ff !important;
  box-shadow: none !important;
}

/* مراحل المشروع. */
#root [data-task-stages] [role="button"]:focus-visible { outline: 2px solid #8b5cf6; outline-offset: 2px; }

@media (max-width: 640px) {
  #root [data-feature="elegant-project-tabs-v1"] button { font-size: 12px !important; padding-inline: 8px !important; }
  #root [data-task-actions] { margin-inline-start: 0; }
}