/* ── Scrollbar ─────────────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track  { background: transparent; }
::-webkit-scrollbar-thumb  { background: #4f46e5; border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: #6366f1; }

/* ── Transitions ───────────────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing: border-box; }
body { transition: background-color 0.2s, color 0.2s; }

/* ── Toast notifications ───────────────────────────────────────────────────── */
#toast-container {
  position: fixed;
  bottom: 1.25rem;
  right: 1.25rem;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  pointer-events: none;
}
.toast {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.75rem 1rem;
  border-radius: 0.875rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #fff;
  box-shadow: 0 4px 24px rgba(0,0,0,0.3);
  pointer-events: auto;
  animation: toastIn 0.25s ease forwards;
  max-width: 22rem;
  backdrop-filter: blur(8px);
}
.toast.success { background: rgba(16,185,129,0.92); }
.toast.error   { background: rgba(239,68,68,0.92); }
.toast.info    { background: rgba(99,102,241,0.92); }
.toast.warning { background: rgba(245,158,11,0.92); }
.toast.out { animation: toastOut 0.3s ease forwards; }

@keyframes toastIn  { from { opacity:0; transform:translateY(12px) scale(0.95); } to { opacity:1; transform:none; } }
@keyframes toastOut { from { opacity:1; transform:none; } to { opacity:0; transform:translateY(8px) scale(0.95); } }

/* ── Modal transitions ─────────────────────────────────────────────────────── */
.modal-enter { animation: modalIn 0.2s ease forwards; }
.modal-leave { animation: modalOut 0.15s ease forwards; }

@keyframes modalIn  { from { opacity:0; transform:scale(0.96); } to { opacity:1; transform:scale(1); } }
@keyframes modalOut { from { opacity:1; transform:scale(1); } to { opacity:0; transform:scale(0.96); } }

/* ── Glassmorphism card ────────────────────────────────────────────────────── */
.glass-card {
  background: rgba(255,255,255,0.06);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,0.12);
}

/* ── File card hover ───────────────────────────────────────────────────────── */
.file-card {
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.file-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(99,102,241,0.12);
}

/* ── Drag-over state ───────────────────────────────────────────────────────── */
.drag-over {
  border-color: #6366f1 !important;
  background: rgba(99,102,241,0.06) !important;
}

/* ── Progress bar shimmer ──────────────────────────────────────────────────── */
.progress-shimmer {
  background: linear-gradient(90deg, #6366f1 0%, #8b5cf6 50%, #6366f1 100%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* ── Responsive sidebar ────────────────────────────────────────────────────── */
@media (max-width: 1023px) {
  #sidebar { transform: translateX(-100%); }
  #sidebar.open { transform: translateX(0); }
  #sidebarOverlay.open { display: block !important; }
}