.dcd-active-call-sessions {
  display: grid;
  gap: 10px;
  border: 1px solid #f59e0b;
  border-radius: 14px;
  padding: 14px;
  background: #fffbeb;
  margin-bottom: 10px;
}

.dcd-active-call-sessions h4 {
  margin: 0;
  color: #92400e;
}

.dcd-active-call-sessions-list {
  display: grid;
  gap: 10px;
}

.dcd-active-call-sessions-empty {
  margin: 0;
  color: var(--dcd-muted);
}

.dcd-active-call-session {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(320px, 1.4fr);
  gap: 12px;
  align-items: center;
  border: 1px solid #fcd34d;
  border-radius: 10px;
  padding: 10px;
  background: #ffffff;
}

.dcd-active-call-session > div,
.dcd-call-session-unlock-form {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 12px;
  align-items: center;
}

.dcd-call-session-state {
  border-radius: 999px;
  padding: 4px 9px;
  background: #e0f2fe;
  color: #075985;
  font-size: 12px;
  font-weight: 800;
}

.dcd-active-call-session.is-emergency {
  border-color: #ef4444;
  background: #fff7f7;
}

.dcd-active-call-session.is-emergency .dcd-call-session-state {
  background: #fee2e2;
  color: #991b1b;
}

.dcd-call-session-unlock-form[hidden] {
  display: none !important;
}

.dcd-call-session-unlock-form input[type="text"] {
  flex: 1 1 220px;
  min-height: 40px;
  border: 1px solid #d6a72c;
  border-radius: 10px;
  padding: 8px 10px;
}

@media (max-width: 760px) {
  .dcd-active-call-session {
    grid-template-columns: 1fr;
  }
}