/* ============================================
   GLOBAL STYLES FOR QL SECURITY
   Base styles applied site-wide
   ============================================ */

/* Body Background Gradient */
body {
  background: linear-gradient(to bottom right, #0f172a, #1e4a7a, #1e293b);
  min-height: 100vh;
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
  color: #ffffff;
}

/* Container max-widths to match design */
.container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}

@media (min-width: 640px) {
  .container {
    max-width: 640px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 768px;
  }
}

@media (min-width: 1024px) {
  .container {
    max-width: 1024px;
  }
}

@media (min-width: 1280px) {
  .container {
    max-width: 1280px;
  }
}

@media (min-width: 1536px) {
  .container {
    max-width: 1536px;
  }
}

/* Smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* Focus styles for accessibility */
a:focus,
button:focus,
input:focus,
textarea:focus {
  outline: 2px solid #4A90E2;
  outline-offset: 2px;
}

/* Selection color */
::selection {
  background-color: #2C64B9;
  color: #ffffff;
}

/* Disable animations for users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}