/* ═══════════════════════════════════════════════════════════════════════════
   SHARE CONTEXT + LINK HISTORY  (core/share-ctx.css)  — pairs with share-ctx.js

   ⚠ THIS SHEET IS GLOBAL. Every class here is prefixed `dlsx-` so nothing can
   reach a tool's own markup; never add a bare element selector to this file.

   ⚠ THE FOCUS RULES CANNOT BE SCOPED TO A TOOL. Their ancestors in the original
   (Social Ad QA) were `.sf-app .sfe-ctx-sel:focus` — a scope that simply would
   not exist in any other tool, so the ring would have vanished silently. They
   are re-specified here as `.dlsx-ctx .dlsx-sel:focus` (0,3,0) rather than a
   bare `.dlsx-sel:focus` (0,2,0), because the site sheet carries
   `input:focus` / `select:focus` rules that outrank a single class — the same
   collision that once left the feedback modal's email field with no ring at all.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ⚠ NO OUTER MARGINS. These blocks are rendered INSIDE a host div, so they are
   grandchildren of main.app — and shell.css's `main.app > section,main.app > div
   {margin-top:0;margin-bottom:0}` only reaches the host, not them. Their own
   margins would therefore stack on top of main.app's 25px gap. Spacing is the
   parent's job here, which is the same reasoning .dl-hero-stack was built on. */

/* ⚠ SELF-GUARD THE hidden ATTRIBUTE. Eight controls here toggle `hidden`, and
   every one of them sets an explicit display, which BEATS the UA default. Today
   they vanish only because core/shell.css carries
   `.tool [hidden],main.app [hidden]{display:none!important}` — mount this module
   anywhere outside .tool / main.app and all eight render as visible empty boxes.
   A shared module cannot depend on where it happens to be mounted. */
.dlsx-ctx [hidden],.dlsx-hist[hidden],.dlsx-ctx.dlsx-grp[hidden]{display:none!important}
.dlsx-grp[hidden],.dlsx-logo[hidden],.dlsx-btn[hidden]{display:none!important}

