/* Styles for the room consultation management view (app.room-consultation.search.results.management). As a route
   view, not a component, every rule hangs from the '.room-consultation-management' root class to scope it and to
   outweigh generic classes on the same element (e.g. .panel-md, .panel-md-body). */

/* Header: back link and save button */
.room-consultation-management .room-consultation-management__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  align-self: stretch;
}

.room-consultation-management .room-consultation-management__title {
  display: flex;
  gap: var(--md-spacing-xs);
  margin-bottom: var(--md-spacing-none);
  font-size: var(--md-font-size-7);
}

.room-consultation-management .room-consultation-management__divider {
  margin-top: var(--md-spacing-xs);
  margin-bottom: var(--md-spacing-sm);
}

/* Tabs: request data and consultation management */
.room-consultation-management .room-consultation-management__tabs {
  display: flex;
  gap: var(--md-spacing-sm);
  margin-bottom: var(--md-spacing-sm);
  max-height: 88px; /* no token: MDDS has no height ramp */
}

.room-consultation-management .room-consultation-management__tab {
  width: 600px; /* no token: MDDS has no width ramp */
}

/* Consultation panel */
.room-consultation-management .room-consultation-management__panel {
  font-size: var(--md-font-size-4);
}

.room-consultation-management .room-consultation-management__consultation-id {
  margin: var(--md-spacing-none);
  padding: var(--md-spacing-mn);
  font-size: var(--md-font-size-8);
}

.room-consultation-management .room-consultation-management__columns {
  display: flex;
}

/* no token: column widths and the scroll height of the main column */
.room-consultation-management .room-consultation-management__main {
  display: flex;
  flex-direction: column;
  flex: 2 0 0;
  min-width: 400px;
  max-height: 70vh;
  overflow: auto;
  padding: var(--md-spacing-sm);
}

.room-consultation-management .room-consultation-management__side {
  display: flex;
  flex-direction: column;
  flex: 1 0 0;
  min-width: 200px;
  max-width: 424px;
  padding: var(--md-spacing-sm);
  border-left: var(--md-border-width-sm) solid var(--md-border-primary);
}

.room-consultation-management .room-consultation-management__label {
  margin-bottom: var(--md-spacing-3xs);
}

.room-consultation-management .room-consultation-management__origin-dot {
  font-size: var(--md-font-size-3);
}

/* Applicant and record cards */
.room-consultation-management .room-consultation-management__records {
  display: flex;
  flex-direction: column;
  gap: var(--md-spacing-4xs);
}

.room-consultation-management .room-consultation-management__card {
  padding: var(--md-spacing-xs) var(--md-spacing-sm);
  background: var(--md-background-secondary);
}

.room-consultation-management .room-consultation-management__card--record {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: var(--md-spacing-3xs);
}

.room-consultation-management .room-consultation-management__card-content {
  display: flex;
  align-items: stretch;
  gap: var(--md-spacing-xs);
}

/* 2rem on the 10px root of Bootstrap 3 */
.room-consultation-management .room-consultation-management__card-icon {
  font-size: var(--md-font-size-6);
  color: var(--md-content-brand-secondary);
}

.room-consultation-management .room-consultation-management__card-data {
  display: flex;
  flex-direction: column;
  gap: var(--md-spacing-3xs);
}

.room-consultation-management .room-consultation-management__name {
  font-weight: var(--md-font-weight-semibold);
}

/* Application and consultation status */
.room-consultation-management .room-consultation-management__status-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--md-spacing-3xs);
  margin-bottom: var(--md-spacing-3xs);
}

.room-consultation-management .room-consultation-management__status-label--spaced {
  margin-bottom: var(--md-spacing-xs);
}

.room-consultation-management .room-consultation-management__status {
  padding: var(--md-spacing-4xs) var(--md-spacing-xs);
}

.room-consultation-management .room-consultation-management__consultation-status-label {
  justify-content: flex-start;
}

.room-consultation-management .room-consultation-management__consultation-status {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--md-spacing-xs);
}

/* Creator details */
.room-consultation-management .room-consultation-management__creator {
  display: flex;
  align-items: center;
  gap: var(--md-spacing-xs);
}

.room-consultation-management .room-consultation-management__creator-icon {
  font-size: 48px; /* no token: the font size ramp jumps from 40px to 56px */
  color: var(--md-content-tertiary);
}

.room-consultation-management .room-consultation-management__creator-data {
  display: flex;
  flex-direction: column;
}

/* no semantic token: neutral-20 is only aliased as a border colour */
.room-consultation-management .room-consultation-management__creator-name {
  color: var(--md-color-neutral-20);
}