/* The Fruit Wagers page: the whole site chrome goes purple + gold while you are here.
   (Light theme keeps its own palette.) The page itself is styled by fruit-wagers.css, the hero by stakes.css (.hsx). */

html[data-theme]:not([data-theme="white"]):has(body.page-wagers) {
  /* near-black with only a hint of plum; gold does the accenting, purple lives in the hero */
  --bg: #06030a; --bg-2: #0d0614;
  --panel: rgba(16, 9, 26, .97); --panel-solid: #100919; --plate: #130a1e; --plate-2: #1d1030; --fade: #05020a;
  --red: #5a4210; --red-rgb: 90, 66, 16; --red-hot: #d9a21b; --blood: #3a2a08; --blood-rgb: 58, 42, 8;
  --hot: #ffcb5c; --hot-rgb: 255, 203, 92; --hot-ink: #2a1200; --hot-text: #ffd982; --rim: #8a6a1f;
  --muted: #cdbfdb; --text-soft: #f0e6ff; --placeholder: #9a8aae;
  --pop-bg: #0d0614; --row-bg: rgba(12, 6, 20, .92); --chip-bg: rgba(34, 22, 8, .88); --danger-fill: #130a1e;
  --btn-fill: linear-gradient(180deg, #ffe08f, #f4b942 55%, #d98b17);
  --live: #ffcb5c;
}
/* the logo: same art, shifted from red to purple */
body.page-wagers .logo-img { filter: hue-rotate(292deg) saturate(1.15) brightness(1.05); }

/* the hero uses the same markup as the home banner; here its fruit art comes from the page's embedded glyphs */
#fruit-wagers .bp-hero { margin-bottom: 14px; }
#fruit-wagers .hsx-pair .bp-glyph { position: absolute; top: 50%; width: 84px; height: 84px; margin-top: -42px; border: 0; background-color: transparent;
  filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .6)) drop-shadow(0 0 12px rgba(176, 77, 255, .55)); font-size: 0; }
#fruit-wagers .hsx-pair .bp-glyph.hsx-l { left: 0; }
#fruit-wagers .hsx-pair .bp-glyph.hsx-r { right: 0; left: auto; }
#fruit-wagers .hsx-cycle .bp-glyph { position: absolute; inset: 0; width: 22px; height: 22px; border: 0; background-color: transparent; opacity: 0; font-size: 0;
  animation: hsx-fruit 3.6s steps(1, end) infinite; }
#fruit-wagers .hsx-cycle .bp-glyph:nth-child(1) { animation-delay: 0s; }    #fruit-wagers .hsx-cycle .bp-glyph:nth-child(2) { animation-delay: .3s; }
#fruit-wagers .hsx-cycle .bp-glyph:nth-child(3) { animation-delay: .6s; }   #fruit-wagers .hsx-cycle .bp-glyph:nth-child(4) { animation-delay: .9s; }
#fruit-wagers .hsx-cycle .bp-glyph:nth-child(5) { animation-delay: 1.2s; }  #fruit-wagers .hsx-cycle .bp-glyph:nth-child(6) { animation-delay: 1.5s; }
#fruit-wagers .hsx-cycle .bp-glyph:nth-child(7) { animation-delay: 1.8s; }  #fruit-wagers .hsx-cycle .bp-glyph:nth-child(8) { animation-delay: 2.1s; }
#fruit-wagers .hsx-cycle .bp-glyph:nth-child(9) { animation-delay: 2.4s; }  #fruit-wagers .hsx-cycle .bp-glyph:nth-child(10) { animation-delay: 2.7s; }
#fruit-wagers .hsx-cycle .bp-glyph:nth-child(11) { animation-delay: 3s; }   #fruit-wagers .hsx-cycle .bp-glyph:nth-child(12) { animation-delay: 3.3s; }
#fruit-wagers .hsx-wfruits .bp-glyph { width: 40px; height: 40px; margin-right: -12px; border: 0; background-color: transparent; font-size: 0; filter: drop-shadow(0 3px 4px rgba(0, 0, 0, .6)); }
#fruit-wagers .hsx-wfruits .bp-glyph:last-child { margin-right: 0; }
#fruit-wagers button.hsx-wager, #fruit-wagers button.hsx-empty { width: 100%; text-align: left; min-height: 0; font: inherit; cursor: pointer; }
#fruit-wagers button.hsx-wager { border-top: 0; border-right: 0; border-bottom: 0; }
#fruit-wagers .hsx-btn { min-height: 0; border: 0; cursor: pointer; }
#fruit-wagers .hsx-title { margin: 0; }
#fruit-wagers .hsx-ghost { border: 0; }

/* hero typography (the page's own heading rules would shrink it) */
#fruit-wagers .hsx-title { font: 400 clamp(1.9rem, 3.2vw, 2.7rem)/.95 var(--display); letter-spacing: .03em; text-transform: uppercase; }
#fruit-wagers .hsx-tag { font-size: .92rem; max-width: none; }
#fruit-wagers .hsx-kicker, #fruit-wagers .hsx-stat em { font-family: var(--label); }
#fruit-wagers .hsx-stat b, #fruit-wagers .hsx-wval b { font-family: var(--display); }

/* the red leftovers on this page */
#fruit-wagers .bp-brand { filter: hue-rotate(292deg) saturate(1.15) drop-shadow(0 2px 5px rgba(0, 0, 0, .8)); }

