/* Visor del PDF de una actividad (ficha) y preview del PNG (listado).
   Convive con problem.css / problem_index_page.css, de donde salen el layout de la pagina, la
   barra lateral de filtros y el arbol de carpetas. */

.activity-pdf {
  margin-top: 0.5rem;
}

.activity-pdf-toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.75rem;
}

.activity-pdf-toggle {
  padding: 6px 14px;
  border-radius: 8px;
  border: 1px solid var(--myborder, #d3d3d3);
  background: var(--mybackground, #ffffff);
  color: inherit;
  cursor: pointer;
  font-size: 0.95em;
}

.activity-pdf-toggle:hover {
  border-color: #999;
}

.activity-pdf-toggle[aria-pressed="true"] {
  border-color: #2f6f4f;
  font-weight: 600;
}

.activity-pdf-status {
  margin: 0 0 0.75rem;
  font-size: 0.95em;
  opacity: 0.8;
}

.activity-pdf-status-error {
  color: #9f2d20;
  opacity: 1;
}

.activity-pdf-pages {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

.activity-pdf-page canvas {
  display: block;
  max-width: 100%;
  height: auto;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
}

.activity-pdf-error {
  margin-top: 1rem;
  padding: 0.75rem 1rem;
  border: 1px solid #b94c3d;
  border-radius: 8px;
  background: rgba(185, 76, 61, 0.08);
}

.activity-pdf-error pre {
  margin: 0.5rem 0 0;
  max-height: 320px;
  overflow: auto;
  white-space: pre-wrap;
  font-size: 0.85em;
}

/* Preview del PDF en el listado. El PNG viene recortado al contenido, con fondo blanco propio,
   asi que se enmarca para que no flote sobre el fondo de la tarjeta en modo oscuro. */
.activity-preview {
  margin: 0.45em 0 0.2em;
  max-width: 100%;
}

.activity-preview img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 320px;
  object-fit: contain;
  object-position: top left;
  background-color: #fff;
  border: 1px solid var(--myborder, #e0e0e0);
  border-radius: 4px;
}

/* Tarjeta del listado: sin las columnas de puntuacion/colecciones de .problem-item. */
.activity-item {
  position: relative;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--myborder, #e0e0e0);
}

.activity-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.activity-title {
  font-size: 1.05rem;
  margin: 0 0 0.2em;
}

.activity-no-preview {
  margin: 0.45em 0 0.2em;
  font-size: 0.9em;
  opacity: 0.7;
}

.activity-edit-button {
  position: absolute;
  top: 0;
  right: 0;
  text-decoration: none;
  font-size: 1.05rem;
  opacity: 0.65;
}

.activity-edit-button:hover {
  opacity: 1;
}