* { -webkit-tap-highlight-color: transparent; }

html { scroll-behavior: smooth; }

body { background-image: radial-gradient(circle at 0% 0%, rgba(14,165,233,0.06) 0%, transparent 40%), radial-gradient(circle at 100% 100%, rgba(168,85,247,0.04) 0%, transparent 40%); }

.dark body { background-image: radial-gradient(circle at 0% 0%, rgba(14,165,233,0.12) 0%, transparent 40%), radial-gradient(circle at 100% 100%, rgba(168,85,247,0.08) 0%, transparent 40%); }

/* Sleek scrollbar */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
.dark ::-webkit-scrollbar-thumb { background: #334155; }
.dark ::-webkit-scrollbar-thumb:hover { background: #475569; }

/* Input defaults */
input, select, textarea {
  font-family: inherit;
}
input:focus, select:focus, textarea:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(14,165,233,0.15);
  border-color: #0ea5e9;
}

.modal-input {
  width: 100%;
  padding: 0.6rem 0.8rem;
  border-radius: 0.6rem;
  border: 1px solid #e2e8f0;
  background: white;
  font-size: 0.875rem;
  transition: all 0.15s;
}
.dark .modal-input { background: #1e293b; border-color: #334155; color: #f1f5f9; }
.modal-label {
  display: block;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #64748b;
  margin-bottom: 0.35rem;
}
.dark .modal-label { color: #94a3b8; }
.btn-primary {
  padding: 0.6rem 1.2rem;
  border-radius: 0.7rem;
  background: linear-gradient(to right, #0ea5e9, #0284c7);
  color: white;
  font-weight: 600;
  font-size: 0.875rem;
  box-shadow: 0 4px 12px rgba(14,165,233,0.3);
}
.btn-secondary {
  padding: 0.6rem 1.2rem;
  border-radius: 0.7rem;
  background: #f1f5f9;
  color: #334155;
  font-weight: 600;
  font-size: 0.875rem;
}
.dark .btn-secondary { background: #334155; color: #f1f5f9; }
.btn-danger {
  padding: 0.6rem 1.2rem;
  border-radius: 0.7rem;
  background: #fee2e2;
  color: #b91c1c;
  font-weight: 600;
  font-size: 0.875rem;
}

@media print {
  body * { visibility: hidden; }
  #invoice-body, #invoice-body * { visibility: visible; }
  #invoice-body { position: absolute; left: 0; top: 0; width: 100%; padding: 2rem; }
}

/* Smooth section transitions */
section { animation: fadeIn 0.3s ease-out; }
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}