.workspace-cache-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  margin: 0.2rem 0 1rem;
  padding: 0.72rem 0.82rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent) 8%, var(--bg-input));
}

.workspace-cache-copy {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
  flex-wrap: wrap;
  font-size: var(--ui-small-text, .875rem);
  color: var(--text-muted);
}

.workspace-cache-copy strong {
  color: var(--text-main);
  white-space: nowrap;
}

.workspace-cache-status[data-state="saved"],
.workspace-cache-status[data-state="restored"] {
  color: var(--accent);
}

.workspace-cache-status[data-state="error"] {
  color: var(--danger, #ff6b6b);
}

.workspace-cache-clear {
  flex: 0 0 auto;
}

@media (max-width: 620px) {
  .workspace-cache-bar {
    align-items: stretch;
    flex-direction: column;
  }

  .workspace-cache-clear {
    align-self: flex-start;
  }
}