/* ===========================================
   Cyberpunk Gamer — Neon Skin
   =========================================== */

:root {
  --cpg-purple: #a742f5;
  --cpg-blue: #00e5ff;
  --cpg-pink: #ff2ec4;
  --cpg-bg: #07050f;
  --cpg-bg-alt: #0f0a1e;
  --cpg-text: #e8e6f5;
}

/* --- پس‌زمینه کلی سایت --- */
body {
  background: radial-gradient(circle at 20% 20%, rgba(167, 66, 245, 0.15), transparent 40%),
              radial-gradient(circle at 80% 0%, rgba(0, 229, 255, 0.12), transparent 40%),
              radial-gradient(circle at 50% 100%, rgba(255, 46, 196, 0.12), transparent 45%),
              var(--cpg-bg) !important;
  color: var(--cpg-text) !important;
  font-family: 'Rajdhani', 'Vazirmatn', sans-serif !important;
}

/* --- تیترها --- */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Orbitron', 'Rajdhani', sans-serif !important;
  color: #fff !important;
  text-shadow: 0 0 6px rgba(167, 66, 245, 0.6), 0 0 14px rgba(0, 229, 255, 0.35);
  letter-spacing: 0.5px;
}

/* --- لینک‌ها --- */
a {
  color: var(--cpg-blue) !important;
  transition: text-shadow 0.25s ease, color 0.25s ease;
}
a:hover {
  color: var(--cpg-pink) !important;
  text-shadow: 0 0 8px var(--cpg-pink);
}

/* --- کانتینرهای اصلی، ویجت‌ها، کارت‌ها --- */
article, .widget, .entry-content, .post, .comment, table, aside {
  background: rgba(15, 10, 30, 0.55) !important;
  border: 1px solid rgba(167, 66, 245, 0.25) !important;
  border-radius: 10px;
  box-shadow: 0 0 20px rgba(0, 229, 255, 0.05);
}

/* --- دکمه‌ها و ورودی‌ها --- */
button, input[type="submit"], .button, .wp-block-button__link, input[type="button"] {
  background: linear-gradient(135deg, var(--cpg-purple), var(--cpg-blue)) !important;
  border: none !important;
  color: #fff !important;
  font-family: 'Orbitron', sans-serif !important;
  letter-spacing: 1px;
  border-radius: 6px !important;
  box-shadow: 0 0 10px rgba(167, 66, 245, 0.5);
  transition: box-shadow 0.25s ease, transform 0.15s ease;
  text-transform: uppercase;
}
button:hover, input[type="submit"]:hover, .button:hover {
  box-shadow: 0 0 22px var(--cpg-pink), 0 0 8px var(--cpg-blue);
  transform: translateY(-1px);
}

input[type="text"], input[type="email"], input[type="password"], input[type="search"], textarea, select {
  background: rgba(7, 5, 15, 0.8) !important;
  border: 1px solid var(--cpg-purple) !important;
  color: var(--cpg-text) !important;
  border-radius: 6px !important;
}
input:focus, textarea:focus, select:focus {
  outline: none !important;
  border-color: var(--cpg-blue) !important;
  box-shadow: 0 0 10px var(--cpg-blue) !important;
}

/* --- اسکرول‌بار --- */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--cpg-bg); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(var(--cpg-purple), var(--cpg-blue), var(--cpg-pink));
  border-radius: 10px;
}

/* --- انتخاب متن --- */
::selection { background: var(--cpg-pink); color: #000; }

/* ===========================================
   صفحه لودینگ
   =========================================== */
#cpg-loading-screen {
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: var(--cpg-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.6s ease, visibility 0.6s ease;
}
#cpg-loading-screen.cpg-hide {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.cpg-loading-inner { text-align: center; }
.cpg-logo-glitch {
  font-family: 'Orbitron', sans-serif;
  font-size: 2.4rem;
  font-weight: 900;
  color: #fff;
  position: relative;
  text-shadow: 0 0 10px var(--cpg-blue), 0 0 25px var(--cpg-purple);
  animation: cpg-glitch 2.2s infinite;
}
@keyframes cpg-glitch {
  0%, 100% { transform: translate(0,0); }
  20% { transform: translate(-2px, 1px); text-shadow: 2px 0 var(--cpg-pink), -2px 0 var(--cpg-blue); }
  40% { transform: translate(2px, -1px); }
  60% { transform: translate(-1px, 2px); text-shadow: -2px 0 var(--cpg-purple), 2px 0 var(--cpg-pink); }
}
.cpg-bar-wrap {
  width: 260px;
  height: 6px;
  background: rgba(255,255,255,0.08);
  border-radius: 10px;
  margin: 24px auto 12px;
  overflow: hidden;
}
.cpg-bar {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--cpg-purple), var(--cpg-blue), var(--cpg-pink));
  animation: cpg-bar-fill 1.4s ease-in-out infinite;
  border-radius: 10px;
}
@keyframes cpg-bar-fill {
  0% { width: 0%; margin-right: 100%; }
  50% { width: 60%; margin-right: 20%; }
  100% { width: 0%; margin-right: 0%; }
}
.cpg-loading-text {
  font-family: 'Rajdhani', sans-serif;
  color: var(--cpg-blue);
  letter-spacing: 3px;
  font-size: 0.9rem;
}

