/* PDF Editor — the selection bar, for text, annotations and text blocks (editor/sel-bar.js, block-mark.js), and the touch selection handles (sel-handles.js). Colours are the shared --sl-* tokens with fallbacks. The bar is
   fixed to the viewport; its row scrolls sideways on a phone, and the colour popover sits outside that scroll area. */
.selbar { position: fixed; left: 0; top: 0; z-index: 60; box-sizing: border-box; max-width: calc(100vw - 16px); padding: 4px; border-radius: 10px; background: var(--sl-surface, #191d26); color: var(--sl-text, #f2f2f2); border: 1px solid var(--sl-border, #323b4c); box-shadow: 0 8px 26px rgba(0, 0, 0, .38); font: 13px/1.2 system-ui, sans-serif; }
.selbar[hidden], .selbar-pop[hidden] { display: none; }
.selbar-row { display: flex; align-items: center; gap: 2px; overflow-x: auto; scrollbar-width: thin; }
.selbar-btn { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 9px; border: 1px solid transparent; border-radius: 7px; background: transparent; color: inherit; font: inherit; white-space: nowrap; cursor: pointer; }
.selbar-btn:hover { background: var(--sl-hover, rgba(255, 255, 255, .08)); }
.selbar-btn:focus-visible, .selbar-sw:focus-visible { outline: 2px solid var(--sl-accent, #ffeae8); outline-offset: 1px; }
.selbar-btn.is-on, .selbar-btn[aria-pressed="true"] { background: var(--sl-accent-soft, rgba(255, 234, 232, .18)); border-color: var(--sl-accent, #ffeae8); }
.selbar-btn[aria-expanded="true"] { background: var(--sl-accent-soft, rgba(255, 234, 232, .18)); border-color: var(--sl-accent, #ffeae8); }
.selbar-dot { width: 12px; height: 12px; flex: 0 0 auto; border-radius: 50%; border: 1px solid var(--sl-border, #323b4c); }
.selbar-sep { flex: 0 0 1px; align-self: stretch; margin: 5px 3px; background: var(--sl-border, #323b4c); }
.selbar-pop { position: absolute; left: 4px; top: calc(100% + 6px); z-index: 1; display: flex; gap: 6px; padding: 7px; border-radius: 9px; background: var(--sl-surface, #191d26); border: 1px solid var(--sl-border, #323b4c); box-shadow: 0 8px 22px rgba(0, 0, 0, .35); }
.selbar.pop-below .selbar-pop { top: auto; bottom: calc(100% + 6px); }
.selbar-sw { width: 26px; height: 26px; padding: 0; border-radius: 50%; border: 2px solid var(--sl-border, #323b4c); cursor: pointer; }
.selbar-sw[aria-pressed="true"] { border-color: var(--sl-text, #f2f2f2); box-shadow: 0 0 0 2px var(--sl-surface, #191d26) inset; }
.selbar-btn.is-danger { color: var(--danger, #ff5a6e); } /* the theme's danger text: 4.5:1 on the bar in each theme */
.selbar-row[hidden], .selbar-btn[hidden] { display: none; }
.selbar-op { height: 30px; padding: 0 10px; border: 1px solid var(--sl-border, #323b4c); }
@media (max-width: 480px) { .selbar-row.is-annot { flex-wrap: wrap; } }
@media (max-width: 900px) { .selbar-btn { padding: 0 7px; } }
/* a text block's Mark up group (editor/block-mark.js, para-bar.js): inline on a wide screen; on a narrow one a "Mark up" button
   opens it below the bar (above it when the bar is low on the screen) */
.para-mk { display: contents; }
.para-mk-toggle { display: none; }
.para-mk-toggle::after { content: ""; width: 0; height: 0; margin-left: 1px; border: 4px solid transparent; border-top-color: currentColor; transform: translateY(2px); }
@media (max-width: 860px) {
  .para-mk-toggle { display: inline-flex; }
  .para-mk { display: none; }
  .para-mk.is-open { position: absolute; left: 4px; right: 4px; top: calc(100% + 6px); z-index: 1; display: flex; flex-wrap: wrap; gap: 2px; padding: 4px; border-radius: 9px; background: var(--sl-surface, #191d26); border: 1px solid var(--sl-border, #323b4c); box-shadow: 0 8px 22px rgba(0, 0, 0, .35); }
  .para-mk.is-open.is-up { top: auto; bottom: calc(100% + 6px); }
  .para-mk .selbar-sep:last-child { display: none; }
}
/* touch selection handles (editor/sel-handles.js): a dot under each end of the selection, in a 32 px touch target */
.sel-knob { position: fixed; z-index: 59; width: 32px; height: 32px; margin-left: -16px; touch-action: none; cursor: grab; }
.sel-knob::before { content: ""; position: absolute; left: 8px; top: 4px; width: 16px; height: 16px; box-sizing: border-box; border-radius: 50%; background: var(--sl-accent, #286eff); border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .45); }
.sel-knob[hidden] { display: none; }
/* a finger's selection of the page's text (the long press, the handles): touch.css turns text selection off on the page view,
   a touch surface, for a coarse pointer */
@media (pointer: coarse) { .pv-textlayer span { -webkit-user-select: text; user-select: text; } }