/* Stili applicativi sopra il design system (tokens.css + components.css).
   Qui stanno solo: UI di caricamento/errore di Blazor e poche utility di layout. */

/* --- Layout di pagina --- */
.pv-page { padding: var(--pv-space-6); max-width: 1280px; }
.pv-h1 { font-size: var(--pv-text-xl); font-weight: var(--pv-weight-bold); margin: 0 0 var(--pv-space-5); line-height: var(--pv-leading-tight); }
.pv-h2 { font-size: var(--pv-text-md); font-weight: var(--pv-weight-medium); margin: 0 0 var(--pv-space-3); }

.pv-stack { display: flex; flex-direction: column; gap: var(--pv-space-4); }
.pv-cluster { display: flex; align-items: end; gap: var(--pv-space-3); flex-wrap: wrap; }
.pv-cluster--center { align-items: center; }
.pv-cols { display: grid; grid-template-columns: 5fr 7fr; gap: var(--pv-space-6); align-items: start; }
@media (max-width: 1000px) { .pv-cols { grid-template-columns: 1fr; } }

/* --- Vista codice (lato docente, superficie chiara) --- */
.pv-codeview {
  background: var(--pv-surface);
  border: 1px solid var(--pv-border);
  border-radius: var(--pv-radius-md);
  padding: var(--pv-space-4);
  font-family: var(--pv-font-mono);
  font-size: var(--pv-text-sm);
  line-height: 1.7;
  overflow: auto;
  max-height: 440px;
  margin: 0;
  white-space: pre-wrap;
}
.pv-diff-line { display: block; padding: 0 var(--pv-space-2); border-radius: 3px; }
.pv-diff-line--add { background: var(--pv-success-tint); color: var(--pv-success); }
.pv-diff-line--del { background: var(--pv-danger-tint); color: var(--pv-danger); text-decoration: line-through; }

/* --- Evidenza JSON dentro le segnalazioni --- */
.pv-alert__evidence {
  display: block;
  font-family: var(--pv-font-mono);
  font-size: var(--pv-text-xs);
  color: var(--pv-ink-2);
  margin: var(--pv-space-1) 0 var(--pv-space-2);
  word-break: break-all;
}

/* --- UI di caricamento Blazor --- */
.loading-progress {
  position: relative;
  display: block;
  width: 6rem;
  height: 6rem;
  margin: 20vh auto 1rem;
}
.loading-progress circle {
  fill: none;
  stroke: #EDEEF1;
  stroke-width: 0.6rem;
  transform-origin: 50% 50%;
  transform: rotate(-90deg);
}
.loading-progress circle:last-child {
  stroke: #47549B;
  stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
  transition: stroke-dasharray 0.05s ease-in-out;
}
.loading-progress-text {
  position: absolute;
  text-align: center;
  font-weight: bold;
  inset: calc(20vh + 3rem) 0 auto 0.2rem;
}
.loading-progress-text:after {
  content: var(--blazor-load-percentage-text, "Caricamento");
}

#blazor-error-ui {
  background: #F7F0DD;
  color: #24262C;
  border-top: 1px solid #E8D9AC;
  bottom: 0;
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem;
  position: fixed;
  width: 100%;
  z-index: 200;
}
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; }

/* --- Stampa / export PDF delle evidenze --- */
@media print {
  .pv-sidebar, .pv-no-print, .pv-btn, .pv-input, .pv-select { display: none !important; }
  .pv-shell { display: block; }
  .pv-page { max-width: none; padding: 0; }
  .pv-panel, .pv-card, .pv-alert { break-inside: avoid; box-shadow: none; }
  .pv-panel__body { max-height: none !important; overflow: visible !important; }
  body { background: #fff; }
}

/* --- Guida interattiva --- */
.pv-guide details { margin-bottom: var(--pv-space-3); }
.pv-guide summary { cursor: pointer; list-style: none; user-select: none; }
.pv-guide summary::before { content: "▸ "; color: var(--pv-primary); }
.pv-guide details[open] summary::before { content: "▾ "; }
.pv-guide summary:hover { background: var(--pv-bg); }

/* --- Fix: i bottoni-link ereditavano il colore dei link (blu su blu) --- */
.pv-body a.pv-btn { color: var(--pv-on-primary); }
.pv-body a.pv-btn:hover { color: var(--pv-on-primary); }
.pv-body a.pv-btn--secondary, .pv-body a.pv-btn--secondary:hover,
.pv-body a.pv-btn--ghost, .pv-body a.pv-btn--ghost:hover { color: var(--pv-primary); }

/* --- Modali (consegna espansa, segnalazioni studente, overlay verifica) --- */
.pv-modal-backdrop {
  position: fixed; inset: 0; background: rgba(36,38,44,.55);
  display: flex; align-items: center; justify-content: center;
  z-index: 300; padding: var(--pv-space-6);
}
.pv-modal {
  background: var(--pv-surface); border-radius: var(--pv-radius-lg);
  box-shadow: var(--pv-shadow-2); padding: var(--pv-space-6);
  max-width: 820px; width: 100%; max-height: 85vh; overflow: auto;
}
.pv-modal--consegna { font-size: var(--pv-text-md); line-height: 1.7; }

/* --- Output console: errori e warning evidenziati --- */
.pv-out-err { color: #F0A8A0; }
.pv-out-warn { color: #E8CF9A; }
