/* Bell Link -- belépés utáni fooldal: jackpot-áttekintés plusz játékválasztó.
   A jatek.css tokenjeit (szín, betűtípus) használja, csak amit az újraír. */

body.fd-test{display:block;padding:28px 14px}

.fd{
  position:relative;z-index:1;width:100%;max-width:900px;margin:0 auto;
  display:flex;flex-direction:column;gap:26px;
}

.fd-fejlec{display:flex;align-items:center;justify-content:center;padding:6px 0 2px}
.fd-fejlec .marka-logo{height:40px;width:auto;display:block}

.fd-szakasz-cim{
  font-family:'Cinzel',Georgia,serif;font-weight:800;letter-spacing:.10em;font-size:15px;
  color:var(--halvany);text-align:center;text-transform:uppercase;margin-bottom:2px;
}

/* --------------------------------------------------- napi szerencsekerék
   (kártya 874d1b8a) -- a .kerek-* elemek a jatek.css-ből jönnek, ez csak a
   doboz-keretet adja, ugyanazt a középre-igazítást, mint a .letra kártyák. */
.fd-kerek-doboz{
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;
  padding:16px 18px 18px;border-radius:18px;
  background:linear-gradient(180deg,#4a0a16 0%,#2a0509 55%,#1c0307 100%);
  border:2px solid var(--arany-sot);
  box-shadow:0 12px 28px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,220,160,.14);
}
.fd-kerek-doboz .kifizetes-info{max-width:340px}

/* ---------------------------------------------------------- játék-rács */
.fd-racs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
/* Ha a Dörgő csempe lathato (lasd fooldal.html #fd-dorgo, dorgo-fooldal-
   kapcsolo.json), negy csempe van -- Zoltan dontese szerint (2026-09-03)
   ilyenkor a 2 sor x 2 csempe nez ki jobban, mint a 3+1. A `:has()`
   szandekosan CSAK a tenyleges lathatosaghoz kotodik (fail-closed: ha a
   Dorgo barmiert rejtve marad, a racs magatol visszavalt harom-oszloposra),
   nem kell hozza kulon JS-kapcsolo. */
