/* =========================================================
   Brodlin chrome redesign, 2026-11-07
   Side rail: round tiles in a capsule (variant C), logo colours and red tag.
   Toolbar: square 32px buttons, even gaps, narrower selects.
   Topbar: labels on the icon line, closer to the icon.
   Loaded last; only presentation, no behaviour.
   ========================================================= */
:root {
  --brd-purple: #6d28d9;
  --brd-purple-dark: #2e1065;
  --brd-purple-soft: #ede9fe;
  --brd-purple-hover: #ddd6fe;
  --brd-red: #e5484d;
  --brd-capsule-border: #dfe3ea;
}

/* ---------- Side rail: capsule with logo-style tiles ---------- */
#ipdfPagesShell {
  --brd-rail-top: 9px;
  --brd-tile: 38px;
  --brd-tile-gap: 8px;
}
#ipdfPagesShell::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 4px;
  width: 50px;
  height: calc(var(--brd-rail-top) * 2 + var(--brd-tile) * 4 + var(--brd-tile-gap) * 3 - 4px);
  background: #ffffff;
  border: 1px solid var(--brd-capsule-border);
  border-radius: 999px;
  box-sizing: border-box;
  z-index: 0;
  pointer-events: none;
}
#ipdfPagesShell > #ipdfPagesPanelToggle,
#ipdfPagesShell > #ipdfTemplatePanelToggle,
#ipdfPagesShell > #ipdfAiTextPanelToggle,
#ipdfPagesShell > #ipdfSignatureV3Toggle {
  position: absolute !important;
  left: 10px !important;
  z-index: 1;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: var(--brd-tile) !important;
  height: var(--brd-tile) !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: var(--brd-purple-soft) !important;
  color: var(--brd-purple-dark) !important;
  box-shadow: none !important;
  transition: background-color .15s ease, color .15s ease;
}
#ipdfPagesShell > #ipdfPagesPanelToggle { top: var(--brd-rail-top) !important; }
#ipdfPagesShell > #ipdfTemplatePanelToggle { top: calc(var(--brd-rail-top) + (var(--brd-tile) + var(--brd-tile-gap)) * 1) !important; }
#ipdfPagesShell > #ipdfAiTextPanelToggle { top: calc(var(--brd-rail-top) + (var(--brd-tile) + var(--brd-tile-gap)) * 2) !important; }
#ipdfPagesShell > #ipdfSignatureV3Toggle { top: calc(var(--brd-rail-top) + (var(--brd-tile) + var(--brd-tile-gap)) * 3) !important; }
#ipdfPagesShell > [id$="Toggle"] .material-symbols-outlined {
  font-size: 24px !important;
  color: inherit !important;
}
#ipdfPagesShell > [id$="Toggle"]:hover {
  background: var(--brd-purple-hover) !important;
}
/* Active tile: dark purple with the red logo tag. */
#ipdfPagesShell[data-panel-state="open"] > #ipdfPagesPanelToggle,
#ipdfPagesShell[data-template-state="open"] > #ipdfTemplatePanelToggle,
#ipdfPagesShell[data-ai-text-state="open"] > #ipdfAiTextPanelToggle,
#ipdfPagesShell > [id$="Toggle"][aria-pressed="true"],
#ipdfPagesShell > [id$="Toggle"][aria-expanded="true"] {
  background: var(--brd-purple-dark) !important;
  color: #ffffff !important;
}
#ipdfPagesShell[data-panel-state="open"] > #ipdfPagesPanelToggle::after,
#ipdfPagesShell[data-template-state="open"] > #ipdfTemplatePanelToggle::after,
#ipdfPagesShell[data-ai-text-state="open"] > #ipdfAiTextPanelToggle::after,
#ipdfPagesShell > [id$="Toggle"][aria-pressed="true"]::after,
#ipdfPagesShell > [id$="Toggle"][aria-expanded="true"]::after {
  content: "";
  position: absolute;
  top: -3px;
  right: -3px;
  width: 9px;
  height: 9px;
  border-radius: 2px;
  background: var(--brd-red);
  transform: rotate(20deg);
}
/* While any side panel is open, the whole capsule hides (like the right button);
   the panel takes its usual place. Only one panel can be active. */
#ipdfPagesShell[data-panel-state="open"]::before,
#ipdfPagesShell[data-template-state="open"]::before,
#ipdfPagesShell[data-ai-text-state="open"]::before,
#ipdfPagesShell[data-signature-v3-state="open"]::before {
  display: none !important;
}
#ipdfPagesShell#ipdfPagesShell[data-panel-state="open"] > [id$="Toggle"],
#ipdfPagesShell#ipdfPagesShell[data-template-state="open"] > [id$="Toggle"],
#ipdfPagesShell#ipdfPagesShell[data-ai-text-state="open"] > [id$="Toggle"],
#ipdfPagesShell#ipdfPagesShell[data-signature-v3-state="open"] > [id$="Toggle"] {
  display: none !important;
}

