/* ─────────────────────────────────────────────────────────────────
   UniqText Platform — Custom Styles
   (Tailwind CSS handles most of the heavy lifting;
    this file adds bespoke components and overrides.)
───────────────────────────────────────────────────────────────── */

/* ── Hero gradient ─────────────────────────────────────────────── */
.hero-gradient {
  background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 50%, #6d28d9 100%);
}

/* ── Shared input style (used in forms AND admin modals) ────────── */
.input-field {
  display: block;
  width: 100%;
  border: 1px solid #e5e7eb;
  border-radius: 0.75rem;
  padding: 0.625rem 0.875rem;
  font-size: 0.875rem;
  line-height: 1.5;
  color: #111827;
  background-color: #fff;
  transition: border-color 0.15s, box-shadow 0.15s;
  outline: none;
}

.input-field:focus {
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

select.input-field {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  padding-right: 2.5rem;
}

/* ── App card hover lift ────────────────────────────────────────── */
.app-card {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.app-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(79, 70, 229, 0.1);
}

/* ── Filter buttons ─────────────────────────────────────────────── */
.filter-btn {
  border: 1px solid #e5e7eb;
  color: #6b7280;
  background: #fff;
  transition: all 0.15s;
  cursor: pointer;
}
.filter-btn:hover {
  border-color: #6366f1;
  color: #4f46e5;
}
.active-filter {
  background: #4f46e5;
  color: #fff;
  border-color: #4f46e5;
}

/* ── Scrollbar (admin sidebar area) ────────────────────────────── */
::-webkit-scrollbar        { width: 6px; height: 6px; }
::-webkit-scrollbar-track  { background: #f9fafb; }
::-webkit-scrollbar-thumb  { background: #d1d5db; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #9ca3af; }

/* ── Fade-in animation for modals ───────────────────────────────── */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

#appModal   > div,
#orderModal > div {
  animation: fadeIn 0.2s ease forwards;
}

/* ── Status progress bar animation ─────────────────────────────── */
@keyframes pulse-indigo {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.5; }
}
.processing-pulse {
  animation: pulse-indigo 2s ease-in-out infinite;
}

/* ── Utility: prose-like content area ──────────────────────────── */
.prose-content p   { margin-bottom: 0.75rem; }
.prose-content ul  { list-style: disc; padding-left: 1.25rem; margin-bottom: 0.75rem; }
.prose-content li  { margin-bottom: 0.25rem; }