/* Big Match: the auction card under the touchline, its price lit on a
   little pitch-side scoreboard in amber. Builds on the plugin's own card
   styles. */
@import url("../../../components/auction_card.css");

.ed-card-auction, html.dark .ed-card-auction {
  background: var(--paper-2);
  border: 1px solid var(--rule);
  border-radius: var(--radius, 14px);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.ed-card-auction:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.ed-card-auction::before, html.dark .ed-card-auction::before {
  top: 0; left: 0; right: 0; height: 12px; border-radius: 0; z-index: 2;
  background: var(--bm-band);
}
.ed-card-auction.auction-ended-winner::before { filter: saturate(.5); }
.ed-card-auction .ed-folio { color: var(--theme-600); }

/* The price row: a black LED board, the bid in amber */
.ed-card-auction .flex.items-end.justify-between.border-t {
  position: relative;
  margin: 0 -.25rem; padding: .75rem .9rem .8rem;
  background: radial-gradient(120% 90% at 50% 0%, rgba(255, 255, 255, .06), transparent 60%), #05080e;
  border: 2px solid #2a3346 !important;
  border-radius: 8px;
}
.ed-card-auction .flex.items-end.justify-between.border-t .ed-eyebrow { color: var(--lime); }
.ed-card-auction .flex.items-end.justify-between.border-t p.text-sm { color: #dfe6f1 !important; }
.ed-card-auction .flex.items-end.justify-between.border-t p.text-sm span[style] { color: var(--lime) !important; }
.ed-card-auction .auction-current-bid,
.ed-card-auction .font-display.text-2xl {
  font-family: var(--font-display); font-weight: 900 !important; font-size: clamp(1.5rem, 2.6vw, 1.85rem);
  color: var(--led) !important; letter-spacing: .02em;
  text-shadow: 0 0 10px rgba(255, 184, 28, .45);
  overflow-wrap: normal;
}

.ed-card-auction .info-btn { border: 1px solid var(--rule) !important; color: var(--ink) !important; border-radius: 999px !important; }
.ed-card-auction .info-btn:hover { border-color: var(--theme-500) !important; color: var(--theme-600) !important; }

/* The frame at the weight the theme's home skin gave it, so it still
   wins over the plain rules above. */
html body .ed-card-auction {
  position: relative;
  background: var(--paper-2);
  border: 1px solid var(--rule);
  border-radius: var(--radius, 14px);
  box-shadow: var(--shadow);
}
/* Titles come from the database with no dir; in Arabic and Urdu an
   English name keeps its own order. */
html[dir="rtl"] body .ed-card-auction :is(h2, h3, h4) { unicode-bidi: plaintext; }

/* The info button fills with ink on hover; its icon takes the paper colour
   with it instead of keeping the ink it has at rest. */
.ed-card-auction .info-btn:hover,
.ed-card-auction .info-btn:hover :is(svg, i) { color: var(--paper) !important; }