/* DarAmanah SPA — Custom styles (completes Tailwind CDN) */

/* Sidebar transition */
.sidebar { transition: transform 0.3s ease; }
.sidebar.closed { transform: translateX(-100%); }

/* Page transition */
.page-enter { animation: fadeIn 0.2s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* Bottom nav active state */
.bottom-nav-item.active { color: #b45309; }
.bottom-nav-item.active svg { stroke: #b45309; }

/* Sidebar nav active */
.sidebar-link.active { background-color: #f5f5f4; color: #0f172a; font-weight: 600; }

/* Form focus */
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: #b45309;
  box-shadow: 0 0 0 3px rgba(180, 83, 9, 0.1);
}

/* Loading spinner */
.spinner {
  width: 24px; height: 24px;
  border: 3px solid #e5e7eb;
  border-top-color: #b45309;
  border-radius: 50%;
  animation: spin 0.6s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Card hover */
.card-hover { transition: box-shadow 0.2s ease, transform 0.2s ease; }
.card-hover:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.08); transform: translateY(-1px); }

/* Toast notification */
.toast {
  position: fixed; bottom: 24px; right: 24px; z-index: 100;
  padding: 12px 20px; border-radius: 8px;
  font-size: 14px; font-weight: 500;
  animation: slideUp 0.3s ease;
  max-width: 360px;
}
.toast.success { background: #065f46; color: white; }
.toast.error { background: #991b1b; color: white; }
@keyframes slideUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }

/* Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #9ca3af; }
