@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap');

/* Base reset styles */
html {
  scroll-behavior: smooth;
  background-color: #050508;
  color: #e2e8f0;
}

body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  overflow-x: hidden;
  background-color: #050508;
}

/* Premium Scrollbar styling */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #050508;
}
::-webkit-scrollbar-thumb {
  background: #161922;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #00f0ff;
}

/* Linear-gradients cyber grid background */
.cyber-grid {
  background-size: 40px 40px;
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.015) 1px, transparent 1px),
                    linear-gradient(to bottom, rgba(255, 255, 255, 0.015) 1px, transparent 1px);
}

.glow-shadow-cyan {
  box-shadow: 0 0 20px rgba(0, 240, 255, 0.12);
}

.glow-shadow-magenta {
  box-shadow: 0 0 20px rgba(255, 0, 127, 0.12);
}

/* Code-editor live heartbeat wave animation */
@keyframes wave-motion {
  0%, 100% {
    d: path("M0 50 Q 50 10, 100 50 T 200 50 T 300 50 T 400 50");
  }
  50% {
    d: path("M0 50 Q 50 90, 100 50 T 200 50 T 300 10, 400 50");
  }
}
.wave-path-1 {
  animation: wave-motion 3.5s ease-in-out infinite;
}

@keyframes wave-motion-2 {
  0%, 100% {
    d: path("M0 60 Q 60 90, 120 60 T 240 60 T 360 60 T 400 60");
  }
  50% {
    d: path("M0 60 Q 60 10, 120 60 T 240 60 T 360 90, 400 60");
  }
}
.wave-path-2 {
  animation: wave-motion-2 4.5s ease-in-out infinite;
}

/* Dynamic custom scale and glow interaction curves */
.transition-all-custom {
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.bg-dot-grid {
  background-image: radial-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1.5px);
  background-size: 24px 24px;
}

/* PDF Preview Sheet Custom Layout & Styling */
.pdf-page {
  width: 210mm;
  height: 297mm;
  box-sizing: border-box;
  box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.4), 0 8px 16px -8px rgba(0, 0, 0, 0.4);
  border-radius: 12px;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Light/Dark mode specific borders/shadows for screen preview */
.pdf-page.bg-white {
  border: 1px solid rgba(0, 0, 0, 0.08);
}
.pdf-page.bg-\[\#0c0d12\] {
  border: 1px solid rgba(255, 255, 255, 0.08);
}

/* Strip spacing, shadows and rounded corners when compiling to actual PDF */
body.pdf-export-mode {
  overflow: visible !important;
}

body.pdf-export-mode #preview-container {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 210mm !important;
  height: auto !important;
  z-index: 999999 !important;
  background: transparent !important;
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  border: none !important;
  border-radius: 0 !important;
}

body.pdf-export-mode #pdf-printable-target {
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  width: 210mm !important;
  max-width: 210mm !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
}

body.pdf-export-mode #pdf-printable-target > * {
  margin: 0 !important;
  padding: 0 !important;
}

body.pdf-export-mode .pdf-page {
  box-shadow: none !important;
  border-radius: 0 !important;
  border: none !important;
  height: 296.5mm !important; /* Slightly smaller than 297mm to prevent fractional overflow and blank pages */
  margin: 0 !important;
  box-sizing: border-box !important;
}

