.fs-notes-result-block[hidden],
.fs-note-partner-suggestions[hidden],
.fs-notes-analysis[hidden] {
  display: none !important;
}

.fs-notes-query-form {
  display: flex;
  align-items: end;
  gap: var(--fs-space-3);
}

.fs-notes-query-fields {
  display: grid;
  flex: 1;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: var(--fs-space-3);
}

.fs-notes-query-actions,
.fs-note-create-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--fs-space-2);
}

.fs-notes-list-grid,
.fs-notes-content .fs-datalist__row {
  grid-template-columns: 160px minmax(180px, 1fr) minmax(160px, 0.8fr) minmax(240px, 2fr) 24px;
}

.fs-note-cell {
  min-width: 0;
  overflow-wrap: anywhere;
}

.fs-note-cell--content {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fs-note-details {
  padding: var(--fs-space-3) var(--fs-space-4);
  color: var(--fs-color-text);
  line-height: 1.55;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.fs-notes-analysis {
  display: grid;
  gap: var(--fs-space-3);
}

.fs-notes-analysis pre {
  overflow: auto;
  margin: 0;
  padding: var(--fs-space-3);
  color: var(--fs-color-text);
  background: var(--fs-color-primary-subtle);
  border: 1px solid var(--fs-color-primary-line);
  border-radius: var(--fs-radius-md);
  font: inherit;
  line-height: 1.55;
  white-space: pre-wrap;
}

.fs-note-create-form {
  display: grid;
  max-width: 760px;
  gap: var(--fs-space-4);
}

.fs-note-create-form textarea {
  min-height: 150px;
  resize: vertical;
}

.fs-note-partner-field {
  position: relative;
}

.fs-note-partner-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.fs-note-partner-control input {
  border-radius: var(--fs-radius-sm) 0 0 var(--fs-radius-sm);
}

.fs-note-partner-control .action-button {
  border-radius: 0;
}

.fs-note-partner-control .action-button:last-child {
  border-radius: 0 var(--fs-radius-sm) var(--fs-radius-sm) 0;
}

.fs-note-partner-control input:focus {
  border-color: var(--fs-color-primary);
  box-shadow: inset 0 0 0 1px var(--fs-color-primary);
  outline: none;
}

.fs-note-partner-suggestions {
  position: absolute;
  z-index: 20;
  top: calc(100% - var(--fs-space-4));
  right: 0;
  left: 0;
  display: grid;
  max-height: 280px;
  overflow-y: auto;
  padding: var(--fs-space-1);
  background: var(--fs-color-surface);
  border: 1px solid var(--fs-color-border);
  border-radius: var(--fs-radius-sm);
  box-shadow: var(--fs-shadow-md);
}

.fs-note-partner-option,
.fs-note-partner-empty {
  padding: var(--fs-space-2) var(--fs-space-3);
  color: var(--fs-color-text);
  background: transparent;
  border: 0;
  border-radius: var(--fs-radius-sm);
  text-align: left;
}

.fs-note-partner-option {
  cursor: pointer;
}

.fs-note-partner-option:hover,
.fs-note-partner-option.is-active {
  background: var(--fs-color-primary-subtle);
}

.fs-note-partner-empty {
  color: var(--fs-color-text-secondary);
}

@media (max-width: 760px) {
  .fs-notes-query-form {
    align-items: stretch;
    flex-direction: column;
  }

  .fs-notes-query-fields {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .fs-notes-query-actions,
  .fs-note-create-actions {
    flex-wrap: wrap;
  }

  .fs-notes-content .fs-datalist__head {
    display: none;
  }

  .fs-notes-content .fs-datalist__row {
    grid-template-columns: minmax(0, 1fr) 24px;
  }

  .fs-notes-content .fs-note-cell {
    display: grid;
    grid-column: 1;
    grid-template-columns: minmax(84px, 0.35fr) minmax(0, 1fr);
    gap: var(--fs-space-2);
  }

  .fs-notes-content .fs-note-cell::before {
    color: var(--fs-color-text-secondary);
    content: attr(data-label);
    font-size: var(--fs-text-xs);
    font-weight: 700;
  }

  .fs-notes-content .fs-datalist__chevron {
    grid-column: 2;
    grid-row: 1 / span 4;
  }
}