/*
Theme Name: PopularFX Child — My Bitcoin World
Theme URI: https://wordpress.org/themes/popularfx/
Description: Futuristic neon cyberpunk child theme for PopularFX (My Bitcoin World)
Author: Mr. Crypto
Template: popularfx
Version: 1.0.0
Text Domain: popularfx-child
*/

/*
  ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
  ┃  MY BITCOIN WORLD — NEON CYBERPUNK SKIN (PopularFX Child)  ┃
  ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
  Drop-in styling: keeps PopularFX layouts intact, upgrades visuals site-wide.
*/

/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600;800&family=Rajdhani:wght@400;600;700&display=swap');

:root{
  --mbw-bg0:#03020a;
  --mbw-bg1:#070822;
  --mbw-glass: rgba(255,255,255,.06);

  --mbw-cyan:#00f7ff;
  --mbw-pink:#ff2fd6;
  --mbw-violet:#8a2bff;
  --mbw-green:#3cff00;
  --mbw-btc:#f7931a;

  --mbw-text:#e9f3ff;
  --mbw-muted:#a9c2ff;

  --mbw-radius:18px;
  --mbw-radius-lg:24px;
  --mbw-shadow: 0 0 18px rgba(0,247,255,.22), 0 0 34px rgba(255,47,214,.14);
  --mbw-shadow-strong: 0 0 0 1px rgba(0,247,255,.16), 0 0 40px rgba(0,247,255,.18), 0 0 60px rgba(255,47,214,.10);
}

html,body{height:100%;}
body{
  background:
    radial-gradient(1200px 700px at 18% 0%, rgba(0,247,255,.18), transparent 60%),
    radial-gradient(1000px 650px at 90% 18%, rgba(255,47,214,.16), transparent 58%),
    radial-gradient(1100px 800px at 55% 95%, rgba(138,43,255,.16), transparent 55%),
    linear-gradient(180deg, var(--mbw-bg1), var(--mbw-bg0));
  color: var(--mbw-text);
  font-family: Rajdhani, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  letter-spacing:.2px;
  overflow-x:hidden;
}

/* Animated aurora */
body:before{
  content:"";
  position:fixed;
  inset:-45%;
  background:
    conic-gradient(from 120deg at 50% 50%,
      rgba(0,247,255,.18),
      rgba(255,47,214,.16),
      rgba(138,43,255,.16),
      rgba(60,255,0,.10),
      rgba(0,247,255,.18));
  filter: blur(70px);
  opacity:.22;
  animation: mbwAurora 18s linear infinite;
  z-index:-3;
}
@keyframes mbwAurora{
  0%{transform:translate3d(-2%, -1%, 0) rotate(0deg);} 
  50%{transform:translate3d(2%, 1%, 0) rotate(180deg);} 
  100%{transform:translate3d(-2%, -1%, 0) rotate(360deg);} 
}

/* Scanlines + grain */
body:after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    repeating-linear-gradient(
      to bottom,
      rgba(255,255,255,.03) 0px,
      rgba(255,255,255,.03) 1px,
      rgba(0,0,0,0) 3px,
      rgba(0,0,0,0) 7px
    ),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.04), transparent 55%);
  mix-blend-mode: overlay;
  opacity:.32;
  z-index:-2;
}

/* Keep content above decorative layers */
body > *{position:relative; z-index:1;}

/* Typography */
h1,h2,h3,h4,h5,h6{
  font-family: Orbitron, system-ui, sans-serif;
  letter-spacing:.7px;
  text-shadow: 0 0 18px rgba(0,247,255,.16);
}
h1{
  font-weight:800;
  background: linear-gradient(90deg, var(--mbw-cyan), var(--mbw-btc), var(--mbw-pink));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
p{color: rgba(233,243,255,.92)}
small,.small,.site-description{color: rgba(169,194,255,.90)}

::selection{background: rgba(0,247,255,.25); color: var(--mbw-text);}

/* Links */
a{color: var(--mbw-cyan); text-decoration:none; transition: .2s ease;}
a:hover{color: var(--mbw-pink); text-shadow: 0 0 12px rgba(255,47,214,.45);}

/* Global focus */
:focus-visible{outline: 2px solid rgba(0,247,255,.55); outline-offset: 3px; border-radius: 10px;}

/* Header / Nav — "neon control panel" */
.site-header{
  background: linear-gradient(180deg, rgba(10,12,30,.78), rgba(10,12,30,.22));
  border-bottom: 1px solid rgba(0,247,255,.20);
  box-shadow: 0 0 30px rgba(0,247,255,.10);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.mbw-header-wrap{
  position:relative;
  border-radius: 0 0 var(--mbw-radius-lg) var(--mbw-radius-lg);
}

.mbw-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding: 10px 16px;
  background: linear-gradient(90deg, rgba(0,247,255,.10), rgba(255,47,214,.08));
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.mbw-topbar .mbw-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(247,147,26,.38);
  background: rgba(247,147,26,.10);
  box-shadow: 0 0 18px rgba(247,147,26,.18);
  font-family: Orbitron, system-ui, sans-serif;
  letter-spacing:.7px;
  font-size: 12px;
  text-transform: uppercase;
}
.mbw-topbar .mbw-badge .mbw-dot{
  width: 10px; height: 10px; border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, rgba(255,255,255,.9), rgba(247,147,26,.45));
  box-shadow: 0 0 14px rgba(247,147,26,.35);
}

