@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root, :root body, :root .wp-site-blocks {
  --global-palette1: #00f2fe !important; /* Neon Cyan */
  --global-palette2: #9b51e0 !important; /* Vibrant Purple */
  --global-palette3: #f8fafc !important; /* Title text */
  --global-palette4: #e2e8f0 !important; /* Body text */
  --global-palette5: #94a3b8 !important; /* Muted text */
  --global-palette6: rgba(255, 255, 255, 0.08) !important; /* Borders */
  --global-palette7: rgba(10, 11, 20, 0.4) !important; /* Secondary bg / Card bg */
  --global-palette8: #030303 !important; /* Main Site Background - OLED Black */
  --global-palette9: #000000 !important; /* Darker Background / Contrasts */
  --global-palette9rgb: 0, 0, 0 !important;
  
  --global-palette-btn-bg: var(--global-palette1) !important;
  --global-palette-btn-bg-hover: var(--global-palette2) !important;
  --global-palette-highlight: var(--global-palette1) !important;
  --global-palette-highlight-alt: var(--global-palette2) !important;
  --global-palette-highlight-alt2: var(--global-palette9) !important;

  --global-palette-btn-sec-bg: rgba(255, 255, 255, 0.08) !important;
  --global-palette-btn-sec-bg-hover: rgba(255, 255, 255, 0.15) !important;
  --global-palette-btn-sec: #f8fafc !important;
  --global-palette-btn-sec-hover: #ffffff !important;
  
  color-scheme: dark;
}

