.customer-timeline-card {
  margin-top: 22px;
}

.customer-timeline {
  position: relative;
  display: grid;
  gap: 0;
  margin-top: 18px;
}

.customer-timeline::before {
  position: absolute;
  top: 22px;
  bottom: 22px;
  left: 21px;
  width: 2px;
  background: #e3eaf3;
  content: "";
}

.customer-timeline-event {
  position: relative;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 16px;
  padding: 13px 0;
}

.customer-timeline-icon {
  z-index: 1;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 5px solid #fff;
  border-radius: 50%;
  background: #e8f0ff;
  color: #235ed7;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.customer-timeline-event.kind-sale .customer-timeline-icon {
  background: #ddf7ef;
  color: #087a62;
}

.customer-timeline-event.kind-email .customer-timeline-icon {
  background: #f0eafe;
  color: #6845bd;
}

.customer-timeline-event.kind-appointment .customer-timeline-icon {
  background: #fff0d2;
  color: #9a6200;
}

.customer-timeline-event.kind-status .customer-timeline-icon,
.customer-timeline-event.kind-evidence .customer-timeline-icon {
  background: #ffe9ea;
  color: #b83b46;
}

.customer-timeline-copy {
  min-width: 0;
  padding: 13px 16px;
  border: 1px solid #e4eaf1;
  border-radius: 13px;
  background: #fbfcfe;
}

.customer-timeline-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.customer-timeline-heading > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.customer-timeline-heading a,
.customer-timeline-heading strong {
  color: #122039;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}

.customer-timeline-heading a:hover {
  color: #1f61e8;
  text-decoration: underline;
}

.customer-timeline-heading span,
.customer-timeline-heading time,
.customer-timeline-copy p {
  color: #718097;
  font-size: 12px;
}

.customer-timeline-heading time {
  flex: 0 0 auto;
  white-space: nowrap;
}

.customer-timeline-copy p {
  margin: 9px 0 0;
  line-height: 1.55;
}

.customer-timeline-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 10px;
}

.customer-timeline-meta strong {
  color: #0c745e;
  font-size: 12px;
}

.customer-timeline-meta a {
  margin-left: auto;
  color: #1f61e8;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.customer-timeline-meta a:hover {
  text-decoration: underline;
}

.timeline-status {
  background: #edf2f8;
  color: #526176;
}

.converted-sales-summary {
  display: grid;
  justify-items: end;
  gap: 2px;
  color: #6d7a90;
  font-size: 12px;
}

.converted-sales-summary strong {
  color: #087a62;
  font-size: 15px;
}

.objective-detail-header .director-top-actions form {
  margin: 0;
}

.objective-sales-credit-summary {
  display: grid;
  justify-items: end;
  gap: 2px;
}

.objective-sales-credit-summary strong {
  color: #0b745f;
  font-size: 15px;
}

.objective-sales-credit-summary small {
  color: #718097;
  font-size: 12px;
}

.objective-sales-credit-list {
  display: grid;
  margin-top: 14px;
  border: 1px solid #e4eaf1;
  border-radius: 13px;
  overflow: hidden;
}

.objective-sales-credit-list > article {
  display: grid;
  grid-template-columns: 90px minmax(220px, 1fr) 92px 70px 110px;
  gap: 14px;
  align-items: center;
  padding: 13px 15px;
  border-bottom: 1px solid #e8edf3;
  background: #fff;
}

.objective-sales-credit-list > article:last-child {
  border-bottom: 0;
}

.objective-sales-credit-list time,
.objective-sales-credit-list small,
.objective-sales-credit-list span {
  color: #718097;
  font-size: 11px;
}

.objective-sales-credit-list div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.objective-sales-credit-list div strong {
  color: #15223a;
  font-size: 13px;
}

.objective-sales-credit-list div small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.objective-sales-credit-list > article > b {
  color: #15223a;
  text-align: right;
}

.objective-sales-credit-list > article > strong {
  color: #0b745f;
  text-align: right;
}

@media (max-width: 700px) {
  .customer-timeline-heading {
    display: grid;
    gap: 7px;
  }

  .customer-timeline-heading time {
    white-space: normal;
  }

  .customer-timeline-meta {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .customer-timeline-meta a {
    width: 100%;
    margin-left: 0;
  }

  .converted-sales-summary {
    justify-items: start;
  }

  .objective-sales-credit-summary {
    justify-items: start;
  }

  .objective-sales-credit-list > article {
    grid-template-columns: 78px minmax(0, 1fr) 60px;
  }

  .objective-sales-credit-list > article > span {
    display: none;
  }

  .objective-sales-credit-list > article > strong {
    grid-column: 2 / -1;
  }
}