.mbw-topbar .mbw-tagline{
  font-family: Rajdhani, system-ui, sans-serif;
  letter-spacing:.3px;
  color: rgba(233,243,255,.88);
  display:flex;
  align-items:center;
  gap:10px;
}
.mbw-topbar .mbw-tagline .mbw-chip{
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,247,255,.22);
  background: rgba(0,247,255,.08);
  box-shadow: 0 0 18px rgba(0,247,255,.10);
  font-family: Orbitron, system-ui, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
}

/* Brand badge (stacked neon label near the site title) */
.mbw-brand-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,247,255,.22);
  background: linear-gradient(90deg, rgba(0,247,255,.08), rgba(255,47,214,.06));
  box-shadow: 0 0 22px rgba(0,247,255,.12);
}
.mbw-brand-icon{
  width: 28px;
  height: 28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius: 10px;
  background: rgba(247,147,26,.12);
  border: 1px solid rgba(247,147,26,.35);
  box-shadow: 0 0 20px rgba(247,147,26,.18);
  font-family: Orbitron, system-ui, sans-serif;
  font-weight: 800;
  color: rgba(247,147,26,.95);
  text-shadow: 0 0 14px rgba(247,147,26,.35);
}
.mbw-brand-text{
  font-family: Orbitron, system-ui, sans-serif;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 1px;
  color: rgba(233,243,255,.95);
}
.mbw-brand-tag{
  font-family: Rajdhani, system-ui, sans-serif;
  font-size: 12px;
  color: rgba(169,194,255,.92);
  padding-left: 10px;
  border-left: 1px solid rgba(255,255,255,.10);
}

.site-branding .site-title a{
  font-family: Orbitron, system-ui, sans-serif;
  letter-spacing: 1px;
  text-transform: uppercase;
  background: linear-gradient(90deg, var(--mbw-cyan), var(--mbw-btc), var(--mbw-pink));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* Neon underline accent under header */
.site-header:after{
  content:"";
  display:block;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(0,247,255,.75), rgba(247,147,26,.75), rgba(255,47,214,.75), transparent);
  box-shadow: 0 0 18px rgba(0,247,255,.25);
}

/* Menu */
.main-navigation a{
  font-family: Orbitron, system-ui, sans-serif;
  text-transform: uppercase;
  letter-spacing:.8px;
  font-size: 12px;
  opacity:.92;
  padding: 10px 12px;
  border-radius: 999px;
}
.main-navigation a:hover{
  background: rgba(0,247,255,.08);
  box-shadow: 0 0 18px rgba(0,247,255,.15);
}
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a{
  background: linear-gradient(90deg, rgba(0,247,255,.18), rgba(255,47,214,.14));
  border: 1px solid rgba(0,247,255,.25);
  box-shadow: var(--mbw-shadow);
}

/* Hamburger */
.menu-toggle{
  border-radius: 999px;
  border: 1px solid rgba(0,247,255,.25);
  background: rgba(0,247,255,.06);
  box-shadow: 0 0 18px rgba(0,247,255,.12);
}

/* Content surfaces */
article, .post, .page, .widget, .comments-area, .entry, .entry-content > *{border-radius: var(--mbw-radius);}