/* ---------- Collaboration button (right) in the same style ---------- */
#ipdfCollaborationDoc.ipdf-collab-launcher {
  width: 52px !important;
  height: 52px !important;
  padding: 0 !important;
  right: 8px !important;
  border: 1px solid var(--brd-capsule-border) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
}
#ipdfCollaborationDoc.ipdf-collab-launcher::before {
  content: "";
  position: absolute;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--brd-purple-soft);
  z-index: 0;
}
#ipdfCollaborationDoc.ipdf-collab-launcher:hover::before { background: var(--brd-purple-hover); }
#ipdfCollaborationDoc.ipdf-collab-launcher .material-symbols-outlined {
  position: relative;
  z-index: 1;
  font-size: 24px !important;
  color: var(--brd-purple-dark) !important;
}

/* ---------- Toolbar: square buttons, even gaps, narrower fields ---------- */
#ipdfToolbar .ipdf-tb-btn:not(.ipdf-tb-btn--arrow) {
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  margin: 0 1px !important;
  border-radius: 8px !important;
  justify-content: center;
}
#ipdfToolbar .ipdf-tb-btn.ipdf-tb-btn--arrow {
  width: 16px !important;
  min-width: 16px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  margin: 0 3px 0 -1px !important;
  border-radius: 6px !important;
}
#ipdfToolbar .ipdf-tb-btn.is-active,
#ipdfToolbar .ipdf-tb-btn[aria-pressed="true"],
#ipdfToolbar .ipdf-tb-btn[data-active="1"] {
  background: var(--brd-purple-soft) !important;
  color: var(--brd-purple-dark) !important;
}
#ipdfToolbar .ipdf-tb-btn:hover:not(.is-disabled) {
  background: #f1eefc !important;
}
#ipdfToolbar .ipdf-tb-select {
  height: 32px !important;
  min-height: 32px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
}
#ipdfToolbar #ipdfParagraphStyle { width: 96px !important; min-width: 96px !important; }
#ipdfToolbar #ipdfFontFamily { width: 104px !important; min-width: 104px !important; }
#ipdfToolbar #ipdfFontSize { width: 58px !important; min-width: 58px !important; }
#ipdfToolbar .ipdf-tb-sep { margin-left: 6px !important; margin-right: 6px !important; }

/* ---------- Topbar: label on the icon line, close to it ---------- */
.ipdf-topbar .ipdf-topbar-action {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 0 8px !important;
}
.ipdf-topbar .ipdf-topbar-action .material-symbols-outlined {
  font-size: 18px !important;
  line-height: 20px !important;
  display: inline-flex;
  align-items: center;
}
.ipdf-topbar .ipdf-topbar-action-label {
  display: inline-flex !important;
  align-items: center;
  line-height: 20px !important;
  height: 20px;
}
.ipdf-topbar [class*="topbar-right"],
.ipdf-topbar [class*="topbar-actions"] {
  align-items: center !important;
}
.ipdf-topbar #ipdfProdSaveStatus,
.ipdf-topbar #ipdfProdUserBlock,
.ipdf-topbar .ipdf-lang-switch {
  display: inline-flex !important;
  align-items: center !important;
  align-self: center !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* ---------- Signature dialog must not break the sticky toolbar (2026-11-07) ----------
   The signature dialog (<dialog class="sc-dialog" open>) sets body{overflow:hidden}.
   That turns <body> into a scroll container, the sticky toolbar stops sticking and
   jumps away, leaving empty space above the side panels. Keep body visible. */
body:has(> dialog.sc-dialog[open]) {
  overflow: visible !important;
}

/* ---------- No slide on page load (2026-11-07) ----------
   Until add-on-multipage.js writes the real top offset on <html>, the side rail
   and the collaboration button would sit at the 110px fallback (behind the
   toolbar) and then slide down. Keep them invisible until positioned; show
   anyway after 3s if the script never runs. */
@keyframes brdShowLate { to { visibility: visible; } }
html:not([style*="--ipdf-multipage-top-offset"]) #ipdfPagesShell,
html:not([style*="--ipdf-multipage-top-offset"]) #ipdfCollaborationDoc {
  visibility: hidden;
  animation: brdShowLate 0s linear 3s forwards;
}

/* ---------- Minimal grey states, no outlines (Denis, 2026-11-07) ----------
   Active = grey three tones darker than the toolbar (#f7f8fa). Hover lighter.
   Purple and red are used rarely; never for toolbar states. */
