/* ============================
   Theme Styles - Minecraft Specific
   ============================ */

/* Custom Minecraft Styled Elements */

/* Blocky elements like Minecraft */
.minecraft-block {
  position: relative;
  border: 3px solid rgba(0,0,0,0.3);
  box-shadow: inset -1px -1px 0 rgba(0,0,0,0.5),
              inset 1px 1px 0 rgba(255,255,255,0.5);
}

/* Custom Minecraft button style */
.minecraft-button {
  border: 2px solid #000;
  background: linear-gradient(to bottom, #8b8b8b 0%, #7c7c7c 100%);
  color: #fff;
  text-shadow: 2px 2px #000;
  box-shadow: inset -2px -4px 0 rgba(0,0,0,0.6),
              inset 2px 2px 0 rgba(255,255,255,0.3);
  font-family: 'VT323', monospace;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: all 0.1s ease-out;
}

.minecraft-button:active {
  box-shadow: inset -1px -2px 0 rgba(0,0,0,0.6),
              inset 1px 1px 0 rgba(255,255,255,0.3);
  transform: translateY(2px);
}

/* Animated pixel effects */
.pixel-border {
  position: relative;
  border: 4px solid;
  border-image-source: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill-opacity="0.75"><rect x="0" y="0" width="6" height="6" fill="black" /><rect x="6" y="6" width="6" height="6" fill="black" /><rect x="6" y="0" width="6" height="6" fill="white" /><rect x="0" y="6" width="6" height="6" fill="white" /></svg>');
  border-image-slice: 25%;
  border-image-width: 6;
  border-image-repeat: round;
  background-clip: padding-box;
}

/* Minecraft animated gradient text */
.minecraft-gradient-text {
  background: linear-gradient(to right, #4CAF50, #8BC34A, #CDDC39, #8BC34A, #4CAF50);
  background-size: 200% auto;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  animation: shine 3s linear infinite;
}

@keyframes shine {
  to {
    background-position: 200% center;
  }
}

/* Minecraft dirt texture for backgrounds */
.dirt-bg {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64"><rect width="64" height="64" fill="#7D5D3B"/><rect x="0" y="0" width="16" height="16" fill="#6E4F33"/><rect x="32" y="32" width="16" height="16" fill="#6E4F33"/><rect x="16" y="48" width="16" height="16" fill="#6E4F33"/><rect x="48" y="16" width="16" height="16" fill="#6E4F33"/></svg>');
}

/* Minecraft stone texture for backgrounds */
.stone-bg {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64"><rect width="64" height="64" fill="#7D7D7D"/><rect x="0" y="0" width="16" height="16" fill="#696969"/><rect x="32" y="32" width="16" height="16" fill="#696969"/><rect x="16" y="48" width="16" height="16" fill="#696969"/><rect x="48" y="16" width="16" height="16" fill="#696969"/></svg>');
}

/* Parallax scrolling effect for the background */
.parallax-effect {
  will-change: transform;
  transition: transform 0.1s ease-out;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 16px;
  height: 16px;
  background-color: #383838;
}

::-webkit-scrollbar-thumb {
  background-color: #565656;
  border: 2px solid #383838;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #4CAF50;
}

::-webkit-scrollbar-track {
  background-color: #383838;
}

/* Animation for floating elements */
.float-animation {
  animation: float 6s ease-in-out infinite;
}

@keyframes float {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0);
  }
}

/* Glow effect for elements */
.glow {
  box-shadow: 0 0 10px var(--primary-color),
              0 0 20px var(--primary-color);
  animation: glow-pulse 2s ease-in-out infinite alternate;
}

@keyframes glow-pulse {
  from {
    box-shadow: 0 0 5px var(--primary-color),
                0 0 10px var(--primary-color);
  }
  to {
    box-shadow: 0 0 15px var(--primary-color),
                0 0 30px var(--primary-color);
  }
}

/* Creeper face overlay for special elements */
.creeper-overlay::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64"><rect x="16" y="16" width="8" height="8" fill="black"/><rect x="40" y="16" width="8" height="8" fill="black"/><rect x="16" y="32" width="8" height="8" fill="black"/><rect x="24" y="40" width="16" height="8" fill="black"/><rect x="40" y="32" width="8" height="8" fill="black"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.05;
  z-index: -1;
  pointer-events: none;
}

/* Diamond border */
.diamond-border {
  border: 3px solid #41A9FF;
  box-shadow: 0 0 15px rgba(65, 169, 255, 0.6);
}

/* Redstone dust animation */
.redstone-active::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #FF0000;
  box-shadow: 0 0 10px #FF0000;
  animation: redstone-pulse 2s infinite;
}

@keyframes redstone-pulse {
  0% {
    opacity: 0.5;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.5;
  }
}

/* Block breaking animation */
.breaking-animation {
  position: relative;
  overflow: hidden;
}

.breaking-animation::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64"><path d="M0 0 L64 64 M0 64 L64 0" stroke="rgba(0,0,0,0.3)" stroke-width="2"/></svg>');
  animation: breaking 2s steps(10) infinite;
  pointer-events: none;
}

@keyframes breaking {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* Dark mode theme */
.dark-mode {
  --primary-color: #5EB46E;
  --secondary-color: #8B6D5C;
  --accent-color: #FFB428;
  --dark-bg: #121212;
  --light-bg: #1E1E1E;
  --text-primary: #ECEFF1;
  --text-secondary: #B0BEC5;
}

/* Dark mode Minecraft texture pattern */
[data-theme="dark"] body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: -1;
  opacity: 0.03;
  background-image: 
    linear-gradient(0deg, transparent 24%, rgba(150, 150, 150, 0.05) 25%, rgba(150, 150, 150, 0.05) 26%, transparent 27%, transparent 74%, rgba(150, 150, 150, 0.05) 75%, rgba(150, 150, 150, 0.05) 76%, transparent 77%, transparent),
    linear-gradient(90deg, transparent 24%, rgba(150, 150, 150, 0.05) 25%, rgba(150, 150, 150, 0.05) 26%, transparent 27%, transparent 74%, rgba(150, 150, 150, 0.05) 75%, rgba(150, 150, 150, 0.05) 76%, transparent 77%, transparent);
  background-size: 50px 50px;
}

/* Minecraft loading animation */
.minecraft-loader {
  width: 48px;
  height: 48px;
  position: relative;
  animation: rotate 1s linear infinite;
}

.minecraft-loader::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 24px;
  height: 24px;
  background-color: var(--primary-color);
}

.minecraft-loader::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 24px;
  height: 24px;
  background-color: var(--accent-color);
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(90deg);
  }
}