/* wager cards: tier-colored arena cards with big fruit art */
#fruit-wagers .bp-posts { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
#fruit-wagers .bp-post { --tc: #a7aec2; position: relative; display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 16px; overflow: hidden; border: 0; border-radius: 20px;
  background: linear-gradient(160deg, color-mix(in srgb, var(--tc) 24%, #14062a), #12051f 62%);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc) 55%, transparent), 0 12px 28px -14px var(--tc); animation: none; transition: transform .18s, box-shadow .18s; }
#fruit-wagers .bp-post[data-pt="2"] { --tc: #3ddc84; } #fruit-wagers .bp-post[data-pt="1"] { --tc: #4aa3ff; }
#fruit-wagers .bp-post[data-pt="5"] { --tc: #c06bff; } #fruit-wagers .bp-post[data-pt="4"] { --tc: #ffcb5c; }
#fruit-wagers .bp-post::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--tc); box-shadow: 0 0 16px var(--tc); }
#fruit-wagers .bp-post:hover { transform: translateY(-4px); box-shadow: inset 0 0 0 1px var(--tc), 0 18px 34px -12px var(--tc); }
#fruit-wagers .bp-post[data-pt="5"]::after, #fruit-wagers .bp-post[data-pt="4"]::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(110deg, transparent 35%, rgba(255, 255, 255, .16) 50%, transparent 65%); background-size: 260% 100%; animation: hsx-glint 4s linear infinite; }
#fruit-wagers .bp-cardtop { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
#fruit-wagers .bp-person { display: flex; align-items: center; gap: 10px; min-width: 0; }
#fruit-wagers .bp-cardhero { display: flex; align-items: center; justify-content: center; gap: 4px; min-height: 120px; margin: 4px 0; }
#fruit-wagers .bp-cardhero .bp-glyph { width: 84px; height: 84px; border: 0; background-color: transparent; font-size: 0; animation: hsx-bob 4.5s ease-in-out infinite;
  filter: drop-shadow(0 10px 10px rgba(0, 0, 0, .6)) drop-shadow(0 0 14px color-mix(in srgb, var(--tc) 55%, transparent)); }
#fruit-wagers .bp-cardhero .bp-glyph:nth-of-type(2) { animation-delay: -1.4s; } #fruit-wagers .bp-cardhero .bp-glyph:nth-of-type(3) { animation-delay: -2.8s; }
#fruit-wagers .bp-cardhero .bp-plus { color: var(--tc); font-weight: 900; }
#fruit-wagers .bp-cardhero .bp-chip { margin-left: 8px; flex: none; }
@keyframes hsx-bob { 50% { transform: translateY(-7px) rotate(3deg); } }
#fruit-wagers .bp-post h3 { margin: 0; font: 800 1.05rem/1.2 var(--label); }
#fruit-wagers .bp-post .bp-actions { margin-top: 6px; }
#fruit-wagers .bp-post .bp-actions .bp-button { width: 100%; justify-content: center; }

/* inputs */
#fruit-wagers input[type="search"], #fruit-wagers select, #fruit-wagers textarea { background: #1d0a36; color: #fff; border: 1px solid rgba(231, 196, 255, .35); border-radius: 12px; padding: 10px 14px; }
#fruit-wagers .bp-search input { width: 100%; }
@media (prefers-reduced-motion: reduce) { #fruit-wagers .bp-cardhero .bp-glyph, #fruit-wagers .bp-post::after { animation: none; } }

/* more red -> purple: the Open fights box, the in-page logo, the trust bar */
body.page-wagers .sc-fight, body.page-wagers .sc-fight * { filter: none; }
body.page-wagers .sc-fight { filter: hue-rotate(38deg) !important; }
#fruit-wagers .bp-top .bp-brand { filter: hue-rotate(292deg) saturate(1.15) drop-shadow(0 2px 5px rgba(0, 0, 0, .8)); }
#fruit-wagers #bp-board[data-theme="red"], #fruit-wagers #bp-guided[data-theme="red"] { --bp-teal: #ffcb5c; }
#fruit-wagers .bp-trustbar { background: linear-gradient(90deg, rgba(255, 203, 92, .14), rgba(176, 77, 255, .16)); border-color: rgba(255, 203, 92, .45); }

/* the page's own palette: dark with gold trim (the hero keeps its plum felt) */
#fruit-wagers .bp-app, #fruit-wagers #bp-board[data-theme="red"] {
  --bp-bg: #06030a; --bp-panel: #120a1e; --bp-deep: #0c0614; --bp-soft: #1d1030; --bp-line: rgba(255, 203, 92, .22); --bp-rim: #8a6a1f;
  --bp-frame: #ffcb5c; --bp-red: #ffcb5c; --bp-on: #2a1200; --bp-gold: #ffcb5c;
}
#fruit-wagers .bp-top { border-bottom: 1px solid rgba(255, 203, 92, .35); }
#fruit-wagers .bp-tabs button[aria-current="page"] { color: #ffcb5c; box-shadow: inset 0 -3px 0 #ffcb5c; }
#fruit-wagers .bp-toprow h2 { color: #fff; text-shadow: 0 2px 0 #000, 0 0 16px rgba(255, 203, 92, .35); }
#fruit-wagers .bp-trustbar { background: linear-gradient(90deg, rgba(255, 203, 92, .12), rgba(0, 0, 0, .3)); border-color: rgba(255, 203, 92, .4); }
#fruit-wagers input[type="search"], #fruit-wagers select, #fruit-wagers textarea { background: #0e0716; border-color: rgba(255, 203, 92, .4); }
#fruit-wagers .bp-badge.bp-stake { background: rgba(255, 203, 92, .14); color: #ffd982; border: 1px solid rgba(255, 203, 92, .5); }
[data-pt="3"] { --tc: #ff4d5a; }
[data-pt="6"] { --tc: #ff6ad5; }
