/* ============================================================
   CryptoLoveYou — Global Brand Theme
   DEFAULT: Dark — crypto_theme.jpg purple/blue wave (all pages)
   TOGGLE:  Light mode via html.clv-light class (clean white)
   Applied CONSISTENTLY across every page
   ============================================================ */

/* ─── DEFAULT DARK MODE (applied to html and body directly) ─── */
html, body {
  background-color: #07020f;
  background-image:
    radial-gradient(ellipse at 15% 50%, rgba(109,33,168,0.22) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 15%, rgba(59,130,246,0.14) 0%, transparent 50%),
    url('/images/crypto_theme.jpg');
  background-size: cover;
  background-position: center top;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-blend-mode: overlay, overlay, normal;
  color: #f5f3ff;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Hero sections */
.hero,
[class*="hero-"],
.site-hero,
.page-hero {
  background:
    linear-gradient(135deg,
      rgba(26,5,51,0.92) 0%,
      rgba(45,20,88,0.88) 40%,
      rgba(30,58,138,0.85) 100%),
    url('/images/crypto_theme.jpg') center center / cover no-repeat;
  border-bottom: 1px solid rgba(168,85,247,0.25);
  position: relative;
  overflow: hidden;
}

.hero::after {
  content: '';
  position: absolute;
  top: -80px;
  right: -80px;
  width: 360px;
  height: 360px;
  background: radial-gradient(circle, rgba(59,130,246,0.18) 0%, transparent 70%);
  pointer-events: none;
}

/* Nav bar */
nav,
.site-nav,
#masthead,
.navbar,
.smart-head-main,
.smart-head-mid,
.smart-head-top {
  background: rgba(7,2,15,0.85) !important;
  border-bottom: 1px solid rgba(124,58,237,0.2) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Cards and panels */
.card,
.panel,
.widget,
.entry-content .wp-block-group,
[class*="card-"],
[class*="-card"] {
  background: rgba(18,5,38,0.72) !important;
  border: 1px solid rgba(124,58,237,0.18) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* Category page hero */
.category .hero,
.archive .hero,
.tax-category .hero {
  background:
    linear-gradient(160deg,
      rgba(109,33,168,0.25) 0%,
      rgba(7,2,15,0.95) 50%,
      rgba(37,99,235,0.15) 100%),
    url('/images/crypto_theme.jpg') center center / cover no-repeat;
}

/* Guide pages */
.guide-hero,
.en-guide-hero {
  background:
    linear-gradient(135deg,
      rgba(13,31,60,0.96) 0%,
      rgba(17,34,64,0.94) 60%,
      rgba(10,22,40,0.97) 100%),
    url('/images/crypto_theme.jpg') right center / cover no-repeat;
  border: 1px solid rgba(232,155,45,0.2);
}

/* Buttons and CTAs */
.btn-primary,
.wp-block-button__link,
button[type="submit"],
.cta-button {
  background: linear-gradient(135deg, #7c3aed 0%, #3b82f6 100%) !important;
  border: none !important;
  color: #fff !important;
  transition: opacity 0.2s ease, transform 0.15s ease;
}

.btn-primary:hover,
.wp-block-button__link:hover,
button[type="submit"]:hover,
.cta-button:hover {
  opacity: 0.88;
  transform: translateY(-1px);
}

/* Links */
a { color: #a78bfa; }
a:hover { color: #22d3ee; transition: color 0.15s ease; }

/* Typography */
h1, h2, h3, h4, h5, h6 { color: #f5f3ff; }
p, li, td, th { color: #c4b5fd; }
.muted, .text-muted, small { color: #a89dc0; }

/* Utilities */
.accent-border { border-left: 3px solid #7c3aed; padding-left: 1rem; }
hr, .divider { border-color: rgba(124,58,237,0.2); }

/* Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #07020f; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #7c3aed, #3b82f6);
  border-radius: 3px;
}

/* Selection */
::selection { background: rgba(124,58,237,0.4); color: #f5f3ff; }

/* ════════════════════════════════════════════════════════════
   LIGHT MODE (toggle via html.clv-light class)
   Clean white — not lavender, not gray — just proper white
   ════════════════════════════════════════════════════════════ */

html.clv-light,
html.clv-light body {
  background-color: #ffffff !important;
  background-image: none !important;
  background-attachment: scroll !important;
  color: #1e1b4b !important;
}

html.clv-light .hero,
html.clv-light [class*="hero-"],
html.clv-light .site-hero,
html.clv-light .page-hero {
  background:
    linear-gradient(135deg,
      rgba(243,238,253,0.95) 0%,
      rgba(235,245,255,0.92) 100%) !important;
  border-bottom: 1px solid rgba(124,58,237,0.15) !important;
}

html.clv-light nav,
html.clv-light .site-nav,
html.clv-light #masthead,
html.clv-light .navbar,
html.clv-light .smart-head-main,
html.clv-light .smart-head-mid,
html.clv-light .smart-head-top {
  background: rgba(255,255,255,0.95) !important;
  border-bottom: 1px solid rgba(124,58,237,0.12) !important;
}

html.clv-light .card,
html.clv-light .panel,
html.clv-light .widget,
html.clv-light [class*="card-"],
html.clv-light [class*="-card"] {
  background: #ffffff !important;
  border: 1px solid rgba(124,58,237,0.12) !important;
  box-shadow: 0 1px 3px rgba(30,27,75,0.04);
}

html.clv-light h1,
html.clv-light h2,
html.clv-light h3,
html.clv-light h4,
html.clv-light h5,
html.clv-light h6 { color: #1e1b4b !important; }

html.clv-light p,
html.clv-light li,
html.clv-light td,
html.clv-light th { color: #3730a3 !important; }

html.clv-light .muted,
html.clv-light .text-muted,
html.clv-light small { color: #6d6a9c !important; }

html.clv-light a { color: #6d28d9; }
html.clv-light a:hover { color: #2563eb; }

html.clv-light ::-webkit-scrollbar-track { background: #f5f5f5; }
html.clv-light ::selection { background: rgba(167,139,250,0.35); color: #1e1b4b; }

/* Keep X/Twitter icon colour consistent across all link states */
a.s-twitter, a.s-twitter:visited, a.s-twitter:active, a.s-twitter:hover { color: inherit; }

/* Override SmartMag .s-dark class in light mode */
html.clv-light .s-dark body,
html.clv-light .s-dark { background-color: #ffffff !important; }