.entry-content > .wp-block-group,
.entry-content > .wp-block-columns,
.entry-content > .wp-block-cover,
.entry-content > .wp-block-media-text,
.widget,
article,
.post,
.page{
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  border: 1px solid rgba(0,247,255,.18);
  box-shadow: var(--mbw-shadow);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* Extra panel wrapper (used in child templates) */
.mbw-panel{
  border-radius: var(--mbw-radius-lg);
  border: 1px solid rgba(0,247,255,.18);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  box-shadow: var(--mbw-shadow);
  padding: 18px;
}

.widget, article, .post, .page{padding: 18px;}

/* Entry title glow */
.entry-title{
  text-shadow: 0 0 18px rgba(0,247,255,.20), 0 0 32px rgba(255,47,214,.10);
}

/* Buttons */
button,
input[type="submit"],
.wp-block-button__link,
a.button,
.button,
input[type="button"],
input[type="reset"]{
  font-family: Orbitron, system-ui, sans-serif;
  letter-spacing:.9px;
  border-radius: 999px !important;
  padding: 12px 18px !important;
  border: 1px solid rgba(0,247,255,.35) !important;
  background: linear-gradient(90deg, rgba(0,247,255,.18), rgba(255,47,214,.18)) !important;
  color: var(--mbw-text) !important;
  box-shadow: 0 0 0 1px rgba(0,247,255,.15), 0 0 22px rgba(0,247,255,.18);
  transition: transform .15s ease, box-shadow .2s ease, filter .2s ease;
}
button:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover,
a.button:hover,
.button:hover{
  transform: translateY(-1px);
  box-shadow: 0 0 0 1px rgba(255,47,214,.25), 0 0 34px rgba(255,47,214,.22);
  filter: saturate(1.15);
}
button:active,
input[type="submit"]:active,
.wp-block-button__link:active{
  transform: translateY(0) scale(.99);
}

/* Forms */
input[type="text"], input[type="email"], input[type="search"], input[type="url"], input[type="password"], textarea, select{
  background: rgba(5,6,14,.55) !important;
  color: var(--mbw-text) !important;
  border: 1px solid rgba(0,247,255,.22) !important;
  border-radius: 14px !important;
  padding: 12px 14px !important;
  outline: none !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03);
}
input:focus, textarea:focus, select:focus{
  border-color: rgba(255,47,214,.35) !important;
  box-shadow: 0 0 0 3px rgba(255,47,214,.15), 0 0 26px rgba(0,247,255,.12);
}

/* Images */
img{border-radius: 14px;}
.wp-block-image img{
  border: 1px solid rgba(0,247,255,.18);
  box-shadow: 0 0 22px rgba(0,247,255,.12);
}

/* Tables */
table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border-radius: 16px;
  border: 1px solid rgba(0,247,255,.18);
  box-shadow: 0 0 24px rgba(0,247,255,.12);
}
th,td{padding: 12px 12px; border-bottom: 1px solid rgba(255,255,255,.06);}
th{
  font-family: Orbitron, system-ui, sans-serif;
  letter-spacing:.6px;
  background: rgba(0,247,255,.10);
}

/* Footer */
.site-footer{
  margin-top: 40px;
  background: linear-gradient(180deg, rgba(10,12,30,.20), rgba(10,12,30,.68));
  border-top: 1px solid rgba(255,47,214,.18);
  box-shadow: 0 -18px 44px rgba(255,47,214,.08);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.mbw-footer-band{
  display:flex;
  justify-content:center;
  gap: 18px;
  padding: 14px 10px 0;
  opacity:.55;
}
.mbw-footer-mark{
  font-family: Orbitron, system-ui, sans-serif;
  font-weight: 800;
  color: rgba(247,147,26,.25);
  text-shadow: 0 0 20px rgba(247,147,26,.18), 0 0 40px rgba(0,247,255,.08);
  letter-spacing: 2px;
}
.mbw-footer-title{
  font-family: Orbitron, system-ui, sans-serif;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0 0 10px;
  color: rgba(233,243,255,.94);
}
.site-info{
  opacity:.9;
  padding: 18px 14px;
  border-radius: var(--mbw-radius);
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.03);
  box-shadow: 0 0 20px rgba(0,247,255,.06);
}

/* Optional utility: neon badge */
.mbw-badge-inline{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(247,147,26,.35);
  background: rgba(247,147,26,.10);
  box-shadow: 0 0 18px rgba(247,147,26,.18);
  font-family: Orbitron, system-ui, sans-serif;
}

/* Motion accessibility */
@media (prefers-reduced-motion: reduce){
  body:before{animation:none;}
}
/* PopularFX header background fix */
.site-header {
  background-size: contain !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  min-height: 600px;
}
/* ===============================
   HERO HEADER IMAGE FIX
   Ensures full image is visible
================================ */

.mbw-header-wrap,
.site-header {
  overflow: visible !important;
}

.site-header .custom-header,
.site-header .wp-custom-header,
.site-header .wp-custom-header img {
  width: 100%;
  height: auto !important;
  max-height: 600px;
}

/* If header image is used as background */
.site-header .custom-header,
.site-header .wp-custom-header {
  background-size: contain !important; /* KEY FIX */
  background-position: center center;
  background-repeat: no-repeat;
  min-height: 600px;
}