/* ============================================================
   SCHEDMATE — TIMELINE CSS
   Safe styles that match your existing dashboard theme
============================================================ */

.timeline-module { padding: 6px; }

.tl-controls{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.tl-seg{
  display:flex;
  gap:6px;
  padding:6px;
  border:1px solid var(--sm-border, rgba(0,0,0,.06));
  border-radius:999px;
  background:var(--sm-surface-2, rgba(255,255,255,.6));
  box-shadow: 0 10px 30px rgba(0,0,0,.04);
}

.tl-seg-btn{
  border:0;
  background:transparent;
  padding:8px 12px;
  border-radius:999px;
  font-weight:700;
  cursor:pointer;
  color:var(--sm-text, #2a3b4d);
}

.tl-seg-btn.is-active{
  background:rgba(45, 125, 255, .12);
  box-shadow: inset 0 0 0 1px rgba(45,125,255,.2);
}

.tl-search{
  min-width:220px;
  flex:1;
  max-width:360px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--sm-border, rgba(0,0,0,.06));
  background:var(--sm-surface-2, rgba(255,255,255,.75));
  outline:none;
}

.tl-card { margin-top: 14px; overflow:hidden; }

.tl-table{ width:100%; }

.tl-row{
  display:grid;
  grid-template-columns: 140px 120px 160px 1fr;
  gap:10px;
  padding:12px 14px;
  align-items:center;
  border-top:1px solid var(--sm-border, rgba(0,0,0,.06));
}

.tl-head{
  border-top:0;
  background:var(--sm-surface-3, rgba(0,0,0,.02));
  font-size:12px;
  letter-spacing:.02em;
  font-weight:800;
  color:var(--sm-muted, #516070);
}

.tl-empty{
  grid-template-columns: 1fr;
  color:var(--sm-muted, #6b7a8a);
}

.tl-when{ color:var(--sm-muted, #516070); font-weight:700; }
.tl-action{ color:var(--sm-text, #273444); font-weight:700; }
.tl-msg{ color:var(--sm-text, #334155); }
.tl-type{ }

.tl-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  border:1px solid var(--sm-border, rgba(0,0,0,.06));
  background:var(--sm-surface-2, rgba(255,255,255,.65));
}

.tl-client{ background: rgba(16,185,129,.14); border-color: rgba(16,185,129,.3); color:#0f766e; }
html.dark .tl-client, html[data-theme="dark"] .tl-client { color:#5eead4; }
.tl-booking{ background: rgba(59,130,246,.14); border-color: rgba(59,130,246,.3); color:#1d4ed8; }
html.dark .tl-booking, html[data-theme="dark"] .tl-booking { color:#93c5fd; }
.tl-service{ background: rgba(168,85,247,.14); border-color: rgba(168,85,247,.3); color:#6d28d9; }
html.dark .tl-service, html[data-theme="dark"] .tl-service { color:#d8b4fe; }

@media (max-width: 920px){
  .tl-row{ grid-template-columns: 120px 100px 140px 1fr; }
}
@media (max-width: 720px){
  .tl-row{ grid-template-columns: 1fr; }
  .tl-head{ display:none; }
  .tl-row > div{ padding:2px 0; }
  .tl-when{ opacity:.8; }
}