/* app.css — custom styles layered on top of Tailwind CSS CDN */

/* HTMX loading indicator: hidden by default, shown during requests */
.htmx-indicator {
  display: none;
}
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
  display: inline-block;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}
.animate-spin {
  animation: spin 1s linear infinite;
}

#drop-zone.drag-active {
  border-color: #6366f1;
  background-color: #eef2ff;
}

.result-card {
  transition: box-shadow 0.15s ease;
}
.result-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.07);
}

.flag-critical { background-color: #fef2f2; border-color: #fca5a5; color: #991b1b; }
.flag-high     { background-color: #fff7ed; border-color: #fdba74; color: #9a3412; }
.flag-medium   { background-color: #fffbeb; border-color: #fde68a; color: #92400e; }
.flag-low      { background-color: #fefce8; border-color: #fef08a; color: #713f12; }

table th { white-space: nowrap; }

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #6366f1;
  outline-offset: 2px;
}