/* DownloadMonitor — custom styles on top of Bootstrap 5 */

body { background-color: #f7f8fa; }
.navbar-brand { font-weight: 600; }

/* ---------- Anomaly highlighting ---------- */
tr.row-anomalia { background-color: #fde2e2 !important; }
tr.row-anomalia:hover { background-color: #fbd0d0 !important; }
.badge-anomalia { background: #c93030; }
.badge-normale  { background: #6c757d; }

/* ---------- Photos ---------- */
.photo-thumb { width: 84px; height: 84px; object-fit: cover; border: 1px solid #ccc; border-radius: 6px; }
.photo-tile { position: relative; display: inline-block; margin: 0 .4rem .4rem 0; }
.photo-tile .photo-del {
  position: absolute; top: -8px; right: -8px;
  width: 22px; height: 22px; border-radius: 50%; border: 0;
  background: #c93030; color: #fff; font-size: .75rem; line-height: 22px; padding: 0; cursor: pointer;
}

/* ---------- Click-to-zoom ---------- */
.zoomable { cursor: zoom-in; transition: transform .1s ease; }
.zoomable:hover { transform: scale(1.04); }
#zoomModal .modal-dialog { max-width: max-content; width: auto; justify-content: center; }
#zoomModal .modal-content { background: transparent; border: 0; box-shadow: none; }
#zoomModal .modal-body { background: transparent; padding: 0; }
#zoomModal img { display: block; height: 80vh; width: auto; max-width: 95vw; object-fit: contain; }
@media (orientation: portrait), (max-width: 767.98px) {
  #zoomModal img { width: 80vw; height: auto; max-height: 90vh; }
}

/* ---------- Mobile-first operator form ---------- */
.mode-toggle .btn { min-width: 7.5rem; }
.capture-zone { border: 2px dashed #bbb; border-radius: .6rem; padding: 1rem; text-align: center; background: #fff; }
.capture-zone i { font-size: 1.8rem; color: #888; }

/* ---------- Dashboard cards on mobile ---------- */
@media (max-width: 767.98px) {
  .table-downloads thead { display: none; }
  .table-downloads, .table-downloads tbody, .table-downloads tr, .table-downloads td { display: block; width: 100%; }
  .table-downloads tr { border: 1px solid #dee2e6; border-radius: .5rem; margin-bottom: .75rem; padding: .5rem; background: #fff; }
  .table-downloads td { border: 0 !important; padding: .3rem 0; }
  .table-downloads td::before { content: attr(data-label) ": "; font-weight: 600; color: #666; }
}

/* Live "new" pulse on freshly arrived rows */
@keyframes flashNew { from { background-color: #fff3cd; } to { background-color: transparent; } }
tr.flash-new { animation: flashNew 2.5s ease-out; }