/* Apartado del permiso por puntos: permiso-por-puntos.php y estadisticas-permiso-por-puntos.php */
.pp-datos {
    display: flex; gap: 16px; align-items: flex-start; max-width: 820px; margin: 24px 0; padding: 18px 20px;
    background: var(--ap-superficie); border: 1px solid var(--ap-borde); border-radius: var(--ap-radio); box-shadow: var(--ap-sombra);
}
.pp-datos h2 { font-size: 19px !important; margin: 0 0 8px; }
.pp-datos p { margin: 0 0 14px; line-height: 1.6; }
.pp-datos-icono { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--ap-acento-suave); color: var(--ap-acento); }
.pp-datos-icono svg { width: 22px; height: 22px; }

.seo-permiso .seo-tabla { max-width: 620px; margin-bottom: 12px; }

.pp-puntos .ap-anyos { margin: 0 0 16px; }
.pp-puntos .ap-grafica-tarjeta { margin-bottom: 14px; }
.pp-tabla-anyos { max-width: 720px; }

.pp-intentos { list-style: none; margin: 0 0 8px; padding: 0; max-width: 720px; display: grid; gap: 10px; }
.pp-intentos li { display: grid; grid-template-columns: 170px minmax(0, 1fr) 70px 70px; gap: 10px; align-items: center; font-variant-numeric: tabular-nums; }
.pp-intentos strong { text-align: right; }
.pp-intentos small { color: var(--ap-texto-3); text-align: right; }
.pp-intentos-barra { height: 12px; border-radius: 6px; background: var(--ap-borde-suave); overflow: hidden; }
.pp-intentos-barra i { display: block; height: 100%; border-radius: 6px; background: var(--ap-verde); }

@media (max-width: 760px) {
    .pp-puntos .po-mapa-bloque { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
    .pp-datos { flex-direction: column; padding: 16px; }
    .pp-intentos li { grid-template-columns: minmax(0, 1fr) 64px; }
    .pp-intentos-barra { grid-column: 1 / -1; grid-row: 2; }
    .pp-intentos small { display: none; }
}
