/* ── Base ── */
*, *::before, *::after { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; margin: 0; }

/* ── Clamp helpers ── */
.clamp1 { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.clamp2 { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

/* ── Hide scrollbars ── */
.no-scroll::-webkit-scrollbar { display: none; }
.no-scroll { -ms-overflow-style: none; scrollbar-width: none; }

/* ── Date picker opacity ── */
input[type=date]::-webkit-calendar-picker-indicator { opacity: 0.5; }

/* ── Spinner ── */
.tf-spinner {
  width: 28px; height: 28px;
  border: 3px solid #e2e8f0;
  border-top-color: #2563eb;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Avatar colour classes ── */
.av-purple  { background: #f3e8ff; color: #7e22ce; }
.av-blue    { background: #dbeafe; color: #1d4ed8; }
.av-teal    { background: #ccfbf1; color: #0f766e; }
.av-rose    { background: #ffe4e6; color: #be123c; }
.av-amber   { background: #fef3c7; color: #b45309; }
.av-indigo  { background: #e0e7ff; color: #4338ca; }

/* ── Main tab active ── */
.main-tab.active { color: #2563eb; border-bottom-color: #2563eb; }

/* ── Sub tab active ── */
.sub-tab.active { background: #eff6ff; color: #2563eb; }

/* ── Section accordion ── */
.tf-section .section-toggle.open { border-radius: 1rem 1rem 0 0; }
.tf-section .section-arrow.open  { transform: rotate(180deg); }

/* ── Badge colours ── */
.badge-active        { background:#dbeafe; color:#1d4ed8; }
.badge-done          { background:#dcfce7; color:#15803d; }
.badge-overdue       { background:#ffedd5; color:#c2410c; }
.badge-stopped       { background:#f1f5f9; color:#64748b; }
.badge-removed       { background:#f1f5f9; color:#94a3b8; }
.badge-not_done      { background:#fee2e2; color:#dc2626; }
.badge-not_attempted { background:#f1f5f9; color:#64748b; }

/* ── Type pill ── */
.pill-recurring { background:#e0e7ff; color:#4338ca; }
.pill-adhoc     { background:#f1f5f9; color:#64748b; }

/* ── Progress bar ── */
.progress-bar { height:6px; border-radius:9999px; background:#e2e8f0; overflow:hidden; }
.progress-fill { height:100%; border-radius:9999px; background:#2563eb; transition:width .3s; }

/* ── Drawer animation ── */
.tf-drawer { animation: slideUp 0.22s ease-out; }
@keyframes slideUp { from { transform: translateY(60px); opacity:0; } to { transform: translateY(0); opacity:1; } }

/* ── Overlay z levels ── */
.z-50 { z-index: 50; }
.z-60 { z-index: 60; }

/* ── Pct colours ── */
.pct-green  { color:#16a34a; }
.pct-amber  { color:#d97706; }
.pct-red    { color:#dc2626; }


.badge-secondary{
  background:#c3c3c34f;
  color: #000 !important;
}