/* Carelytics Custom Styles */

/* HTMX loading indicator */
#htmx-indicator {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #1E40AF, #0D9488);
  z-index: 9999;
  animation: loading-progress 1.5s ease-in-out infinite;
}
.htmx-request #htmx-indicator { display: block; }
@keyframes loading-progress {
  0% { width: 0%; opacity: 1; }
  50% { width: 70%; opacity: 1; }
  100% { width: 100%; opacity: 0; }
}

/* Sidebar active state */
.nav-item-active {
  background-color: rgba(255, 255, 255, 0.1);
  border-left: 3px solid #0D9488;
}

/* Status badges */
.badge { display: inline-flex; align-items: center; padding: 0.125rem 0.625rem; border-radius: 0.375rem; font-size: 0.75rem; font-weight: 500; }
.badge-green { background-color: #dcfce7; color: #166534; }
.badge-red { background-color: #fee2e2; color: #991b1b; }
.badge-yellow { background-color: #fef3c7; color: #92400e; }
.badge-blue { background-color: #dbeafe; color: #1e40af; }
.badge-gray { background-color: #f3f4f6; color: #374151; }
.badge-teal { background-color: #ccfbf1; color: #134e4a; }
.badge-purple { background-color: #ede9fe; color: #5b21b6; }

/* Cards */
.card { background: white; border-radius: 0.5rem; box-shadow: 0 1px 3px 0 rgba(0,0,0,0.1); border: 1px solid #e5e7eb; }
.card:hover { box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1); transition: box-shadow 0.15s; }

/* Tables */
.data-table th { background-color: #f9fafb; font-weight: 500; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: #6b7280; }
.data-table tr:hover { background-color: #f9fafb; }

/* Form inputs */
.form-input,
.form-control,
.form-select { display: block; width: 100%; background-color: #ffffff; color: #111827; border: 1px solid #d1d5db; border-radius: 0.375rem; padding: 0.5rem 0.75rem; font-size: 0.875rem; line-height: 1.5; transition: border-color 0.15s; }
.form-input:focus,
.form-control:focus,
.form-select:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1); }
select.form-input, select.form-control, .form-select { appearance: auto; }
textarea.form-input, textarea.form-control { resize: vertical; }

/* Timeline */
.timeline-item { position: relative; padding-left: 2rem; padding-bottom: 1.5rem; }
.timeline-item::before { content: ''; position: absolute; left: 0.5rem; top: 1.5rem; bottom: 0; width: 2px; background: #e5e7eb; }
.timeline-item::after { content: ''; position: absolute; left: 0; top: 0.375rem; width: 1rem; height: 1rem; border-radius: 50%; background: #e5e7eb; border: 2px solid white; }
.timeline-item:last-child::before { display: none; }

/* Toast notifications */
.toast { position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 9999; min-width: 20rem; padding: 1rem 1.25rem; border-radius: 0.5rem; box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1); animation: slideIn 0.3s ease-out; }
.toast-success { background: #16a34a; color: white; }
.toast-error { background: #dc2626; color: white; }
.toast-warning { background: #d97706; color: white; }
@keyframes slideIn { from { transform: translateX(120%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

/* Print styles */
@media print {
  .no-print, nav, .sidebar, header, footer { display: none !important; }
  .print-only { display: block !important; }
  body { font-size: 11pt; }
  .card { box-shadow: none; border: 1px solid #ccc; }
}

/* Stat card hover effect */
.stat-card { transition: transform 0.15s ease, box-shadow 0.15s ease; }
.stat-card:hover { transform: translateY(-2px); box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1); }

/* AI-filled form fields — violet ring + tint so the reviewer sees exactly
   what the AI extracted from the documents and still needs to confirm. */
.ai-filled {
  background-color: #f5f3ff !important;   /* violet-50 */
  border-color: #c4b5fd !important;       /* violet-300 */
  box-shadow: 0 0 0 1px #c4b5fd;
}