/**
 * PREMIUM VISUAL POLISH
 * AAA-Quality TCG Enhancement Styles
 * Makes everything look super crisp and polished
 * ==========================================
 */

/* ===== CARD ENHANCEMENTS ===== */
.player-card,
.played-card,
.enemy-card {
  /* Ultra-crisp rendering */
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;

  /* Enhanced depth and clarity */
  filter: brightness(1.05) contrast(1.1) saturate(1.15);

  /* Premium shadow for depth */
  box-shadow:
    0 10px 30px rgba(0, 0, 0, 0.5),
    0 5px 15px rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);

  /* Smooth transitions */
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Better text rendering */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Enhanced card images for maximum clarity */
.player-card-img,
.card-img {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  filter: brightness(1.1) contrast(1.15) saturate(1.2);
  backface-visibility: hidden;
  transform: translateZ(0);
  will-change: filter;
}

/* Premium hover state */
.player-card:hover,
.played-card:hover {
  transform: translateY(-15px) scale(1.08) rotateZ(0deg);
  box-shadow:
    0 25px 50px rgba(255, 215, 0, 0.4),
    0 15px 30px rgba(255, 215, 0, 0.3),
    0 5px 15px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
  filter: brightness(1.2) contrast(1.15) saturate(1.3);
  z-index: 1000 !important;
}

/* ===== RARITY ENHANCEMENTS ===== */

/* Legendary cards - Maximum impact */
.legendary {
  background: linear-gradient(135deg,
    rgba(255, 215, 0, 0.15) 0%,
    rgba(255, 165, 0, 0.1) 50%,
    rgba(255, 215, 0, 0.15) 100%);
  border: 2px solid rgba(255, 215, 0, 0.8);
  box-shadow:
    0 0 30px rgba(255, 215, 0, 0.8),
    0 0 60px rgba(255, 215, 0, 0.5),
    0 10px 40px rgba(0, 0, 0, 0.6),
    inset 0 0 30px rgba(255, 215, 0, 0.2);
}

.legendary:hover {
  border-color: rgba(255, 215, 0, 1);
  box-shadow:
    0 0 40px rgba(255, 215, 0, 1),
    0 0 80px rgba(255, 215, 0, 0.8),
    0 0 120px rgba(255, 215, 0, 0.6),
    0 15px 50px rgba(0, 0, 0, 0.7),
    inset 0 0 40px rgba(255, 215, 0, 0.3);
}

/* Epic cards - Purple majesty */
.epic {
  background: linear-gradient(135deg,
    rgba(157, 78, 221, 0.12) 0%,
    rgba(138, 43, 226, 0.08) 50%,
    rgba(157, 78, 221, 0.12) 100%);
  border: 2px solid rgba(157, 78, 221, 0.7);
  box-shadow:
    0 0 25px rgba(157, 78, 221, 0.7),
    0 0 50px rgba(157, 78, 221, 0.4),
    0 10px 35px rgba(0, 0, 0, 0.5),
    inset 0 0 25px rgba(157, 78, 221, 0.15);
}

.epic:hover {
  border-color: rgba(157, 78, 221, 1);
  box-shadow:
    0 0 35px rgba(157, 78, 221, 1),
    0 0 70px rgba(157, 78, 221, 0.7),
    0 0 105px rgba(157, 78, 221, 0.5),
    0 15px 45px rgba(0, 0, 0, 0.6),
    inset 0 0 35px rgba(157, 78, 221, 0.25);
}

/* Rare cards - Blue excellence */
.rare {
  background: linear-gradient(135deg,
    rgba(0, 128, 255, 0.1) 0%,
    rgba(0, 100, 255, 0.06) 50%,
    rgba(0, 128, 255, 0.1) 100%);
  border: 2px solid rgba(0, 128, 255, 0.6);
  box-shadow:
    0 0 20px rgba(0, 128, 255, 0.6),
    0 0 40px rgba(0, 128, 255, 0.3),
    0 10px 30px rgba(0, 0, 0, 0.4),
    inset 0 0 20px rgba(0, 128, 255, 0.12);
}

.rare:hover {
  border-color: rgba(0, 128, 255, 1);
  box-shadow:
    0 0 30px rgba(0, 128, 255, 1),
    0 0 60px rgba(0, 128, 255, 0.6),
    0 0 90px rgba(0, 128, 255, 0.4),
    0 15px 40px rgba(0, 0, 0, 0.5),
    inset 0 0 30px rgba(0, 128, 255, 0.2);
}

