/* ====== Reset & tokens ====== */
.fc-root * { box-sizing: border-box; }
.fc-root {
  --fc-gap: 18px;
  --fc-radius: 14px;
  --fc-bg: #111;              /* page bg, não é cor do card */
  --fc-text: #eaeaea;         /* textos gerais fora da carta */
  --fc-muted:#a7a7a7;
  font-family: Inter, Poppins, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* ===== SQUADS (grid) ===== */
.fc-squads-grid{
  display:grid;
  grid-template-columns: repeat(var(--fc-cols,4), minmax(240px,1fr));
  gap: var(--fc-gap);
}
@media (max-width: 1024px){ .fc-squads-grid{ grid-template-columns: repeat(3, minmax(220px,1fr)); } }
@media (max-width: 720px) { .fc-squads-grid{ grid-template-columns: repeat(2, minmax(180px,1fr)); } }

.fc-squad-card{
  position:relative; display:block; min-height:180px; aspect-ratio:16/9;
  border-radius: var(--fc-radius); overflow:hidden; text-decoration:none; color:var(--fc-text);
  background:#1a1a1a; box-shadow:0 18px 28px rgba(0,0,0,.18);
  transition: transform .15s ease, box-shadow .15s ease;
}
.fc-squad-card:hover{ transform: translateY(-2px); box-shadow: 0 22px 34px rgba(0,0,0,.22); }
.fc-squad-bg{ position:absolute; inset:0; background-size:cover; background-position:center; filter:brightness(.75) saturate(.95); }
.fc-squad-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.45) 60%, rgba(0,0,0,.65)); }
.fc-squad-head{ position:absolute; inset:12px 14px auto 14px; display:flex; justify-content:space-between; z-index:2; font-weight:600; letter-spacing:.2px; }
.fc-squad-title{ font-size:16px; text-shadow:0 1px 2px rgba(0,0,0,.5); }
.fc-squad-date{ font-size:12px; opacity:.9; }

/* ===== Players header ===== */
.fc-players-head{ display:flex; align-items:center; justify-content:space-between; margin: 4px 2px 18px; }
.fc-back{ color: var(--fc-muted); text-decoration:none; font-size:14px; }
.fc-back:hover{ text-decoration:underline; }
.fc-players-title{ font-weight:700; color:var(--fc-text); }

/* ===== Grid de cartas ===== */
.fc-players-grid{
  display:grid;
  grid-template-columns: repeat(5, minmax(180px, 1fr));
  gap: 16px;
}
@media (max-width: 1200px){ .fc-players-grid{ grid-template-columns: repeat(4, minmax(160px,1fr)); } }
@media (max-width: 900px) { .fc-players-grid{ grid-template-columns: repeat(3, minmax(150px,1fr)); } }
@media (max-width: 640px) { .fc-players-grid{ grid-template-columns: repeat(2, minmax(140px,1fr)); } }

/* ===== Carta ===== */
.fc-card-frame{
  position:relative; border-radius: 12px; min-height: 310px; padding: 10px 10px 12px; overflow:hidden;
  background-size: cover; background-position:center; 
  /* TEXTOS E ÍCONES: SEM hard-code, sempre do backend */
  color: var(--cardColor, #ddd);


}

/* topo: rating/pos/++ (usa ratingColor quando existir) */
.fc-card-top{
  position:absolute; left:40px; top:70px; display:flex; flex-direction:column; gap:2px; z-index: 10;
  color: var(--ratingColor, var(--cardColor, currentColor));
  text-shadow: 0 1px 2px rgba(0,0,0,.65);
}
.fc-rating{ font-size:22px; font-weight:800; line-height:1; }
.fc-pos{ font-size:13px; font-weight:600; line-height:1; }
.fc-roleplus{ font-size:12px; font-weight:600; line-height:1; } /* “++” cru, sem cápsula */

/* Lateral (alt-pos + sideicon) */
.fc-lateral{
  position:absolute; left:2%; top:25%; z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:20px;
}
.fc-altpos-emb{ position:relative; width: 30px }
.fc-altpos-emb svg{ width:100%; height:auto; display:block; }
.fc-altpos-list{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
   font-size: 8px; font-weight:800; color: var(--alt-pos-border, currentColor);
  text-shadow: 0 1px 1px rgba(0,0,0,.5);
}
.fc-altpos-sub{ line-height:1;display:flex;  flex-direction: column;
    align-items: center;}
.fc-altpos-list .fc-altpos-sub + .fc-altpos-sub{
  border-top: 1px solid color-mix(in srgb, var(--alt-pos-border, currentColor), transparent 35%);
  margin-top: 2px; padding-top: 4px; width: 78%;
}
.fc-badge{ font-size:11px; font-weight:800; padding:2px 6px; border-radius:6px; background: rgba(0,0,0,.65); border:1px solid rgba(255,255,255,.18); }

/* Side icon (diamante) abaixo do alt-pos */
.fc-sideicon{
  width: 30px; height:auto; display:block; filter: drop-shadow(0 1px 1px rgba(0,0,0,.5));
}
.fc-sideicon svg{ width:100%; height:auto; display:block; }
/* Recolore apenas o “branco” do SVG para a cor do card */
.fc-sideicon [fill="#fff"], .fc-sideicon [fill="#FFF"], .fc-sideicon [fill="white"]{ fill: var(--lineColor, var(--cardColor, currentColor)) !important; }
.fc-sideicon [stroke="#fff"], .fc-sideicon [stroke="#FFF"], .fc-sideicon [stroke="white"]{ stroke: var(--lineColor, var(--cardColor, currentColor)) !important; }

/* Face central: mais ao centro vertical */
.fc-face{
  position:absolute; left:50%; transform:translateX(-50%);
 width: 100%; height:auto; object-fit:contain; pointer-events:none;
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.45));
}