.fd-racs:has(#fd-dorgo:not([hidden])){grid-template-columns:repeat(2,1fr)}
@media (max-width:760px){.fd-racs{grid-template-columns:1fr}}

.fd-kartya{
  position:relative;border-radius:18px;padding:22px 18px 20px;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;
  background:linear-gradient(180deg,#4a0a16 0%,#2a0509 55%,#1c0307 100%);
  border:2px solid var(--arany-sot);
  box-shadow:0 12px 28px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,220,160,.14);
  text-decoration:none;color:inherit;
  transition:transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}
a.fd-kartya:hover, a.fd-kartya:focus-visible{
  transform:translateY(-4px);border-color:var(--arany);
  box-shadow:0 18px 38px rgba(0,0,0,.6), 0 0 0 1px var(--arany), inset 0 1px 0 rgba(255,220,160,.22);
}
a.fd-kartya:focus-visible{outline:2px solid var(--arany);outline-offset:3px}

.fd-ikon{width:88px;height:88px;margin-bottom:2px}
.fd-ikon svg{width:100%;height:100%;display:block}
.fd-ikon img{width:100%;height:100%;display:block;object-fit:contain}

.fd-nev{
  font-family:'Cinzel',Georgia,serif;font-weight:800;letter-spacing:.08em;font-size:19px;
  background:linear-gradient(180deg,#fff6d2 0%,#f6c33c 55%,#c98a08 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.fd-leiras{font-size:13px;color:var(--halvany);line-height:1.4;min-height:2.8em}

.fd-gomb{
  margin-top:8px;padding:9px 26px;border-radius:999px;
  background:linear-gradient(180deg,var(--arany-vil),var(--arany));
  color:#3a1c00;font-weight:700;font-size:13px;letter-spacing:.08em;
}

/* A kartya `display:flex`, tehat a `hidden` attributumot FELULIRNA. A
   fooldal.js ezzel a kapcsoloval valt a "hamarosan" helyorzo, plusz az elo
   belepesi pont kozott, ezert a szabaly nem esztetikai kerdes. */
.fd-kartya[hidden]{display:none}

/* -------------------------------------------------------- hamarosan */
.fd-kartya.fd-hamarosan{
  cursor:default;filter:saturate(.4) brightness(.68);border-color:#5a3a1a;
}
.fd-kartya.fd-hamarosan .fd-ikon{opacity:.75}
.fd-szalag{
  position:absolute;top:14px;right:-30px;width:130px;text-align:center;
  transform:rotate(40deg);padding:4px 0;font-size:10.5px;font-weight:800;letter-spacing:.14em;
  font-family:'Cinzel',serif;color:#2a1400;background:var(--halvany);
  box-shadow:0 2px 6px rgba(0,0,0,.4);
}

/* ------------------------------------------- egyenleg / kifizetés-kérés
   (kártya b6e846f2). A `.doboz`/`.bonusz-zar-sor`/`.kifizetes-info` a
   jatek.css-ből jön változatlanul (lásd a fooldal.html komment-fejlécét),
   itt csak a fooldal-saját keret plusz az űrlap kap stílust. */
.fd-egyenleg-doboz{
  display:flex;flex-direction:column;gap:10px;align-items:stretch;
  max-width:360px;margin:0 auto;padding:16px 18px 18px;border-radius:18px;
  background:linear-gradient(180deg,#4a0a16 0%,#2a0509 55%,#1c0307 100%);
  border:2px solid var(--arany-sot);
  box-shadow:0 12px 28px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,220,160,.14);
}
.fd-egyenleg-info{font-size:12px;color:var(--halvany);line-height:1.5;margin:0}

.fd-kifizetes-gomb{
  border:1px solid var(--arany-sot);border-radius:10px;cursor:pointer;padding:9px 18px;
  background:rgba(246,195,60,.08);color:var(--arany-vil);
  font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:14px;
  letter-spacing:.04em;transition:background 120ms ease;
}
.fd-kifizetes-gomb:hover{background:rgba(246,195,60,.16)}

.fd-kifizetes-urlap{display:flex;flex-direction:column;gap:8px}
.fd-kifizetes-urlap label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--halvany)}
.fd-kifizetes-mezo{
  padding:8px 10px;border-radius:8px;border:1px solid rgba(246,195,60,.3);
  background:#1b0308;color:#fff2cf;font-family:'Barlow Condensed',sans-serif;
  font-size:16px;font-variant-numeric:tabular-nums;
}
.fd-kifizetes-sugo{font-size:11.5px;color:var(--halvany);line-height:1.4;margin:0}
.fd-kifizetes-gombsor{display:flex;gap:10px}
.fd-kifizetes-kuldes{
  flex:1;border:1px solid var(--arany-sot);border-radius:10px;cursor:pointer;padding:9px 14px;
  background:linear-gradient(180deg,var(--arany-vil),var(--arany));
  color:#3a1c00;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:14px;
}
.fd-kifizetes-kuldes:disabled{filter:saturate(.4) brightness(.7);cursor:default}
.fd-kifizetes-megse{
  border:1px solid rgba(246,195,60,.28);border-radius:10px;cursor:pointer;padding:9px 14px;
  background:transparent;color:var(--halvany);
  font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:14px;
}
.fd-kifizetes-uzenet{font-size:12px;line-height:1.4;margin:0;padding:8px 10px;border-radius:8px}
.fd-kifizetes-uzenet.fd-siker{background:rgba(80,180,110,.14);color:#a8e6bd}
.fd-kifizetes-uzenet.fd-hiba{background:rgba(220,90,90,.14);color:#f3b3b3}

@media (max-width:760px){
  .fd-fejlec .marka-logo{height:32px}
  .fd-egyenleg-doboz{max-width:none}
}