/* Estilos usados pelos widgets e seções das páginas demo do XadrezPro */

.xp-card{
	background: var(--xp-bg-alt, #141210);
	border: 1px solid var(--xp-border, rgba(212,175,90,0.25));
	border-radius: 14px;
	padding: 26px;
	height: 100%;
}
.xp-card-title{
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 19px;
	color: var(--xp-gold, #d4af5a);
	margin-bottom: 18px;
}
.xp-card-title i{ font-size: 18px; }

/* Ranking */
.xp-ranking-list{ list-style: none; margin: 0 0 18px; padding: 0; }
.xp-ranking-row{
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid rgba(212,175,90,0.12);
}
.xp-ranking-row:last-child{ border-bottom: none; }
.xp-rank-pos{
	width: 22px; text-align: center;
	color: var(--xp-gold, #d4af5a);
	font-weight: 700;
}
.xp-rank-avatar{
	width: 34px; height: 34px; border-radius: 50%; object-fit: cover;
	border: 1px solid rgba(212,175,90,0.3);
}
.xp-rank-name{ flex: 1; color: #f5f2ec; font-size: 15px; }
.xp-rank-score{ color: var(--xp-gold-light, #f0d78c); font-weight: 700; }

.xp-btn--block{ display: block; width: 100%; text-align: center; }

/* Estatísticas */
.xp-stat-list{ list-style: none; margin: 0; padding: 0; }
.xp-stat-row{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 11px 0;
	border-bottom: 1px solid rgba(212,175,90,0.12);
	color: #d8d3c8;
	font-size: 15px;
}
.xp-stat-row:last-child{ border-bottom: none; }
.xp-stat-label i{ color: var(--xp-gold, #d4af5a); margin-right: 8px; width: 16px; text-align: center; }
.xp-stat-value{ font-weight: 700; font-size: 16px; }

/* Badges de modo de jogo (Blitz / Clássica) usados no hero */
.xp-mode-badge{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	border: 1px solid var(--xp-border, rgba(212,175,90,0.25));
	border-radius: 10px;
	padding: 12px 16px;
	background: rgba(255,255,255,0.02);
}
.xp-mode-badge i{ color: var(--xp-gold, #d4af5a); font-size: 20px; }
.xp-mode-badge .xp-mode-title{ font-weight: 700; color: #f5f2ec; display: block; font-size: 14px; }
.xp-mode-badge .xp-mode-sub{ color: var(--xp-muted, #b9b3a6); font-size: 12px; }

/* Ícones de recursos (feature grid) */
.xp-feature{ display: flex; align-items: flex-start; gap: 14px; }
.xp-feature i{
	width: 46px; height: 46px; min-width: 46px;
	display: flex; align-items: center; justify-content: center;
	border: 1px solid var(--xp-border, rgba(212,175,90,0.25));
	border-radius: 10px;
	color: var(--xp-gold, #d4af5a);
	font-size: 18px;
}
.xp-feature h4{ margin: 0 0 4px; font-size: 16px; color: #f5f2ec; }
.xp-feature p{ margin: 0; font-size: 14px; color: var(--xp-muted, #b9b3a6); }

/* Passo a passo numerado */
.xp-step{ display: flex; align-items: center; gap: 16px; }
.xp-step-num{
	width: 44px; height: 44px; min-width: 44px;
	border: 2px solid var(--xp-gold, #d4af5a);
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	color: var(--xp-gold, #d4af5a);
	font-weight: 700; font-size: 17px;
}
.xp-step h4{ margin: 0 0 2px; font-size: 16px; color: #f5f2ec; }
.xp-step p{ margin: 0; font-size: 13px; color: var(--xp-muted, #b9b3a6); }

@media (max-width: 767px){
	.xp-step{ margin-bottom: 20px; }
}