/* @import "./src/components/full-results-popup/style/queryManager.css"; */
/* @import "./src/components/full-results-popup/style/queryRenderer.css"; */

:root {
  --icon-color-left: var(--co-left-sidebar__icon, #5c7080);
  --icon-color-top: var(--co-button__minimal-icon, #5c7080);
}

/* SETTINGS */

#context-menu-container {
  position: absolute;
  z-index: 0;
}
#full-results-popup-container {
  z-index: 0;
}

.rm-settings .liveai-settings-smallinput > input[type="text"] {
  min-width: 50px;
  width: 80px;
  text-align: end;
}

.liveai-settings-largeinput {
  display: flex;
  flex-direction: column;
}
.rm-settings .liveai-settings-largeinput > input[type="text"] {
  margin-top: 12px;
  width: 100%;
}
.rm-settings .liveai-settings-largeinput > div {
  align-self: flex-start !important;
}

/***** Voice Recorder *****/

.speech-command.ask-your-graph .bp3-icon-chat {
  transform: translateY(-1px);
}

/******/

.popover-target {
  width: 10px;
  height: 10px;
  background-color: transparent;
  border: none;
}

.color-toaster .bp3-toast {
  background: orange;
}
.color-toaster .bp3-toast-messge {
  color: black;
}
.search-agent-toaster .bp3-toast,
.thinking-toaster .bp3-toast,
.mcp-toaster .bp3-toast {
  max-width: 600px;
  max-height: 90vh;
  font-size: 13px;
  padding: 5px;
  resize: both;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.search-agent-toaster .bp3-toast-message,
.thinking-toaster .bp3-toast-message,
.mcp-toaster .bp3-toast-message {
  color: var(--co-app, black);
}

/* Special overflow handling for search-agent-toaster to allow dropdown to escape */
.search-agent-toaster .bp3-toast {
  overflow: visible;
}

/* But keep the message area scrollable */
.search-agent-toaster .bp3-toast .bp3-toast-message {
  overflow-y: auto;
}
.search-agent-toaster .bp3-toast .bp3-button-group,
.thinking-toaster .bp3-toast .bp3-button-group,
.mcp-toaster .bp3-toast .bp3-button-group {
  display: none;
}
.search-agent-toaster .bp3-toast .buttons,
.thinking-toaster .bp3-toast .buttons,
.mcp-toaster .bp3-toast .buttons {
  min-height: fit-content;
  align-self: flex-end;
  background: inherit;
  /* Allow expansion dropdown to overflow the toaster boundaries */
  overflow: visible;
  position: relative;
  z-index: 10000;
}

/* Expansion dropdown specific styles to ensure it appears above toaster boundaries */
.search-agent-toaster .bp3-toast .buttons > div[style*="position: relative"] {
  overflow: visible !important;
}

.search-agent-toaster .bp3-toast .buttons div[style*="position: absolute"] {
  z-index: 10001 !important;
}

/* Expansion Dropdown Styles */
.expansion-dropdown-container {
  position: relative;
  display: inline-block;
}

.expansion-dropdown-menu {
  position: absolute;
  top: 100%;
  right: 0; /* Changed from left: 0 to right: 0 for better positioning */
  min-width: 300px;
  background-color: white;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  z-index: 10000; /* Increased z-index for better layering */
  max-height: 400px;
  overflow-y: auto;
  /* Add better viewport handling */
  transform: translateY(2px); /* Small gap from trigger */
}

.expansion-dropdown-option {
  padding: 8px 12px;
  cursor: pointer;
  border-bottom: 1px solid #eee;
  display: flex;
  align-items: center;
  font-size: 13px;
  color: #333;
  transition: all 0.2s ease;
}

.expansion-dropdown-option:last-child {
  border-bottom: none;
}

.expansion-dropdown-option:hover {
  background-color: rgba(217, 130, 43, 0.15);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.expansion-dropdown-option-emoji {
  margin-right: 8px;
  font-size: 14px;
}

.expansion-dropdown-option-label {
  flex: 1;
}

.search-agent-toaster .bp3-toast .bp3-toast-message,
.thinking-toaster .bp3-toast .bp3-toast-message,
.mcp-toaster .bp3-toast .bp3-toast-message {
  overflow-y: scroll;
}
.search-agent-toaster .bp3-toast li {
  padding: 3px 0;
}
.search-agent-toaster .bp3-toast ul {
  list-style-type: none;
}
.search-agent-toaster .bp3-toast ul,
.search-agent-toaster .bp3-toast ol {
  padding-left: 20px;
}
.search-agent-toaster .bp3-toast .bp3-toast-message > ul {
  padding-left: 0;
}
.search-agent-toaster .bp3-toast .bp3-toast-message {
  margin-top: 5px;
}
.laia-progressbar {
  margin-bottom: 20px;
}

.speech-to-roam :is(.log-button, .bp3-icon, .bp3-button):focus {
  border: none;
  outline: none;
}
.timer {
  font-variant-numeric: tabular-nums;
  margin-left: 4px;
}
.speech-to-roam-container-left > .speech-ui-row1 .left-timer-wrapper {
  display: flex;
  justify-content: space-between;
  margin: 0 !important;
  margin-left: 2px;
  padding-left: 0;
}
.roam-sidebar-content,
.log-button {
  max-width: 230px !important;
}
.speech-to-roam-container-left.speech-to-roam.log-button {
  padding-right: 5px !important;
  margin-right: 0px !important;
}
.speech-to-roam-container-left > .speech-ui-row1 > .log-button {
  margin-right: 0px !important;
}

.speech-record-button {
  min-width: 24px !important;
}
/* .speech-record-button > span {
  margin-left: -2px;
} */
.speech-record-button:focus,
.speech-backward-button:focus {
  outline-width: 0px !important;
}
.speech-record-button .bp3-icon {
  margin-left: 2px;
  min-width: 24px;
  padding: 0;
}

.speech-ui-row1,
.speech-ui-row2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 24px;
}

.speech-to-roam-container-top {
  z-index: 1;
  display: flex;
}
.rm-topbar:has(.rm-open-left-sidebar-btn):not(:has(#todayTomorrow)):not(
    :has(#workspaces)
  ):not(:has(.rm-topbar__arrow-button))
  > .speech-to-roam.speech-to-roam-container-top {
  position: absolute;
  left: 40px;
}
/* .speech-to-roam-container-top:has(.digits) {
  flex-direction: column;
}
.speech-to-roam-container-top:has(.speech-ui-row2 > .bp3-popover-wrapper) {
  margin-top: 5px;
} */
.speech-to-roam-container-top .speech-ui-row2:not(:has(.bp3-popover-wrapper)) {
  display: none;
}

.speech-to-roam-container-left {
  display: flex;
  align-items: center;
  gap: 10px;
}
.speech-to-roam-container-left
  > .speech-ui-row1
  > .log-button
  > span:last-child {
  margin-right: -3px;
}
.speech-to-roam-container-left > .speech-ui-row1:has(.fa-microphone-slash) {
  margin-left: -4px;
}
.speech-to-roam-container-left:has(.digits) {
  padding-top: 2px;
  padding-bottom: 2px;
}
.speech-to-roam-container-left:has(.digits) > div.log-button {
  padding-right: 0 !important;
}
.speech-to-roam-container-left > .speech-ui-row1 > .log-button {
  padding: 0 4px 0 2px !important;
  margin-left: 0 !important;
}
.speech-to-roam-container-left:has(.digits) > .speech-ui-row1 > .log-button {
  padding-right: 0 !important;
}
.speech-to-roam-container-left
  > .speech-ui-row1
  > .log-button:not(:has(.digits))
  > span:last-child {
  margin-left: -1px;
}

.speech-to-roam .fa-microphone {
  padding-bottom: 1px;
}

.speech-to-roam-container-left svg:not(.fa-record-vinyl) path {
  fill: var(--icon-color-left);
}
.speech-to-roam-container-top svg:not(.fa-record-vinyl) path,
.full-results-chat-mic-button svg path {
  fill: var(--icon-color-top);
}

.full-results-chat-mic-button {
  margin-left: -5px;
}

.openai-logo {
  transform: translateY(2px);
}

.speech-to-roam-container-inline {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 25px;
  /* padding-top: 4px;
  padding-bottom: 4px; */
  margin-right: 20px;
}
/* .speech-to-roam-container-inline .bp3-popover-target {
  margin-right: 15px;
} */
.speech-to-roam-container-inline > .bp3-popover-wrapper:nth-child(2) {
  width: 170px;
}

.highlight-elt {
  animation: green-shadow-flash 5s;
}
.highlight-elt-inset {
  animation: green-shadow-inset-flash 5s;
}
.highlight-elt-orange-inset {
  animation: orange-shadow-inset-flash 3s;
  animation-iteration-count: 4;
}
.highlight-elt-blue {
  animation: blue-shadow-flash 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}
.fixed-highlight-elt-blue {
  transition: 2.5s;
  filter: brightness(0.8);
  -webkit-box-shadow: 0 0 10px 5px #2196f380;
  box-shadow: 0 0 10px 5px #2196f380;
}
@keyframes blue-shadow-flash {
  0% {
    filter: brightness(0.8);
    -webkit-box-shadow: 0 0 10px 5px #2196f380;
  }
  50% {
    -webkit-box-shadow: 0 0 10px 5px transparent;
  }
  100% {
    filter: brightness(0.8);
    -webkit-box-shadow: 0 0 10px 5px #2196f380;
  }
}
@keyframes green-shadow-flash {
  0% {
    -webkit-box-shadow: 0 0 10px 5px transparent;
  }
  50% {
    filter: brightness(0.9);
    -webkit-box-shadow: 0 0 10px 5px green;
  }
  100% {
    -webkit-box-shadow: 0 0 10px 5px transparent;
  }
}
@keyframes green-shadow-inset-flash {
  0% {
    -webkit-box-shadow: inset 0 0 10px 5px transparent;
  }
  50% {
    filter: brightness(0.9);
    -webkit-box-shadow: inset 0 0 10px 5px green;
  }
  100% {
    -webkit-box-shadow: inset 0 0 10px 5px transparent;
  }
}
@keyframes orange-shadow-inset-flash {
  0% {
    -webkit-box-shadow: inset 0 0 5px 3px transparent;
  }
  50% {
    /* filter: brightness(0.9); */
    -webkit-box-shadow: inset 0 0 6px 2px #ffa600e0;
  }
  100% {
    -webkit-box-shadow: inset 0 0 5px 3px transparent;
  }
}

/* CONTEXT MENU */

.bp3-elevation-3.aicommands-div {
  min-width: 250px;
  width: auto;
  z-index: 999 !important;
}
.aicommands-div > .str-aicommands-menu {
  padding: 10px;
}
.aicommands-div > .str-aicommands-menu h6 {
  color: unset;
}

/* Default model & thinking controls */
.aicommands-div > .str-aicommands-menu > .bp3-menu-header.menu-hint {
  margin: 8px 0 5px 0;
  padding-left: 0;
}
.aicommands-div
  > .str-aicommands-menu
  > .bp3-menu-header.menu-hint
  > .bp3-heading {
  padding-right: 0;
}

/* BlueprintJS HTML Selects */
.str-aicommands-menu .bp3-html-select select {
  padding-right: 20px;
  padding-left: 5px;
  text-align: right;
}
.str-aicommands-menu .bp3-html-select .bp3-icon {
  padding-right: 0;
  right: 2px;
}

.aicommands-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  opacity: 0.6;
  font-size: 12px;
  font-weight: 500;
}
.aicommands-topbar .laia-topbar-icons {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.aicommands-div > ul,
.aicommands-div > ul > li {
  cursor: grab;
}
.aicommands-div:active *,
.aicommands-div.dragging * {
  cursor: grabbing;
}

.aicommands-style,
.aicommands-context,
.estimate-tokens {
  opacity: 0.6;
  padding: 5px 0;
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
  font-size: 12px;
  flex-wrap: wrap;
  max-width: 350px;
}
.estimate-tokens {
  padding: 1px 6px 5px 0;
}
.aicommands-context div {
  font-size: 12px;
}
.aicommands-context button {
  background: none;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 2px 4px;
  font-size: 12px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 1px;
}
.aicommands-context button > .bp3-icon-caret-down {
  padding-right: 0;
}
.aicommands-context .bp3-numeric-input {
  align-items: center;
}
.aicommands-context .bp3-numeric-input input {
  width: 35px;
  font-size: 12px;
  height: 24px;
  align-items: center;
  text-align: center;
  padding-left: 4px;
  padding-right: 4px;
}
.aicommands-context
  .bp3-numeric-input
  .bp3-button-group.bp3-vertical
  > .bp3-button {
  width: fit-content;
  flex: 1 1 13px;
}
.aicommands-context .bp3-numeric-input button > .bp3-icon {
  padding: 0;
}
.aicommands-context .bp3-numeric-input button svg {
  width: 14px;
}
.aicommands-style {
  gap: 5px;
  padding-top: 0;
}
.aicommands-context {
  padding-right: 6px;
}
.aicommands-context .bp3-control {
  margin-bottom: 0;
}
.aicommands-context .bp3-control.bp3-inline {
  margin-right: 0px;
}
.aicommands-context .bp3-control-indicator {
  margin-right: 3px;
}
.aicommands-context label {
  margin-bottom: 0;
  font-weight: normal;
}
.aicommands-style .bp3-icon-pin,
.aicommands-style .bp3-icon-unpin {
  cursor: pointer !important;
  padding: 5px;
}
.aicommands-style select,
.str-aicommands-input select {
  font-size: 12px;
  text-align: end;
  padding-right: 28px;
}
.str-aicommands-input select {
  opacity: 0.6;
}

.str-aicommands-additional {
  margin-top: 10px;
}
.str-aicommands-additional textarea {
  scrollbar-width: 5px;
  max-height: 32vh;
}

.str-aimodels-menu {
  height: fit-content;
  max-height: 450px;
  /* opacity: 0.6; */
  font-size: 12px;
  overflow-y: scroll;
}

.suggested-aicommands
  .str-aicommands-menu
  .bp3-popover:has(.str-aimodels-menu) {
  transform: translateY(-40px);
}

.str-aimodels-menu .bp3-menu-item > div {
  margin-right: 15px;
}
.str-aimodels-menu .bp3-menu-item-label {
  align-self: center;
}

.bp3-menu.str-aicommands-menu {
  max-height: 50vh;
  /* overflow: scroll; */
  z-index: 9999;
}

.str-aicommands-menu .bp3-input-group *:focus {
  outline: none !important;
  box-shadow: 0;
}
.str-aicommands-menu .bp3-input-group .bp3-icon {
  opacity: 0.6;
  cursor: pointer;
}

.str-aimodels-menu li a:focus,
.str-aicommands-menu li a:focus {
  outline-width: 0px !important;
  text-decoration: none;
  font-weight: bold;
}

.str-aimodels-menu .menu-hint,
.str-aicommands-menu .menu-hint {
  opacity: 0.6;
}
.str-aimodels-menu .menu-hint *,
.str-aicommands-menu .menu-hint * {
  font-size: 12px;
}

.str-aicommands-menu .menu-hint div {
  text-align: center;
  line-height: 1.75;
  /* margin: 0 0 8px 0; */
}

.str-aicommands-menu .custom-lgg-menu {
  display: flex;
  flex-direction: row;
  align-items: center;
  /* margin: 0;
  padding: 0; */
}

.str-aicommands-menu .bp3-icon {
  padding-right: 5px;
}

.bp3-popover.suggested-aicommands {
  transform: translateX(10px) translateY(-33px) !important;
  z-index: 9999;
}

/* INLINE BUTTONS
 on the right of assistant answer */

.liveai-instant-btn-container {
  position: absolute;
  /* top: -22px; */
  right: 0;
  z-index: 99;
  opacity: 0.1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.liveai-instant-btn-outliner-container {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 99;
  opacity: 0.4;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.rm-block-children:not(:has(.rm-block))
  > .liveai-instant-btn-outliner-container {
  top: -25px;
}
.liveai-instant-btn-container:not(:has(.fa-copy)) {
  top: 1px;
  opacity: 0.4;
}

.rm-block[data-has-ref-count] .liveai-instant-btn-container,
.fixed-highlight-elt-blue
  > :first-of-type(.rm-block)[data-has-ref-count]
  .liveai-instant-btn-outliner-container {
  top: 25px;
}
.rm-block[data-has-instant-btn]:hover > div > .liveai-instant-btn-container {
  opacity: 0.4;
}

.rm-block[data-has-instant-btn-outliner]:hover
  > div
  > .liveai-instant-btn-outliner-container {
  opacity: 0.6;
}

.rm-block[data-has-instant-btn] .liveai-instant-btn-container:hover,
.rm-block[data-has-instant-btn]:hover .liveai-instant-btn-container:hover,
.rm-block[data-has-instant-btn-outliner]
  .liveai-instant-btn-outliner-container:hover,
.rm-block[data-has-instant-btn-outliner]:hover
  .liveai-instant-btn-outliner-container:hover {
  opacity: 1;
}
.rm-block .liveai-instant-btn-container > .bp3-button,
.rm-block .liveai-instant-btn-outliner-container > button.bp3-button {
  background-color: transparent;
  min-height: 18px;
  min-width: 20px;
  max-height: 20px;
  max-width: 20px;
  padding: 1px;
  box-shadow: none;
  background-image: none;
}
.rm-block .liveai-instant-btn-container > .bp3-button:hover,
.rm-block .liveai-instant-btn-outliner-container > button.bp3-button:hover {
  background-color: rgba(0, 0, 0, 0.1);
}
/* .liveai-instant-btn-container > svg {
  padding: 1px 0;
} */
.liveai-instant-btn-container svg:not(.fa-xmark) path,
.liveai-instant-btn-outliner-container svg:not(.fa-xmark) path {
  fill: var(--icon-color-top);
}

/* Suggestions menu, native {{or:}} component   */
.rm-option {
  margin: 0;
}
.bp3-select-popover .bp3-menu {
  width: fit-content;
  max-width: -webkit-fill-available;
}

/* Tokens usage dialog */
.tokens-dialog-container {
  z-index: 1000;
}

.tokens-dialog,
.laia-help-dialog {
  width: 95%;
  max-width: 800px;
  max-height: 95vh;
  z-index: 9999;
  margin: 10px 0;
}
.tokens-dialog .bp3-dialog-body,
.laia-help-dialog .bp3-dialog-body {
  max-height: 90vh;
  overflow-y: auto;
  margin-right: 2px;
  padding-right: 15px;
}
.laia-help-dialog .bp3-dialog-body {
  font-size: small;
}

/* Tokens usage content - shared between dialog and tab */
.tokens-dialog h3,
.tokens-usage-content h3 {
  cursor: pointer;
  display: flex;
  align-items: center;
}
.tokens-dialog h3 .bp3-icon,
.tokens-usage-content h3 .bp3-icon,
.tokens-dialog h3 .bp5-icon,
.tokens-usage-content h3 .bp5-icon {
  margin-right: 3px;
}
.tokens-dialog table,
.tokens-usage-content table {
  width: 100%;
  margin: 10px 0;
}
.tokens-dialog .bp3-dialog-body .bp3-html-table th,
.tokens-dialog .bp5-dialog-body .bp5-html-table th,
.tokens-usage-content .bp3-html-table th,
.tokens-usage-content .bp5-html-table th {
  background-color: #f5f8fa;
  padding: 8px;
  text-align: left;
}
.tokens-dialog .bp3-dialog-body .bp3-html-table td,
.tokens-dialog .bp5-dialog-body .bp5-html-table td,
.tokens-usage-content .bp3-html-table td,
.tokens-usage-content .bp5-html-table td {
  color: unset;
  padding: 8px;
  max-width: 220px;
}
.tokens-dialog .even-row,
.tokens-usage-content .even-row {
  background-color: transparent;
}
.tokens-dialog .odd-row,
.tokens-usage-content .odd-row {
  background-color: rgba(0, 0, 0, 0.05);
}
.last-request {
  margin-bottom: 10px;
}
.tokens-reset-section {
  margin-top: 20px;
  padding-top: 10px;
  border-top: 1px solid #e1e8ed;
}

/* Dark mode support */
.bp5-dark .tokens-usage-content .bp5-html-table th,
.bp3-dark .tokens-usage-content .bp3-html-table th {
  background-color: #293742;
}
.bp5-dark .tokens-usage-content .odd-row,
.bp3-dark .tokens-usage-content .odd-row {
  background-color: rgba(255, 255, 255, 0.05);
}
.bp5-dark .tokens-reset-section,
.bp3-dark .tokens-reset-section {
  border-top-color: #394b59;
}

@media (max-width: 500px) {
  .roam-sidebar-content,
  .log-button {
    max-width: 100vw !important;
  }

  .rm-topbar
    > span.speech-to-roam.speech-to-roam-container-top:not(:has(.timer)) {
    position: absolute;
    left: unset !important;
    right: 15px;
    top: 45px;
    border-radius: 0 0 20px 5px;
    backdrop-filter: blur(1.5px);
  }
  .roam-main:has(.speech-to-roam.speech-to-roam-container-top)
    .roam-article:not(:has(.rm-title-display)) {
    padding-top: 35px;
  }

  .speech-to-roam:has(.timer) {
    position: fixed;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    padding: 0 !important;
    top: calc(100dvh / 4 * 3);
    left: 0 !important;
    width: 100vw;
    height: calc(100dvh / 4);
    z-index: 10;
    color: #5c7080;
    background-color: var(--bc-main, #182026) !important;
  }

  .speech-to-roam-container-top:has(.timer) {
    border-top: 2px solid #5c7080;
    background-color: var(--bc-main, white) !important;
  }

  .speech-ui-row1:has(.timer),
  .speech-ui-row1:has(.timer) + .speech-ui-row2 {
    justify-content: center;
    gap: 10px;
    scale: 2.5;
  }

  .laia-help-dialog .bp3-dialog-body {
    margin-left: 12px;
    margin-right: 2px;
    padding-right: 12px;
    font-size: smaller;
  }

  .bp3-elevation-3.aicommands-div {
    min-width: 200px;
    width: 300px;
    transform: scale(0.9);
  }
  .bp3-popover.suggested-aicommands {
    transform: translateX(5px) translateY(15px) scale(0.9) !important;
  }

  .search-agent-toaster .bp3-toast {
    max-width: 90%;
  }

  .tokens-dialog .bp3-dialog-body {
    font-size: 7.5px;
    overflow-x: scroll;
    margin: 10px;
  }
  .tokens-dialog .bp3-dialog-body p {
    font-size: 10px;
    margin-bottom: 2px;
  }
  .tokens-dialog .bp3-dialog-body td,
  .tokens-dialog .bp3-dialog-body th {
    padding: 6px;
  }
}

@media (max-width: 390px) {
  .speech-ui-row1:has(.timer),
  .speech-ui-row1:has(.timer) + .speech-ui-row2 {
    justify-content: center;
    gap: 5px;
    scale: 2.2;
  }
}

/* MCP Configuration Component Styles */

.bp3-dialog:has(.mcp-config-container) {
  width: 950px !important;
  max-width: 90%;
  max-height: 90vh !important;
}

.mcp-config-container {
  padding: 10px;
  height: 100%;
  overflow: auto;
  max-height: 950px;
}

.mcp-config-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}

.mcp-config-header-buttons {
  display: flex;
  gap: 10px;
}

.mcp-server-card {
  background-color: unset;
  margin-bottom: 8px;
}

.mcp-server-card-content {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.mcp-server-card-main {
  flex: 1;
}

.mcp-server-title-row {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}

.mcp-server-title {
  margin: 0;
  margin-right: 10px;
}

.mcp-server-auto-tag {
  margin-left: 8px;
}

.mcp-server-url {
  font-size: 12px;
  color: #666;
  margin-bottom: 8px;
}

.mcp-server-description {
  font-size: 12px;
  color: #666;
  margin-bottom: 8px;
}

.mcp-server-tools-section {
  margin-top: 8px;
}

.mcp-server-tools-button {
  font-size: 11px;
  padding: 2px 4px;
}

.mcp-server-tools-container {
  margin-top: 8px;
  padding: 8px;
  background-color: #f5f5f5;
  border-radius: 4px;
}

.mcp-server-tool-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 8px;
  padding: 4px 0;
}

.mcp-server-tool-info {
  flex: 1;
  margin-right: 8px;
}

.mcp-server-tool-name {
  font-weight: bold;
  font-size: 12px;
  margin-bottom: 2px;
}

.mcp-server-tool-description {
  font-size: 11px;
  color: #666;
  line-height: 1.3;
}

.mcp-server-card-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.mcp-server-card-actions > .bp3-switch {
  margin-bottom: 0;
}

.mcp-empty-state {
  text-align: center;
  padding: 20px;
}

.mcp-empty-state-icon {
  margin-bottom: 10px;
  opacity: 0.5;
}

.mcp-empty-state-text {
  margin: 0;
  color: #666;
}

.mcp-dialog {
  max-width: 900px;
  max-height: 85vh;
}

.mcp-dialog-content {
  padding: 20px;
}

.mcp-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 20px;
}

.mcp-collapsible-section {
  margin-top: 8px;
}

.mcp-collapsible-header {
  display: flex;
  align-items: center;
  cursor: pointer;
  /* padding: 8px 0; */
  margin-bottom: 5px;
}

.mcp-collapsible-header .bp3-icon-chevron-right {
  color: #888;
}

.mcp-collapsible-title {
  margin: 0;
  margin-left: 5px;
  font-size: 11px;
  font-weight: 700;
  color: #888;
}

.mcp-collapsible-content {
  padding: 6px;
  background-color: #f8f9fa;
  border-radius: 4px;
  border-left: 3px solid #137cbd;
}

.mcp-resource-item,
.mcp-prompt-item,
.mcp-tool-item {
  padding: 6px 8px;
  margin-bottom: 4px;
  background-color: white;
  border-radius: 3px;
  border: 1px solid #e1e8ed;
}

.mcp-tool-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.mcp-tool-info {
  flex: 1;
  margin-right: 8px;
}

.mcp-resource-name,
.mcp-prompt-name,
.mcp-tool-name {
  font-weight: 500;
  font-size: 12px;
  color: #182026;
}

.mcp-resource-description,
.mcp-prompt-description,
.mcp-tool-description {
  font-size: 11px;
  color: #5c7080;
  margin-top: 2px;
}

/* MCP Toaster Styles */
.mcp-toaster {
  z-index: 10000 !important;
}

.mcp-toaster .bp3-toast {
  max-width: 400px;
  font-size: 13px;
  z-index: 10001 !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.mcp-toaster .bp3-toast.bp3-intent-success {
  background-color: #0f9960;
  color: white;
}

.mcp-toaster .bp3-toast.bp3-intent-danger {
  background-color: #db3737;
  color: white;
}

.mcp-toaster .bp3-toast.bp3-intent-primary {
  background-color: #137cbd;
  color: white;
}

/* Ask Graph Dialog Styles */

/* Mode Dialog */
.laia-askgraph-mode-dialog {
  width: 500px;
  max-width: 90vw;
}

.laia-askgraph-mode-dialog-body {
  padding: 20px;
}

.laia-askgraph-user-query {
  margin-bottom: 15px;
  padding: 12px;
  border: 1px solid #e1e8ed;
  border-radius: 6px;
  font-size: 14px;
}

.laia-askgraph-current-mode {
  margin-bottom: 20px;
  color: #5c7080;
  font-size: 14px;
}

.laia-askgraph-mode-options {
  margin-bottom: 25px;
}

.laia-askgraph-mode-options-title {
  margin: 0 0 15px 0;
  font-size: 16px;
  font-weight: 600;
}

.laia-askgraph-mode-option {
  margin-bottom: 12px;
}

.laia-askgraph-mode-button {
  text-align: left;
  justify-content: flex-start;
  padding: 12px 16px;
  border: 1px solid #d3d8de;
  border-radius: 6px;
  transition: all 0.2s ease;
}

.laia-askgraph-mode-button:hover {
  border-color: #a7b6c2;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.laia-askgraph-mode-button-recommended {
  border-color: #137cbd;
  border-width: 2px;
}

.laia-askgraph-mode-icon {
  margin-right: 12px;
  flex-shrink: 0;
}

.laia-askgraph-mode-content {
  flex: 1;
}

.laia-askgraph-mode-title {
  font-size: 14px;
  margin-bottom: 4px;
}

.laia-askgraph-mode-description {
  font-size: 12px;
  opacity: 0.8;
  line-height: 1.4;
}

.laia-askgraph-remember-checkbox {
  margin-top: 20px;
  padding-top: 15px;
  border-top: 1px solid #e1e8ed;
}

/* First Time Dialog */
.laia-askgraph-firsttime-dialog-body {
  padding: 5px;
}

.laia-askgraph-firsttime-dialog {
  width: 600px;
  max-width: 90vw;
}

.laia-askgraph-firsttime-intro {
  margin-bottom: 20px;
  font-size: 14px;
  line-height: 1.5;
}

.laia-askgraph-firsttime-radio-group {
  margin-bottom: 15px;
}

.laia-askgraph-firsttime-radio-options {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.bp3-control:not(.bp3-align-right).laia-askgraph-firsttime-radio {
  padding-left: 35px;
}

.laia-askgraph-firsttime-radio {
  margin: 0;
  padding: 4px 6px;
  border: 1px solid #e1e8ed;
  border-radius: 6px;
  transition: border-color 0.2s ease;
}

.laia-askgraph-firsttime-radio:hover {
  border-color: #a7b6c2;
}

.laia-askgraph-firsttime-radio .bp3-control-indicator {
  margin-right: 10px;
}

.laia-askgraph-firsttime-radio .bp3-control-indicator:checked {
  border-color: #137cbd;
}

.laia-askgraph-firsttime-radio label {
  font-weight: 500;
  font-size: 14px;
}

.laia-askgraph-firsttime-mode-details {
  padding: 15px;
  border: 1px solid #d3d8de;
  border-radius: 8px;
  margin-bottom: 15px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.laia-askgraph-firsttime-mode-title {
  margin: 0 0 12px 0;
  font-size: 17px;
  font-weight: 600;
  color: #2c3e50;
}

.laia-askgraph-firsttime-mode-description {
  margin: 0 0 15px 0;
  font-size: 14px;
  line-height: 1.6;
  color: #34495e;
}

.laia-askgraph-firsttime-pros-cons {
  display: flex;
  gap: 24px;
}

.laia-askgraph-firsttime-pros,
.laia-askgraph-firsttime-cons {
  flex: 1;
  padding: 12px;
  border: 1px solid #e8ebed;
  border-radius: 6px;
}

.laia-askgraph-firsttime-pros {
  border-left: 3px solid #0f9960;
}

.laia-askgraph-firsttime-cons {
  border-left: 3px solid #d9822b;
}

.laia-askgraph-firsttime-pros-title {
  color: #0f9960;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 8px;
  display: block;
}

.laia-askgraph-firsttime-cons-title {
  color: #d9822b;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 8px;
  display: block;
}

.laia-askgraph-firsttime-pros-content,
.laia-askgraph-firsttime-cons-content {
  margin: 0;
  font-size: 12px;
  white-space: pre-wrap;
  font-family: inherit;
  line-height: 1.5;
  color: #5c7080;
}

.laia-askgraph-firsttime-note,
.laia-askgraph-firsttime-privacy {
  padding: 14px 16px;
  border: 1px solid #e8ebed;
  border-radius: 6px;
  font-size: 13px;
  margin-bottom: 10px;
  display: flex;
  align-items: flex-start;
  line-height: 1.5;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

.laia-askgraph-firsttime-note {
  border-left: 4px solid #d9822b;
}

.laia-askgraph-firsttime-privacy {
  border-left: 4px solid #137cbd;
  margin-bottom: 0;
}

.laia-askgraph-firsttime-note-icon,
.laia-askgraph-firsttime-privacy-icon {
  margin-right: 12px;
  margin-top: 2px;
  flex-shrink: 0;
  opacity: 0.8;
  min-width: 16px;
}

.laia-askgraph-firsttime-note strong,
.laia-askgraph-firsttime-privacy strong {
  margin-right: 4px;
}

.laia-askgraph-firsttime-dialog-footer {
  padding: 5px;
  border-top: 1px solid #e1e8ed;
}

.laia-askgraph-firsttime-proceed-button {
  min-width: 200px;
  font-size: 14px;
  font-weight: 600;
}

/* Container positioning for dialogs */
.askgraph-mode-dialog-container,
.askgraph-firsttime-dialog-container {
  z-index: 10000;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Ask Graph Mode Indicator */
.laia-askgraph-mode-indicator {
  display: inline-flex;
  align-items: center;
  margin-left: 8px;
  font-size: 11px;
}

.laia-askgraph-mode-indicator-icon-only {
  margin-left: 4px;
}

.laia-askgraph-mode-button {
  padding: 2px 6px;
  min-height: 20px;
  min-width: auto;
}

.laia-askgraph-mode-button-icon-only {
  padding: 2px;
  min-width: 20px;
}

.laia-askgraph-mode-span {
  display: flex;
  align-items: center;
  padding: 2px 4px;
}

.laia-askgraph-mode-span-icon-only {
  padding: 2px;
}

.laia-askgraph-mode-icon {
  margin-right: 3px;
}

.laia-askgraph-mode-icon-only {
  margin-right: 0;
}

.laia-askgraph-mode-text {
  font-size: 11px;
}

/* Mode-specific colors - use header icon color for consistency */
.laia-askgraph-mode-private,
.laia-askgraph-mode-balanced,
.laia-askgraph-mode-full,
.laia-askgraph-mode-default {
  color: var(--icon-color-top);
}

/* Icon colors should match other header icons */
.laia-askgraph-mode-indicator svg path {
  fill: var(--icon-color-top);
}

/* Optional: Subtle mode distinction through opacity when needed */
.laia-askgraph-mode-private {
  opacity: 0.8;
}

.laia-askgraph-mode-balanced {
  opacity: 0.9;
}

.laia-askgraph-mode-full {
  opacity: 1;
}

.laia-askgraph-mode-default {
  opacity: 0.7;
}

/* Full Results Popup Styles */
.full-results-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.full-results-header {
  background: inherit;
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 34px;
  padding-bottom: 6px;
  margin-bottom: 6px;
  border-bottom: 1px solid rgba(167, 182, 194, 0.4);
}

h3.full-results-title.bp3-heading {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.full-results-close-button {
  background: none;
  border: 1px solid rgba(167, 182, 194, 0.4);
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
  padding: 4px;
  width: 26px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #333;
  transition: all 0.2s ease;
}

.full-results-close-button:hover {
  background: #f5f5f5;
  border-color: #999;
}

.full-results-close-button:active {
  background: #e0e0e0;
}

.full-results-filters-and-sorts {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  row-gap: 6px;
}

.full-results-result-item {
  /* background: inherit; */
  background: var(--bc-app, white);
  margin-bottom: 8px;
  padding: 6px;
  border: 1px solid #ddd;
  border-radius: 4px;
  display: flex;
  align-items: flex-start;
  transition: all 0.3s ease;
}

/* Highlighting for referenced blocks from chat - smooth halo animation - Orange theme */
.full-results-result-item.highlighted-result {
  background: linear-gradient(135deg, #fff3e0, #ffe0b2) !important;
  border: 2px solid #f57c00 !important;
  animation: haloOrange 3s ease-in-out infinite;
}

/* Highlighting for referenced pages from chat - smooth halo animation - Blue theme */
.full-results-result-item.highlighted-page-result {
  background: linear-gradient(135deg, #e3f2fd, #bbdefb) !important;
  border: 2px solid #1976d2 !important;
  animation: haloBlue 3s ease-in-out infinite;
}

/* Smooth halo animation for highlighted results - Orange theme */
@keyframes haloOrange {
  0% {
    box-shadow:
      0 0 8px rgba(245, 124, 0, 0.3),
      0 0 16px rgba(245, 124, 0, 0.2),
      0 0 24px rgba(245, 124, 0, 0.1);
  }
  50% {
    box-shadow:
      0 0 16px rgba(245, 124, 0, 0.5),
      0 0 32px rgba(245, 124, 0, 0.3),
      0 0 48px rgba(245, 124, 0, 0.15);
  }
  100% {
    box-shadow:
      0 0 8px rgba(245, 124, 0, 0.3),
      0 0 16px rgba(245, 124, 0, 0.2),
      0 0 24px rgba(245, 124, 0, 0.1);
  }
}

/* Keep the old blue animation for backward compatibility */
@keyframes haloBlue {
  0% {
    box-shadow:
      0 0 8px rgba(25, 118, 210, 0.3),
      0 0 16px rgba(25, 118, 210, 0.2),
      0 0 24px rgba(25, 118, 210, 0.1);
  }
  50% {
    box-shadow:
      0 0 16px rgba(25, 118, 210, 0.5),
      0 0 32px rgba(25, 118, 210, 0.3),
      0 0 48px rgba(25, 118, 210, 0.15);
  }
  100% {
    box-shadow:
      0 0 8px rgba(25, 118, 210, 0.3),
      0 0 16px rgba(25, 118, 210, 0.2),
      0 0 24px rgba(25, 118, 210, 0.1);
  }
}

.full-results-result-item > .full-results-checkbox {
  margin-right: 10px;
  margin-top: 6px;
  cursor: pointer;
  z-index: 6;
}

.full-results-block-container {
  flex: 1;
}

.full-result-renderer {
  transform: translateX(-20px);
}

.full-result-renderer .flex-h-box {
  transform: translateX(15px);
}

.rm-api-render--page {
  margin-left: 8px;
}

.full-results-buttons-container {
  display: flex;
  gap: 8px;
}

.full-results-dropdown {
  position: relative;
  display: inline-flex;
}

.full-results-dropdown-toggle {
  background: #0066cc;
  color: white;
  border: none;
  border-left: 1px solid rgba(255, 255, 255, 0.3);
  padding: 6px 4px;
  cursor: pointer;
  font-size: 12px;
  border-radius: 0 4px 4px 0;
}

.full-results-dropdown-toggle:hover {
  background: #0052a3;
}

.full-results-dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  background: #0066cc;
  color: white;
  border: 1px solid rgba(167, 182, 194, 0.4);
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  z-index: 1000;
  min-width: 150px;
}

.full-results-dropdown-item {
  display: block;
  width: 100%;
  padding: 8px 12px;
  background: none;
  border: none;
  text-align: left;
  cursor: pointer;
  font-size: 12px;
  color: white;
}

.full-results-dropdown-item:hover {
  background: #f5f5f5;
}

.full-results-button {
  border: none;
  padding: 6px 12px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
}

.full-results-button-primary {
  background: #0066cc;
  color: white;
  border-radius: 4px 0 0 4px;
}

.full-results-button-primary:hover {
  background: #0052a3;
}

.full-results-button-secondary {
  background: #999;
  color: white;
}

.full-results-button-secondary:hover {
  background: #777;
}

.full-results-select-all-checkbox {
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: 12px;
  color: #24292e;
  gap: 6px;
  margin-top: 6px;
}
.full-results-select-all-checkbox > input[type="checkbox"] {
  margin: 0;
}

/* Blueprint dropdown popover styling */
.full-results-dropdown-popover {
  z-index: 1002 !important; /* Above fullscreen modal (1001) */
}

.full-results-dropdown-popover .bp3-menu {
  min-width: 150px;
}

/* Ensure popovers from full-results buttons appear above fullscreen mode */
.full-results-modal .bp3-popover-target + .bp3-overlay .bp3-popover {
  z-index: 1002 !important;
}

/* Ensure Blueprint popovers appear above modal overlay */
/* .bp3-popover2 {
  z-index: 10000 !important;
}

.bp3-overlay {
  z-index: 10000 !important;
} */

/* Simple custom dropdown styling */
.full-results-simple-dropdown {
  position: relative;
  display: inline-flex;
}

.full-results-simple-dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  background: inherit;
  border: inherit;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  z-index: 1000;
  min-width: 150px;
  max-width: 200px;
}

.full-results-simple-dropdown-item {
  display: block;
  width: 100%;
  padding: 8px 12px;
  border: none;
  background: none;
  text-align: left;
  cursor: pointer;
  font-size: 14px;
  color: inherit;
  line-height: 1.28571;
  font-family:
    -apple-system, "BlinkMacSystemFont", "Segoe UI", "Roboto", "Oxygen",
    "Ubuntu", "Cantarell", "Open Sans", "Helvetica Neue", "Icons16", sans-serif;
  transition: background-color 0.1s cubic-bezier(0.4, 1, 0.75, 0.9);
}

.full-results-simple-dropdown-item:hover {
  background: rgba(167, 182, 194, 0.3);
  color: inherit;
}

.full-results-simple-dropdown-item:active {
  background: rgba(167, 182, 194, 0.5);
}

.full-results-simple-dropdown-item:first-child {
  border-radius: 4px 4px 0 0;
}

.full-results-simple-dropdown-item:last-child {
  border-radius: 0 0 4px 4px;
}

/* Enhanced Full Results Popup Styles - Phase 6 */

/* Enhanced Controls Section */
.full-results-controls {
  /* background: #f8f9fa; */
  background: inherit;
  border: 1px solid rgba(167, 182, 194, 0.4);
  border-radius: 6px;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex-shrink: 0; /* Don't shrink the controls */
}

.full-results-search-filters {
  flex: 1;
  display: flex;
  align-items: center;
  min-width: 300px;
}

.full-results-search-input {
  flex: 1;
  width: 100%;
}

.full-results-page-filter {
  min-width: 150px;
}

.full-results-sort-controls {
  display: flex;
  gap: 8px;
  align-items: center;
  min-width: 250px;
  flex-wrap: wrap;
}

.full-results-sort-select {
  min-width: 120px;
}

.full-results-metadata-toggle {
  margin: 0 !important;
  font-size: 13px;
}

.full-results-paths-toggle {
  z-index: 6px;
  margin: 0;
}

.full-results-pagination-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  color: #6c757d;
  padding-top: 8px;
  border-top: 1px solid rgba(167, 182, 194, 0.4);
}

.full-results-selection-info {
  color: #0d6efd;
  font-weight: 500;
}

/* Enhanced Results List */
.full-results-list {
  border: 1px solid rgba(167, 182, 194, 0.4);
  border-radius: 6px;
  background: inherit;
}

.full-results-result-item {
  margin: 0;
  border: none;
  border-bottom: 1px solid rgba(167, 182, 194, 0.4);
  border-radius: 0;
  padding: 12px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  transition: border 0.15s ease;
}

.full-results-result-item:hover {
  /* border: 3px solid rgba(167, 182, 194, 0.2);*/
  box-shadow: inset 0px 0px 5px 2px rgba(167, 182, 194, 0.35);
}

.full-results-result-item:last-child {
  border-bottom: none;
}

.full-results-result-item > .full-results-checkbox {
  margin: 0;
  margin-top: 4px;
  cursor: pointer;
  flex-shrink: 0;
}

.full-results-block-container {
  flex: 1;
  min-width: 0; /* Allow flex item to shrink */
}

/* Result Metadata */
.full-results-metadata {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 8px;
  font-size: 10px;
  color: #6c757d;
}

.full-results-page-info {
  background: #e3f2fd;
  color: #1565c0;
  padding: 2px 6px;
  border-radius: 12px;
  font-weight: 500;
}

.full-results-date-info {
  background: #f3e5f5;
  color: #7b1fa2;
  padding: 2px 6px;
  border-radius: 12px;
}

.full-results-count-info {
  background: #fff3e0;
  color: #ef6c00;
  padding: 2px 6px;
  border-radius: 12px;
  font-weight: 500;
}

.full-results-uid-info {
  background: #e8f5e8;
  color: #2e7d32;
  padding: 2px 6px;
  border-radius: 12px;
  font-family: monospace;
}

/* Pagination */
.full-results-pagination {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 16px 0;
  padding: 12px 16px;
  background: inherit;
  border: 1px solid rgba(167, 182, 194, 0.4);
  border-radius: 6px;
}

.full-results-pagination-controls {
  display: flex;
  align-items: center;
  gap: 12px;
}

.full-results-page-info {
  font-size: 14px;
  color: #495057;
  font-weight: 500;
  margin: 0 12px;
}

.full-results-per-page {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #6c757d;
}

.full-results-per-page label {
  margin: 0;
}

/* Clickable Metadata Styles */
.clickable {
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    color 0.2s ease;
  border-radius: 3px;
  padding: 2px 4px;
}

.clickable:hover {
  background-color: #e3f2fd;
  color: #1976d2;
  transform: translateY(-1px);
}

.clickable:active {
  transform: translateY(0);
  background-color: #bbdefb;
}

.full-results-page-info.clickable::after {
  content: " 📋";
  opacity: 0;
  transition: opacity 0.2s ease;
}

.full-results-page-info.clickable:hover::after {
  opacity: 1;
}

.full-results-uid-info.clickable::after {
  content: " 📋";
  opacity: 0;
  transition: opacity 0.2s ease;
}

.full-results-uid-info.clickable:hover::after {
  opacity: 1;
}

/* Search Highlighting Styles */
.search-highlight {
  background-color: #ffeb3b;
  color: #333;
  padding: 1px 2px;
  border-radius: 2px;
  font-weight: bold;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.search-highlight:not(:last-child) {
  margin-right: 2px;
}

/* Roam-Style References Filter */
.roam-references-filter {
  margin-bottom: 16px;
  font-family:
    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.references-search {
  margin-bottom: 12px;
}

.filter-section {
  margin-bottom: 16px;
  border: 1px solid #e0e6ed;
  border-radius: 3px;
  background: #fafbfc;
}

.section-header {
  padding: 8px 12px;
  border-bottom: 1px solid #e0e6ed;
  background: #f5f6f7;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 13px;
}

.section-title {
  font-weight: 600;
  color: #182026;
}

.section-subtitle {
  color: #5c7080;
  font-size: 11px;
  font-style: italic;
}

.clear-button {
  margin-left: auto;
}

.references-list {
  padding: 0;
}

.references-group {
  margin-bottom: 12px;
}

.references-group:last-child {
  margin-bottom: 0;
}

.group-title {
  font-size: 12px;
  font-weight: 600;
  color: #5c7080;
  padding: 8px 12px 4px 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.reference-item {
  display: flex;
  align-items: center;
  padding: 6px 12px;
  cursor: pointer;
  border-bottom: 1px solid #f0f1f2;
  transition: background-color 0.15s ease;
  user-select: none;
}

.reference-item:last-child {
  border-bottom: none;
}

.reference-item:hover {
  background-color: #ebf1f5;
}

.reference-item.included {
  background-color: #e8f4f0;
  border-left: 3px solid #0f9960;
}

.reference-item.included:hover {
  background-color: #d1ede4;
}

.reference-item.excluded {
  background-color: #f5e8e8;
  border-left: 3px solid #db3737;
}

.reference-item.excluded:hover {
  background-color: #ebdada;
}

.reference-item.active {
  font-weight: 500;
}

.reference-icon {
  margin-right: 8px;
  font-size: 12px;
  opacity: 0.7;
}

.reference-title {
  flex: 1;
  font-size: 13px;
  color: #182026;
}

.reference-count {
  font-size: 11px;
  color: #5c7080;
  background: rgba(92, 112, 128, 0.1);
  padding: 2px 6px;
  border-radius: 9px;
  font-weight: 500;
  min-width: 20px;
  text-align: center;
}

.reference-item.included .reference-count {
  background: rgba(15, 153, 96, 0.2);
  color: #0f9960;
}

.reference-item.excluded .reference-count {
  background: rgba(219, 55, 55, 0.2);
  color: #db3737;
}

.no-references {
  padding: 16px 12px;
  text-align: center;
  color: #5c7080;
  font-style: italic;
  font-size: 12px;
}

/* References Filter Popover Styles */
.references-filter-portal {
  z-index: 2000000 !important; /* Much higher than full-results modal */
}

.references-filter-portal .bp3-popover {
  z-index: 2000001 !important;
  max-height: 500px;
  overflow: hidden;
}

.references-filter-portal .bp3-popover-content {
  z-index: 2000002 !important;
}

.roam-references-filter-popover {
  width: 350px;
  max-height: 450px;
  padding: 12px;
  overflow-y: auto;
  font-family:
    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
}

.references-filter-trigger {
  margin-left: -2px;
}

.references-filter-trigger.active {
  background-color: #e1f5fe;
  color: #0277bd;
}

.references-filter-trigger.active:hover {
  background-color: #b3e5fc;
}

/* Fixed Filters Section - Always Visible */
.active-filters-section {
  margin-bottom: 16px;
  padding-bottom: 12px;
  display: flex;
  gap: 24px;
}

.filter-group {
  flex: 1;
  margin-bottom: 0;
}

.filter-label {
  font-weight: 600;
  font-size: 11px;
  color: #394b59;
  margin-bottom: 4px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.filter-hint {
  font-weight: 400;
  color: #8a9ba8;
  font-size: 10px;
}

.filter-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}

/* Reference Button Styles (Native Roam Style) */
.reference-button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  border: 1px solid #d3dce6;
  border-radius: 3px;
  background: #ffffff;
  color: #394b59;
  font-size: 12px;
  font-weight: 400;
  cursor: pointer;
  transition: all 0.1s ease;
  white-space: nowrap;
  font-family: inherit;
}

.reference-button:hover {
  background: #f7f9fb;
  border-color: #c1ccd7;
}

.reference-button.included {
  background: #e8f5e8;
  color: #2d5016;
  border-color: #a7d18a;
}

.reference-button.included:hover {
  background: #d4e7d4;
  border-color: #8bc167;
}

.reference-button.excluded {
  background: #fceaea;
  color: #a94442;
  border-color: #ebccd1;
}

.reference-button.excluded:hover {
  background: #f2dede;
  border-color: #d6b8b8;
}

.reference-button.active {
  font-weight: 500;
}

/* Daily Notes Button Special Styling */
.reference-button.daily-notes-button {
  font-weight: 500;
}

.reference-button.daily-notes-button .bp3-icon {
  margin-right: 2px;
}

/* Reference Title and Count */
.reference-title {
  flex: 1;
}

.reference-count {
  font-size: 9px;
  font-weight: 500;
  background: #e1e8ed;
  color: #738694;
  padding: 1px 3px;
  border-radius: 2px;
  margin-left: 4px;
  min-width: 12px;
  text-align: center;
}

.reference-button.included .reference-count {
  background: rgba(45, 80, 22, 0.2);
  color: #2d5016;
}

.reference-button.excluded .reference-count {
  background: rgba(169, 68, 66, 0.2);
  color: #a94442;
}

/* References Buttons Container */
.references-buttons-container {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

/* Search Input Styling */
.roam-references-filter-popover .references-search {
  margin-bottom: 12px;
}

.roam-references-filter-popover .references-search input {
  font-size: 13px;
}

/* No References Message */
.no-references {
  color: #8a9ba8;
  font-style: italic;
  text-align: center;
  padding: 16px;
  font-size: 12px;
}

/* Filter Instructions */
.filter-instructions {
  margin-top: 12px;
  padding-top: 8px;
  border-top: 1px solid #e0e6ed;
  color: #8a9ba8;
  font-size: 11px;
  text-align: center;
  font-style: italic;
}

/* Additional z-index overrides for the popover */
/* .bp3-portal .bp3-popover.references-filter-popover-container {
  z-index: 2000003 !important;
}

.bp3-portal .bp3-popover-content {
  z-index: 2000004 !important;
} */

/* Target any Blueprint popover that contains our filter content */
/* .bp3-popover:has(.roam-references-filter-popover) {
  z-index: 2000005 !important;
} */

/* Fallback for browsers that don't support :has() */
/* .bp3-popover[data-popover-content*="roam-references-filter"] {
  z-index: 2000005 !important;
} */

/* Target the specific popover overlay class */
/* .references-filter-popover-overlay {
  z-index: 2000010 !important;
}

.references-filter-popover-overlay .bp3-popover-content {
  z-index: 2000011 !important;
} */

/* Global override for any Blueprint popover in portal */
/* body > .bp3-portal > .bp3-popover {
  z-index: 2000012 !important;
} */

/* Fix overflow issue - allow popover to show outside modal bounds */
.full-results-modal:has(.references-filter-trigger) {
  overflow: visible !important;
}

/* Fallback for browsers that don't support :has() */
.full-results-modal.references-filter-active {
  overflow: visible !important;
}

/* Also fix the main content container */
.full-results-main-content:has(.references-filter-trigger) {
  overflow: visible !important;
}

.full-results-controls:has(.references-filter-trigger) {
  overflow: visible !important;
}

.full-results-search-filters:has(.references-filter-trigger) {
  overflow: visible !important;
}

/* Compact Pagination Styles */
.full-results-pagination-compact {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: 16px;
  padding-left: 16px;
  border-left: 1px solid #e9ecef;
}

.full-results-page-info-compact {
  font-size: 13px;
  color: #5c7080;
  min-width: 40px;
  text-align: center;
}

.full-results-per-page-compact {
  min-width: 50px;
  font-size: 12px;
}

.full-results-per-page-compact .bp3-html-select select {
  font-size: 12px;
  padding: 2px 20px 2px 6px;
  min-height: 24px;
}

/* Responsive adjustments for compact pagination */
@media (max-width: 768px) {
  .full-results-pagination-compact {
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    margin-left: 0;
    padding-left: 0;
    border-left: none;
    padding-top: 8px;
    border-top: 1px solid #e9ecef;
  }

  .full-results-page-info-compact {
    text-align: left;
  }
}

/* Enhanced Action Bar - Fixed at bottom of results panel */
.full-results-action-bar {
  position: relative;
  width: 100%;
  gap: 8px;
  margin-left: 0px;
  padding: 4px 6px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid rgba(167, 182, 194, 0.3);
  margin-bottom: 6px;
  border-radius: 0;
  flex-wrap: wrap;
  flex-shrink: 0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  z-index: 5;
}

.full-results-selection-controls {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-wrap: wrap;
}

.full-results-select-all-checkbox {
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: 13px;
  color: #495057;
  gap: 6px;
  margin: 0;
  font-weight: 500;
}

.full-results-select-all-checkbox > input[type="checkbox"] {
  margin: 0;
}

.full-results-select-all-checkbox.bp3-control .bp3-control-indicator {
  margin-right: 5px;
}

.full-results-buttons-container {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* No Results Messages */
.full-results-no-results {
  text-align: center;
  padding: 40px 20px;
  color: #6c757d;
  font-style: italic;
  background: #f8f9fab0;
  border-radius: 6px;
  margin: 16px 0;
}

/* Page Metadata View Styles */
.full-results-page-metadata-view {
  margin-left: 8px;
  background: inherit;
}

.full-results-page-title {
  font-weight: 600;
  color: #212529;
}

.full-results-page-title h3.rm-page__title {
  font-size: 20px;
  padding-bottom: 6px;
}

.full-results-page-title .rm-embed-container {
  margin-right: 0px;
}

.full-results-page-title .rm-embed__content {
  font-weight: initial;
}

.full-results-page-count {
  font-size: 13px;
  color: #6c757d;
  margin-bottom: 4px;
}

.full-results-page-uid {
  font-size: 11px;
  color: #868e96;
  font-family: monospace;
  background: #e9ecef;
  padding: 2px 6px;
  border-radius: 3px;
  display: inline-block;
}

.full-results-page-date {
  font-size: 12px;
  color: #6c757d;
  margin-top: 4px;
}

.full-results-page-info {
  font-size: 12px;
  color: #6c757d;
  /* margin-top: 4px; */
  display: flex;
  align-items: center;
  gap: 4px;
}

.full-results-page-tags {
  font-size: 12px;
  color: #495057;
  margin-top: 4px;
  font-style: italic;
}

/* Enhanced Type Badges */
.full-results-type-badge {
  padding: 3px 8px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.full-results-type-badge.page {
  background: #e3f2fd;
  color: #1565c0;
}

.full-results-type-badge.block {
  background: #fff3e0;
  color: #ef6c00;
}

/* View Mode Controls */
.full-results-view-mode-select,
.full-results-page-display-select {
  min-width: 120px;
  font-size: 13px;
}

/* Enhanced Sort Controls Layout */
.full-results-sort-controls {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.full-results-sort-controls > * {
  flex-shrink: 0;
}

/* Chat Interface Styles - Modern Redesign */

.full-results-chat-header {
  padding: 8px;
  border-bottom: 1px solid rgba(167, 182, 194, 0.15);
  background: rgba(158, 158, 158, 0.1);
  /* background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.8),
    rgba(247, 249, 250, 0.5)
  ); */
  backdrop-filter: blur(10px);
}

.full-results-chat-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.full-results-chat-info-text {
  display: flex;
  align-items: center;
  font-size: 13px;
  color: #5c7080;
  flex: 1;
  min-width: 0;
}

.full-results-chat-info-text span {
  flex: 1;
  min-width: 0;
}

.full-results-chat-header-controls {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-shrink: 0;
}

.full-results-chat-header-controls .bp3-button {
  opacity: 0.6;
  transition:
    opacity 0.2s ease,
    transform 0.2s ease;
}

.full-results-chat-header-controls .bp3-button:hover {
  opacity: 1;
  transform: scale(1.1);
}

.full-results-chat-warning {
  font-size: 12px;
  color: #dc3545;
  background: rgba(220, 53, 69, 0.1);
  padding: 4px 8px;
  border-radius: 4px;
  border: 1px solid rgba(167, 182, 194, 0.4);
}

/* Modern Welcome Message */
.full-results-chat-welcome {
  display: flex;
  /* gap: 8px; */
  margin-bottom: 20px;
  padding: 8px;
}

.full-results-chat-assistant-avatar {
  font-size: 32px;
  flex-shrink: 0;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

.full-results-chat-assistant-message,
.full-results-chat-message.assistant .full-results-chat-text {
  background: var(--bc-main, rgba(255, 255, 255, 0.5));
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(167, 182, 194, 0.2);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  flex: 1;
}

.full-results-chat-text.chat-query-content .rm-query.rm-full-width {
  max-width: 100%;
}

/* Help message styling */
.full-results-chat-help-avatar {
  font-size: 32px;
  margin-right: 8px;
  flex-shrink: 0;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

.full-results-chat-assistant-message.chat-help {
  background: var(--bc-main, rgba(255, 255, 255, 0.5));
  opacity: 1;
  border: 1px dashed #9e9e9e;
  box-shadow: 0 2px 6px #9e9e9e;
}
.full-results-chat-assistant-message.chat-help .full-results-chat-suggestions {
  padding-top: 0;
}

/* If Blueprint extension is enabled... */
html.has-blueprint-extension .full-results-chat-assistant-message,
html.has-blueprint-extension .assistant .full-results-chat-text,
html.has-blueprint-extension .full-results-chat-assistant-message.chat-help {
  background: rgb(138 155 168 / 10%);
}

/* Modern Suggestion Pills */
.full-results-chat-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 0 4px 0;
}

.full-results-chat-suggestions button {
  background: linear-gradient(
    135deg,
    rgba(102, 126, 234, 0.1) 0%,
    rgba(118, 75, 162, 0.1) 100%
  );
  border: 1px solid rgba(102, 126, 234, 0.3);
  color: #667eea;
  padding: 8px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  text-align: left;
  transition: all 0.2s ease;
  box-shadow: 0 2px 4px rgba(102, 126, 234, 0.1);
}

.full-results-chat-suggestions button:hover {
  background: linear-gradient(
    135deg,
    rgba(102, 126, 234, 0.15) 0%,
    rgba(118, 75, 162, 0.15) 100%
  );
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(102, 126, 234, 0.2);
  border-color: rgba(102, 126, 234, 0.5);
}

/* "What's New" button highlight for unseen updates */
.full-results-chat-suggestions button.whats-new-unseen {
  position: relative;
  background: linear-gradient(
    135deg,
    rgba(255, 165, 0, 0.15) 0%,
    rgba(255, 100, 50, 0.15) 100%
  );
  border-color: rgba(255, 165, 0, 0.6);
  color: #e08a00;
  font-weight: 600;
  animation: whatsNewPulse 2s ease-in-out infinite;
}

.full-results-chat-suggestions button.whats-new-unseen:hover {
  background: linear-gradient(
    135deg,
    rgba(255, 165, 0, 0.25) 0%,
    rgba(255, 100, 50, 0.25) 100%
  );
  border-color: rgba(255, 165, 0, 0.8);
  box-shadow: 0 4px 12px rgba(255, 165, 0, 0.3);
}

.whats-new-badge {
  display: inline-block;
  width: 8px;
  height: 8px;
  background: #ff6a00;
  border-radius: 50%;
  margin-left: 6px;
  vertical-align: middle;
  box-shadow: 0 0 6px rgba(255, 106, 0, 0.6);
}

@keyframes whatsNewPulse {
  0%, 100% {
    box-shadow: 0 2px 4px rgba(255, 165, 0, 0.15);
  }
  50% {
    box-shadow: 0 2px 12px rgba(255, 165, 0, 0.35);
  }
}

.full-results-chat-feature-hint {
  margin-top: 6px;
}

/* Modern Chat Messages */
.full-results-chat-message {
  display: flex;
  gap: 0;
  margin-bottom: 4px;
  align-items: flex-start;
  animation: slideIn 0.3s ease-out;
}

@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.full-results-chat-message.user {
  flex-direction: row-reverse;
}

/* Avatars - Hidden permanently for cleaner interface */
.full-results-chat-avatar {
  display: none !important;
}

.full-results-chat-assistant-avatar {
  display: none !important;
}

.full-results-chat-content {
  max-width: 85%;
  word-wrap: break-word;
}
.full-results-chat-content ul {
  padding-inline-start: 25px;
}

/* Modern Chat Bubbles */
.full-results-chat-text {
  /* background: var(--bc-main, rgba(255, 255, 255, 0.5)); */
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(167, 182, 194, 0.2);
  font-size: 14px;
  line-height: 1.65;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.2s ease;
}

/* If Blueprint extension is enabled... */
/* html:has(head style#blueprint-css)
  .full-results-chat-assistant-message
  .full-results-chat-text {
  background: rgb(138 155 168 / 10%);
} */

.full-results-chat-text:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.full-results-chat-message.user .full-results-chat-text {
  background: #607d8b;
  color: white;
  border: none;
}

/* Enhanced typography for chat text */
.full-results-chat-text p {
  margin: 0 0 12px 0;
}

.full-results-chat-text p:last-child {
  margin-bottom: 0;
}

.full-results-chat-text h2 {
  font-size: 18px;
  font-weight: 600;
  margin: 16px 0 8px 0;
  color: #2c3e50;
}

.full-results-chat-text h3 {
  font-size: 16px;
  font-weight: 600;
  margin: 12px 0 6px 0;
  color: #34495e;
}

.full-results-chat-text h4 {
  font-size: 15px;
  font-weight: 600;
  margin: 10px 0 5px 0;
  color: #495057;
}

.full-results-chat-text strong {
  font-weight: 700;
  /* color: #2c3e50; */
}

.full-results-chat-text ul,
.full-results-chat-text ol {
  margin: 8px 0;
  padding-left: 20px;
}

.full-results-chat-text li {
  margin-bottom: 4px;
  padding-bottom: 0;
  line-height: 1.5;
}

.full-results-chat-text ol li {
  padding-bottom: 0;
}

.full-results-chat-text h5 {
  font-size: 14px;
  font-weight: 600;
  margin: 8px 0 4px 0;
  color: #5a6c7d;
}

.full-results-chat-text h6 {
  font-size: 13px;
  font-weight: 600;
  margin: 6px 0 4px 0;
  color: #6c757d;
}

.full-results-chat-text br {
  margin-bottom: 4px;
}

/* Code blocks in chat messages */
.full-results-chat-text .chat-code-block-wrapper {
  position: relative;
  margin: 10px 0;
}

.full-results-chat-text .chat-code-block-wrapper pre {
  margin: 0;
  padding: 10px 12px 34px 12px;
  border-radius: 8px;
  background: rgba(40, 44, 52, 0.92);
  color: #f5f8fa;
  overflow-x: auto;
}

.full-results-chat-text .chat-code-block-wrapper code {
  color: inherit;
  background: transparent;
  white-space: pre;
}

.full-results-chat-text .chat-code-buttons {
  position: absolute;
  right: 8px;
  bottom: 8px;
  display: flex;
  gap: 4px;
}

.full-results-chat-text .chat-code-copy-button {
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.4);
  color: #f5f8fa;
  font-size: 11px;
  line-height: 1;
  padding: 4px 8px;
  cursor: pointer;
}

.full-results-chat-text .chat-code-copy-button:hover {
  background: rgba(0, 0, 0, 0.6);
}

/* Markdown table styling */
.full-results-chat-text table.markdown-table {
  width: 100%;
  border-collapse: collapse;
  margin: 12px 0;
  font-size: 13px;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  overflow: hidden;
}

.full-results-chat-text table.markdown-table thead {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
}

.full-results-chat-text table.markdown-table th {
  padding: 10px 12px;
  font-weight: 600;
  text-align: left;
  border-bottom: 2px solid #dee2e6;
}

.full-results-chat-text table.markdown-table td {
  padding: 8px 12px;
  border-bottom: 1px solid #e9ecef;
  color: black;
}

.full-results-chat-text table.markdown-table tbody tr:nth-child(odd) {
  background-color: #f8f9fa;
}

.full-results-chat-text table.markdown-table tbody tr:nth-child(even) {
  background-color: #ffffff;
}

.full-results-chat-text table.markdown-table tbody tr:hover {
  background-color: #e7f1ff;
  transition: background-color 0.2s ease;
}

/* Roam embed links styling */
.full-results-chat-text .roam-embed-link {
  color: #0d6efd;
  text-decoration: none;
  font-weight: 500;
  padding: 2px 4px;
  border-radius: 3px;
  background: rgba(13, 110, 253, 0.1);
  transition: background-color 0.15s ease;
}

.full-results-chat-text .roam-embed-link:hover {
  background: rgba(13, 110, 253, 0.2);
  text-decoration: none;
}

.full-results-chat-text .roam-block-ref {
  color: #6c757d;
  text-decoration: none;
  font-family: monospace;
  font-size: 12px;
  padding: 1px 3px;
  border-radius: 3px;
  background: rgba(108, 117, 125, 0.1);
  transition: background-color 0.15s ease;
}

.full-results-chat-text .roam-block-ref:hover {
  background: rgba(108, 117, 125, 0.2);
  text-decoration: none;
}

/* Enhanced block reference links for chat navigation - Orange theme */
.full-results-chat-text .roam-block-ref-chat {
  color: #fd7e14;
  text-decoration: none;
  padding: 2px 4px;
  border-radius: 4px;
  background: rgba(253, 126, 20, 0.1);
  transition: all 0.2s ease;
  cursor: pointer;
  border: 1px solid rgba(253, 126, 20, 0.2);
}

.full-results-chat-text .roam-block-ref-chat:hover {
  background: rgba(253, 126, 20, 0.15);
  border-color: rgba(253, 126, 20, 0.4);
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(253, 126, 20, 0.2);
}

/* Page reference and tag reference links styling - Blue theme */
.full-results-chat-text .roam-page-ref-chat,
.full-results-chat-text .roam-tag-ref-chat {
  color: #0d6efd;
  text-decoration: none;
  font-weight: 500;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(13, 110, 253, 0.1);
  transition: all 0.2s ease;
  cursor: pointer;
  border: 1px solid rgba(13, 110, 253, 0.2);
}

.full-results-chat-text .roam-page-ref-chat:hover,
.full-results-chat-text .roam-tag-ref-chat:hover {
  background: rgba(13, 110, 253, 0.15);
  border-color: rgba(13, 110, 253, 0.4);
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(13, 110, 253, 0.2);
}

.full-results-chat-message.user .full-results-chat-text {
  background: #607d8b;
  color: white;
  border-color: #0d6efd;
}

.full-results-chat-message-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 3px;
}

.full-results-chat-timestamp {
  font-size: 11px;
  color: #6c757d;
}

.full-results-chat-tokens {
  font-size: 10px;
  color: #8a939b;
  opacity: 0.8;
}

.full-results-chat-total-tokens {
  font-size: 11px;
  color: inherit;
  opacity: 0.7;
  font-weight: 500;
}

.full-results-chat-expansion-badge {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 4px 8px;
  border-radius: 12px;
  background: rgba(102, 126, 234, 0.1);
  color: #667eea;
  font-size: 11px;
  font-weight: 500;
  border: 1px solid rgba(102, 126, 234, 0.2);
  cursor: help;
  transition: all 0.2s ease;
}

.full-results-chat-expansion-badge:hover {
  background: rgba(102, 126, 234, 0.15);
  border-color: rgba(102, 126, 234, 0.3);
}

.full-results-chat-copy-link {
  font-size: 11px;
  color: #6c757d;
  cursor: pointer;
  text-decoration: none;
  opacity: 0.3;
  transition: opacity 0.2s ease;
  transform: translateY(-5px);
}

.full-results-chat-copy-link .bp3-button {
  min-width: 16px;
  min-height: 16px;
  padding: 2px;
}

.full-results-chat-copy-link:hover {
  opacity: 1;
  text-decoration: underline;
}

.full-results-chat-message.user .full-results-chat-message-footer {
  flex-direction: row-reverse;
}

/* User message action menu */
.full-results-chat-user-actions {
  opacity: 0;
  transition: opacity 0.2s ease;
}

.full-results-chat-message.user:hover .full-results-chat-user-actions {
  opacity: 0.7;
}

.full-results-chat-user-actions:hover {
  opacity: 1 !important;
}

/* Edit mode styles */
.full-results-chat-message.editing {
  background: rgba(253, 126, 20, 0.05);
  border-radius: 12px;
  padding: 8px;
  margin: -8px;
}

.chat-message-edit-wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.chat-message-edit-container {
  background: var(--bc-main, white);
  border: 2px solid #fd7e14;
  border-radius: 8px;
  padding: 12px;
  min-height: 60px;
  box-shadow: 0 2px 8px rgba(253, 126, 20, 0.2);
}

/* Style the Roam block editor inside the edit container */
.chat-message-edit-container .rm-block-main,
.chat-message-edit-container .rm-block-input {
  font-size: 14px;
  line-height: 1.5;
}

.chat-message-edit-container .rm-zoom {
  padding: 0;
  margin: 0;
}

.chat-message-edit-container .rm-zoom-item {
  padding-left: 0;
}

.chat-message-edit-container .rm-block-children {
  margin-left: 16px;
}

.chat-message-edit-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding-top: 4px;
}

.chat-message-edit-actions .bp3-button {
  min-width: 70px;
}

.chat-message-edit-error {
  color: #dc3545;
  padding: 12px;
  text-align: center;
  font-style: italic;
}

.full-results-chat-typing {
  background: #f8f9fa;
  padding: 8px 12px;
  border-radius: 12px;
  border: 1px solid #e9ecef;
  font-size: 14px;
  font-style: italic;
  color: #6c757d;
}

.full-results-chat-tool-history {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
}

.full-results-chat-tool-usage-item {
  background: #f8f9fa;
  padding: 8px 12px;
  border-radius: 8px;
  border-left: 3px solid #0066cc;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.full-results-chat-tool-name {
  font-weight: 600;
  font-style: normal;
  color: #495057;
  font-size: 13px;
}

.full-results-chat-tool-details {
  font-style: italic;
  color: #6c757d;
  font-size: 12px;
  line-height: 1.4;
}

/* Scrollable markdown content box for create_block/create_page tools */
.full-results-chat-tool-details .tool-markdown-content {
  font-style: normal;
  background: #f0f0f0;
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 8px;
  margin-top: 4px;
  max-height: 30vh;
  overflow-y: auto;
  /* white-space: pre-wrap; */
  font-family: monospace;
  font-size: 11px;
}

.full-results-chat-tool-details .tool-markdown-content ul {
  margin-bottom: 0;
}

/* Insertion context showing where content will be placed */
.full-results-chat-tool-details .tool-insertion-context {
  background: #f8f9fa;
  border: 1px dashed #ccc;
  border-radius: 4px;
  padding: 6px 8px;
  margin: 6px 0;
  font-size: 11px;
}

.full-results-chat-tool-details .tool-sibling {
  color: #6c757d;
  font-style: italic;
  padding: 2px 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.full-results-chat-tool-details .tool-sibling.above {
  border-bottom: 1px dotted #ddd;
  padding-bottom: 4px;
  margin-bottom: 4px;
}

.full-results-chat-tool-details .tool-sibling.below {
  border-top: 1px dotted #ddd;
  padding-top: 4px;
  margin-top: 4px;
}

.full-results-chat-tool-details .tool-insertion-marker {
  color: #28a745;
  font-weight: 500;
  padding: 3px 0;
}

/* Outline preview showing existing content + insertion point */
.full-results-chat-tool-details .tool-outline-preview {
  font-style: normal;
  font-family: monospace;
  font-size: 11px;
  line-height: 1.5;
  white-space: pre-wrap;
}

.full-results-chat-tool-details .tool-outline-preview .existing-content {
  color: #6c757d;
  opacity: 0.8;
}

.full-results-chat-tool-response {
  font-size: 12px;
}

/* ========================================
   Vector Search Results Display
   ======================================== */

.vs-results-container {
  margin-top: 6px;
  border-radius: 8px;
}

.vs-results-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 10px;
  background: #f0f4f8;
  border-bottom: 1px solid #dce4ec;
  font-size: 12px;
}

.vs-results-summary {
  font-weight: 600;
  color: #394b59;
}

.vs-results-time {
  margin-left: 6px;
  color: #8a9ba8;
  font-weight: 400;
}

.vs-add-all-btn,
.vs-add-btn,
.vs-expand-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border: 1px solid #d8e1e8;
  border-radius: 4px;
  background: #fff;
  color: #394b59;
  font-size: 11px;
  cursor: pointer;
  transition: all 0.15s ease;
}

.vs-add-all-btn:hover:not(:disabled),
.vs-add-btn:hover:not(:disabled) {
  background: #e1f0ff;
  border-color: #4a90d9;
  color: #2b6cb0;
}

.vs-expand-btn:hover {
  background: #f0f4f8;
}

.vs-add-all-btn.vs-added,
.vs-add-btn.vs-added {
  background: #e6f4ea;
  border-color: #a8d5b8;
  color: #1e7e34;
  cursor: default;
}

.vs-add-all-btn:disabled,
.vs-add-btn:disabled {
  opacity: 0.7;
}

.vs-results-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 6px;
}

.vs-result-card {
  border: 1px solid #e1e8ed;
  border-radius: 6px;
  background: #fff;
  overflow: hidden;
  transition: border-color 0.15s ease;
}

.vs-result-card:hover {
  border-color: #c1cdd6;
}

.vs-result-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 10px;
  background: #fafbfc;
  border-bottom: 1px solid #f0f3f5;
}

.vs-result-title {
  font-size: 12px;
  font-weight: 500;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.vs-page-ref {
  color: #137cbd;
}

.vs-page-ref.vs-clickable {
  cursor: pointer;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 2px;
}

.vs-page-ref.vs-clickable:hover {
  color: #0e5a8a;
  text-decoration-style: solid;
}

.vs-source-icon {
  margin-right: 4px;
  vertical-align: -1px;
}

.vs-dnp-icon {
  color: #a854a8;
  opacity: 0.7;
}

.vs-file-name {
  color: #5c7080;
  font-style: italic;
}

/* Relevance badges with gradient coloring */
.vs-relevance-badge {
  flex-shrink: 0;
  padding: 1px 6px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
}

.vs-relevance-high {
  background: #e6f4ea;
  color: #1e7e34;
}

.vs-relevance-medium {
  background: #fff8e1;
  color: #b8860b;
}

.vs-relevance-low {
  background: #fff3e0;
  color: #e65100;
}

.vs-relevance-poor {
  background: #fce4ec;
  color: #c62828;
}

.vs-result-content {
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1.5;
  color: #394b59;
  word-break: break-word;
  overflow-wrap: break-word;
}

.vs-result-content p {
  margin: 0 0 4px;
}

.vs-result-content ul,
.vs-result-content ol {
  margin: 0;
  padding-left: 18px;
}

.vs-result-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 10px 6px;
  gap: 8px;
}

.vs-result-actions:empty {
  display: none;
}

/* Dark theme support */
.bp3-dark .vs-results-header,
.dark-mode .vs-results-header {
  background: #2a3540;
  border-bottom-color: #3a4a56;
}

.bp3-dark .vs-results-summary,
.dark-mode .vs-results-summary {
  color: #d8e1e8;
}

.bp3-dark .vs-result-card,
.dark-mode .vs-result-card {
  background: #1e2a33;
  border-color: #3a4a56;
}

.bp3-dark .vs-result-header,
.dark-mode .vs-result-header {
  background: #253240;
  border-bottom-color: #2a3a48;
}

.bp3-dark .vs-result-content,
.dark-mode .vs-result-content {
  color: #c5d0d8;
}

.bp3-dark .vs-page-ref,
.dark-mode .vs-page-ref {
  color: #48aff0;
}

.bp3-dark .vs-page-ref.vs-clickable:hover,
.dark-mode .vs-page-ref.vs-clickable:hover {
  color: #6bbfff;
}

.bp3-dark .vs-add-all-btn,
.bp3-dark .vs-add-btn,
.bp3-dark .vs-expand-btn,
.dark-mode .vs-add-all-btn,
.dark-mode .vs-add-btn,
.dark-mode .vs-expand-btn {
  background: #2a3540;
  border-color: #3a4a56;
  color: #c5d0d8;
}

.bp3-dark .vs-results-list,
.dark-mode .vs-results-list {
  background: transparent;
}

/* Tool confirmation UI */
.full-results-chat-tool-confirmation {
  background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
  border: 1px solid #ffc107;
  border-radius: 8px;
  padding: 12px;
  margin-top: 8px;
}

.tool-confirmation-header {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  color: #856404;
  margin-bottom: 10px;
  font-size: 13px;
}

.tool-confirmation-non-atomic-warning {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  margin-bottom: 8px;
  font-size: 11px;
  color: #a67908;
  background: rgba(217, 179, 14, 0.1);
  border-radius: 4px;
}

.tool-confirmation-buttons {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.tool-confirmation-buttons .bp3-button {
  font-size: 12px;
}

.tool-confirmation-feedback {
  margin-top: 8px;
}

.tool-confirmation-input {
  width: 100%;
  padding: 6px 10px;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 12px;
  background: white;
}

.tool-confirmation-input:focus {
  outline: none;
  border-color: #ffc107;
  box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.2);
}

.tool-confirmation-input::placeholder {
  color: #999;
  font-style: italic;
}

/* Tool confirmation preview/diff */
.tool-confirmation-preview {
  max-height: 200px;
  overflow-y: auto;
  margin-bottom: 10px;
  padding: 6px 8px;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 4px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  font-size: 12px;
}

.tool-confirmation-diff-item {
  padding: 4px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.tool-confirmation-diff-item:last-child {
  border-bottom: none;
}

.tool-confirmation-diff-block-header {
  font-weight: 600;
  color: #333;
  margin-bottom: 2px;
  font-family: monospace;
  font-size: 11px;
}

.tool-confirmation-diff-context {
  font-weight: 400;
  color: #666;
  font-family: inherit;
}

.tool-confirmation-diff-row {
  display: flex;
  align-items: baseline;
  gap: 4px;
  padding: 1px 0 1px 12px;
  flex-wrap: wrap;
  line-height: 1.4;
}

.tool-confirmation-diff-label {
  color: #666;
  font-size: 11px;
  min-width: 55px;
  flex-shrink: 0;
}

.tool-confirmation-diff-old {
  background: rgba(255, 0, 0, 0.08);
  color: #8b0000;
  padding: 1px 4px;
  border-radius: 2px;
  text-decoration: line-through;
  word-break: break-word;
}

.tool-confirmation-diff-new {
  background: rgba(0, 128, 0, 0.08);
  color: #006400;
  padding: 1px 4px;
  border-radius: 2px;
  word-break: break-word;
}

.tool-confirmation-diff-arrow {
  color: #999;
  flex-shrink: 0;
  font-size: 11px;
}

.tool-confirmation-diff-delete .tool-confirmation-diff-block-header {
  color: #8b0000;
}

.tool-confirmation-diff-warning {
  color: #856404;
  font-style: italic;
  font-size: 11px;
}

.tool-confirmation-expand-btn {
  background: none;
  border: none;
  color: #5c7080;
  cursor: pointer;
  font-size: 9px;
  padding: 0 4px;
  margin-left: 2px;
  vertical-align: middle;
  opacity: 0.7;
  transition: opacity 0.15s;
}

.tool-confirmation-expand-btn:hover {
  opacity: 1;
  color: #137cbd;
}

/* Insertion context for create_block confirmation */
/* .tool-confirmation-insertion-context {
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px dashed rgba(0, 0, 0, 0.1);
} */

.tool-confirmation-section-label {
  font-weight: 600;
  color: #495057;
  font-size: 11px;
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.tool-confirmation-outline-preview {
  font-family: monospace;
  font-size: 11px;
  line-height: 1.6;
  color: #6c757d;
  background: rgba(0, 0, 0, 0.02);
  padding: 8px 10px;
  border-radius: 3px;
  margin: 4px 0;
  white-space: pre-wrap;
  opacity: 0.85;
  border: 1px solid rgba(0, 0, 0, 0.08);
}

.tool-confirmation-insertion-marker {
  color: #28a745;
  font-weight: 600;
  font-size: 11px;
  margin-top: 4px;
  padding: 4px 8px;
  background: rgba(40, 167, 69, 0.1);
  border-radius: 3px;
  border-left: 3px solid #28a745;
}

.tool-confirmation-content-to-insert {
  margin-top: 8px;
}

.tool-confirmation-page-context {
  font-size: 12px;
  color: #495057;
  margin-bottom: 6px;
  padding: 4px 8px;
  background: rgba(0, 0, 0, 0.03);
  border-radius: 3px;
  border-left: 3px solid #6c757d;
}

.tool-confirmation-page-context strong {
  color: #137cbd;
}

.tool-confirmation-diff-location {
  font-size: 11px;
  color: #6c757d;
  font-style: italic;
}

/* User choice form UI */
.full-results-chat-user-choice {
  color: initial;
  background: linear-gradient(to bottom, #eef3fc, #e8eef8);
  border: 1px solid #a3bffa;
  border-radius: 8px;
  padding: 12px;
  margin: 8px 0;
}
.full-results-chat-user-choice:focus {
  outline: 2px solid #5c9cf5;
  outline-offset: 2px;
}
.user-choice-header {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  margin-bottom: 10px;
  color: #2b5797;
  font-size: 13px;
}
.user-choice-group {
  margin-bottom: 10px;
}
.user-choice-label {
  font-weight: 500;
  font-size: 13px;
  margin-bottom: 4px;
  color: #444;
}
.user-choice-options {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-left: 4px;
}
.user-choice-radio {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  cursor: pointer;
}
.user-choice-radio input[type="radio"] {
  margin: 0;
  cursor: pointer;
}
.user-choice-checkbox {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  cursor: pointer;
}
.user-choice-checkbox input[type="checkbox"] {
  margin: 0;
  cursor: pointer;
}
.user-choice-text-wrapper {
  margin-top: 2px;
}
.user-choice-text-input {
  width: 100%;
  padding: 6px 10px;
  border: 1px solid #a3bffa;
  border-radius: 4px;
  font-size: 13px;
  font-family: inherit;
  background: white;
  resize: vertical;
  min-height: 36px;
}
.user-choice-text-input:focus {
  outline: none;
  border-color: #5b8def;
  box-shadow: 0 0 0 2px rgba(91, 141, 239, 0.2);
}
.user-choice-text-input::placeholder {
  color: #999;
  font-style: italic;
}
/* Slider */
.user-choice-slider-wrapper {
  padding: 4px 4px 0;
}
.user-choice-slider {
  width: 100%;
  cursor: pointer;
  accent-color: #5b8def;
}
.user-choice-slider-labels {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: #666;
  margin-top: 2px;
}
.user-choice-slider-value {
  font-weight: 600;
  color: #2b5797;
  font-size: 13px;
}
/* Hint toggle & icon */
.user-choice-hint-toggle {
  margin-left: auto;
}
.user-choice-hint-icon {
  color: #d4a017;
  margin-left: 4px;
  opacity: 0.7;
}
.user-choice-hint-popover {
  padding: 6px 10px;
  max-width: 260px;
  font-size: 12px;
  line-height: 1.4;
  color: #333;
}
.user-choice-buttons {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}
.user-choice-buttons .bp3-button {
  font-size: 12px;
}

/* Dark mode variants for user choice form */
.bp3-dark .full-results-chat-user-choice {
  background: linear-gradient(to bottom, #1e2a3a, #1a2533);
  border-color: #3d5a80;
}
.bp3-dark .user-choice-header {
  color: #8ab4f8;
}
.bp3-dark .user-choice-label {
  color: #bcc;
}
.bp3-dark .user-choice-slider-labels {
  color: #999;
}
.bp3-dark .user-choice-slider-value {
  color: #8ab4f8;
}
.bp3-dark .user-choice-hint-popover {
  color: #e0e0e0;
}
.bp3-dark .user-choice-text-input {
  background: #1a2533;
  border-color: #3d5a80;
  color: #e0e0e0;
}
.bp3-dark .user-choice-text-input:focus {
  border-color: #5b8def;
  box-shadow: 0 0 0 2px rgba(91, 141, 239, 0.15);
}

/* Removed - using consolidated definition below */

.full-results-chat-mode-toggle {
  display: flex;
  gap: 16px;
  margin-bottom: 12px;
  font-size: 13px;
}

.full-results-chat-access-button {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  padding: 4px 8px;
  border-radius: 4px;
  border: 1px solid #d1d5da;
  background: #f6f8fa;
  cursor: pointer;
  transition: all 0.2s ease;
}

.full-results-chat-access-button:hover {
  background: #e1e4e8;
  border-color: #c6cbd1;
}

.full-results-chat-mode-toggle label {
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  color: #495057;
}

.full-results-chat-mode-toggle input[type="radio"] {
  margin: 0;
}

.full-results-chat-agent-mode .bp3-control.bp3-switch {
  font-size: 12px;
}
.full-results-chat-agent-mode .bp3-control.bp3-control-indicator {
  margin-right: 8px;
}

.disabled-hint {
  color: #6c757d;
  font-size: 11px;
  margin-left: 4px;
}

/* Modern Floating Chat Input */
.full-results-chat-input-container {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 8px;
  padding-top: 0;
  background: transparent;
  position: relative;
}

/* Microphone button in chat */
.full-results-chat-mic-button {
  min-width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
}

.full-results-chat-mic-button:hover {
  background-color: rgba(167, 182, 194, 0.15);
}

.full-results-chat-mic-button:active {
  transform: scale(0.95);
}

.full-results-chat-mic-button svg {
  font-size: 16px;
}

/* Elegant input wrapper with floating effect */
.full-results-chat-input-container::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 16px;
  right: 16px;
  height: 1px;
  background: linear-gradient(
    to right,
    transparent,
    rgba(167, 182, 194, 0.15),
    transparent
  );
}

textarea.bp3-input.full-results-chat-input {
  flex: 1;
  resize: none;
  border-radius: 12px;
  border: 2px solid transparent;
  padding: 6px 8px;
  font-size: 13px;
  line-height: 1.5;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  /* background: linear-gradient(to bottom, #ffffff, #fafbfc);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.8); */
  min-height: 40px;
  max-height: 250px;
  width: 100%;
  overflow-y: auto;
}

textarea.bp3-input.full-results-chat-input::placeholder {
  color: #a0a8b0;
  font-weight: 400;
}

textarea.bp3-input.full-results-chat-input:hover {
  border-color: rgba(102, 126, 234, 0.2);
  box-shadow:
    0 4px 12px rgba(0, 0, 0, 0.06),
    0 2px 4px rgba(0, 0, 0, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

textarea.bp3-input.full-results-chat-input:focus {
  border-color: #667eea;
  /* background: #ffffff; */
  box-shadow:
    0 6px 20px rgba(102, 126, 234, 0.15),
    0 2px 6px rgba(102, 126, 234, 0.1),
    0 0 0 4px rgba(102, 126, 234, 0.08);
  outline: none;
}

/* Smooth scrollbar for long text */
textarea.bp3-input.full-results-chat-input::-webkit-scrollbar {
  width: 6px;
}

textarea.bp3-input.full-results-chat-input::-webkit-scrollbar-track {
  background: transparent;
}

textarea.bp3-input.full-results-chat-input::-webkit-scrollbar-thumb {
  background: rgba(167, 182, 194, 0.3);
  border-radius: 3px;
}

textarea.bp3-input.full-results-chat-input::-webkit-scrollbar-thumb:hover {
  background: rgba(167, 182, 194, 0.5);
}

.bp3-menu.chat-page-autocomplete-menu {
  max-height: 250px;
  overflow: auto;
}

/* Modern floating send button */
.full-results-chat-send {
  align-self: center;
  flex-shrink: 0;
  border-radius: 50%;
  width: 44px;
  height: 44px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.35);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  position: relative;
  overflow: hidden;
}

.full-results-chat-send::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  transform: translate(-50%, -50%);
  transition:
    width 0.3s ease,
    height 0.3s ease;
}

.full-results-chat-send:hover::before {
  width: 100%;
  height: 100%;
}

.full-results-chat-send:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(102, 126, 234, 0.45);
}

.full-results-chat-send:active {
  transform: translateY(0) scale(0.95);
  box-shadow: 0 2px 8px rgba(102, 126, 234, 0.4);
}

.full-results-chat-send:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

.full-results-chat-send .bp3-icon {
  position: relative;
  z-index: 1;
}

/* Stop button variant */
.full-results-chat-stop.full-results-chat-send {
  background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
  box-shadow: 0 4px 12px rgba(231, 76, 60, 0.35);
  animation: stop-pulse 1.5s ease-in-out infinite;
}

.full-results-chat-stop.full-results-chat-send:hover {
  box-shadow: 0 8px 20px rgba(231, 76, 60, 0.45);
}

.full-results-chat-stop.full-results-chat-send:active {
  box-shadow: 0 2px 8px rgba(231, 76, 60, 0.4);
}

@keyframes stop-pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.8;
  }
}

/* Elegant controls area */
.full-results-chat-edition-mode-bar {
  display: flex;
  align-items: center;
  padding: 4px 8px 0;
}

.full-results-chat-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 8px;
  padding-left: 0px;
  background: transparent;
}

.full-results-chat-container .bp3-tooltip .bp3-popover-content {
  padding: 4px 10px;
}

.full-results-chat-access-menu-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.full-results-chat-controls .full-results-chat-toolbar-button,
.full-results-chat-input-container .full-results-chat-toolbar-button {
  border-radius: 6px;
  padding: 4px 6px;
}

.full-results-chat-controls .full-results-chat-toolbar-button:hover,
.full-results-chat-input-container .full-results-chat-toolbar-button:hover,
.bp3-popover-open .full-results-chat-toolbar-button {
  background: rgba(58, 60, 61, 1) !important;
}

.full-results-chat-access-mode {
  flex-shrink: 0;
}

.full-results-chat-access-mode .bp3-html-select {
  font-size: 13px;
}

.full-results-chat-access-mode .bp3-html-select select {
  border-radius: 16px;
  border: 1px solid rgba(167, 182, 194, 0.25);
  padding: 6px 28px 6px 12px;
  background: linear-gradient(to bottom, #ffffff, #fafbfc);
  transition: all 0.2s ease;
  font-weight: 500;
}

.full-results-chat-access-mode .bp3-html-select select:hover {
  border-color: rgba(102, 126, 234, 0.3);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.full-results-chat-access-mode .bp3-html-select select:focus {
  border-color: #667eea;
  box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
  outline: none;
}

.full-results-chat-model-selector {
  flex-shrink: 0;
}

/* Advanced options menu */
.advanced-options-menu .advanced-option-row {
  padding: 4px 0;
}
.advanced-options-menu .bp3-switch {
  margin-bottom: 0;
  font-size: 12px;
}
.advanced-options-menu .bp3-slider {
  min-width: 180px;
}
.advanced-options-menu .bp3-numeric-input {
  max-width: 140px;
}

/* Enhanced modal layout for chat */
.full-results-modal {
  border-radius: 8px;
  padding: 8px;
  width: 75%;
  max-width: 1200px;
  max-height: 90vh;
  height: 100%;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  display: flex;
  flex-direction: column;
  transition: all 0.3s ease;
}

.full-results-modal:has(.full-results-chat-container) {
  max-width: 1200px;
}

.full-results-main-content {
  flex: 1;
  display: flex;
  gap: 8px;
  flex-direction: column;
  overflow: hidden;
  margin-right: 0;
}

.full-results-main-content .bp3-button {
  z-index: 6;
}

/* When chat is shown, add margin to main content */
.full-results-modal.chat-open .full-results-main-content {
  margin-right: 10px;
}

/* Removed - using consolidated definition below */

/* Responsive Design */
@media (max-width: 768px) {
  .full-results-modal {
    max-width: 95%;
    max-height: 95%;
    padding: 16px;
  }

  .full-results-search-filters {
    flex-direction: column;
    align-items: stretch;
  }

  .full-results-search-input {
    min-width: unset;
  }

  .full-results-sort-controls {
    flex-direction: column;
    align-items: stretch;
  }

  .full-results-pagination {
    flex-direction: column;
    gap: 12px;
  }

  .full-results-action-bar {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .full-results-selection-controls {
    justify-content: center;
  }

  .full-results-buttons-container {
    justify-content: center;
  }

  .full-results-metadata {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
}

/* Advanced UI Features: Fullscreen, Resizable, Chat-only */

/* Fullscreen Mode - Takes priority over side panel positioning */
.full-results-overlay.fullscreen {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgba(0, 0, 0, 0.95) !important;
  pointer-events: auto !important; /* Re-enable pointer events in fullscreen */
  /* z-index: 1000 !important; Above Roam content but not excessively high */
}

.full-results-modal.fullscreen {
  width: 100vw !important;
  height: 100vh !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  position: relative;
  /* z-index: 1001; Above the overlay */
}

/* When fullscreen is active, restore Roam app margin (panel is no longer "alongside") */
.full-results-overlay.fullscreen.side-panel-mode ~ #app,
body.has-fullscreen-side-panel #app {
  margin: 0 !important;
}

/* Header Controls */
.full-results-header-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}

.full-results-control-button {
  background: none;
  border: 1px solid rgba(167, 182, 194, 0.3);
  border-radius: 6px;
  padding: 5px 6px;
  cursor: pointer;
  font-size: 13px;
  color: #5c7080;
  transition: all 0.2s ease;
  min-width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.full-results-control-button:hover {
  background: rgba(102, 126, 234, 0.08);
  border-color: rgba(102, 126, 234, 0.3);
  color: #667eea;
}

.full-results-control-button:active {
  background: rgba(102, 126, 234, 0.15);
  transform: scale(0.95);
}

.full-results-control-button:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.full-results-control-button .bp3-icon {
  transition: transform 0.2s ease;
}

.full-results-control-button:hover .bp3-icon {
  transform: scale(1.08);
}

/* Content Container Layout */
.full-results-content-container {
  display: flex;
  flex: 1;
  overflow: hidden;
  position: relative;
  min-height: 0; /* Allow flex shrinking */
  height: 100%; /* Take available height */
}

/* Edge Hover Buttons for Quick Layout Switching */
.edge-hover-button {
  position: absolute;
  margin: 40px 0;
  top: 0;
  bottom: 0;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(
    to right,
    rgba(102, 126, 234, 0.05),
    rgba(102, 126, 234, 0.12)
  );
  border: 1px solid rgba(102, 126, 234, 0.2);
  cursor: pointer;
  opacity: 0;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 5;
  color: #667eea;
}

/* Show edge buttons on container hover */
.full-results-content-container:hover .edge-hover-button {
  opacity: 0.1;
}

.full-results-content-container:hover .edge-hover-button:hover {
  opacity: 1;
  background: linear-gradient(
    to right,
    rgba(102, 126, 234, 0.15),
    rgba(102, 126, 234, 0.25)
  );
  border-color: rgba(102, 126, 234, 0.4);
  box-shadow: 0 2px 8px rgba(102, 126, 234, 0.2);
}

.edge-hover-button .bp3-icon {
  transition: transform 0.2s ease;
}

.edge-hover-button:hover .bp3-icon {
  transform: scale(1.2);
}

/* Right edge button */
.edge-hover-right {
  right: 0;
  border-left: 2px solid rgba(102, 126, 234, 0.3);
  border-right: none;
  border-radius: 8px 0 0 8px;
}

/* Left edge button */
.edge-hover-left {
  left: 0;
  border-right: 2px solid rgba(102, 126, 234, 0.3);
  border-left: none;
  border-radius: 0 8px 8px 0;
}

/* Edge buttons in split mode - positioned at panel boundaries */
.edge-hover-button.edge-hover-split {
  width: 24px;
  background: linear-gradient(
    to right,
    rgba(118, 75, 162, 0.08),
    rgba(118, 75, 162, 0.15)
  );
  border-color: rgba(118, 75, 162, 0.25);
  color: #764ba2;
  top: 40%;
  bottom: auto;
  height: 150px;
  transform: translateY(-50%);
}

.edge-hover-button.edge-hover-split:hover {
  background: linear-gradient(
    to right,
    rgba(118, 75, 162, 0.2),
    rgba(118, 75, 162, 0.35)
  );
  border-color: rgba(118, 75, 162, 0.5);
  box-shadow: 0 2px 8px rgba(118, 75, 162, 0.3);
}

.full-results-content-container select {
  font-size: 13px;
}

.full-results-main-content {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: width 0.2s ease;
  height: 100%; /* Take available height */
  min-height: 0; /* Allow flex shrinking */
}

/* Scrollable content container for results and pagination */
.full-results-scrollable-content {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
  /* Let flex handle the height naturally */
}

.full-results-chat-container {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: width 0.2s ease;
  max-height: fit-content; /* Ensure it takes full height */
  min-height: 0; /* Allow flex shrinking */
  align-items: center;
}

/* Chat panel should properly fit available space */
.full-results-chat-panel {
  display: flex;
  flex-direction: column;
  /* height: 100%; */
  min-height: 0;
  overflow: hidden;
  width: 100%;
  max-width: 1200px;
  border-radius: 8px;
}

/* Chat messages area with seamless scrolling */
.full-results-chat-messages {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
  padding: 8px;
  scroll-behavior: smooth;
}

/* Custom scrollbar for messages */
.full-results-chat-messages::-webkit-scrollbar {
  width: 8px;
}

.full-results-chat-messages::-webkit-scrollbar-track {
  background: transparent;
  margin: 8px 0;
}

.full-results-chat-messages::-webkit-scrollbar-thumb {
  background: rgba(167, 182, 194, 0.25);
  border-radius: 4px;
  transition: background 0.2s ease;
}

.full-results-chat-messages::-webkit-scrollbar-thumb:hover {
  background: rgba(167, 182, 194, 0.4);
}

.full-results-chat-input-area {
  flex-shrink: 0;
  /* background: #f8f9fa; */
  background: inherit;
}
.full-results-chat-input-area .bp3-popover-wrapper {
  z-index: 6;
}

/* Disable transitions during resizing for smoothness */
.full-results-modal.resizing .full-results-main-content,
.full-results-modal.resizing .full-results-chat-container {
  transition: none;
}

/* Chat-only Mode */
.full-results-modal.chat-only .full-results-main-content {
  display: none !important;
}

.full-results-modal.chat-only .full-results-resize-handle {
  display: none !important;
}

.full-results-modal.chat-only .full-results-chat-container {
  width: 100% !important;
}

/* Resize Handle */
.full-results-resize-handle {
  width: 2px;
  background: #f0f0f0;
  cursor: ew-resize;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  user-select: none;
}

.full-results-resize-handle:hover {
  width: 6px;
  background: #e0e0e0;
}

.full-results-resize-handle:hover .resize-handle-bar {
  background: #666;
  opacity: 1;
}

.resize-handle-bar {
  width: 2px;
  height: 30px;
  background: #ccc;
  border-radius: 1px;
  opacity: 0;
  transition: all 0.2s ease;
}

.full-results-modal.resizing {
  user-select: none;
}

.full-results-modal.resizing .full-results-resize-handle {
  background: #007acc;
}

.full-results-modal.resizing .resize-handle-bar {
  background: white;
}

/* Enhanced Chat Panel Styling */
.full-results-chat-panel {
  height: 100%;
  display: flex;
  flex-direction: column;
  /* background: #fafafa; */
  background: inherit;
  /* border-left: 1px solid #e0e0e0; */
  min-height: 0; /* Allow flex shrinking */
  overflow: hidden; /* Prevent overflow */
  width: 100%;
}

.full-results-modal.chat-only .full-results-chat-panel {
  border-left: none;
}

/* Responsive Design for Advanced Features */
@media (max-width: 768px) {
  .full-results-control-button {
    min-width: 28px;
    height: 28px;
    padding: 4px 6px;
    font-size: 12px;
  }

  .full-results-header-controls {
    gap: 4px;
  }

  .full-results-resize-handle {
    width: 8px; /* Slightly wider for touch devices */
  }

  /* Auto chat-only mode on mobile when chat is open */
  .full-results-modal.chat-open {
    .full-results-main-content {
      display: none;
    }

    .full-results-resize-handle {
      display: none;
    }

    .full-results-chat-container {
      width: 100% !important;
    }
  }
}

/* Accessibility Improvements */
.full-results-control-button:focus {
  outline: 2px solid #007acc;
  outline-offset: 2px;
}

.full-results-resize-handle:focus {
  outline: 2px solid #007acc;
  outline-offset: 1px;
}

/* Animation for smooth transitions */
.full-results-overlay {
  transition: all 0.3s ease;
}

/* Side Panel Mode - displays alongside Roam app */
.full-results-overlay.side-panel-mode {
  position: fixed !important;
  background: transparent !important;
  /* z-index: 1001 !important; Higher than Roam's sidebar (z-index: 1000) */
  pointer-events: none; /* Allow clicking through to Roam app */
  transition: all 0.3s ease;
}

/* Right position (default) */
.full-results-overlay.side-panel-right {
  top: 0 !important;
  left: auto !important;
  right: 0 !important;
  width: auto !important;
  height: 100vh !important;
  justify-content: flex-end !important;
  align-items: stretch !important;
}

/* Left position */
.full-results-overlay.side-panel-left {
  top: 0 !important;
  left: 0 !important;
  right: auto !important;
  width: auto !important;
  height: 100vh !important;
  justify-content: flex-start !important;
  align-items: stretch !important;
}

/* Bottom position */
.full-results-overlay.side-panel-bottom {
  top: auto !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100vw !important;
  height: auto !important;
  justify-content: center !important;
  align-items: flex-end !important;
}

.full-results-modal.side-panel {
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  pointer-events: auto; /* Re-enable clicks on the panel itself */
  transition:
    width 0.1s ease,
    height 0.1s ease;
}

/* Right panel styling */
.full-results-overlay.side-panel-right .full-results-modal.side-panel {
  width: 100%;
  height: 100vh !important;
  box-shadow: -4px 0 12px rgba(0, 0, 0, 0.15) !important;
  border-left: 1px solid #ccc;
}

/* Left panel styling */
.full-results-overlay.side-panel-left .full-results-modal.side-panel {
  width: 100%;
  height: 100vh !important;
  box-shadow: 4px 0 12px rgba(0, 0, 0, 0.15) !important;
  border-right: 1px solid #ccc;
}

/* Bottom panel styling */
.full-results-overlay.side-panel-bottom .full-results-modal.side-panel {
  width: 100vw !important;
  height: 100%;
  box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.15) !important;
  border-top: 1px solid #ccc;
  padding-top: 4px;
  padding-bottom: 0;
}

/* Adjust Roam app to make space for side panel - Right */
.full-results-overlay.side-panel-right ~ #app,
body.has-side-panel-right #app {
  transition: margin-right 0.3s ease;
}

/* Adjust Roam app to make space for side panel - Left */
.full-results-overlay.side-panel-left ~ #app,
body.has-side-panel-left #app {
  transition: margin-left 0.3s ease;
}

/* Adjust Roam app to make space for side panel - Bottom */
.full-results-overlay.side-panel-bottom ~ #app,
body.has-side-panel-bottom #app {
  transition: margin-bottom 0.3s ease;
}

/* When side panel is closed, restore Roam app */
body.has-no-side-panel #app {
  margin-right: 0 !important;
  margin-left: 0 !important;
  margin-bottom: 0 !important;
}

/* Side Panel Resize Handle */
.side-panel-resize-handle {
  position: absolute;
  z-index: 10;
  cursor: ew-resize;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: auto;
}

.side-panel-resize-handle:hover {
  background: rgba(0, 122, 204, 0.1);
}

.side-panel-resize-right {
  left: 0;
  top: 0;
  width: 8px;
  height: 100%;
  cursor: ew-resize;
}

.side-panel-resize-left {
  right: 0;
  top: 0;
  width: 8px;
  height: 100%;
  cursor: ew-resize;
}

.side-panel-resize-bottom {
  top: 0;
  left: 0;
  width: 100%;
  height: 8px;
  cursor: ns-resize;
}

.side-panel-resize-handle .resize-handle-bar {
  background: #ccc;
  border-radius: 2px;
  transition: all 0.2s ease;
}

.side-panel-resize-right .resize-handle-bar,
.side-panel-resize-left .resize-handle-bar {
  width: 3px;
  height: 40px;
}

.side-panel-resize-bottom .resize-handle-bar {
  width: 40px;
  height: 3px;
}

.side-panel-resize-handle:hover .resize-handle-bar {
  background: #007acc;
}

/* Legacy auto-switch mode - no longer used (replaced by layoutMode system) */
/* Kept for reference only
.full-results-modal.auto-switch-mode .full-results-chat-container {
  width: 100% !important;
}

.full-results-modal.auto-switch-mode .full-results-main-content {
  display: none !important;
}
*/

/* Compact header for side panel mode */
.full-results-modal.side-panel .full-results-header {
  min-height: 30px;
}

.full-results-modal.side-panel .full-results-title {
  font-size: 14px;
  margin: 0;
  line-height: 1.3;
}

.full-results-modal.side-panel .full-results-control-button {
  min-width: 28px;
  min-height: 28px;
  padding: 4px;
}

.full-results-modal.side-panel .full-results-control-button .bp3-icon {
  font-size: 14px;
}

/* Extra compact for bottom position */
.full-results-overlay.side-panel-bottom .full-results-header {
  min-height: 30px;
  padding-bottom: 2px;
  margin-bottom: 2px;
}

.full-results-overlay.side-panel-bottom .full-results-title {
  font-size: 13px;
}

.full-results-overlay.side-panel-bottom .full-results-control-button {
  min-width: 26px;
  min-height: 26px;
}

/* Enable Container Queries on Chat Container */
.full-results-chat-container {
  container-type: inline-size;
  container-name: chat;
}

/* Compact Chat Mode - Applied when .full-results-chat-container width < 600px */
@container chat (max-width: 600px) {
  /* Compact header */
  .full-results-chat-header {
    padding: 6px 8px;
  }

  .full-results-chat-info-text {
    font-size: 12px;
  }

  .full-results-chat-info-text .bp3-icon {
    display: none;
  }

  .full-results-chat-total-tokens {
    display: none;
  }

  .full-results-chat-header-controls .bp3-button {
    min-width: 24px;
    min-height: 24px;
    padding: 2px;
  }

  .full-results-chat-header-controls .bp3-icon {
    font-size: 12px;
  }

  /* Compact messages */
  .full-results-chat-messages {
    padding: 6px;
  }

  .full-results-chat-message {
    gap: 0;
    margin-bottom: 6px;
  }

  .full-results-chat-copy-link svg {
    height: 14px;
  }

  /* Adjust message bubbles */
  .full-results-chat-content {
    max-width: 95%;
  }

  .full-results-chat-text {
    padding: 8px 10px 8px 16px;
    border-radius: 12px;
    font-size: 13px;
    line-height: 1.5;
  }

  /* Compact welcome message */
  .full-results-chat-welcome {
    margin-bottom: 12px;
    padding: 4px;
  }

  .full-results-chat-assistant-message {
    padding: 8px 12px;
    font-size: 13px;
  }

  /* Smaller suggestion pills */
  .full-results-chat-suggestions button {
    padding: 6px 10px;
    font-size: 12px;
    border-radius: 16px;
  }

  /* Compact controls */
  .full-results-chat-controls {
    padding: 6px;
    padding-left: 0;
    gap: 6px;
    font-size: 11px;
  }
  .full-results-chat-controls .bp3-button {
    font-size: 12px;
    min-height: 20px;
  }
  .full-results-chat-info svg .full-results-chat-controls svg {
    height: 12px;
  }

  .full-results-chat-access-mode .bp3-html-select select {
    padding: 4px 20px 4px 8px;
    font-size: 12px;
    border-radius: 12px;
  }

  .full-results-chat-model-selector .bp3-button {
    padding: 0;
  }

  /* Compact input */
  .full-results-chat-input-container {
    padding: 6px;
    gap: 6px;
  }

  textarea.bp3-input.full-results-chat-input {
    padding: 5px 10px;
    font-size: 13px;
    min-height: 34px;
    border-radius: 12px;
  }

  .full-results-chat-send {
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
  }

  .full-results-chat-send .bp3-icon {
    font-size: 14px;
  }

  /* Compact typography */
  .full-results-chat-text h2 {
    font-size: 16px;
    margin: 12px 0 6px 0;
  }

  .full-results-chat-text h3 {
    font-size: 14px;
    margin: 10px 0 4px 0;
  }

  .full-results-chat-text h4 {
    font-size: 13px;
    margin: 8px 0 4px 0;
  }

  .full-results-chat-text p {
    margin: 0 0 8px 0;
  }

  .full-results-chat-text ul,
  .full-results-chat-text ol {
    margin: 8px 0;
    padding-left: 20px;
  }

  /* Compact message footer */
  .full-results-chat-message-footer {
    margin-top: 2px;
    gap: 6px;
  }

  .full-results-chat-timestamp,
  .full-results-chat-tokens {
    font-size: 10px;
  }
}

/* Very Compact Chat Mode - Applied when .full-results-chat-container width < 330px */
@container chat (max-width: 330px) {
  /* Compact header */
  .full-results-chat-header {
    padding: 5px 6px;
  }

  .full-results-chat-info-text {
    font-size: 11px;
  }

  .full-results-chat-header-controls .bp3-icon {
    font-size: 11px;
  }

  /* Compact messages */
  .full-results-chat-messages {
    padding: 4px;
  }

  .full-results-chat-message {
    margin-bottom: 4px;
  }

  .full-results-chat-tool-name,
  .full-results-chat-tool-details,
  .full-results-chat-tool-response {
    font-size: 11px;
  }

  /* Adjust message bubbles */
  .full-results-chat-content {
    max-width: 100%;
  }

  .full-results-chat-content ul {
    padding-inline-start: 15px;
  }

  .full-results-chat-text {
    padding: 6px 8px;
    border-radius: 12px;
    font-size: 11px;
    line-height: 1.5;
  }

  /* Compact welcome message */
  .full-results-chat-welcome {
    margin-bottom: 8px;
    padding: 4px;
  }

  .full-results-chat-assistant-message {
    padding: 6px 8px;
    font-size: 11px;
  }

  /* Smaller suggestion pills */
  .full-results-chat-suggestions button {
    padding: 5px 8px;
    font-size: 11px;
    border-radius: 12px;
  }

  /* Compact controls */
  .full-results-chat-controls {
    padding: 4px;
    padding-left: 0;
    gap: 4px;
  }
  .full-results-chat-controls .bp3-button {
    font-size: 11px;
    min-height: 18px;
  }
  .full-results-chat-info svg .full-results-chat-controls svg {
    height: 11px;
  }

  .full-results-chat-access-mode .bp3-html-select select {
    padding: 4px 16px 4px 6px;
    font-size: 11px;
    border-radius: 12px;
    height: 26px;
  }
  .full-results-chat-access-mode
    .bp3-html-select
    select
    .bp3-html-select
    .bp3-icon {
    top: 5px;
  }

  .full-results-chat-agent-mode .bp3-control.bp3-switch {
    font-size: 11px;
  }
  .full-results-chat-agent-mode .bp3-control.bp3-control-indicator {
    margin-right: 6px;
  }

  /* Compact input */
  .full-results-chat-input-container {
    padding: 5px;
    gap: 5px;
  }

  textarea.bp3-input.full-results-chat-input {
    padding: 4px 8px;
    font-size: 11px;
    min-height: 32px;
    border-radius: 12px;
  }

  .full-results-chat-send {
    width: 24px;
    height: 24px;
    min-width: 24px;
    min-height: 24px;
  }

  .full-results-chat-send .bp3-icon {
    font-size: 11px;
  }

  /* Compact typography */
  .full-results-chat-text h2 {
    font-size: 13px;
    margin: 10px 0 5px 0;
  }

  .full-results-chat-text h3 {
    font-size: 12px;
    margin: 8px 0 4px 0;
  }

  .full-results-chat-text h4 {
    font-size: 11px;
    margin: 8px 0 4px 0;
  }

  .full-results-chat-text p {
    margin: 0 0 6px 0;
  }

  .full-results-chat-text ul,
  .full-results-chat-text ol {
    margin: 8px 0;
    padding-left: 14px;
  }

  /* Compact message footer */
  .full-results-chat-message-footer {
    margin-top: 0;
    gap: 5px;
  }

  .full-results-chat-timestamp,
  .full-results-chat-tokens {
    font-size: 9px;
  }
}

/* On very small screens, revert to overlay mode */
@media (max-width: 768px) {
  .full-results-overlay.side-panel-mode {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(0, 0, 0, 0.5) !important;
    justify-content: center !important;
    align-items: center !important;
    pointer-events: auto;
  }

  .full-results-modal.side-panel {
    width: 95% !important;
    height: 90vh !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
    border: none !important;
  }

  .full-results-overlay.side-panel-mode ~ #app,
  body.has-side-panel-mode #app {
    margin: 0 !important;
  }

  .side-panel-resize-handle {
    display: none !important;
  }
}

/* Dark mode support (if needed) */
@media (prefers-color-scheme: dark) {
  .full-results-control-button {
    background: #333;
    border-color: #555;
    color: #fff;
  }

  .full-results-control-button:hover {
    background: #444;
    border-color: #777;
  }

  .full-results-resize-handle {
    background: #949494;
  }

  .full-results-resize-handle:hover {
    background: #9b9b9b;
  }

  .resize-handle-bar {
    background: #777;
  }
}

/* Chat Command Suggest Popover Alignment */
.chat-command-suggest-popover {
  width: fit-content;
}

.chat-command-suggest-popover .bp3-popover-content {
  padding: 0 !important;
}

/* Ensure input and menu have same width */
.chat-command-suggest-input {
  width: 100% !important;
  box-sizing: border-box;
}

/* Menu alignment */
.chat-command-suggest-popover .bp3-menu,
.chat-command-suggest-menu.slash-mode.bp3-menu {
  width: 100%;
  max-height: 400px;
  overflow-y: auto;
}

/* Input container at bottom of menu */
.chat-command-suggest-popover .bp3-input-group {
  border-top: 1px solid #e1e8ed;
  margin: 0;
}

/* Reorder Suggest component to have input at bottom */
.chat-command-suggest-popover .bp3-popover-content {
  display: flex;
  flex-direction: column-reverse; /* Reverse order: input at bottom */
}

.chat-command-suggest-wrapper .bp3-input-group {
  order: 2; /* Input at bottom */
}

.chat-command-suggest-popover .bp3-menu {
  order: 1; /* Menu at top */
}

/* Hide input completely in slash mode */
.chat-command-suggest-popover.slash-mode .bp3-input-group {
  display: none !important;
}

/* Remove border when input is hidden */
.chat-command-suggest-popover.slash-mode .bp3-menu {
  border-top: none;
}

/* Ensure menu doesn't steal focus or block textarea */
.chat-command-suggest-menu.slash-mode {
  pointer-events: auto;
  max-height: 400px;
  overflow-y: auto;
}

/* Make sure popover doesn't interfere with textarea focus */
/* Scoped to only affect our chat command suggest menu popovers */
.full-results-modal
  .bp3-popover-content:has(.chat-command-suggest-menu.slash-mode) {
  pointer-events: auto;
}

/* Chat Tools Menu Styles */
.chat-tools-menu {
  max-width: 350px;
  max-height: 500px;
  overflow-y: auto;
}

.chat-tools-menu-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px;
  background-color: rgba(158, 158, 158, 0.1);
  border-bottom: 1px solid var(--co-border, #e1e8ed);
}

.chat-tools-menu-header strong {
  font-size: 13px;
  font-weight: 600;
  /* color: var(--co-text, #182026); */
}

.chat-tools-menu-section-header {
  padding: 8px 12px;
  background-color: var(--co-bg-sidebar, #f5f8fa);
  border-top: 1px solid var(--co-border, #e1e8ed);
}

.chat-tools-menu-section-header strong {
  font-size: 12px;
  font-weight: 600;
  color: var(--co-text-secondary, #5c7080);
}

.chat-tool-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
  min-width: 0;
}

.chat-tool-name {
  font-weight: 500;
  font-size: 12px;
  /* color: var(--co-text, #182026); */
}

.chat-tool-description {
  font-size: 11px;
  color: var(--co-text-secondary, #5c7080);
  line-height: 1.3;
  white-space: normal;
  word-wrap: break-word;
}

.chat-tools-menu .bp3-menu-item {
  padding: 6px;
  display: flex;
  align-items: flex-start;
  gap: 2px;
}

.chat-tools-menu .bp3-menu-item:hover {
  background-color: var(--co-bg-hover, rgba(92, 112, 128, 0.1));
}

.chat-tools-menu .bp3-menu-item .bp3-switch,
.chat-tools-menu .bp3-control-indicator {
  flex-shrink: 0;
  margin: 0 !important;
  padding: 0 !important;
}

.full-results-chat-tools-menu {
  display: flex;
  align-items: center;
}

.full-results-chat-tools-menu .bp3-button {
  min-width: 32px;
}

/* Collapsible tool descriptions */
.chat-tool-description {
  transition:
    max-height 0.2s ease,
    opacity 0.2s ease,
    margin-top 0.2s ease;
  overflow: hidden;
}

.chat-tool-description.collapsed {
  max-height: 0;
  opacity: 0;
  margin-top: 0;
}

.chat-tool-description.expanded {
  max-height: 200px;
  opacity: 1;
  margin-top: 4px;
}

/* Tool name with caret icon */
.chat-tool-name {
  display: flex;
  align-items: center;
}

.chat-tool-name .bp3-icon {
  flex-shrink: 0;
  color: var(--co-text-secondary, #5c7080);
}

/* ============================================
   Scope Selection Dialog Styles
   ============================================ */

.laia-scope-selection-dialog {
  width: 650px;
  max-width: 90vw;
}

.laia-scope-selection-dialog-body {
  padding: 0;
}

.laia-scope-user-query {
  margin-bottom: 12px;
  padding: 10px;
  background: #f7f9fb;
  border: 1px solid #e1e8ed;
  border-radius: 6px;
  font-size: 14px;
  color: #394b59;
}

.laia-scope-user-query strong {
  color: #1c2127;
}

.laia-scope-explanation {
  margin-bottom: 20px;
  font-size: 14px;
  color: #5c7080;
  line-height: 1.5;
}

.laia-scope-options {
  margin-bottom: 20px;
}

.laia-scope-option {
  margin-bottom: 12px;
}

.laia-scope-button {
  text-align: left;
  justify-content: flex-start;
  padding: 10px 12px;
  border: 2px solid #d3d8de;
  border-radius: 8px;
  transition: all 0.2s ease;
  min-height: 90px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.laia-scope-button .bp3-button-text {
  display: flex;
  gap: 12px;
  align-items: center;
}

.laia-scope-button:hover {
  border-color: #a7b6c2;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transform: translateY(-1px);
}

.laia-scope-icon {
  flex-shrink: 0;
  margin-top: 2px;
  color: #5c7080;
}

.laia-scope-button-recommended .laia-scope-icon {
  color: #137cbd;
}

.laia-scope-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.laia-scope-title {
  font-size: 15px;
  font-weight: 600;
  color: #1c2127;
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.laia-scope-badge {
  display: inline-block;
  padding: 2px 8px;
  background: #137cbd;
  color: white;
  font-size: 11px;
  font-weight: 500;
  border-radius: 10px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.laia-scope-description {
  font-size: 13px;
  color: #394b59;
  line-height: 1.4;
  margin-bottom: 4px;
}

.laia-scope-best-for {
  font-size: 12px;
  color: #5c7080;
  line-height: 1.3;
}

.laia-scope-count {
  font-size: 12px;
  color: #738694;
  font-weight: 500;
}

.laia-scope-tip {
  margin-top: 10px;
  padding: 12px;
  background: #fffae6;
  border: 1px solid #f7e7a1;
  border-radius: 6px;
  font-size: 13px;
  color: #735c0f;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  line-height: 1.4;
}

.laia-scope-tip .bp3-icon {
  flex-shrink: 0;
  margin-top: 2px;
  color: #bf7326;
}

/* Dark mode support - scoped to our dialog only */
.bp3-dark .laia-scope-selection-dialog .laia-scope-selection-dialog-body {
  background: #30404d;
}

.bp3-dark .laia-scope-selection-dialog .laia-scope-user-query {
  background: #293742;
  border-color: #404854;
  color: #f5f8fa;
}

.bp3-dark .laia-scope-selection-dialog .laia-scope-explanation {
  color: #abb3bf;
}

.bp3-dark .laia-scope-selection-dialog .laia-scope-button {
  border-color: #404854;
  background: #30404d;
}

.bp3-dark .laia-scope-selection-dialog .laia-scope-button:hover {
  border-color: #5c7080;
  background: #394b59;
}

.bp3-dark .laia-scope-selection-dialog .laia-scope-button-recommended {
  border-color: #48aff0;
  background: #1f2933;
}

.bp3-dark .laia-scope-selection-dialog .laia-scope-title {
  color: #f5f8fa;
}

.bp3-dark .laia-scope-selection-dialog .laia-scope-description {
  color: #abb3bf;
}

.bp3-dark .laia-scope-selection-dialog .laia-scope-tip {
  background: #3f3105;
  border-color: #634e11;
  color: #f7e7a1;
}

/* Drag and Drop Overlay for FullResultsPopup */
.full-results-drag-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(2px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  pointer-events: none;
}

.full-results-drag-message {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 24px;
  background: rgba(19, 124, 189, 0.1);
  border: 2px dashed #137cbd;
  border-radius: 8px;
  color: #137cbd;
}

.full-results-drag-message p {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
}

/* Dark mode support for drag overlay */
.bp3-dark .full-results-drag-overlay {
  background: rgba(48, 64, 77, 0.85);
}

.bp3-dark .full-results-drag-message {
  background: rgba(72, 175, 240, 0.15);
  border-color: #48aff0;
  color: #48aff0;
}

/* Ask Query Button (for Roam query blocks) */
.ask-query-button {
  transition: opacity 0.2s ease;
  margin-left: 4px;
}
.ask-query-button:hover {
  opacity: 1;
}
