/* TEXTURE FIX - Load this AFTER style.css */

/* Force navbar textures */
.tabs::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="200" height="200"%3E%3Cfilter id="noise2"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="4" /%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noise2)" opacity="0.08"/%3E%3C/svg%3E') !important;
  pointer-events: none !important;
  z-index: 0 !important;
  mix-blend-mode: overlay !important;
  opacity: 0.6 !important;
  display: block !important;
}

.tabs::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.15) 0%, rgba(255, 250, 245, 0.08) 50%, rgba(0, 0, 0, 0.12) 100%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
  mix-blend-mode: overlay !important;
  display: block !important;
}

/* Force hero textures */
.hero::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(135deg, rgba(255, 215, 180, 0.12) 0%, rgba(255, 192, 203, 0.08) 25%, rgba(255, 228, 196, 0.10) 50%, rgba(255, 218, 185, 0.08) 75%, rgba(255, 205, 210, 0.12) 100%), url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="300" height="300"%3E%3Cfilter id="paper2"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.85" numOctaves="4" /%3E%3CfeColorMatrix type="saturate" values="0.4"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23paper2)" opacity="0.12"/%3E%3C/svg%3E') !important;
  background-size: 400% 400%, 250px 250px !important;
  background-position: 0% 50%, center !important;
  animation: heroTextureFlow 30s ease-in-out infinite !important;
  mix-blend-mode: overlay !important;
  z-index: 1 !important;
  pointer-events: none !important;
  opacity: 0.7 !important;
  display: block !important;
}

/* Ensure tabs and hero content stay on top */
.tab {
  position: relative !important;
  z-index: 10 !important;
}

.hero-inner {
  position: relative !important;
  z-index: 10 !important;
}