/* ebay-live.css — the "Live on eBay" module on card pages (comp/ebay-live.js).
   Loaded by the static catalog card page (infra/seo-catalog/templates/card.html) and by the
   web pages that mount the module. Same skin as the results tiles (card-prices-redesign.css):
   the --rx-* tokens, Cinzel small-caps headings, the 4-stop holo as the accent rail. The module
   is a list of outbound listing cards; nothing here is interactive beyond the links. */

.ebl{ position:relative; border:1px solid var(--rx-line, rgba(168,85,247,.28)); border-radius:14px; overflow:hidden;
      background:linear-gradient(180deg, var(--rx-panel, #1c0b2b), var(--rx-panel2, #160821)); color:var(--rx-muted, #e9e0f9);
      margin:1rem 0; }
/* the holo rail the results tiles wear (card-prices-redesign.css .cp-rich-panel.rxcard::after) */
.ebl::after{ content:""; position:absolute; left:0; top:0; height:100%; width:4px; background:var(--holo); opacity:.9; z-index:1; border-radius:14px 0 0 14px; }

.ebl-head{ display:flex; align-items:center; gap:10px; padding:10px 14px 8px 18px; border-bottom:1px solid rgba(168,85,247,.18); }
.ebl-logo{ height:18px; width:auto; display:block; }
.ebl-h{ font-family:"Cinzel",serif; font-weight:700; font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:#fff; }
.ebl-count{ margin-left:auto; font-family:"JetBrains Mono","IBM Plex Mono",monospace; font-size:.62rem; letter-spacing:.06em; text-transform:uppercase; color:var(--rx-dim, #cdbfec); }

.ebl-list{ display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:8px; padding:10px 14px 10px 18px; }
/* one listing: thumb | title + chips | money. The whole card is the affiliate link. */
.ebl-item{ display:grid; grid-template-columns:56px minmax(0,1fr) auto; gap:10px; align-items:center;
           padding:8px; border:1px solid rgba(168,85,247,.16); border-radius:10px; background:var(--rx-inset, rgba(12,6,22,.5));
           color:inherit; text-decoration:none; transition:border-color .15s, transform .15s; }
.ebl-item:hover{ border-color:rgba(251,203,28,.55); transform:translateY(-1px); }
.ebl-thumb{ width:56px; height:56px; border-radius:8px; overflow:hidden; background:rgba(255,255,255,.04); display:flex; align-items:center; justify-content:center; }
.ebl-img{ width:100%; height:100%; object-fit:cover; display:block; }
.ebl-noimg{ background:repeating-linear-gradient(45deg, rgba(168,85,247,.12) 0 6px, transparent 6px 12px); }
.ebl-body{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.ebl-title{ font-family:"Exo 2","Segoe UI",sans-serif; font-size:.8rem; line-height:1.25; color:#fff;
            display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ebl-meta{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.ebl-chip{ font-family:"JetBrains Mono","IBM Plex Mono",monospace; font-size:.55rem; letter-spacing:.06em; text-transform:uppercase;
           padding:2px 6px; border-radius:999px; border:1px solid rgba(168,85,247,.35); color:var(--rx-dim, #cdbfec); }
.ebl-ends{ font-family:"JetBrains Mono","IBM Plex Mono",monospace; font-size:.55rem; letter-spacing:.04em; color:var(--rx-dim, #cdbfec); opacity:.85; }
.ebl-money{ display:flex; flex-direction:column; align-items:flex-end; gap:2px; white-space:nowrap; }
.ebl-amt{ font-family:"JetBrains Mono","IBM Plex Mono",monospace; font-weight:600; font-size:.95rem; color:var(--rx-ebay, #fbcb1c); }
.ebl-note{ font-family:"Cinzel",serif; font-size:.52rem; letter-spacing:.1em; text-transform:uppercase; color:var(--rx-dim, #cdbfec); }

.ebl-foot{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; padding:6px 14px 10px 18px; border-top:1px solid rgba(168,85,247,.18); }
.ebl-more{ font-family:"Cinzel",serif; font-weight:700; font-size:.6rem; letter-spacing:.1em; text-transform:uppercase; color:var(--rx-ebay, #fbcb1c); text-decoration:none; }
.ebl-more:hover{ text-decoration:underline; }
/* the affiliate disclosure sits at the point of the link, every time the module renders */
.ebl-disclosure{ margin-left:auto; font-family:"Exo 2","Segoe UI",sans-serif; font-size:.62rem; color:var(--rx-dim, #cdbfec); opacity:.8; }

@media (max-width:600px){
  .ebl-list{ grid-template-columns:1fr; padding-left:14px; }
  .ebl-disclosure{ margin-left:0; }
}