.Polaris-Card__Section.SurveyResponses {
  padding: 0;
}

.ResponsesList {
  --border-color: hsla(220, 5%, 92%, 1);

  border-collapse: separate;
  border-spacing: 0;
  max-width: none;
}

.ResponsesList th,
.ResponsesList td {
  border-bottom: 1px solid var(--border-color); /* Bottom border */
}

.ResponsesList td {
  border-right: 1px solid var(--border-color); /* Right border */
}

.ResponsesList td:last-child {
  border-right: none;
}

.ResponsesList th {
  background-color: hsla(0, 0%, 98%, 1);
  border-bottom: 1px solid var(--border-color);
  color: hsla(220, 6%, 47%, 1);
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  padding: 12px 20px;
  text-align: left;
  text-transform: none;
  white-space: nowrap;
}

.ResponsesList__Response td {
  background: transparent;
  border-bottom: 1px solid #dfe3e8;
  color: hsla(220, 24%, 12%, 1);
  font-size: 14px;
  line-height: 16px;
  padding: 14px 20px;
  transition: background 150ms ease-in-out,
              border-color 250ms ease-in-out;
  vertical-align: top;
  white-space: nowrap;
}

.ResponsesList .response-editor__edit-indicator {
  align-items: center;
  color: oklch(0.68 0.04 254.73);
  cursor: pointer;
  display: flex;
  font-size: 12px;
  height: 0;
  justify-content: flex-end;
  opacity: 0;
  overflow: hidden;
  transition: opacity 150ms ease-in-out,
              height 0s 150ms;
  text-align: right;
}

.ResponsesList .response-editor__edit-indicator svg {
  height: 16px;
  width: 16px;
}

.ResponsesList .response-editor__actions {
  align-items: center;
  direction: ltr;
  display: flex;
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 22px;
  height: 0;
  justify-content: flex-end;
  line-height: 1;
  letter-spacing: normal;
  overflow: hidden;
  transition: opacity 150ms ease-in-out,
              height 0s;
  text-transform: none;
  white-space: nowrap;
  word-wrap: normal;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

.response-editor__reject {
  color: oklch(0.75 0.00 255);
  cursor: pointer;
  transition: color 250ms ease-in-out;
}

.response-editor__reject:hover {
  color: oklch(0.65 0.00 255);
}

.response-editor__confirm {
  color: oklch(0.65 0.17 257.94 / .8);
  cursor: pointer;
  transition: color 250ms ease-in-out;
}

.response-editor__confirm:hover {
  color: oklch(0.65 0.17 257.94 / 1);
}

.ResponsesList:not(:has(.editing)) .ResponsesList__Response:hover {
  & td {
    background-color: hsla(0, 0%, 98%, 1);
  }
}

.ResponsesList td.SurveyResponse__CustomerViewLink {
  border-right-color: transparent;
  padding-right: 0;
}

.ResponsesList .ResponsesList__OrderNumber {
  font-family: monospace;
  overflow: hidden;
  padding-left: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 75px;
}

.ResponsesList:has(.ResponsesList__OrderNumber:hover) .ResponsesList__OrderNumber {
  max-width: none;
}

.ResponsesList .SurveyResponse__Response {
  max-width: 200px;
  min-width: 200px;
  padding: 14px 20px;
  white-space: normal;
  width: 200px;
  word-break: break-word;
  word-wrap: break-word;
}

.ResponsesList:not(:has(.editing)) .ResponsesList__Response:has(.response-editor:hover) {
  & .response-editor {
    border-color: oklch(0.75 0 0);
  }

  & .ResponsesList__OrderNumber {
    border-right-color: oklch(0.75 0 0);
  }

  & .tier-1 {
    border-right-color: #dfe3e8;
  }

  & .response-editor__edit-indicator {
    height: 16px;
    opacity: 1;
    transition: opacity 150ms ease-in-out,
                height 0s;
  }
}

.ResponsesList:has(:focus-within) .ResponsesList__Response:focus-within,
.ResponsesList .ResponsesList__Response.editing {
  & td {
    background-color: oklch(0.98 0 0);
  }

  & .ResponsesList__OrderNumber {
    border-right-color: oklch(0.76 0.09 257.94);
  }

  & .response-editor {
    background-color: oklch(0.99 0.01 255.21 / 1);
    border-color: oklch(0.76 0.09 257.94);
  }

  & .tier-1 {
    border-right-color: oklch(0.91 0.01 0);
  }

  & .response-editor:focus,
  & .response-editor:focus + .SurveyResponse__Actions {
    background-color: oklch(0.95 0.02 255.21 / 1);
    outline: none;
  }

  & .response-editor__actions {
    height: 20px;
    opacity: 1;
    transition: opacity 150ms ease-in-out,
                height 0s 150ms;
  }
}

.ResponsesList:has(.editing) .ResponsesList__Response:has(+ .ResponsesList__Response.editing) {
  & .response-editor {
    border-bottom-color: oklch(0.75 0.09 257.94);
  }
}

.ResponsesList .response-editor:has(+ .SurveyResponse__Actions) {
  border-right: transparent;
}

.ResponsesList:not(:has(.editing)) .ResponsesList__Response:has(+ .ResponsesList__Response .response-editor:hover) .response-editor {
  border-bottom-color: oklch(0.79 0 0);
}

.ResponsesList__Response.editing .response-editor {
  background-color: oklch(0.99 0.01 255.21 / 1);
}

.ResponsesList .SurveyResponse__Actions {
  max-width: 100px;
  min-width: 100px;
  padding-left: 4px;
  padding-right: 8px;
  width: 100px;
}

.SurveyResponse__Date {
  font-family: monospace;
}