.dlsx-ctx{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0;padding:11px 14px;
          border:1px solid #e2e8f2;border-radius:12px;background:#f8fafd}
.dlsx-grp{display:flex;align-items:center;gap:6px;min-width:0}
.dlsx-lbl{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;
          letter-spacing:.03em;text-transform:uppercase;color:#6a7284;white-space:nowrap}
.dlsx-lbl i{color:#4338ca}
.dlsx-sel{height:32px;min-width:150px;max-width:210px;margin:0;padding:0 9px;border:1px solid #dde3ec;
          border-radius:8px;background:#fff;color:#1a2233;font:inherit;font-size:12.5px}
.dlsx-sel:disabled{opacity:.55;cursor:default}
.dlsx-ctx .dlsx-sel:focus{outline:none;border-color:#4338ca;box-shadow:0 0 0 3px rgba(67,56,202,.13)}
.dlsx-btn{width:29px;height:29px;flex:none;display:grid;place-items:center;border:1px solid #dde3ec;
          border-radius:8px;background:#fff;color:#5a6478;font-size:11.5px;cursor:pointer;transition:.14s;padding:0}
.dlsx-btn:hover{background:#eef3fe;border-color:#4338ca;color:#4338ca}
.dlsx-btn:disabled{opacity:.4;cursor:default}
.dlsx-btn:disabled:hover{background:#fff;border-color:#dde3ec;color:#5a6478}
.dlsx-ctx .dlsx-btn:focus-visible,.dlsx-hist .dlsx-btn:focus-visible{outline:2px solid #4338ca;outline-offset:1px}
.dlsx-del:hover{background:#fdecec;border-color:#c0392b;color:#c0392b}
.dlsx-logo{width:29px;height:29px;flex:none;border:1px solid #dde3ec;border-radius:8px;overflow:hidden;background:#fff}
.dlsx-logo img{width:100%;height:100%;object-fit:contain;display:block}
.dlsx-hint{flex:1 1 200px;min-width:0;font-size:11px;line-height:1.45;color:#6b717f}

html.dark .dlsx-ctx{background:#151a21;border-color:#2a3140}
html.dark .dlsx-lbl{color:#9aa4b6}
html.dark .dlsx-lbl i{color:#8d8bff}
html.dark .dlsx-sel{background:#171c24;border-color:#2a3140;color:#e8edf6}
html.dark .dlsx-btn{background:#171c24;border-color:#2a3140;color:#98a2b3}
html.dark .dlsx-btn:hover{background:#1d2634;border-color:#6d63e8;color:#a5b4fc}
html.dark .dlsx-btn:disabled:hover{background:#171c24;border-color:#2a3140;color:#98a2b3}
html.dark .dlsx-del:hover{background:#2a1618;border-color:#a5322a;color:#ff9d94}
html.dark .dlsx-logo{background:#171c24;border-color:#2a3140}
html.dark .dlsx-hint{color:#949daf}

@media (max-width:760px){
  .dlsx-ctx{gap:10px;padding:10px}
  .dlsx-sel{min-width:120px}
  .dlsx-hint{flex-basis:100%}
}

/* ── link-domain chip (opens the shared picker in core/link-domain.js) ────── */
.dlsx-dom{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 11px;border:1px solid #dde3ec;
          border-radius:8px;background:#fff;font:inherit;font-size:12.5px;font-weight:700;color:#2f6b46;cursor:pointer}
.dlsx-dom:hover{border-color:#4338ca;color:#4338ca}
.dlsx-dom i{font-size:9px;opacity:.7}
html.dark .dlsx-dom{background:#171c24;border-color:#2a3140;color:#7fd8a4}
html.dark .dlsx-dom:hover{border-color:#6d63e8;color:#a5b4fc}

/* ── the links history panel ──────────────────────────────────────────────── */
.dlsx-hist{margin:0}
.dlsx-hist-head{display:flex;align-items:center;gap:10px;margin:0 0 12px}
.dlsx-hist-head h3{margin:0;font-size:15px;font-weight:800;color:#1a2233;display:flex;align-items:center;gap:8px}
.dlsx-hist-head h3 i{color:#4338ca;font-size:13px}
.dlsx-hist-meter{font-size:12px;color:#8b93a5;margin-right:auto}
.dlsx-hist-body{display:flex;flex-direction:column;gap:6px}
.dlsx-hist-row{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid #e6ebf3;border-radius:10px;
               background:#fbfcfe;transition:.14s}
.dlsx-hist-row:hover{border-color:#c6d2e6;background:#f4f8fd}
.dlsx-hist-open{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;align-items:flex-start;
                border:0;background:none;padding:0;font:inherit;cursor:pointer;text-align:left}
/* a row with no reopen handler is not a button and must not pretend to be one */
.dlsx-hist-open.is-static{cursor:default}
.dlsx-hist-t{font-size:13px;font-weight:700;color:#1a2233;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dlsx-hist-s{font-size:11.5px;color:#7a8398}
.dlsx-hist-acts{flex:none;display:inline-flex;gap:5px}
.dlsx-hist-acts a.dlsx-btn{text-decoration:none}
.dlsx-hist-empty{margin:0;padding:14px;text-align:center;font-size:12.5px;color:#8b93a5;
                 border:1px dashed #dde3ec;border-radius:10px}
.dlsx-hist-retry{border:0;background:none;padding:0;font:inherit;font-weight:700;color:#4338ca;cursor:pointer;text-decoration:underline}
.dlsx-hist-note{margin:11px 0 0;font-size:11.5px;line-height:1.5;color:#8b93a5;display:flex;gap:7px;align-items:flex-start}
html.dark .dlsx-hist-head h3{color:#e8edf6}
html.dark .dlsx-hist-head h3 i{color:#8d8bff}
html.dark .dlsx-hist-meter,html.dark .dlsx-hist-s,html.dark .dlsx-hist-note,html.dark .dlsx-hist-empty{color:#8d97a9}
html.dark .dlsx-hist-row{background:#151a21;border-color:#2a3140}
html.dark .dlsx-hist-row:hover{background:#1a212b;border-color:#3a4354}
html.dark .dlsx-hist-t{color:#e8edf6}
html.dark .dlsx-hist-empty{border-color:#2a3140}
html.dark .dlsx-hist-retry{color:#a5b4fc}

/* ── which tool a link belongs to ────────────────────────────────────────────
   Every row carries it, not only the foreign ones: a tag that appears sometimes
   reads as a warning, one that is always there reads as an address. */
.dlsx-hist-own{display:inline-block;margin-left:8px;padding:1px 6px;border-radius:5px;
  background:#eef1fe;color:#4338ca;font-size:9.5px;font-weight:800;font-style:normal;
  letter-spacing:.02em;vertical-align:middle;white-space:nowrap}
.dlsx-hist-row.is-other .dlsx-hist-t{color:#4a5265}
.dlsx-hist-row.is-other .dlsx-hist-own{background:#f1f3f7;color:#5a6478}
html.dark .dlsx-hist-own{background:#232a3d;color:#a5b4fc}
html.dark .dlsx-hist-row.is-other .dlsx-hist-t{color:#b9c1d1}
html.dark .dlsx-hist-row.is-other .dlsx-hist-own{background:#252b36;color:#98a2b3}
/* the quieter second action on a foreign row */
.dlsx-use{width:auto;padding:0 8px;font-size:10.5px;font-weight:800;letter-spacing:.02em}