/* Common cards - Clean and crisp */
.common {
  border: 1px solid rgba(200, 200, 200, 0.4);
  box-shadow:
    0 5px 20px rgba(0, 0, 0, 0.3),
    0 2px 10px rgba(0, 0, 0, 0.2);
}

/* ===== STAT ENHANCEMENTS ===== */
.cost-stat,
.atk-stat,
.def-stat {
  /* Premium stat appearance */
  background: radial-gradient(circle, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
  border: 2px solid rgba(255, 255, 255, 0.3);
  box-shadow:
    0 0 10px rgba(0, 0, 0, 0.8),
    inset 0 0 10px rgba(255, 255, 255, 0.1);

  /* Crisp text */
  font-weight: 900;
  text-shadow:
    0 0 8px rgba(255, 255, 255, 0.8),
    0 0 15px rgba(255, 255, 255, 0.5),
    2px 2px 4px rgba(0, 0, 0, 1),
    -1px -1px 2px rgba(0, 0, 0, 1);

  /* Better rendering */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  filter: brightness(1.1);
}

/* Animated stat glow on hover */
.player-card:hover .cost-stat,
.player-card:hover .atk-stat,
.player-card:hover .def-stat,
.played-card:hover .cost-stat,
.played-card:hover .atk-stat,
.played-card:hover .def-stat {
  border-color: rgba(255, 215, 0, 0.8);
  box-shadow:
    0 0 15px rgba(255, 215, 0, 1),
    0 0 30px rgba(255, 215, 0, 0.6),
    inset 0 0 15px rgba(255, 215, 0, 0.3);
  text-shadow:
    0 0 10px rgba(255, 215, 0, 1),
    0 0 20px rgba(255, 215, 0, 0.8),
    2px 2px 4px rgba(0, 0, 0, 1);
}

/* ===== BATTLEFIELD ENHANCEMENTS ===== */
#no-mans-land {
  /* Premium battlefield appearance */
  background:
    radial-gradient(ellipse at 50% 50%, rgba(139, 0, 0, 0.25) 0%, transparent 70%),
    linear-gradient(to bottom,
      rgba(0, 0, 0, 0.4) 0%,
      rgba(20, 0, 0, 0.2) 30%,
      rgba(20, 0, 0, 0.2) 70%,
      rgba(0, 0, 0, 0.4) 100%);

  box-shadow:
    inset 0 15px 40px rgba(0, 0, 0, 0.6),
    inset 0 -15px 40px rgba(0, 0, 0, 0.6),
    inset 0 0 100px rgba(139, 0, 0, 0.15);

  border-top: 1px solid rgba(139, 0, 0, 0.3);
  border-bottom: 1px solid rgba(139, 0, 0, 0.3);
}

#player-field,
#enemy-field {
  position: relative;
  filter: brightness(1.05);
}

/* ===== AVATAR ENHANCEMENTS ===== */
#player-avatar,
#enemy-avatar {
  /* Premium avatar styling */
  border: 3px solid rgba(255, 215, 0, 0.6);
  box-shadow:
    0 0 30px rgba(255, 215, 0, 0.5),
    0 10px 40px rgba(0, 0, 0, 0.7),
    inset 0 0 20px rgba(255, 215, 0, 0.2);

  filter: brightness(1.1) contrast(1.15) saturate(1.2);
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

#player-avatar:hover,
#enemy-avatar:hover {
  border-color: rgba(255, 215, 0, 1);
  box-shadow:
    0 0 40px rgba(255, 215, 0, 0.8),
    0 0 80px rgba(255, 215, 0, 0.5),
    0 15px 50px rgba(0, 0, 0, 0.8),
    inset 0 0 30px rgba(255, 215, 0, 0.3);
  transform: scale(1.08);
}

/* ===== BUTTON ENHANCEMENTS ===== */
#end-turn-btn {
  /* Premium button styling */
  background: linear-gradient(135deg,
    rgba(255, 215, 0, 0.2) 0%,
    rgba(255, 165, 0, 0.1) 50%,
    rgba(255, 215, 0, 0.2) 100%);
  border: 2px solid rgba(255, 215, 0, 0.7);
  box-shadow:
    0 0 20px rgba(255, 215, 0, 0.5),
    0 5px 20px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);

  filter: brightness(1.1) saturate(1.2);
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  cursor: pointer;
}

#end-turn-btn:hover {
  background: linear-gradient(135deg,
    rgba(255, 215, 0, 0.3) 0%,
    rgba(255, 165, 0, 0.2) 50%,
    rgba(255, 215, 0, 0.3) 100%);
  border-color: rgba(255, 215, 0, 1);
  box-shadow:
    0 0 30px rgba(255, 215, 0, 0.8),
    0 0 60px rgba(255, 215, 0, 0.5),
    0 8px 30px rgba(0, 0, 0, 0.6),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
  transform: scale(1.12) translateY(-4px);
}