/* Nome */
.fc-name{
  position:absolute; left:0; right:0; top: 64%;font-size: 17px;
  text-align:center; font-weight:800; letter-spacing:.25px;
  text-shadow:0 1px 2px rgba(0,0,0,.6);
  color: var(--cardColor, currentColor);
}

/* ===== Stats (FUT layout: 2 cols x 3 rows; label em cima, número embaixo) ===== */
.fc-stats{
  position:absolute;
  left:12px; right:12px; bottom:60px;
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 5px;
  row-gap: 8px;
}

.fc-stat{
  display:flex;
  flex-direction:column;              /* label em cima, número embaixo */
  align-items:flex-start;
  justify-content:flex-start;
  line-height:1;
  color: var(--cardColor, currentColor);
  text-shadow: 0 1px 1px rgba(0,0,0,.45);
}

.fc-stat-lbl{
  order:0;
  font-size:10px;                     /* mais fino que o número */
  font-weight:700;
  letter-spacing:.25px;
  opacity:.95;
}

.fc-stat-num{
  order:1;
  margin-top:2px;
  font-size:16px;                     /* maior e mais pesado */
  font-weight:900;
  width:auto;                          /* não fixar largura */
  text-align:left;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.55));
}


/* Ícones meta (nations etc.) logo acima da faixa */
.fc-info{  left:78px; bottom:40px; display:flex; gap:6px; align-items:center;    justify-content: center;    margin-top: 245px; }
.fc-ico{ width:16px; height:16px; object-fit:contain; filter: drop-shadow(0 1px 1px rgba(0,0,0,.5)); }
.fc-info-text{ font-size:11px; opacity:.9; color: var(--cardColor, currentColor); }

/* Faixa inferior (SVG do back), menor e um pouco mais baixa */
.fc-extrainfo{
  position:absolute; left:51%; transform:translateX(-50%);
  bottom: 9px; width: 40%; height: clamp(14px, 7.5%, 22px);
  pointer-events:none;
}
.fc-extrainfo svg{ width:100%; height:100%; display:block; }
.fc-extrainfo-row{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:3px;
  font-size: 8px; font-weight:800; color: var(--cardColor, currentColor);
}
/* divisórias entre pé / WF / skills */
.fc-extrainfo-row .fc-sep{
  color: var(--lineColor, var(--cardColor, currentColor));
  opacity:.9; font-weight:900;
}

/* Preço */
.fc-price{
  position:absolute; right:10px; top:10px;
  background: rgba(0,0,0,.55); border: 1px solid rgba(255,255,255,.18);
  padding: 2px 6px; border-radius: 8px; font-weight:800; font-size:12px; color: var(--cardColor, currentColor);
  display: none;
}
/* ===== Stats (flex: 2 colunas x 3 linhas, label em cima, número embaixo) ===== */
.fc-card-frame .fc-stats{
  position: absolute;
  left: 12px; right: 12px; bottom: 60px;

  /* --- layout --- */
  display: flex;
  justify-content: center;

}

.fc-card-frame .fc-stat{
  /* 2 itens por linha: metade da largura - metade do gap */
  flex: 0 0 calc((100% - var(--fc-stats-col-gap)) / 2);
  display: flex;
  flex-direction: column;                      /* label em cima, número embaixo */
  align-items: flex-start;
  justify-content: flex-start;
  line-height: 1;
  min-width: 0;                                /* evita “estouro” */
  color: var(--cardColor, currentColor);
  text-shadow: 0 1px 1px rgba(0,0,0,.45);
  white-space: nowrap;                         /* não quebrar PAC/80 etc. */
}

.fc-card-frame .fc-stat-lbl{
  order: 0;
  font-size:0.7em;                              /* fino (menor) */
  font-weight: 500;
  letter-spacing: .25px;
  opacity: .95;
}

.fc-card-frame .fc-stat-num{
  order: 1;
  margin-top: 2px;
  font-size: 12px;                           /* número menor que estava */
  font-weight: 700;
  line-height: 1;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.55));
}
/* ===== Fallbacks para modo de captura (evita color()/color-mix()) ===== */
html.wpfc-capture .fc-altpos-list .fc-altpos-sub + .fc-altpos-sub{
  border-top: 1px solid rgba(255,255,255,.35) !important;
}


html.wpfc-capture .fc-card-frame{
  width: 220px;          /* largura canônica */
  aspect-ratio: 0.7;     /* mantém proporção estável na captura */
}

