/* Settings replace the conversation inside the existing movable assistant. */
#assistant-panel #assistant-options,
#assistant-panel .assistant-source-chip {
  min-width: 44px;
  min-height: 44px;
}

:root #assistant-panel[data-assistant-page]:not([data-assistant-page="conversation"]) {
  overflow: hidden;
}

#assistant-panel[data-assistant-page]:not([data-assistant-page="conversation"]) > :is(.assistant-source-bar, .assistant-scroll, .assistant-form, .mobile-assistant-reply-row),
#assistant-panel #assistant-management > summary[hidden],
#assistant-panel .assistant-settings-page > details > summary[hidden],
#assistant-panel .assistant-settings-index[hidden],
#assistant-panel .assistant-settings-page[hidden] {
  display: none;
}

#assistant-panel[data-assistant-page]:not([data-assistant-page="conversation"]) #assistant-management {
  position: relative;
  display: block;
  flex: 1 1 0;
  min-height: 0;
  max-height: none;
  overflow: hidden;
  border: 0;
}

#assistant-panel[data-assistant-page]:not([data-assistant-page="conversation"]) .assistant-management-body {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

#assistant-panel .assistant-settings-header {
  display: flex;
  flex: none;
  align-items: center;
  gap: 8px;
  min-height: 56px;
  padding: 4px 12px;
  border-bottom: 1px solid var(--ui-border);
}

#assistant-panel .assistant-settings-back {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 4px;
  min-width: 44px;
  min-height: 44px;
  padding: 4px 8px;
  font-size: 14px;
}

#assistant-panel .assistant-settings-back-icon {
  font-size: 24px;
  line-height: 1;
}

#assistant-panel .assistant-settings-heading {
  min-width: 0;
  margin: 0;
  color: var(--ui-text);
  font-size: 16px;
  font-weight: 650;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

#assistant-panel :is(.assistant-settings-index, .assistant-settings-page) {
  box-sizing: border-box;
  flex: 1 1 0;
  width: 100%;
  min-width: 0;
  min-height: 0;
  max-width: 960px;
  margin-inline: auto;
  padding: 8px 16px 16px;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  font-size: 14px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

#assistant-panel .assistant-settings-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20px;
  gap: 4px 12px;
  width: 100%;
  min-height: 72px;
  padding: 12px 4px;
  border: 0;
  border-bottom: 1px solid var(--ui-border);
  border-radius: 0;
  background: transparent;
  color: var(--ui-text);
  font: inherit;
  text-align: start;
  cursor: pointer;
}

#assistant-panel .assistant-settings-row:hover {
  background: var(--ui-surface-subtle);
}

#assistant-panel .assistant-settings-row-label {
  font-size: 14px;
  font-weight: 650;
}

#assistant-panel .assistant-settings-row-help {
  grid-column: 1;
  color: var(--ui-text-muted);
  font-size: 12px;
}

#assistant-panel .assistant-settings-chevron {
  grid-column: 2;
  grid-row: 1 / 3;
  align-self: center;
  font-size: 24px;
  text-align: center;
  color: var(--ui-text-soft);
}

#assistant-panel :is(.assistant-settings-row, .assistant-settings-back):focus-visible,
#assistant-panel .assistant-settings-page :is(button, input, select, textarea, summary, a):focus-visible {
  outline: 2px solid var(--ui-focus);
  outline-offset: -2px;
}

#assistant-panel .assistant-settings-page :is(button, select, summary),
#assistant-panel .assistant-settings-page input:not([type="checkbox"]):not([type="radio"]),
#assistant-panel .assistant-settings-page :is(.assistant-task-option, .assistant-vision-option) {
  box-sizing: border-box;
  min-height: 44px;
  font-size: 14px;
}

#assistant-panel .assistant-settings-page > .assistant-settings {
  margin: 0;
  border: 0;
}

#assistant-panel .assistant-settings-page .assistant-context {
  max-height: none;
  padding: 8px 0 12px;
  overflow: visible;
  font-size: 14px;
}

#assistant-panel .assistant-settings-page .assistant-context-summary {
  display: block;
  overflow: visible;
  -webkit-line-clamp: unset;
}

#assistant-panel .assistant-settings-page :is(#assistant-note-references, #assistant-resource-references, .assistant-task-card) {
  max-height: none;
  overflow: visible;
}

#assistant-panel .assistant-settings-page :is(.assistant-settings-form > label, .assistant-task-option) {
  font-size: 14px;
}

#assistant-panel .assistant-settings-page :is(.assistant-connection-summary, #assistant-settings-help, #assistant-shared-help, .assistant-task-option-help, .assistant-settings-status) {
  font-size: 12px;
  line-height: 1.5;
}
