/* ══════════════════════════════════════════════════════════════════
   RECENT LINKS  (core/link-history.css) — styles for core/link-history.js
   Shared by Send Files, Creative QA and Ad Preview. Every colour comes
   from the shell CSS variables (--panel/--ink/--muted/--line/--indigo/
   --indigo-soft …) which core/dark-tools.css remaps under html.dark —
   so dark mode inherits with no rules of its own here.
   ══════════════════════════════════════════════════════════════════ */
.dlh{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;text-align:left}
.dlh-head{display:flex;align-items:center;gap:9px;width:100%;background:none;border:none;padding:12px 16px;font:inherit;font-size:13px;font-weight:800;color:var(--ink);cursor:pointer;text-align:left}
.dlh-head>i:first-child{color:var(--indigo);font-size:12px}
.dlh-count{color:var(--muted);font-weight:700}
.dlh-chev{margin-left:auto;color:var(--muted);font-size:11px;transition:transform .18s}
.dlh.is-open .dlh-chev{transform:rotate(180deg)}
.dlh-body{padding:2px 9px 9px}
.dlh-row{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:10px}
.dlh-row:hover{background:var(--indigo-soft)}
.dlh-ic{width:30px;height:30px;flex:none;display:grid;place-items:center;border-radius:8px;background:var(--indigo-soft);color:var(--indigo);font-size:13px}
.dlh-row:hover .dlh-ic{background:var(--panel)}
.dlh-link{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;text-decoration:none}
.dlh-name{color:var(--ink);font-size:12.5px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dlh-link:hover .dlh-name{text-decoration:underline;text-underline-offset:2px}
.dlh-more{color:var(--muted);font-style:normal;font-weight:600}
.dlh-meta{display:flex;align-items:center;gap:5px;color:var(--muted);font-size:11px;font-weight:600;white-space:nowrap;overflow:hidden}
.dlh-dot{color:var(--muted)}
.dlh-exp.is-soon{color:var(--orange)}
.dlh-exp.is-expired{color:var(--muted)}
.dlh-row-expired .dlh-ic,.dlh-row-expired .dlh-name{opacity:.5}
/* NOT .btn-dl / [data-dl] / [download] — shell.js would GA-count those as tool_export */
.dlh-copy{display:inline-flex;align-items:center;gap:6px;flex:none;border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:8px;padding:5px 10px;font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;transition:color .15s,border-color .15s}
.dlh-copy:hover{color:var(--indigo);border-color:var(--indigo)}
.dlh-copy.ok,.dlh-copy.ok:hover{color:var(--green);border-color:var(--green)}
.dlh-x{width:26px;height:26px;flex:none;display:grid;place-items:center;border:none;background:none;color:var(--muted);border-radius:8px;font-size:12px;cursor:pointer}
.dlh-x:hover{background:rgba(229,72,77,.12);color:#e5484d}
.dlh-head:focus-visible,.dlh-copy:focus-visible,.dlh-x:focus-visible,.dlh-link:focus-visible{outline:2px solid var(--indigo);outline-offset:2px}
/* Creative QA mounts inside the Export panel (narrow right column) — needs its
   own top gap there; Send Files / Ad Preview mount as main.app flex children,
   where the shell's gap already spaces them. */
#cqaHistory:not([hidden]){margin-top:12px}
#cqaHistory .dlh-copy span{display:none}