/**
 * Thinking Mode UI Styles
 * Automatically applied when thinking mode is enabled
 * Hides unnecessary UI elements for a simplified interface
 */

/* Hide model selector, presets, and multi-convo when thinking mode is active */
/* Works in all languages by targeting IDs and structure */
body[data-thinking-mode="true"] button[id^=":r"][aria-expanded]:has(span.flex-grow),
body[data-thinking-mode="true"] [data-testid="model-selector"],
body[data-thinking-mode="true"] button[aria-label*="model" i],
body[data-thinking-mode="true"] button[aria-label*="modèle" i] {
  display: none !important;
}

body[data-thinking-mode="true"] #presets-button,
body[data-thinking-mode="true"] [data-testid="presets-button"],
body[data-thinking-mode="true"] [data-testid="presets-menu"],
body[data-thinking-mode="true"] button[aria-label*="Preset" i],
body[data-thinking-mode="true"] button[aria-label*="Exemple" i] {
  display: none !important;
}

body[data-thinking-mode="true"] #add-multi-conversation-button,
body[data-thinking-mode="true"] [data-testid="parameters-button"],
body[data-thinking-mode="true"] [data-testid="multi-convo"] {
  display: none !important;
}

/* Keep the native "New conversation" button visible */

/* Hide TemporaryChat toggle button */
body[data-thinking-mode="true"] button[aria-label*="Temporary" i],
body[data-thinking-mode="true"] button[aria-label*="Temporaire" i] {
  display: none !important;
}

/* Hide starter prompts/examples */
body[data-thinking-mode="true"] [class*="starter"] {
  display: none !important;
}

/* Hide agent marketplace button when thinking mode is active */
body[data-thinking-mode="true"] [data-testid="nav-agents-marketplace-button"],
body[data-thinking-mode="true"] button[aria-label*="Marketplace" i],
body[data-thinking-mode="true"] button[aria-label*="Agent Marketplace" i] {
  display: none !important;
}


/* Hide the standard right side panel content when thinking mode is active */
body[data-thinking-mode="true"] .sidenav#controls-nav {
  display: none !important;
}

/* Ensure thinking mode toggle is always visible */
body[data-thinking-mode="true"] [data-thinking-toggle] {
  display: flex !important;
}

/* Adjust header layout */
body[data-thinking-mode="true"] .chat-header {
  justify-content: space-between;
}

/* Thinking Mode Agents Panel - positioned absolutely */
#thinking-mode-agents-panel-root,
body[data-thinking-mode="true"] #thinking-mode-agents-panel-root {
  position: fixed !important;
  right: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 352px !important;
  z-index: 45;
  background: var(--surface-primary, white);
  border-left: 1px solid var(--border-light, #e5e7eb);
  transition: transform 0.3s ease;
  overflow-y: auto;
  display: block !important;
}

body:not([data-thinking-mode="true"]) #thinking-mode-agents-panel-root {
  display: none;
}

.dark #thinking-mode-agents-panel-root {
  background: var(--surface-primary, #1f2937);
  border-left-color: var(--border-dark, #374151);
}

/* Adjust main content when agents panel is visible */
body[data-thinking-mode="true"] #messages-view {
  margin-right: 352px;
}

/* Hide the resize handle for the original side panel */
body[data-thinking-mode="true"] .sidenav#controls-nav + .react-resizable-handle {
  display: none !important;
}

/* Thinking mode indicator */
.thinking-mode-indicator {
  position: fixed;
  bottom: 20px;
  right: 372px;
  padding: 8px 16px;
  background: #9333ea;
  color: white;
  border-radius: 9999px;
  font-size: 12px;
  font-weight: 500;
  z-index: 50;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}