:root {
  --brd-active: #e3e6ea;
  --brd-hover: #eef0f3;
}
#ipdfToolbar .ipdf-tb-btn,
#ipdfToolbar .ipdf-tbtn,
#ipdfToolbar .ipdf-tb-select,
#ipdfToolbar .ipdf-tb-btn:focus,
#ipdfToolbar .ipdf-tb-btn:focus-visible,
#ipdfToolbar .ipdf-tbtn:focus-visible,
#ipdfToolbar .ipdf-tb-select:focus,
#ipdfToolbar .ipdf-tb-select:focus-visible,
#ipdfToolbar .ipdf-tb-btn.is-disabled {
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important;
}
#ipdfToolbar .ipdf-tb-btn:not(.is-active):not([aria-pressed="true"]):not([data-active="1"]) {
  background: transparent !important;
}
#ipdfToolbar .ipdf-tb-btn:hover:not(.is-disabled) {
  background: var(--brd-hover) !important;
}
#ipdfToolbar .ipdf-tb-btn.is-active,
#ipdfToolbar .ipdf-tb-btn[aria-pressed="true"],
#ipdfToolbar .ipdf-tb-btn[aria-expanded="true"],
#ipdfToolbar .ipdf-tb-btn[data-active="1"] {
  background: var(--brd-active) !important;
  color: #202630 !important;
}
#ipdfToolbar .ipdf-tb-select {
  background-color: transparent !important;
}
#ipdfToolbar .ipdf-tb-select:hover,
#ipdfToolbar .ipdf-tb-select:focus {
  background-color: var(--brd-hover) !important;
}
#ipdfToolbar #ipdfFontSize { width: 72px !important; min-width: 72px !important; }

/* Table size picker: grey selection, no dark outline on selected cells. */
.ipdf-table-picker-cell { border-color: #d3d7dd !important; }
.ipdf-table-picker-cell:hover { background: var(--brd-hover) !important; }
.ipdf-table-picker-cell.is-active {
  background: var(--brd-active) !important;
  border-color: var(--brd-active) !important;
}

/* Emoji: round grey hover, a little larger than the emoji. */
.ipdf-emoji-btn:hover,
.ipdf-emoji-btn:focus-visible {
  background: var(--brd-active) !important;
  border-radius: 50% !important;
  outline: none !important;
}

/* ---------- Grey dropdown for toolbar selects (2026-11-08) ---------- */
.brd-select-menu {
  position: fixed;
  z-index: 100000;
  max-height: 320px;
  overflow-y: auto;
  padding: 4px;
  background: #ffffff;
  border: 1px solid #e6e8ec;
  border-radius: 8px;
  box-shadow: 0 6px 20px rgba(15, 23, 42, .08);
  box-sizing: border-box;
  font-size: 13px;
  color: #202630;
}
.brd-select-item {
  padding: 6px 10px;
  border-radius: 6px;
  cursor: pointer;
  white-space: nowrap;
  line-height: 18px;
}
.brd-select-item:hover { background: var(--brd-hover, #eef0f3); }
.brd-select-item.is-selected { background: var(--brd-active, #e3e6ea); }
#ipdfToolbar .ipdf-tb-select[data-brd-open] { background-color: var(--brd-active, #e3e6ea) !important; }

/* ---------- Select + list as one grey piece, compact (2026-11-08) ---------- */
#ipdfToolbar #ipdfFontSize { width: 64px !important; min-width: 64px !important; }
#ipdfToolbar .ipdf-tb-select[data-brd-open] {
  background-color: var(--brd-active, #e3e6ea) !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
.brd-select-menu {
  padding: 2px !important;
  border: 0 !important;
  border-radius: 0 0 8px 8px !important;
  background: var(--brd-active, #e3e6ea) !important;
  box-shadow: 0 6px 14px rgba(15, 23, 42, .06) !important;
  font-size: 13px !important;
}
.brd-select-item {
  padding: 3px 8px !important;
  line-height: 16px !important;
  border-radius: 5px !important;
}
.brd-select-item:hover { background: #d6dade !important; }
.brd-select-item.is-selected { background: #cfd3d8 !important; }

/* Emoji: circle centred on the glyph; grey tooltip. */
.ipdf-emoji-btn {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  width: 34px !important;
  height: 34px !important;
}
.ipdf-emoji-btn[data-brd-tip]:hover::after {
  content: attr(data-brd-tip);
  position: absolute;
  left: 50%;
  top: calc(100% + 2px);
  transform: translateX(-50%);
  padding: 2px 6px;
  border-radius: 5px;
  background: var(--brd-active, #e3e6ea);
  color: #202630;
  font: 12px/16px system-ui, sans-serif;
  white-space: nowrap;
  pointer-events: none;
  z-index: 5;
}

/* ---------- Topbar: label level with the icon, closer (2026-11-08) ----------
   An older rule lifted the label by top:-2px. */
.ipdf-topbar .ipdf-topbar-action { gap: 3px !important; }
.ipdf-topbar .ipdf-topbar-action .ipdf-topbar-action-label {
  position: static !important;
  top: auto !important;
}