/* mindmap5.3 · css/reader-selection.css —— 摘录图标浮层、分组换行与手机三行布局 */
.reader-selection-menu {
  --selection-hit: var(--reader-selection-control);
  position: fixed; z-index: var(--reader-selection-z); box-sizing: border-box;
  width: max-content; padding: var(--reader-selection-padding);
  border: 1px solid var(--ui-border); border-radius: var(--ui-toolbar-radius);
  background: var(--ui-panel); color: var(--ui-text); box-shadow: var(--ui-shadow);
  font: var(--ui-font-control)/1.5 var(--ui-font); user-select: none;
}
.reader-selection-menu[hidden], .reader-selection-menu [hidden], .reader-selection-tooltip[hidden], .mm-color-tray-auto[hidden] { display: none !important; }
.reader-selection-tools, .reader-selection-new-actions, .reader-selection-operations,
.reader-selection-knowledge, .reader-selection-utility, .reader-selection-styles, .reader-selection-targets {
  display: flex; align-items: center; gap: var(--reader-selection-gap);
}
.reader-selection-tools { flex-wrap: wrap; }
.reader-selection-operations { flex-wrap: wrap; }
.reader-selection-appearance { display: contents; }
.reader-selection-menu button, .reader-selection-menu select {
  box-sizing: border-box; min-height: var(--selection-hit); font: inherit; color: inherit;
  border: 1px solid transparent; border-radius: var(--ui-button-radius); background: transparent;
}
.reader-selection-tools button {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: var(--selection-hit); height: var(--selection-hit); min-width: var(--selection-hit); padding: 0;
}
.reader-selection-tools .mm-icon { width: var(--reader-selection-symbol); height: var(--reader-selection-symbol); }
.reader-selection-menu button { cursor: pointer; }
.reader-selection-menu button:hover:not(:disabled) { background: var(--ui-hover-bg); color: var(--ui-hover-text); }
.reader-selection-menu button[aria-pressed="true"] { background: var(--ui-pressed-bg); color: var(--ui-pressed-text); }
.reader-selection-menu button:disabled, .reader-selection-menu select:disabled { opacity: var(--ui-disabled-opacity); cursor: not-allowed; }
.reader-selection-menu button:focus-visible, .reader-selection-menu select:focus-visible,
.mm-color-tray[data-context="reader-selection"] button:focus-visible {
  outline: var(--ui-focus-width) solid var(--ui-accent); outline-offset: var(--ui-focus-offset);
}
.reader-selection-colors {
  display: flex; align-items: center; flex-wrap: nowrap; gap: var(--reader-selection-swatch-gap);
  min-height: var(--selection-hit); padding-inline: var(--reader-selection-swatch-gap);
  border-inline: 0;
}
/* 热区和可见色块分开：桌面20px方块，触摸仍保留44px命中区域。 */
.reader-selection-colors .mm-color-chip, .reader-selection-colors .mm-color-tray-btn {
  position: relative; width: var(--reader-selection-swatch); height: var(--reader-selection-swatch);
  min-width: var(--reader-selection-swatch); min-height: var(--reader-selection-swatch); padding: 0;
  border: 0; border-radius: var(--ui-button-radius); background: transparent; box-shadow: none; transform: none;
}
.reader-selection-colors .mm-color-chip::before, .mm-color-tray[data-context="reader-selection"] .mm-color-chip::before {
  content: ''; position: absolute; width: var(--reader-selection-swatch); height: var(--reader-selection-swatch);
  left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: var(--ui-button-radius); background: var(--swatch);
}
.reader-selection-colors .mm-color-chip.on::before, .mm-color-tray[data-context="reader-selection"] .mm-color-chip.on::before {
  outline: var(--ui-focus-width) solid var(--ui-accent); outline-offset: var(--ui-focus-offset);
}
.reader-selection-colors .mm-color-tray-btn { display: inline-flex; color: var(--ui-text); border: 1px solid var(--ui-border); }
.reader-selection-colors .mm-color-tray-btn .mm-icon { width: var(--reader-selection-palette-symbol); height: var(--reader-selection-palette-symbol); }
.reader-selection-current-color {
  position: absolute; right: -3px; bottom: -3px; width: 8px; height: 8px; border: 1px solid var(--ui-panel);
  border-radius: 2px; background: var(--reader-selection-current); pointer-events: none;
}
.reader-selection-current-color.is-mixed { background: linear-gradient(135deg, var(--ui-accent) 50%, var(--ui-panel) 50%); }
.reader-selection-menu .reader-selection-remove { color: var(--ui-danger); }
.reader-selection-menu .reader-selection-remove:hover:not(:disabled) { color: var(--ui-danger); background: var(--ui-hover-bg); }
.reader-selection-reason { max-width: var(--reader-selection-mobile-width); margin: var(--reader-selection-gap) 0 0; color: var(--ui-muted); font-size: 12px; overflow-wrap: anywhere; }
.reader-selection-targets { flex-wrap: wrap; margin-top: var(--reader-selection-gap); }
.reader-selection-targets select, .reader-selection-targets button { border-color: var(--ui-border); padding-inline: 8px; }
.reader-selection-targets select { min-width: 0; max-width: 100%; background: var(--ui-panel); }
.reader-selection-targets select:last-child { flex: 1 1 100%; width: 100%; text-overflow: ellipsis; }
/* 按功能组自然换行，手机与桌面保持相同阅读顺序；不把关闭固定到首行。 */
.reader-selection-menu .reader-selection-labeled { width: auto; padding-inline: var(--reader-selection-padding); gap: var(--reader-selection-gap); white-space: nowrap; }
.reader-selection-knowledge, .reader-selection-utility { flex-wrap: wrap; }
.reader-selection-menu.is-narrow .reader-selection-new-actions { display: contents; }
.reader-selection-menu.is-mobile .reader-selection-tools,
.reader-selection-menu.is-mobile .reader-selection-operations { display: flex; flex-wrap: wrap; }
.reader-selection-menu.is-mobile .reader-selection-colors { border: 0; }
.reader-selection-menu.is-mobile .reader-selection-styles { flex-wrap: wrap; }
.reader-selection-menu.is-mobile .reader-selection-colors .mm-color-tray-btn { border-color: transparent; }
.reader-selection-menu.is-mobile .reader-selection-colors .mm-color-tray-btn .mm-icon { width: var(--reader-selection-symbol); height: var(--reader-selection-symbol); }
.mm-color-tray[data-context="reader-selection"] { z-index: calc(var(--reader-selection-z) + 1); box-sizing: border-box; }
.mm-color-tray[data-context="reader-selection"] .mm-color-chip { border: 0; background: transparent; box-shadow: none; transform: none; }
@media (pointer: coarse) {
  .reader-selection-menu { --selection-hit: var(--ui-touch-target); }
  .reader-selection-colors .mm-color-chip, .reader-selection-colors .mm-color-tray-btn {
    width: var(--ui-touch-target); height: var(--ui-touch-target); min-width: var(--ui-touch-target); min-height: var(--ui-touch-target);
  }
  .reader-selection-colors { gap: 0; }
}
.reader-selection-tooltip {
  position: fixed; z-index: max(calc(var(--reader-selection-z) + 2), calc(var(--z-ctxmenu) + 3)); pointer-events: none; box-sizing: border-box;
  max-width: min(var(--reader-selection-tooltip-width), calc(100vw - 16px)); padding: 7px 10px;
  border-radius: var(--ui-button-radius); background: var(--reader-selection-tooltip-bg); color: var(--reader-selection-tooltip-text);
  box-shadow: var(--ui-shadow); font: 12px/1.5 var(--font-ui); overflow-wrap: anywhere;
}
.reader-selection-tooltip::after {
  content: ''; position: absolute; left: var(--reader-tooltip-arrow); width: 8px; height: 8px;
  background: inherit; transform: translateX(-50%) rotate(45deg); bottom: -4px;
}
.reader-selection-tooltip[data-side="below"]::after { top: -4px; bottom: auto; }