body, p, a, span, button, input, select, textarea, label {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

h1, h2, h3, h4, h5, h6, .site-title, .logo, .woocommerce-loop-product__title {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
}

body {
  background-color: #030303 !important;
  color: #f8fafc !important;
  position: relative;
  overflow-x: hidden;
}

/* Background glows */
body::before {
  content: "" !important;
  position: fixed !important;
  width: 600px !important;
  height: 600px !important;
  background: radial-gradient(circle, rgba(0, 242, 254, 0.05) 0%, transparent 70%) !important;
  top: -200px !important;
  right: -100px !important;
  z-index: -1 !important;
  pointer-events: none !important;
  filter: blur(80px) !important;
}

body::after {
  content: "" !important;
  position: fixed !important;
  width: 600px !important;
  height: 600px !important;
  background: radial-gradient(circle, rgba(155, 81, 224, 0.04) 0%, transparent 70%) !important;
  bottom: -200px !important;
  left: -100px !important;
  z-index: -1 !important;
  pointer-events: none !important;
  filter: blur(80px) !important;
}

/* Glassmorphism main header */
.site-header, #masthead, .site-header-wrap, .main-navigation ul ul {
  background: rgba(3, 3, 3, 0.75) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

.main-navigation a, .site-header-item a, .mobile-navigation a {
  color: #f8fafc !important;
  font-weight: 500 !important;
  transition: color 0.3s ease !important;
}

.main-navigation a:hover, .site-header-item a:hover, .mobile-navigation a:hover {
  color: #00f2fe !important;
}

.main-navigation ul ul {
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Header CTA Button */
.site-header-item .button, .site-header-item .btn, .site-header-item [role="button"],
.mobile-navigation .button, .mobile-navigation .btn {
  background: linear-gradient(135deg, #00f2fe 0%, #4facfe 100%) !important;
  color: #03040a !important;
  border: none !important;
  border-radius: 30px !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 15px rgba(0, 242, 254, 0.2) !important;
  transition: all 0.3s ease !important;
}

.site-header-item .button:hover, .site-header-item .btn:hover,
.mobile-navigation .button:hover, .mobile-navigation .btn:hover {
  background: linear-gradient(135deg, #00f2fe 0%, #9b51e0 100%) !important;
  box-shadow: 0 6px 20px rgba(155, 81, 224, 0.3) !important;
  transform: translateY(-1px) !important;
  color: #ffffff !important;
}

/* Ethereal Glass Double-Bezel container wrappers for Woo and content */
.woocommerce-account .entry-content, 
.woocommerce-checkout form.checkout, 
.woocommerce-cart .entry-content,
article.page, article.post,
.entry-content {
  background: rgba(10, 11, 20, 0.4) !important;
  border: 1px solid rgba(0, 242, 254, 0.08) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-radius: 16px !important;
  padding: 2.5rem !important;
  box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37), inset 0 1px 1px rgba(255, 255, 255, 0.15) !important;
}

/* Form controls styling */
input[type="text"], input[type="email"], input[type="password"], input[type="search"], textarea, select {
  background-color: rgba(5, 6, 12, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  transition: all 0.3s ease !important;
  font-size: 15px !important;
}

input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, input[type="search"]:focus, textarea:focus, select:focus {
  border-color: #00f2fe !important;
  box-shadow: 0 0 10px rgba(0, 242, 254, 0.15) !important;
  outline: none !important;
}

/* WooCommerce inputs wrapper override */
.woocommerce-Input {
  background-color: rgba(5, 6, 12, 0.85) !important;
}

/* Custom premium buttons */
.woocommerce button.button, .woocommerce a.button, .woocommerce input.button,
.button, .btn, input[type="submit"], button.button-alt {
  background: linear-gradient(135deg, #00f2fe 0%, #4facfe 100%) !important;
  color: #03040a !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 12px 28px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-shadow: 0 4px 15px rgba(0, 242, 254, 0.15) !important;
  cursor: pointer !important;
}

.woocommerce button.button:hover, .woocommerce a.button:hover, .woocommerce input.button:hover,
.button:hover, .btn:hover, input[type="submit"]:hover, button.button-alt:hover {
  background: linear-gradient(135deg, #00f2fe 0%, #9b51e0 100%) !important;
  box-shadow: 0 6px 20px rgba(155, 81, 224, 0.25) !important;
  transform: translateY(-2px) !important;
  color: #ffffff !important;
}

/* Page Title / Hero Section */
.entry-hero-container-inner, .entry-hero, .page-hero-section {
  background: transparent !important;
  background-color: transparent !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.entry-hero-container-inner .entry-title, .page-hero-section .entry-title, .entry-hero .entry-title {
  color: #f8fafc !important;
}

/* Text Colors */
h1, h2, h3, h4, h5, h6 {
  color: #f8fafc !important;
}

label {
  color: #e2e8f0 !important;
}

/* Link overrides */
.woocommerce-account a, .woocommerce-checkout a, .woocommerce-cart a {
  color: #00f2fe !important;
}
.woocommerce-account a:hover, .woocommerce-checkout a:hover, .woocommerce-cart a:hover {
  color: #9b51e0 !important;
}

.woocommerce-form-login__rememberme, .form-row label.inline {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #94a3b8 !important;
}

/* WooCommerce info banners */
.woocommerce-info, .woocommerce-message, .woocommerce-error {
  background: rgba(10, 11, 20, 0.55) !important;
  border-top: 3px solid #00f2fe !important;
  color: #f8fafc !important;
  border-radius: 8px !important;
  padding: 1rem 1.5rem !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
}
.woocommerce-info a, .woocommerce-message a, .woocommerce-error a {
  color: #00f2fe !important;
}

/* Footer overrides */
.site-footer, footer, #colophon {
  background-color: #000000 !important;
  background: #000000 !important;
  color: #94a3b8 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}
.site-footer-row-container-inner, .site-footer-row-container, .site-footer-row, .site-footer-inner {
  background: transparent !important;
  background-color: transparent !important;
}
.site-footer h1, .site-footer h2, .site-footer h3, .site-footer h4, .site-footer h5, .site-footer h6,
.site-footer p, .site-footer span, .site-footer div, .site-footer li, .site-footer a {
  color: #94a3b8 !important;
}
.site-footer h1, .site-footer h2, .site-footer h3, .site-footer h4, .site-footer h5, .site-footer h6,
.site-footer strong, .site-footer b {
  color: #f8fafc !important;
}
.site-footer a {
  transition: color 0.3s ease !important;
}
.site-footer a:hover {
  color: #00f2fe !important;
}
.social-button, .footer-social-item {
  background: transparent !important;
  background-color: transparent !important;
  color: #94a3b8 !important;
}
.social-button:hover, .footer-social-item:hover {
  color: #00f2fe !important;
}

/* Override product card lists (Shop grid) */
ul.products li.product {
  background: rgba(10, 11, 20, 0.35) !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-radius: 12px !important;
  padding: 1.5rem !important;
  transition: all 0.3s ease !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.05) !important;
}

ul.products li.product:hover {
  background: rgba(10, 11, 20, 0.55) !important;
  border-color: rgba(0, 242, 254, 0.2) !important;
  transform: translateY(-4px) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4), inset 0 1px 1px rgba(255, 255, 255, 0.1) !important;
}
