/* ============================================================
   beedle — RichText editor widget (app side only)
   Styling for the contentEditable editor + its toolbar. The stored
   HTML is self-styling (inline styles), so the REPORT needs none of
   this — report.css is untouched. Tokens come from dataroom.css.
   ============================================================ */
.rt { border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); transition: border-color .16s, box-shadow .16s; }
.rt:focus-within { border-color: var(--blue); box-shadow: 0 0 0 4px var(--blue-wash); }

/* toolbar — hidden until focus in compact mode, always shown when expanded */
.rt-toolbar { display: flex; align-items: center; gap: 2px; flex-wrap: wrap;
              padding: 6px; border-bottom: 1px solid var(--line-2); }
.rt-compact .rt-toolbar { display: none; }
.rt-compact:focus-within .rt-toolbar { display: flex; }

.rt-btn { width: 28px; height: 28px; padding: 0; border: 0; background: none; border-radius: 7px;
          color: var(--ink-2); cursor: pointer; display: grid; place-items: center; transition: .12s; }
.rt-btn:hover { background: var(--paper-2); color: var(--ink); }
.rt-btn.on { background: var(--blue-wash); color: var(--blue-ink); }
.rt-sep { width: 1px; height: 18px; background: var(--line); margin: 0 4px; flex: none; }
.rt-grow { flex: 1; }

/* size dropdown */
.rt-size { position: relative; }
.rt-menu { position: absolute; top: 32px; left: 0; z-index: 10; min-width: 132px;
           background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-sm);
           box-shadow: var(--shadow); padding: 4px; }
.rt-menu-item { display: block; width: 100%; text-align: left; border: 0; background: none;
                padding: 6px 9px; border-radius: 6px; cursor: pointer; color: var(--ink); font-family: var(--sans); }
.rt-menu-item:hover { background: var(--paper-2); }
.rt-menu-item[data-size="small"]  { font-size: 11px; }
.rt-menu-item[data-size="normal"] { font-size: 13px; }
.rt-menu-item[data-size="medium"] { font-size: 16px; }
.rt-menu-item[data-size="big"]    { font-size: 20px; font-weight: 600; }
.rt-menu-item[data-size="title"]  { font-size: 28px; font-weight: 700; }
.rt-menu-item[data-head="<h1>"]   { font-size: 22px; font-weight: 700; }
.rt-menu-item[data-head="<h2>"]   { font-size: 18px; font-weight: 700; }
.rt-menu-item[data-head="<h3>"]   { font-size: 15px; font-weight: 600; }
.rt-menu-item[data-head="<p>"]    { font-size: 13px; }

/* colour swatches */
.rt-colors { display: inline-flex; align-items: center; gap: 4px; }
.rt-sw { width: 18px; height: 18px; padding: 0; border-radius: 5px; border: 1px solid rgba(20,36,46,.18);
         cursor: pointer; transition: transform .1s; }
.rt-sw:hover { transform: scale(1.12); }

/* editable surface + placeholder overlay */
.rt-areawrap { position: relative; }
.rt-area { padding: 10px 12px; font: 14px/1.55 var(--sans); color: var(--ink); outline: none;
           overflow-wrap: anywhere; }
.rt-area b, .rt-area strong { font-weight: 700; }
.rt-ph { position: absolute; top: 10px; left: 12px; right: 12px; color: var(--ink-4);
         font: 14px/1.55 var(--sans); pointer-events: none; }

/* expand modal sits above any host modal (.scrim is z-index 200) and is large —
   a near-full-screen surface for comfortable long-form editing. */
.rt-scrim { z-index: 380; }
.rt-modal { max-width: min(1180px, 94vw); width: 100%; max-height: 92vh; }

/* the data-room page-editor modals must sit above the document viewer (z 300);
   the RichText expand modal (.rt-scrim, 380) still layers above these. */
