.deal-name-row {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  min-width: 0;
  max-width: 100%;
}

.deal-name-row .deal-name-link,
.deal-name-row .deal-inline-title {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--sales-strong);
  text-decoration: none;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.deal-name-row .deal-inline-title {
  color: var(--ink);
  font-weight: 800;
}

.deal-name-row .deal-card-title-link {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  text-decoration: none;
}

.deal-name-row .deal-name-link:hover,
.deal-name-row .deal-inline-title:hover,
.deal-name-row .deal-card-title-link:hover {
  text-decoration: underline;
}

.deal-status-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  font-size: 0.72rem;
  line-height: 1;
  border-radius: 999px;
  flex: 0 0 auto;
  border: 1px solid transparent;
}

.deal-status-icon--open {
  color: var(--sales-strong, #177d3f);
  background: color-mix(in srgb, var(--sales-bg) 55%, var(--panel));
  border-color: color-mix(in srgb, var(--sales-line) 65%, var(--line));
}

.deal-status-icon--won {
  color: var(--ok-ink, #0f5f27);
  background: color-mix(in srgb, var(--ok-bg) 70%, var(--panel));
  border-color: color-mix(in srgb, var(--ok-ink) 25%, var(--line));
}

.deal-status-icon--lost {
  color: var(--err-ink, #8b1e17);
  background: color-mix(in srgb, var(--err-bg) 75%, var(--panel));
  border-color: color-mix(in srgb, var(--err-ink) 28%, var(--line));
}

.deal-status-icon--archived,
.deal-status-icon--neutral {
  color: var(--muted);
  background: color-mix(in srgb, var(--line) 35%, var(--panel));
  border-color: color-mix(in srgb, var(--line) 80%, transparent);
}

.entry-card-title.deal-entry-title {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  max-width: 100%;
}

.entry-card-title.deal-entry-title .deal-entry-title-text {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.deal-recovery-title .deal-name-row,
.expansion-card-title.deal-name-row {
  display: inline-flex;
}
