/** Shopify CDN: Minification failed

Line 47:0 All "@import" rules must come first

**/
/* ==============================================
   PEPTIDE BIOLAB — Global Custom Styles
   Dark theme design system for research peptide brand.
   Mobile-first responsive CSS.
   ==============================================

   COLOR PALETTE:
   --pb-bg-primary:   #0A1628  (deep navy)
   --pb-bg-secondary: #0D1117  (near-black)
   --pb-accent-blue:  #00D4FF  (electric blue)
   --pb-accent-green: #00FF88  (neon green)
   --pb-text-primary: #FFFFFF
   --pb-text-muted:   rgba(255,255,255,0.6)
   --pb-border:       rgba(255,255,255,0.08)
   ============================================== */

/* --------------------------------------------
   1. CSS CUSTOM PROPERTIES (Design Tokens)
   -------------------------------------------- */
:root {
  --pb-bg-primary: #0A1628;
  --pb-bg-secondary: #0D1117;
  --pb-bg-elevated: #111B2E;
  --pb-accent-blue: #00D4FF;
  --pb-accent-green: #00FF88;
  --pb-text-primary: #FFFFFF;
  --pb-text-secondary: rgba(255, 255, 255, 0.75);
  --pb-text-muted: rgba(255, 255, 255, 0.6);
  --pb-text-subtle: rgba(255, 255, 255, 0.4);
  --pb-border-light: rgba(255, 255, 255, 0.08);
  --pb-border-medium: rgba(255, 255, 255, 0.12);
  --pb-radius-sm: 6px;
  --pb-radius-md: 10px;
  --pb-radius-lg: 12px;
  --pb-transition: 0.3s ease;
}

/* --------------------------------------------
   2. GLOBAL BODY & FONT OVERRIDES
   Import Inter via Google Fonts for clean sans-serif
   -------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap');

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* --------------------------------------------
   3. DARK THEME FOOTER OVERRIDES
   Override the Root Theme footer for dark palette
   -------------------------------------------- */
.wt-footer {
  background: var(--pb-bg-secondary) !important;
  color: var(--pb-text-secondary);
  border-top: 1px solid var(--pb-border-light);
}

.wt-footer__title {
  color: var(--pb-text-primary) !important;
}

.wt-footer__text,
.wt-footer__list__item a {
  color: var(--pb-text-muted) !important;
}

.wt-footer__list__item a:hover {
  color: var(--pb-accent-blue) !important;
}

.wt-footer__aside {
  border-top: 1px solid var(--pb-border-light);
}

.wt-footer__aside__copy {
  color: var(--pb-text-subtle) !important;
  font-size: 12px;
}

/* Footer newsletter form dark styling */
.wt-footer .wt-newsletter__field {
  background: var(--pb-bg-elevated) !important;
  border-color: var(--pb-border-medium) !important;
  color: var(--pb-text-primary) !important;
}

.wt-footer .wt-newsletter__field::placeholder {
  color: var(--pb-text-subtle) !important;
}

.wt-footer .wt-newsletter__send {
  background: var(--pb-accent-blue) !important;
  color: var(--pb-bg-primary) !important;
  border-color: var(--pb-accent-blue) !important;
}

/* Social media icons in footer */
.wt-footer .social-links a {
  color: var(--pb-text-muted) !important;
}

.wt-footer .social-links a:hover {
  color: var(--pb-accent-blue) !important;
}

/* Payment icons */
.wt-footer__aside-block--payment .icon {
  opacity: 0.6;
  filter: brightness(1.5);
}

/* Footer collapsible mobile trigger */
.wt-footer__title__icon .wt-icon {
  color: var(--pb-text-muted) !important;
}

/* --------------------------------------------
   4. HEADER DARK OVERRIDES (when header has dark bg)
   -------------------------------------------- */
.wt-header--transparent .wt-header__logo,
.wt-header--transparent .wt-header__nav a {
  color: var(--pb-text-primary);
}

/* Announcement bar styling */
.wt-announcement-bar {
  background: var(--pb-bg-elevated) !important;
  color: var(--pb-text-secondary) !important;
  border-bottom: 1px solid var(--pb-border-light);
  font-size: 13px;
  letter-spacing: 0.3px;
}

/* --------------------------------------------
   5. PB SECTION SHARED UTILITIES
   Common spacing, transitions, and visual patterns
   used across all PB custom sections.
   -------------------------------------------- */

/* Smooth scroll for anchor links */
html {
  scroll-behavior: smooth;
}

/* Remove default section margins from theme */
.pb-section {
  margin: 0 !important;
  padding: 0 !important;
}

/* Ensure PB sections sit flush with no gaps */
.pb-section + .pb-section {
  margin-top: 0 !important;
}

/* Focus visible states for accessibility */
.pb-hero__cta:focus-visible,
.pb-collections__card-link:focus-visible,
.pb-best-sellers__view-all:focus-visible,
.pb-about__cta:focus-visible,
.pb-newsletter__btn:focus-visible,
.pb-newsletter__input:focus-visible,
.pb-faq__question:focus-visible {
  outline: 2px solid var(--pb-accent-blue);
  outline-offset: 2px;
}

/* Selection color */
::selection {
  background: rgba(0, 212, 255, 0.25);
  color: #ffffff;
}

/* --------------------------------------------
   6. RESPONSIVE UTILITY OVERRIDES
   -------------------------------------------- */

/* Ensure main content area has no background bleed */
main#root {
  background: var(--pb-bg-primary);
}

/* Hide scrollbar on slider sections but keep scroll */
.pb-best-sellers__grid::-webkit-scrollbar {
  display: none;
}

/* --------------------------------------------
   7. DARK MODE PRODUCT CARD GLOBAL OVERRIDES
   These apply when product cards from the theme's
   native sections are used within our dark sections.
   -------------------------------------------- */
.template-index .wt-featured-collection {
  background: var(--pb-bg-primary);
}

.template-index .wt-card {
  background: var(--pb-bg-elevated);
  border: 1px solid var(--pb-border-light);
  border-radius: var(--pb-radius-md);
}

.template-index .wt-card__title {
  color: var(--pb-text-primary);
}

.template-index .wt-card__subtitle {
  color: var(--pb-text-muted);
}

/* --------------------------------------------
   8. PREFERS-REDUCED-MOTION
   Respect user accessibility preferences.
   -------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .pb-hero__particle,
  .pb-hero__molecule-line {
    animation: none !important;
    opacity: 0.3;
  }

  * {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}
