/* MTC League of Legends - estilos */

.mtc-lol-wrap{
	--lol-pink: var(--mtc-pink, #ff3899);
	--lol-gold: var(--mtc-gold, #ffc300);
	--lol-bg-1: var(--mtc-bg-1, #180a12);
	--lol-bg-2: var(--mtc-bg-2, #22101a);
	--lol-border: var(--mtc-border, #3a1826);
	--lol-text-1: var(--mtc-text-1, #f5eef1);
	--lol-text-2: var(--mtc-text-2, #b58fa0);
	--lol-text-3: var(--mtc-text-3, #7a5568);

	max-width:1320px;
	margin:0 auto;
	padding:40px 32px 80px;
	color:var(--lol-text-1);
	font-family:'Inter', sans-serif;
}

.mtc-lol-empty{ text-align:center; color:var(--lol-text-2); padding:60px 20px; }

.mtc-lol-grid{
	display:grid;
	grid-template-columns:repeat(5, 1fr);
	gap:16px;
}

.mtc-lol-card{
	background:var(--lol-bg-1);
	border:1px solid var(--lol-border);
	border-radius:10px;
	padding:20px;
	transition:transform .25s ease, border-color .25s ease;
}
.mtc-lol-card:hover{ transform:translateY(-4px); border-color:var(--lol-pink); }

.mtc-lol-card-top{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.mtc-lol-icon{
	width:48px; height:48px; border-radius:8px; border:2px solid var(--lol-gold);
	object-fit:cover; flex-shrink:0;
}
.mtc-lol-name{ font-weight:600; font-size:14px; }
.mtc-lol-tag{ font-size:11px; color:var(--lol-text-3); }

.mtc-lol-role{
	display:inline-block; font-size:11px; text-transform:uppercase; letter-spacing:0.05em;
	color:var(--lol-gold); background:var(--lol-bg-2); border-radius:20px;
	padding:3px 10px; margin-bottom:12px;
}

.mtc-lol-rank{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.mtc-lol-tier{ font-size:14px; font-weight:600; color:var(--lol-text-1); }
.mtc-lol-lp{ font-size:12px; color:var(--lol-pink); }

.mtc-lol-stats-row{
	display:flex; justify-content:space-between; font-size:12px; color:var(--lol-text-2);
	border-top:1px solid var(--lol-border); padding-top:10px; margin-top:4px;
}
.mtc-lol-winrate{ color:var(--lol-pink); font-weight:600; }

.mtc-lol-level{ font-size:11px; color:var(--lol-text-3); margin-top:10px; }

.mtc-lol-sync-note{
	margin-top:24px; font-size:12px; color:var(--lol-text-3); font-style:italic; text-align:right;
}

@media (max-width: 1100px){
	.mtc-lol-grid{ grid-template-columns:repeat(3, 1fr); }
}
@media (max-width: 720px){
	.mtc-lol-wrap{ padding:24px 20px 50px; }
	.mtc-lol-grid{ grid-template-columns:repeat(2, 1fr); }
}