.rt-doc-scrim { z-index: 320; }
.rt-doc-modal { max-width: min(1100px, 95vw); width: 100%; max-height: 92vh; }
.rt-doc-modal .modal-body { display: flex; flex-direction: column; }
.rt-doc-modal .rt { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.rt-doc-modal .rt-areawrap { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.rt-doc-modal .rt-area { flex: 1; overflow: auto; }
.rt-modal .modal-body { display: flex; padding-bottom: 14px; }
.rt-modal .rt { flex: 1; display: flex; flex-direction: column; }
.rt-modal .rt-areawrap { flex: 1; display: flex; flex-direction: column; }
.rt-modal .rt-area { flex: 1; font-size: 15px; line-height: 1.6; overflow: auto; }

/* doc-mode (full) — a roomier surface for authoring data-room HTML pages */
.rt-modal-full { max-width: min(1320px, 96vw); width: 100%; height: 92vh; max-height: 92vh; }
.rt-modal-full .modal-body { display: flex; padding-bottom: 14px; }
.rt-modal-full .rt, .rt-modal-full .rt-areawrap { flex: 1; display: flex; flex-direction: column; }
.rt-modal-full .rt-area { flex: 1; overflow: auto; }

/* base styling for the richer block tags inside the editor surface (the
   data-room viewer mirrors these in .htmldoc; the report path is untouched) */
.rt-area h1 { font-size: 1.9em; font-weight: 700; line-height: 1.25; margin: .5em 0 .35em; }
.rt-area h2 { font-size: 1.5em; font-weight: 700; line-height: 1.3; margin: .5em 0 .3em; }
.rt-area h3 { font-size: 1.2em; font-weight: 600; line-height: 1.35; margin: .5em 0 .25em; }
.rt-area ul, .rt-area ol { margin: .4em 0; padding-left: 1.6em; }
.rt-area li { margin: .15em 0; }
.rt-area blockquote { margin: .6em 0; padding: .2em 0 .2em 14px; border-left: 3px solid var(--line);
                      color: var(--ink-2); font-style: italic; }
.rt-area hr { border: 0; border-top: 1px solid var(--line); margin: 1em 0; }
.rt-area a { color: var(--blue-ink); text-decoration: underline; }
.rt-area img { max-width: 100%; height: auto; border-radius: 6px; }
.rt-area table { border-collapse: collapse; margin: .6em 0; }
.rt-area td, .rt-area th { border: 1px solid var(--line); padding: 5px 9px; text-align: left; }
.rt-area th { background: var(--paper-2); font-weight: 600; }

/* rendered admin-authored page (data-room viewer). The stored HTML carries
   inline prose styling but block tags need these; the report path is untouched. */
.htmldoc { font: 15px/1.65 var(--sans); color: var(--ink); max-width: 78ch; }
.htmldoc h1 { font-size: 1.9em; font-weight: 700; line-height: 1.25; margin: .6em 0 .35em; }
.htmldoc h2 { font-size: 1.5em; font-weight: 700; line-height: 1.3; margin: .8em 0 .3em; }
.htmldoc h3 { font-size: 1.2em; font-weight: 600; line-height: 1.35; margin: .7em 0 .25em; }
.htmldoc p { margin: .6em 0; }
.htmldoc ul, .htmldoc ol { margin: .5em 0; padding-left: 1.6em; }
.htmldoc li { margin: .2em 0; }
.htmldoc blockquote { margin: .8em 0; padding: .3em 0 .3em 16px; border-left: 3px solid var(--line);
                      color: var(--ink-2); font-style: italic; }
.htmldoc hr { border: 0; border-top: 1px solid var(--line); margin: 1.4em 0; }
.htmldoc a { color: var(--blue-ink); text-decoration: underline; }
.htmldoc img { max-width: 100%; height: auto; border-radius: 8px; margin: .4em 0; }
.htmldoc table { border-collapse: collapse; margin: .8em 0; }
.htmldoc td, .htmldoc th { border: 1px solid var(--line); padding: 6px 11px; text-align: left; }
.htmldoc th { background: var(--paper-2); font-weight: 600; }

/* compact, light-touch variant used inline in the revenue-engine cards */
.rt.enote-rt { border-color: transparent; background: transparent; }
.rt.enote-rt:focus-within { border-color: var(--blue); background: var(--surface); }
.rt.enote-rt .rt-area { padding: 4px 6px; font-size: 12.5px; color: var(--ink-2); }
.rt.enote-rt .rt-ph { top: 4px; left: 6px; font-size: 12.5px; color: var(--ink-4); }