/* Japandi auction card: a linen card standing on an oak edge, the lot on
   a pale glazed plate on the daylit wall; the price is written on a small
   wall label in Spectral, a hairline above it. Builds on the plugin's own
   card styles. */
@import url("../../../components/auction_card.css");

.ed-card-auction, html.dark .ed-card-auction {
  position: relative;
  background: var(--jd-linen), var(--paper-2);
  border: 1px solid var(--rule);
  border-radius: var(--radius, 14px);
  box-shadow: var(--shadow);
  overflow: hidden;
  transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s ease, border-color .3s ease;
}
.ed-card-auction:hover, .ed-card-auction:focus-within { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--jd-hair); }
.ed-card-auction::before, html.dark .ed-card-auction::before {
  top: auto; bottom: 0; left: 0; right: 0; height: 5px; border-radius: 0; z-index: 2;
  background: var(--jd-shelf);
}
.ed-card-auction.auction-ended-winner::before { opacity: .55; }
.ed-card-auction .ed-folio { color: var(--ink-soft); font-family: var(--font-display); }
.ed-card-auction h3 { font-family: var(--font-display); font-weight: 400; unicode-bidi: plaintext; }

/* The photo well: the daylit wall, the lot on a glazed plate */
.ed-card-auction > [class*="aspect-"] {
  background:
    radial-gradient(circle at 50% 52%, #fffdf8 0, #f1eadf 24%, #ddd3c3 calc(37% - 1px), rgba(120, 100, 70, .22) 37%, transparent calc(37% + 1px)),
    var(--jd-window) 80% -30px / 150% auto no-repeat,
    linear-gradient(180deg, #f1ebe1, #e9e2d6) !important;
}
html.dark .ed-card-auction > [class*="aspect-"] {
  background:
    radial-gradient(circle at 50% 52%, #fbf6ec 0, #ece4d6 24%, #cfc4b2 calc(37% - 1px), rgba(0, 0, 0, .3) 37%, transparent calc(37% + 1px)),
    radial-gradient(60% 60% at 50% 52%, rgba(232, 180, 110, .2), transparent 70%),
    linear-gradient(180deg, #2a2520, #221e1a) !important;
}
.ed-card-auction > [class*="aspect-"] img { mix-blend-mode: multiply; transform: scale(.6); transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.ed-card-auction:hover > [class*="aspect-"] img { transform: scale(.6) translateY(-4px); }

/* The price row: a wall label under a hairline */
.ed-card-auction .flex.items-end.justify-between.border-t {
  position: relative;
  margin: 0; padding: .9rem 0 .2rem;
  background: none;
  border: 0 !important;
  border-top: 1px solid var(--rule) !important;
  border-radius: 0;
  box-shadow: none;
}
.ed-card-auction .flex.items-end.justify-between.border-t :is(span, p, div):not(.auction-current-bid):not(.font-display) { color: var(--ink-soft) !important; letter-spacing: .14em; }
.ed-card-auction .auction-current-bid,
.ed-card-auction .font-display.text-2xl { font-family: var(--font-display); font-weight: 400 !important; letter-spacing: -.01em; font-size: clamp(1.35rem, 5vw, 1.6rem); color: var(--ink) !important; overflow-wrap: normal; white-space: nowrap; font-variant-numeric: lining-nums; }

.ed-card-auction .info-btn { border: 1px solid var(--jd-hair) !important; color: var(--ink) !important; border-radius: 10px !important; }
.ed-card-auction .info-btn:hover { border-color: var(--ink-soft) !important; }
/* The skin's ink for filled icon tiles also catches this round button, which has no fill; the icon follows the button. :is(#_) only lifts specificity past the tile rule. */
html body #px-spa-content .ed-card-auction .info-btn:is(.info-btn, #_) > svg { color: inherit !important; transform: none !important; filter: none !important; }