/* ===== KARÁCSONYI TÉMA 2025 ===== */
/* Karácsonyi vizuális téma - csak stílusok, nem piszkál árakat vagy DOM-ot */

/* Alapértelmezett body styling amikor a téma aktív - VILÁGOSABB HÁTTÉR */
body.christmas-theme {
  background: linear-gradient(135deg, #1a2332 0%, #2d3e50 25%, #34495e 50%, #2d3e50 75%, #1a2332 100%);
  background-attachment: fixed;
  position: relative;
}

/* Karácsonyi overlay - ELTÁVOLÍTVA, mert homályossá tette az oldalt */

/* Hóesés animáció */
.snowflake {
  position: fixed;
  top: -10px;
  z-index: 9999;
  user-select: none;
  cursor: default;
  animation-name: snowfall;
  animation-duration: 10s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  color: #fff;
  font-size: 1em;
  opacity: 0.8;
  text-shadow: 0 0 5px rgba(255,255,255,0.8);
  pointer-events: none;
}

@keyframes snowfall {
  0% {
    transform: translateY(0vh) rotate(0deg);
    opacity: 1;
  }
  100% {
    transform: translateY(100vh) rotate(360deg);
    opacity: 0.3;
  }
}

/* Karácsonyi banner */
.christmas-banner {
  background: linear-gradient(135deg, #c41e3a 0%, #165b33 50%, #c41e3a 100%);
  color: #fff;
  text-align: center;
  padding: 15px 20px;
  font-weight: 700;
  font-size: 1.15rem;
  box-shadow: 0 4px 15px rgba(196, 30, 58, 0.4);
  animation: christmasPulse 3s ease-in-out infinite;
  position: relative;
  overflow: hidden;
  z-index: 1000;
  width: 100%;
  margin: 0;
}

.christmas-banner::before {
  content: '🎄';
  position: absolute;
  left: 20px;
  font-size: 1.8rem;
  animation: swing 2s ease-in-out infinite;
}

.christmas-banner::after {
  content: '🎁';
  position: absolute;
  right: 20px;
  font-size: 1.8rem;
  animation: swing 2s ease-in-out infinite 1s;
}

@keyframes christmasPulse {
  0%, 100% { 
    box-shadow: 0 4px 15px rgba(196, 30, 58, 0.4);
    transform: scale(1);
  }
  50% { 
    box-shadow: 0 6px 25px rgba(196, 30, 58, 0.7);
    transform: scale(1.01);
  }
}

@keyframes swing {
  0%, 100% { transform: rotate(0deg); }
  25% { transform: rotate(-15deg); }
  75% { transform: rotate(15deg); }
}

/* Gombok karácsonyi színekkel - ERŐSEBB SPECIFICITÁS - VILÁGOSABB */
body.christmas-theme .btn,
body.christmas-theme button:not(.lang-btn):not(.transparent-btn):not(#desktop-search-btn):not(#modal-search-btn):not(.menu-toggle):not(.remove-btn),
body.christmas-theme .add-to-cart,
body.christmas-theme .checkout-btn,
body.christmas-theme .cta-button,
body.christmas-theme a.btn,
body.christmas-theme .product button,
body.christmas-theme .product-card button {
  background: linear-gradient(135deg, #e53e3e 0%, #2d7a4d 100%) !important;
  color: #fff !important;
  border: 2px solid rgba(255, 215, 0, 0.8) !important;
  box-shadow: 0 4px 20px rgba(229, 62, 62, 0.5) !important;
  transition: all 0.3s ease !important;
  font-weight: 600 !important;
}

body.christmas-theme .btn:hover,
body.christmas-theme button:not(.lang-btn):not(.transparent-btn):not(#desktop-search-btn):not(#modal-search-btn):not(.menu-toggle):not(.remove-btn):hover,
body.christmas-theme .add-to-cart:hover,
body.christmas-theme .checkout-btn:hover,
body.christmas-theme .cta-button:hover,
body.christmas-theme a.btn:hover,
body.christmas-theme .product button:hover,
body.christmas-theme .product-card button:hover {
  transform: translateY(-3px) scale(1.02) !important;
  box-shadow: 0 6px 30px rgba(229, 62, 62, 0.8), 0 0 20px rgba(255, 215, 0, 0.5) !important;
  border-color: rgba(255, 215, 0, 1) !important;
}

/* Topbar karácsonyi accent - VILÁGOSABB */
body.christmas-theme .topbar {
  background: linear-gradient(90deg, #1a2332 0%, #2d3e50 50%, #1a2332 100%) !important;
  border-bottom: 3px solid #e53e3e !important;
  box-shadow: 0 2px 15px rgba(229, 62, 62, 0.4) !important;
}

/* Termék kártyák karácsonyi fénnyel - VILÁGOSABB */
body.christmas-theme .product,
body.christmas-theme .product-card {
  border: 2px solid rgba(229, 62, 62, 0.4) !important;
  box-shadow: 0 2px 15px rgba(229, 62, 62, 0.2), 0 0 10px rgba(45, 122, 77, 0.15) !important;
  transition: all 0.3s ease !important;
  background: rgba(255, 255, 255, 0.05) !important;
}

body.christmas-theme .product:hover,
body.christmas-theme .product-card:hover {
  border-color: rgba(229, 62, 62, 0.7) !important;
  box-shadow: 0 4px 25px rgba(229, 62, 62, 0.5), 0 0 20px rgba(45, 122, 77, 0.3) !important;
  transform: translateY(-5px) !important;
}

/* Szövegek és címek - FÉNYESEBB */
body.christmas-theme h1,
body.christmas-theme h2,
body.christmas-theme h3 {
  color: #ffd700 !important;
  text-shadow: 0 0 20px rgba(255, 215, 0, 0.6), 0 0 30px rgba(229, 62, 62, 0.4) !important;
  font-weight: 700 !important;
}

/* Link-ek karácsonyi színnel - VILÁGOSABB */
body.christmas-theme a:not(.btn):not(.lang-btn) {
  color: #ffd700 !important;
  transition: color 0.3s ease !important;
}

body.christmas-theme a:not(.btn):not(.lang-btn):hover {
  color: #ff6b6b !important;
}

/* Countdown timer karácsonyi stílus - VILÁGOSABB */
body.christmas-theme .countdown-timer {
  background: linear-gradient(135deg, rgba(229, 62, 62, 0.25) 0%, rgba(45, 122, 77, 0.25) 100%) !important;
  border: 2px solid rgba(255, 215, 0, 0.7) !important;
  box-shadow: 0 4px 25px rgba(229, 62, 62, 0.4) !important;
}

body.christmas-theme .time-value {
  color: #ffd700 !important;
  text-shadow: 0 0 15px rgba(255, 215, 0, 0.8) !important;
  font-weight: 700 !important;
}

/* MOBIL SPECIFIKUS - erősebb prioritás */
@media (max-width: 768px) {
  body.christmas-theme {
    background: linear-gradient(135deg, #1a2332 0%, #2d3e50 50%, #1a2332 100%) !important;
  }
  
  body.christmas-theme button:not(.lang-btn):not(.transparent-btn):not(#desktop-search-btn):not(#modal-search-btn):not(.menu-toggle):not(.remove-btn),
  body.christmas-theme .btn,
  body.christmas-theme .add-to-cart,
  body.christmas-theme .checkout-btn,
  body.christmas-theme .cta-button,
  body.christmas-theme .product button,
  body.christmas-theme .product-card button {
    background: linear-gradient(135deg, #e53e3e 0%, #2d7a4d 100%) !important;
    color: #fff !important;
    border: 2px solid rgba(255, 215, 0, 0.8) !important;
    box-shadow: 0 4px 20px rgba(229, 62, 62, 0.5) !important;
  }
  
  body.christmas-theme h1,
  body.christmas-theme h2,
  body.christmas-theme h3 {
    color: #ffd700 !important;
    text-shadow: 0 0 20px rgba(255, 215, 0, 0.6) !important;
    font-weight: 700 !important;
  }
  
  .christmas-banner {
    font-size: 1rem;
    padding: 12px 15px;
  }
  
  .christmas-banner::before,
  .christmas-banner::after {
    font-size: 1.5rem;
  }
}
