.vera-ci-bridge-mockup {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 2.4242cqi;
  background: #fff;
  color: var(--color-text);
  container-type: inline-size;
}

.vera-ci-bridge-conversation-header {
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
  height: 16.3636cqi;
}

.vera-ci-bridge-avatar {
  position: absolute;
  inset-block-start: 3.6364cqi;
  inset-inline-start: 3.3333cqi;
  width: 8.4848cqi;
  height: 8.4848cqi;
  border-radius: 1.0606cqi;
  object-fit: cover;
}

.vera-ci-bridge-conversation-copy {
  position: absolute;
  inset-block-start: 3.7879cqi;
  inset-inline-start: 14.5455cqi;
  line-height: 1.3;
}

.vera-ci-bridge-conversation-title,
.vera-ci-bridge-conversation-status,
.vera-ci-bridge-card-header p,
.vera-ci-bridge-transcript-entries,
.vera-ci-bridge-transcript-entries p,
.vera-ci-bridge-actions,
.vera-ci-bridge-actions p {
  margin: 0;
}

.vera-ci-bridge-conversation-title {
  font-size: clamp(0.5625rem, 2.897cqi, 1.195rem);
  font-weight: 500;
  white-space: nowrap;
}

.vera-ci-bridge-conversation-status {
  margin-block-start: 1.0606cqi;
  color: #5d616f;
  font-size: clamp(0.5rem, 2.1429cqi, 0.8839rem);
  font-weight: 400;
  white-space: nowrap;
}

.vera-ci-bridge-ask-vera {
  position: absolute;
  box-sizing: border-box;
  inset-block-start: 5.9091cqi;
  inset-inline-end: 3.1818cqi;
  display: grid;
  min-width: 13.0303cqi;
  height: 5.4545cqi;
  place-items: center;
  padding-inline: 1.7545cqi;
  border-radius: 1.1688cqi;
  background: var(--color-cta);
  color: #fff;
  font-size: clamp(0.5rem, 2.1429cqi, 0.8839rem);
  font-weight: 500;
  line-height: 1.3;
  white-space: nowrap;
}

.vera-ci-bridge-transcript-card,
.vera-ci-bridge-assistant-card {
  position: absolute;
  inset-inline-start: 3.3333cqi;
  width: 93.0303cqi;
  overflow: hidden;
  border: max(1px, 0.2165cqi) solid var(--color-border-warm);
  border-radius: 1.2986cqi;
  background: #fbf9f4;
}

.vera-ci-bridge-transcript-card {
  inset-block-start: 16.3636cqi;
  height: 31.0606cqi;
}

.vera-ci-bridge-assistant-card {
  inset-block-start: 50.4545cqi;
  height: 33.6364cqi;
}

.vera-ci-bridge-card-header {
  display: flex;
  height: 7.8788cqi;
  align-items: center;
  gap: 1.5152cqi;
  padding-inline: 2.4242cqi;
  border-block-end: max(1px, 0.1515cqi) solid var(--color-border-warm);
}

.vera-ci-bridge-card-header p {
  font-size: clamp(0.5rem, 2.4174cqi, 0.9972rem);
  font-weight: 400;
  line-height: 1.3;
  white-space: nowrap;
}

.vera-ci-bridge-transcript-icon {
  width: 2.6552cqi;
  height: 2.6552cqi;
  flex: none;
}

.vera-ci-bridge-transcript-entries {
  position: absolute;
  inset-block-start: 10.6061cqi;
  inset-inline: 2.4242cqi 4.0909cqi;
  display: grid;
  grid-template-rows: repeat(2, 10cqi);
  padding: 0;
  list-style: none;
}

.vera-ci-bridge-transcript-entries li {
  display: grid;
  min-width: 0;
  grid-template-columns: 11.3636cqi 22.4242cqi minmax(0, 1fr);
  color: var(--color-text);
  font-size: clamp(0.5rem, 2.2727cqi, 0.9375rem);
  line-height: 1.3;
}

.vera-ci-bridge-transcript-entries time {
  color: rgb(6 28 90 / 50%);
  font-weight: 400;
  white-space: nowrap;
}

.vera-ci-bridge-transcript-entries strong {
  font-weight: 400;
  white-space: nowrap;
}

.vera-ci-bridge-transcript-entries p {
  min-width: 0;
  margin-block-start: -0.303cqi;
  font-weight: 300;
  line-height: 1.6;
}

.vera-ci-bridge-assistant-header {
  gap: 1.2121cqi;
}

.vera-ci-bridge-vera-mark {
  display: grid;
  width: 2.812cqi;
  height: 2.812cqi;
  flex: none;
  place-items: center;
  border-radius: 0.4545cqi;
  background: #f8580e;
}

.vera-ci-bridge-vera-mark img {
  width: 1.9176cqi;
  height: 1.6758cqi;
}

.vera-ci-bridge-actions {
  display: grid;
  height: calc(100% - 7.8788cqi);
  grid-template-rows: 8.4848cqi 8.6364cqi 8.6364cqi;
  padding: 0;
  list-style: none;
}

.vera-ci-bridge-actions li {
  display: grid;
  min-width: 0;
  grid-template-columns: 3.3333cqi minmax(0, 1fr) auto;
  align-items: center;
  gap: 2.1212cqi;
  padding-inline: 2.5758cqi 2.2727cqi;
  border-block-end: max(1px, 0.1515cqi) solid var(--color-border-warm);
}

.vera-ci-bridge-actions li:last-child {
  border-block-end: 0;
}

.vera-ci-bridge-action-status {
  width: 3.3333cqi;
  height: 3.3333cqi;
}

.vera-ci-bridge-actions p {
  min-width: 0;
  overflow: hidden;
  font-size: clamp(0.5rem, 2.2591cqi, 0.9319rem);
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.vera-ci-bridge-system-badge {
  display: grid;
  width: 5.7576cqi;
  height: 5.7576cqi;
  place-items: center;
  border: max(1px, 0.1588cqi) solid var(--color-border-warm);
  border-radius: 0.9524cqi;
  background: #fff;
}

.vera-ci-bridge-system-badge img {
  width: 3.4023cqi;
  height: 3.4023cqi;
  object-fit: contain;
}

.vera-ci-bridge-approval-badge {
  display: grid;
  min-width: 18.1818cqi;
  height: 4.2424cqi;
  place-items: center;
  padding-inline: 1.5152cqi;
  border-radius: 0.7576cqi;
  background: rgb(249 121 60 / 20%);
  color: #d85700;
  font-size: clamp(0.46875rem, 2.022cqi, 0.8341rem);
  font-weight: 500;
  line-height: 1.3;
  white-space: nowrap;
}
