/* ============================================================
   FP Ranking Premios - Tabla de Premios
   ============================================================ */

.fp-ranking-premios-wrap {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin-bottom: 1em;
}

.fp-ranking-premios-wrap table {
	width: 80%;
	margin: 0 auto;
	border-collapse: collapse;
	font-size: 15px;
	table-layout: fixed;
}

/* Encabezado */
.fp-ranking-premios-wrap thead tr {
	background-color: #000;
	color: #fff;
}

.fp-ranking-premios-wrap thead th {
	padding: 10px 8px;
	text-align: center;
	font-weight: bold;
	letter-spacing: 0.5px;
}

/* Columna posición */
.fp-ranking-premios-wrap th.posicion,
.fp-ranking-premios-wrap td.pos-1,
.fp-ranking-premios-wrap td.pos-2,
.fp-ranking-premios-wrap td.pos-3,
.fp-ranking-premios-wrap td.pos-4,
.fp-ranking-premios-wrap td:first-child {
	width: 14%;
	text-align: center;
}

/* Columna nombre */
.fp-ranking-premios-wrap th.nombre-user,
.fp-ranking-premios-wrap td:nth-child(2) {
	width: 52%;
	text-align: left;
	padding-left: 12px;
}

/* Columna premio */
.fp-ranking-premios-wrap th.puntos,
.fp-ranking-premios-wrap td:nth-child(3) {
	width: 34%;
	text-align: center;
}

/* Filas */
.fp-ranking-premios-wrap tbody tr {
	background-color: #fff;
	border-bottom: 1px solid #e5e5e5;
	transition: background 0.15s;
}

.fp-ranking-premios-wrap tbody td {
	padding: 9px 8px;
	font-weight: bold;
	color: #000 !important;
}

/* Posición 1 - Oro */
.fp-ranking-premios-wrap tbody tr.fila-pos-1 td {
	background-color: #efb810;
	color: #000 !important;
}

/* Posición 2 - Plata */
.fp-ranking-premios-wrap tbody tr.fila-pos-2 td {
	background-color: #e3e4e5;
	color: #000 !important;
}

/* Posición 3 - Bronce */
.fp-ranking-premios-wrap tbody tr.fila-pos-3 td {
	background-color: #cd7f32;
	color: #000 !important;
}

/* Posición 4 */
.fp-ranking-premios-wrap tbody tr.fila-pos-4 td {
	background-color: #ffffff;
	color: #000 !important;
}

/* Primera columna (Pos): siempre fondo blanco */
.fp-ranking-premios-wrap tbody tr.fila-pos-1 td:first-child,
.fp-ranking-premios-wrap tbody tr.fila-pos-2 td:first-child,
.fp-ranking-premios-wrap tbody tr.fila-pos-3 td:first-child,
.fp-ranking-premios-wrap tbody tr.fila-pos-4 td:first-child {
	background-color: #fff;
	color: #000 !important;
}

/* Nota al pie */
.fp-ranking-premios-wrap .fp-ranking-nota {
	font-size: 12px;
	color: #666;
	margin-top: 6px;
	text-align: center;
}

/* ============================================================
   RESPONSIVE - móviles (< 600px)
   ============================================================ */
@media screen and (max-width: 600px) {

	.fp-ranking-premios-wrap table {
		width: 100%;
		font-size: 13px;
	}

	.fp-ranking-premios-wrap thead th {
		padding: 8px 5px;
	}

	.fp-ranking-premios-wrap tbody td {
		padding: 7px 5px;
	}

	.fp-ranking-premios-wrap th.nombre-user,
	.fp-ranking-premios-wrap td:nth-child(2) {
		padding-left: 7px;
	}
}

@media screen and (max-width: 400px) {

	.fp-ranking-premios-wrap table {
		font-size: 12px;
	}

	.fp-ranking-premios-wrap tbody td {
		padding: 6px 3px;
	}
}