/* ===========================================
   افکت موس نئونی
   =========================================== */
#cpg-cursor-dot, #cpg-cursor-ring {
  position: fixed;
  top: 0; left: 0;
  border-radius: 50%;
  pointer-events: none;
  z-index: 999998;
  transform: translate(-50%, -50%);
}
#cpg-cursor-dot {
  width: 6px; height: 6px;
  background: var(--cpg-pink);
  box-shadow: 0 0 8px var(--cpg-pink);
}
#cpg-cursor-ring {
  width: 30px; height: 30px;
  border: 2px solid var(--cpg-blue);
  box-shadow: 0 0 12px var(--cpg-blue);
  transition: transform 0.12s ease-out, opacity 0.2s ease;
}

@media (max-width: 782px) {
  #cpg-cursor-dot, #cpg-cursor-ring { display: none; }
}

/* ===========================================
   گیمیفیکیشن — پروفایل، بج، لیدربورد
   =========================================== */
.cpg-profile-card {
  max-width: 360px;
  margin: 20px auto;
  padding: 24px;
  text-align: center;
  background: rgba(15, 10, 30, 0.7);
  border: 1px solid var(--cpg-purple);
  border-radius: 14px;
  box-shadow: 0 0 25px rgba(167, 66, 245, 0.25);
}
.cpg-profile-badge {
  font-family: 'Orbitron', sans-serif;
  font-size: 1.3rem;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 18px;
  border: 2px solid;
  border-radius: 30px;
  margin-bottom: 14px;
}
.cpg-badge-icon { font-size: 1.4rem; }
.cpg-profile-points {
  font-family: 'Orbitron', sans-serif;
  font-size: 1.6rem;
  color: #fff;
  text-shadow: 0 0 10px var(--cpg-blue);
  margin-bottom: 10px;
}
.cpg-progress-wrap {
  width: 100%;
  height: 8px;
  background: rgba(255,255,255,0.08);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 8px;
}
.cpg-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, var(--cpg-purple), var(--cpg-pink));
  border-radius: 10px;
  transition: width 0.5s ease;
}
.cpg-progress-label { font-size: 0.85rem; opacity: 0.8; }

.cpg-leaderboard {
  max-width: 560px;
  margin: 20px auto;
  padding: 20px;
  background: rgba(15, 10, 30, 0.7);
  border: 1px solid var(--cpg-blue);
  border-radius: 14px;
  box-shadow: 0 0 25px rgba(0, 229, 255, 0.2);
}
.cpg-leaderboard-title {
  font-family: 'Orbitron', sans-serif;
  text-align: center;
  font-size: 1.3rem;
  margin-bottom: 16px;
  color: #fff;
}
.cpg-leaderboard-table { width: 100%; border-collapse: collapse; }
.cpg-leaderboard-table td {
  padding: 8px 10px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  vertical-align: middle;
}
.cpg-rank { font-family: 'Orbitron', sans-serif; color: var(--cpg-pink); width: 40px; }
.cpg-avatar img { border-radius: 50%; border: 2px solid var(--cpg-purple); }
.cpg-points { font-family: 'Orbitron', sans-serif; color: var(--cpg-blue); text-align: left; }

.cpg-comment-badge {
  display: inline-block;
  margin-top: 10px;
  padding: 3px 12px;
  font-size: 0.75rem;
  border: 1px solid;
  border-radius: 20px;
  font-family: 'Orbitron', sans-serif;
}

.cpg-notice { text-align: center; opacity: 0.75; }