/* ============================================================
   ak66-table.css — cartes + table de poker réutilisables
   (voir assets/js/ak66-table.js)
   ============================================================ */

/* ---- Cartes ---- */
.akc{
  --w: var(--akc-w, 52px);
  display:inline-flex; align-items:center; justify-content:center; gap:.02em;
  flex:none; box-sizing:border-box;
  width:var(--w); height:calc(var(--w) * 1.32);
  border-radius:calc(var(--w) * .12);
  background:#fff; border:1.5px solid #2a2320;
  color:#141211; font-size:var(--w); line-height:1;
  box-shadow:0 2px 5px rgba(0,0,0,.3);
  user-select:none; vertical-align:middle;
}
.akc b{ font-family:'Bebas Neue',sans-serif; font-weight:400; font-size:.64em; letter-spacing:0; }
.akc i{ font-style:normal; font-size:.5em; font-family:'Segoe UI Symbol','Apple Symbols','Noto Sans Symbols 2','DejaVu Sans',sans-serif; }
.akc--10 b{ font-size:.54em; letter-spacing:-.05em; }
.akc--10 i{ font-size:.42em; }
.akc--red{ color:#c0201a; }
.akc--hl{ outline:3px solid var(--ember,#ff6b35); outline-offset:1px; }
.akc--dim{ opacity:.35; }
.akc--back{
  background:#d62839 repeating-linear-gradient(45deg, rgba(255,255,255,.16) 0 4px, transparent 4px 9px);
  border:3px solid #fff; box-shadow:0 0 0 1px #2a2320, 0 2px 5px rgba(0,0,0,.3);
}
.akc--slot{ background:transparent; border:1.5px dashed rgba(255,255,255,.4); box-shadow:none; }

/* rangée de cartes hors table (cours, tableaux) */
.akc-row{ display:inline-flex; align-items:center; gap:12px; flex-wrap:wrap; }
.akc-group{ display:inline-flex; gap:4px; }

/* ---- Table ---- */
.akt{
  --akc-w: clamp(34px, 6.4vw, 54px);
  position:relative; display:block; max-width:780px; margin:0 auto;
  padding:clamp(8px, 1.6vw, 16px);
  border-radius:999px;
  background:linear-gradient(180deg, #4a2a1e, #24110c);
  box-shadow:0 18px 40px rgba(28,20,20,.3), inset 0 1px 0 rgba(255,255,255,.12);
}
.akt-felt{
  position:relative; overflow:hidden; border-radius:999px;
  background:radial-gradient(ellipse at 50% 45%, #2f8d50 0%, #1f6d3b 55%, #154d2a 100%);
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.25), inset 0 0 50px rgba(0,0,0,.45);
  min-height:clamp(290px, 44vw, 410px);
  padding:clamp(12px, 2.2vw, 20px) 14%;
  display:flex; flex-direction:column; align-items:center; justify-content:space-between; gap:4px;
  color:#fff;
}
.akt-felt::before{
  content:''; position:absolute; inset:clamp(8px, 1.8vw, 18px);
  border-radius:999px; border:1.5px solid rgba(255,255,255,.14); pointer-events:none;
}
.akt-logo{
  position:absolute; left:50%; top:50%; width:min(34%, 230px);
  transform:translate(-50%, -50%); opacity:.2; pointer-events:none;
}
.akt-felt > *:not(.akt-logo){ position:relative; z-index:1; }

.akt-seat{ display:flex; align-items:center; gap:10px; min-height:20px; }
.akt-cards{ display:inline-flex; gap:4px; }
.akt-seat--villain .akc{ --w:calc(var(--akc-w) * .74); }
.akt-hand .akc{ --w:calc(var(--akc-w) * 1.12); }
.akt-plate{
  font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700; letter-spacing:1px;
  text-transform:uppercase; white-space:nowrap;
  background:#1c1414; color:#f7f1e6; border:1.5px solid #f4b740;
  border-radius:999px; padding:5px 12px;
}
.akt-plate--hero{ border-color:#ff6b35; }

.akt-center{ display:flex; flex-direction:column; align-items:center; gap:8px; }
.akt-pot{
  font-family:'JetBrains Mono',monospace; font-size:13px; letter-spacing:1px; text-transform:uppercase;
  background:rgba(0,0,0,.5); color:#fff; padding:4px 14px; border-radius:999px;
}
.akt-pot strong{ color:#f4b740; font-size:16px; }
.akt-board{ display:flex; gap:clamp(3px, .8vw, 6px); }

.akt-bet-row{ min-height:30px; display:flex; justify-content:center; align-items:center; }
.akt-bet{ display:flex; align-items:center; gap:7px; font-family:'JetBrains Mono',monospace; font-weight:700; font-size:15px; }
.akt-amount{ background:rgba(0,0,0,.5); color:#fff; padding:2px 10px; border-radius:999px; }
.akt-chips{ position:relative; width:24px; height:26px; }
.akt-chips span{
  position:absolute; left:0; width:24px; height:10px; border-radius:50%;
  background:#d62839; border:2px dashed rgba(255,255,255,.9); box-sizing:border-box;
}
.akt-chips span:nth-child(1){ bottom:0; }
.akt-chips span:nth-child(2){ bottom:6px; }
.akt-chips span:nth-child(3){ bottom:12px; }
.akt-bet--hero .akt-chips span{ background:#1c1414; border-color:#f4b740; }

@media (max-width:540px){
  .akt{ border-radius:48px; }
  .akt-felt{ border-radius:40px; padding-left:6%; padding-right:6%; }
  .akt-felt::before{ border-radius:34px; }
  .akt-plate{ font-size:11px; padding:4px 10px; }
}

/* ---- Table complète (AKRing) ---- */
.akt--ring{ --akc-w:clamp(30px, 5.2vw, 46px); margin:40px auto 70px; }
.akt--ring .akt-felt{ min-height:0; aspect-ratio:2 / 1; padding:0; display:block; }
.akr-seat{
  position:absolute; transform:translate(-50%, -50%); z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:3px;
}
.akr-seat .akc{ --w:calc(var(--akc-w) * .5); }
.akr-seat .akt-cards{ gap:2px; }
.akr-seat--hero .akc{ --w:var(--akc-w); }
.akr-seat--hero .akt-cards{ gap:4px; }
.akr-seat .akt-plate{ font-size:11px; padding:3px 9px; }
.akr-seat--hero .akt-plate{ font-size:12px; padding:4px 11px; }
.akr-seat--hl .akt-plate{ box-shadow:0 0 0 3px #ff6b35; }
.akr-dealer{
  position:absolute; transform:translate(-50%, -50%); z-index:2;
  width:26px; height:26px; border-radius:50%;
  background:#fff; color:#141211; border:2px solid #cfc6b8;
  font:800 13px/1 'Manrope', sans-serif; display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 5px rgba(0,0,0,.45);
}
.akr-bet{ position:absolute; transform:translate(-50%, -50%); z-index:2; }
.akr-bet .akt-bet{ font-size:12px; gap:4px; }
.akr-bet .akt-chips{ transform:scale(.8); }

/* couleurs par groupe de positions (cours) */
.akr-g-early { border-color:#e05252; }
.akr-g-middle{ border-color:#f4b740; }
.akr-g-late  { border-color:#4cc27a; }
.akr-g-blinds{ border-color:#7fa7e6; }
.akt-plate.akr-g-early { background:#5a1717; }
.akt-plate.akr-g-middle{ background:#5a4210; }
.akt-plate.akr-g-late  { background:#14482a; }
.akt-plate.akr-g-blinds{ background:#1f3354; }

@media (max-width:540px){
  .akt--ring{ --akc-w:34px; border-radius:90px; margin:30px auto 64px; }
  .akt--ring .akt-felt{ aspect-ratio:3 / 4; border-radius:80px; }
  .akt--ring .akt-felt::before{ border-radius:70px; }
  .akr-seat .akt-plate{ font-size:10px; padding:2px 7px; letter-spacing:.5px; }
  .akr-bet .akt-amount{ padding:1px 6px; }
}