/* (removed custom background on .intro-header – use theme defaults) */

/* Scroll-to-Footer Button for legal compliance access */
:root {
  --sq-green: #2c974d;
  --sq-green-alt: #55c878;
  --site-bg: #ffffff;
  --site-fg: #212529;
  --link: #0066cc;
  --link-hover: #004499;
}

/* Floating scroll-to-footer button
   NOTE: moved authoritative styles into the theme partial to avoid
   conflicting duplicates. The original rules are intentionally
   commented out here so the partial's inline CSS + runtime enforcement
   remain the single source of truth for the scroll button.

.scroll-to-footer {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(44, 151, 77, 0.3);
  background: linear-gradient(135deg, var(--sq-green) 0%, var(--sq-green-alt) 100%);
  color: #ffffff;
  z-index: 1000;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  opacity: 0.95;
}

.scroll-to-footer:hover {
  transform: translateY(-4px) scale(1.05);
  box-shadow: 0 12px 32px rgba(44, 151, 77, 0.4);
  opacity: 1;
}

.scroll-to-footer:active {
  transform: translateY(-2px) scale(1.02);
}

.scroll-to-footer:focus {
  outline: 3px solid rgba(44, 151, 77, 0.5);
  outline-offset: 4px;
}

.scroll-to-footer i {
  font-size: 22px;
  line-height: 0;
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1));
}

/* Hide on small screens where footer is easily accessible */
@media (max-width: 768px) {
  .scroll-to-footer {
    display: none !important;
  }
}
*/

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

/* Respect user's reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  .scroll-to-footer {
    transition: none;
  }
}

/* Dark mode text styling for homepage content */
@media (prefers-color-scheme: dark) {
  /* centralize dark mode variables to match head inline overrides */
  :root {
    --site-bg: #0b0c0d;
    --site-fg: #e6e7e8;
    --link: #7eb4ff;
    --link-hover: #4aa0ff;
  }
  /* Homepage well container */
  .container .row .well {
    color: var(--site-fg) !important;
    background-color: #444 !important;
  }
  
  /* All text elements in well container */
  .container .row .well h1,
  .container .row .well h2,
  .container .row .well h3,
  .container .row .well h4,
  .container .row .well h5,
  .container .row .well h6,
  .container .row .well p,
  .container .row .well * {
    color: #ffffff !important;
  }
  
  /* Additional fallback for any text in well */
  .well,
  .well * {
    color: #ffffff !important;
  }

  /* Fix text selection color in dark mode for best readability */
  ::selection {
    background-color: #111827; /* almost black */
    color: #ffffff;
  }
}

/* =====================================================================
   MOBILE USABILITY: Touch Target Improvements
   ===================================================================== */

/* Compliance links container - better mobile layout */
.compliance-links {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 10px;
  align-items: center;
}

/* Individual compliance links - enhanced touch targets */
.compliance-link {
  display: inline-block;
  padding: 12px 16px !important;
  min-height: 44px !important;
  min-width: 44px !important;
  line-height: 1.4 !important;
  text-align: center;
  border-radius: 6px;
  transition: all 0.2s ease;
  text-decoration: none !important;
  border: 2px solid transparent;
  background-color: rgba(0, 0, 0, 0.05);
  margin: 4px 0;
}

.compliance-link:hover,
.compliance-link:focus {
  background-color: rgba(0, 133, 161, 0.1) !important;
  border-color: rgba(0, 133, 161, 0.3);
  transform: translateY(-1px);
  text-decoration: none !important;
}

.compliance-link:active {
  transform: translateY(0);
  background-color: rgba(0, 133, 161, 0.2) !important;
}

/* Responsive layout for larger screens */
@media (min-width: 768px) {
  .compliance-links {
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
  }
  
  .compliance-link {
    margin: 4px 8px;
  }
}

/* Dark mode compliance links */
@media (prefers-color-scheme: dark) {
  .compliance-link {
    background-color: rgba(255, 255, 255, 0.1);
    color: #B8C5D1 !important;
  }
  
  .compliance-link:hover,
  .compliance-link:focus {
    background-color: rgba(255, 255, 255, 0.2) !important;
    color: #E5E5E5 !important;
    border-color: rgba(255, 255, 255, 0.3);
  }
  
  .compliance-link:active {
    background-color: rgba(255, 255, 255, 0.3) !important;
  }
}