/* Read-only timeline and compact launchers; existing editable controls stay in their rows. */
.ui-pilot .client-history-control {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
}
.ui-pilot .client-history-control > :is(input, select) { flex: 1 1 0; width: 0; min-width: 0; }
.ui-pilot .client-history-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  min-height: 30px;
  padding: 0;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  background: transparent;
  color: var(--text-secondary);
  box-shadow: none;
  cursor: pointer;
}
.ui-pilot .client-history-button .ui-icon { width: 17px; height: 17px; }
.ui-pilot .client-history-button:hover { color: var(--primary); background: var(--primary-soft); }
.ui-pilot .client-history-button:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
.ui-pilot .client-history-button:disabled { opacity: .45; cursor: default; }
.ui-pilot .client-history-card {
  width: min(620px, 100%);
  max-height: calc(100dvh - var(--space-8));
  display: flex;
  flex-direction: column;
  padding: var(--space-6);
  background: var(--surface-elevated);
  color: var(--text-primary);
  border-color: var(--border-strong);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}
.client-history-heading { flex: 0 0 auto; gap: var(--space-3); margin-bottom: var(--space-2); }
.client-history-heading h3 { margin: 0; font: 500 var(--font-lg)/1.4 var(--font-heading); overflow-wrap: anywhere; }
#clientHistoryDescription { margin: 0 0 var(--space-5); color: var(--text-muted); font-size: var(--font-xs); }
#clientHistoryContent { overflow-y: auto; min-height: 0; overscroll-behavior: contain; }
.client-history-timeline { list-style: none; margin: 0; padding: var(--space-1) var(--space-3) var(--space-1) var(--space-6); }
.client-history-event { position: relative; padding: 0 0 var(--space-6) var(--space-5); border-left: 1px solid var(--border-strong); }
.client-history-event:last-child { padding-bottom: var(--space-1); border-color: transparent; }
.client-history-event::before { content: ""; position: absolute; left: -5px; top: 5px; width: 9px; height: 9px; border-radius: 50%; background: var(--text-muted); }
.client-history-event:first-child::before { background: var(--primary); }
.client-history-event time { display: block; margin-bottom: var(--space-3); color: var(--text-primary); font-size: var(--font-sm); font-weight: 500; font-variant-numeric: tabular-nums; }
.client-history-label { display: block; color: var(--text-muted); font-size: var(--font-xs); margin-bottom: var(--space-1); }
.client-history-event p { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; font-size: var(--font-sm); line-height: 1.6; }
.client-history-scents { margin-bottom: var(--space-2); }
.client-history-note p, .client-history-empty { color: var(--text-secondary); }
.client-history-empty { font-size: var(--font-sm); padding: var(--space-5) 0; }
@media (max-width: 640px) {
  .ui-pilot .client-history-button { width: 40px; height: 40px; min-height: 40px; flex-basis: 40px; }
  .ui-pilot .client-history-card { padding: var(--space-4); }
  .client-history-timeline { padding-left: var(--space-3); }
  .client-history-modal #clientHistoryContent { overflow: visible; }
}
@media print { #clientHistoryModal { display: none !important; } }