/* Shared Web/PWA incident suggestion and detail surfaces. */
.ticket-incident-suggestions {
  margin: 1rem 0;
  padding: .85rem;
  border: 1px solid color-mix(in srgb, var(--accent, #198754) 44%, var(--border, #ced4da));
  border-radius: .65rem;
  background: color-mix(in srgb, var(--surface, #fff) 92%, var(--accent, #198754));
}

.ticket-incident-suggestions[hidden],
.ticket-incident-suggestions.hidden { display: none; }

.ticket-incident-suggestions__heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
}

.ticket-incident-suggestion-list {
  display: grid;
  gap: .55rem;
  margin-top: .7rem;
}

.ticket-incident-suggestion,
.ticket-incident-selection,
.ticket-incident-report,
.ticket-incident-linked-ticket {
  border: 1px solid var(--border, #ced4da);
  border-radius: .5rem;
  background: var(--surface, #fff);
}

.ticket-incident-suggestion {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .6rem;
  align-items: center;
  padding: .65rem;
}

.ticket-incident-suggestion__title {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem;
  font-weight: 700;
}

.ticket-incident-suggestion__description,
.ticket-incident-linked-ticket .small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ticket-incident-suggestion__reasons {
  margin-top: .2rem;
  color: var(--muted, #6c757d);
  font-size: .78rem;
}

.ticket-incident-selection {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  margin-top: .7rem;
  padding: .6rem;
  border-color: var(--accent, #198754);
}

.ticket-incident-detail { background: var(--surface, #fff); }
.ticket-incident-report-list { display: grid; gap: .55rem; }
.ticket-incident-report { padding: .65rem; }
.ticket-incident-linked-ticket { padding: .5rem .65rem; color: inherit; text-decoration: none; }
.ticket-incident-linked-ticket:hover { border-color: var(--accent, #198754); color: inherit; }
.ticket-incident-management__input { width: min(100%, 13rem); }

.ticket-incident-link-results { display: grid; gap: .5rem; }
.ticket-incident-link-selection {
  padding: .65rem;
  border: 1px solid var(--accent, #198754);
  border-radius: .5rem;
  background: color-mix(in srgb, var(--surface, #fff) 91%, var(--accent, #198754));
}
.ticket-incident-link-result {
  width: 100%;
  display: grid;
  gap: .2rem;
  padding: .7rem;
  text-align: left;
  color: inherit;
  border: 1px solid var(--border, #ced4da);
  border-radius: .5rem;
  background: var(--surface, #fff);
}
.ticket-incident-link-result:hover,
.ticket-incident-link-result:focus-visible,
.ticket-incident-link-result.is-selected {
  border-color: var(--accent, #198754);
  outline: none;
  box-shadow: 0 0 0 .16rem color-mix(in srgb, var(--accent, #198754) 24%, transparent);
}
.ticket-incident-link-result__title { font-weight: 700; text-transform: capitalize; }
.ticket-incident-link-result__metadata,
.ticket-incident-link-result__description { font-size: .84rem; }
.ticket-incident-link-result__metadata { color: var(--muted, #6c757d); }
.ticket-incident-link-result__description {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-theme="dark"] .ticket-incident-suggestions,
html[data-theme="dark"] .ticket-incident-suggestion,
html[data-theme="dark"] .ticket-incident-selection,
html[data-theme="dark"] .ticket-incident-detail,
html[data-theme="dark"] .ticket-incident-report,
html[data-theme="dark"] .ticket-incident-linked-ticket {
  background: var(--surface);
  color: var(--fg);
}

html[data-theme="dark"] .ticket-incident-link-selection,
html[data-theme="dark"] .ticket-incident-link-result {
  background: var(--surface);
  color: var(--fg);
}

@media (max-width: 575.98px) {
  .ticket-incident-suggestion { grid-template-columns: 1fr; }
  .ticket-incident-suggestion > .btn { width: 100%; }
}