#end-turn-btn:active {
  transform: scale(1.05) translateY(-1px);
}

/* ===== HEALTH/POWER BARS ===== */
#player-health,
#enemy-health,
#player-power,
#enemy-power {
  /* Premium progress bar styling */
  border: 2px solid rgba(255, 215, 0, 0.5);
  box-shadow:
    0 0 15px rgba(255, 215, 0, 0.3),
    inset 0 2px 5px rgba(0, 0, 0, 0.5);
  border-radius: 8px;
  overflow: hidden;
}

/* ===== READY TO ATTACK ENHANCEMENT ===== */
.ready-to-attack {
  animation:
    premiumReadyPulse 1.5s ease-in-out infinite,
    premiumReadyFloat 3s ease-in-out infinite;

  border: 2px solid rgba(0, 100, 255, 1) !important;
  box-shadow:
    0 0 40px rgba(0, 100, 255, 1),
    0 0 80px rgba(0, 100, 255, 0.8),
    0 0 120px rgba(0, 100, 255, 0.6),
    0 20px 60px rgba(0, 0, 0, 0.8),
    inset 0 0 40px rgba(0, 100, 255, 0.5) !important;

  filter: brightness(1.4) saturate(1.6) contrast(1.2) !important;
  transform: translateY(-20px) scale(1.05) !important;
}

@keyframes premiumReadyPulse {
  0%, 100% {
    box-shadow:
      0 0 40px rgba(0, 100, 255, 1),
      0 0 80px rgba(0, 100, 255, 0.8),
      0 0 120px rgba(0, 100, 255, 0.6),
      0 20px 60px rgba(0, 0, 0, 0.8),
      inset 0 0 40px rgba(0, 100, 255, 0.5);
  }
  50% {
    box-shadow:
      0 0 50px rgba(0, 150, 255, 1),
      0 0 100px rgba(0, 150, 255, 1),
      0 0 150px rgba(0, 150, 255, 0.8),
      0 25px 70px rgba(0, 0, 0, 0.9),
      inset 0 0 50px rgba(0, 150, 255, 0.7);
  }
}

@keyframes premiumReadyFloat {
  0%, 100% {
    transform: translateY(-20px) scale(1.05);
  }
  50% {
    transform: translateY(-25px) scale(1.08);
  }
}

/* ===== LOADING SCREEN POLISH ===== */
.loading-screen {
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.loading-title {
  filter: brightness(1.2) saturate(1.3);
  text-shadow:
    0 0 30px rgba(255, 215, 0, 1),
    0 0 60px rgba(255, 215, 0, 0.8),
    0 0 90px rgba(255, 215, 0, 0.6),
    4px 4px 8px rgba(0, 0, 0, 1);
}

/* ===== DAMAGE NUMBER ENHANCEMENT ===== */
.damage-number {
  filter:
    drop-shadow(0 0 10px currentColor)
    drop-shadow(0 0 20px currentColor)
    brightness(1.3);

  font-weight: 900;
  text-shadow:
    0 0 15px currentColor,
    0 0 30px currentColor,
    3px 3px 6px rgba(0, 0, 0, 1),
    -2px -2px 4px rgba(0, 0, 0, 1);
}

/* ===== GENERAL IMPROVEMENTS ===== */

/* Smoother animations globally */
* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Better image quality */
img {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}

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

/* Premium cursor */
body {
  cursor: url('./assets/images/custom-cursor.png'), auto;
}

/* Selection styling */
::selection {
  background: rgba(255, 215, 0, 0.4);
  color: white;
  text-shadow: 0 0 10px rgba(255, 215, 0, 1);
}

/* ===== SCREEN FLASH ENHANCEMENT ===== */
@keyframes premiumScreenFlash {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0.3;
  }
  100% {
    opacity: 0;
  }
}

/* ===== COMBO/ACHIEVEMENT NOTIFICATIONS ===== */
.notification {
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 2px solid rgba(255, 215, 0, 0.5);
  box-shadow:
    0 0 20px rgba(255, 215, 0, 0.4),
    0 10px 30px rgba(0, 0, 0, 0.6);
}

/* ===== PERFORMANCE OPTIMIZATIONS ===== */
.player-card,
.played-card,
.enemy-card,
.player-card-img {
  will-change: transform, filter, box-shadow;
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}