/*

Theme Name: My Theme Name

Theme URI: https://mydomainname/

Description: The theme for LFMTE traffic exchanges.

Version: 1.0

Author: Josh Abbott. 
Design Modifications by JASON lARREMORE @ TRAFFICREATIONS.COM.

*/


@charset "utf-8";


/* Main font settings */

body {
	font-size: 16px;
	font-weight: 400;
	color: #00D3FF;
	background-color: #F3EFF3;
}


/* Main styles for the top level of the main menu */

.lfm_menu_bar {

padding: 0 0 45px;
	margin-bottom: 20px; /* 
/* If your menu bar is overlapping the page content, increase the margin here */
}

@media (max-width: 991.98px) {
	/* Mobile view settings for the top level navigation */
	.lfm_menu_bar {
		padding-bottom: 0;
		margin-bottom: 20px;
	}
}


/* ============================================================ 
   Stallion Kick — Dynamic Neon Particle Field (Twinkle Edition)
   + Shooting Stars (2 lanes, glitter trail, no HTML changes)
   ============================================================ */

/* Site logo styles */
.lfm_menu_logo { max-height: 55px; }
@media (min-width: 992px){
  .lfm_menu_logo { margin-right: 20px; }
}

/* Desktop View Settings */
@media (min-width: 992px){
  body{
    margin: 0;
    background-color: #040404;
    background-image: url(/themes/i/header_bg.jpg);
    background-repeat: repeat-x;
  }
  #headerwrapper{
    width: 1500px;
    height: 400px;
    margin: 0 auto;
    clear: both;
    background-color: transparent;
  }
  #header{
    background-image: url(/themes/i/header_template5.png);
    background-repeat: no-repeat;
    background-color: transparent;
    width: 1500px;
    height: 400px;
  }
}

/* Mobile View Settings */
@media (max-width: 992px){
  body{
    margin: 0;
    background-color: #F3EFF3;
    background-image: url(/themes/i/images/mobile_header_bg.jpg);
    background-repeat: repeat-x;
  }
  #headerwrapper{
    width: 300px;
    height: 75px;
    margin: 0 auto;
    clear: both;
    background-color: transparent;
  }
  #header{
    background-image: url(/themes/i/images/mobile_header.png);
    background-repeat: no-repeat;
    width: 300px;
    height: 75px;
    background-color: transparent;
  }
}

/* ============================================================
   Neon Flow + Particle Glow
   ============================================================ */
:root{
  --sk-cyan: #00D3FF;
  --sk-pink: #FD349C;

  --sk-flow-opacity: 0.22;
  --sk-bokeh-opacity: 0.38;
  --sk-dots-opacity: 0.65;

  --sk-flow-speed: 32s;
  --sk-bokeh-speed: 26s;
  --sk-dots-speed-x: 18s;
  --sk-dots-speed-y: 22s;
  --sk-twinkle-speed: 2.6s;

  /* Shooting stars */
  --sk-star-size: 28px;
  --sk-comet-interval: 10s;  /* cadence per lane */
  --sk-comet-tilt: -18deg;   /* diagonal angle */
  --sk-comet-z: 1;           /* above bg layers, below content */
}

body{
  position: relative;
  isolation: isolate;
  overflow-x: hidden;
}

/* ─── LAYER 1: Diagonal Neon Flow ─────────────────────────── */
body::before{
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    linear-gradient(135deg,
      rgba(255,255,255,0.10) 10%,
      rgba(0,211,255,0.10) 25%,
      rgba(253,52,156,0.10) 45%,
      rgba(0,0,0,0) 60%),
    linear-gradient(135deg,
      rgba(0,211,255,0.25) 0%,
      rgba(253,52,156,0.25) 100%);
  opacity: var(--sk-flow-opacity);
  mix-blend-mode: screen;
  background-size: 180% 180%;
  animation: skFlowDrift var(--sk-flow-speed) linear infinite;
}

/* ─── LAYER 2: Floating Cyan/Pink Orbs ────────────────────── */
html::before{
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(22px 22px at 10% 30%, rgba(0,211,255,0.55), transparent 60%) no-repeat,
    radial-gradient(30px 30px at 80% 60%, rgba(253,52,156,0.55), transparent 60%) no-repeat,
    radial-gradient(18px 18px at 45% 15%, rgba(0,211,255,0.5), transparent 60%) no-repeat,
    radial-gradient(22px 22px at 65% 80%, rgba(253,52,156,0.5), transparent 60%) no-repeat;
  opacity: var(--sk-bokeh-opacity);
  filter: drop-shadow(0 0 6px rgba(0,211,255,0.45))
          drop-shadow(0 0 6px rgba(253,52,156,0.45));
  animation: skBokehFloat var(--sk-bokeh-speed) ease-in-out infinite alternate;
}

/* ─── LAYER 3: Dynamic Particle Grid + Twinkle ────────────── */
html::after{
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(circle, rgba(0,211,255,0.85) 1.8px, transparent 2.8px) 0 0 / 120px 120px,
    radial-gradient(circle, rgba(253,52,156,0.85) 1.8px, transparent 2.8px) 60px 60px / 140px 140px,
    radial-gradient(circle, rgba(255,255,255,0.6) 1.5px, transparent 3px) 30px 90px / 100px 100px,
    radial-gradient(circle, rgba(0,211,255,0.75) 1.4px, transparent 2.6px) 90px 30px / 110px 110px;
  opacity: var(--sk-dots-opacity);
  mix-blend-mode: screen;
  filter: drop-shadow(0 0 8px rgba(0,211,255,0.55))
          drop-shadow(0 0 8px rgba(253,52,156,0.45));
  animation:
    skDotsDriftX var(--sk-dots-speed-x) linear infinite,
    skDotsDriftY var(--sk-dots-speed-y) ease-in-out infinite,
    skTwinkle var(--sk-twinkle-speed) ease-in-out infinite alternate;
}

/* ─── ANIMATIONS (neon layers) ────────────────────────────── */
@keyframes skFlowDrift{
  0%{ background-position: 0% 0%; }
  50%{ background-position: 100% 100%; }
  100%{ background-position: 0% 0%; }
}
@keyframes skBokehFloat{
  0%{ transform: translate3d(0,0,0) scale(1); }
  50%{ transform: translate3d(20px,-15px,0) scale(1.05); }
  100%{ transform: translate3d(0,0,0) scale(1); }
}
@keyframes skDotsDriftX{
  0%{ transform: translateX(0); }
  50%{ transform: translateX(-60px); }
  100%{ transform: translateX(0); }
}
@keyframes skDotsDriftY{
  0%{ transform: translateY(0); }
  50%{ transform: translateY(40px); }
  100%{ transform: translateY(0); }
}
/* Twinkle flicker brightness pulse */
@keyframes skTwinkle{
  0%, 100%{ filter: brightness(1) drop-shadow(0 0 8px rgba(0,211,255,0.55)); }
  25%{ filter: brightness(1.3) drop-shadow(0 0 12px rgba(0,211,255,0.8)); }
  50%{ filter: brightness(0.8) drop-shadow(0 0 8px rgba(253,52,156,0.65)); }
  75%{ filter: brightness(2.5) drop-shadow(0 0 14px rgba(255,255,255,0.75)); }
}

/* ============================================================
   SHOOTING STARS — 2 lanes, glitter trail that falls
   (pure CSS via pseudo-elements; no HTML changes)
   Lanes = body::after and #headerwrapper::before
   ============================================================ */

body::after,
#headerwrapper::before{
  content:"";
  position: fixed;
  inset: auto auto auto -22vw;      /* start off-screen left */
  top: 22vh;                         /* lane Y (override per lane) */
  width: var(--sk-star-size);
  height: var(--sk-star-size);
  pointer-events: none;
  z-index: var(--sk-comet-z);
  transform: rotate(var(--sk-comet-tilt));
  opacity: 0;

  /* STAR HEAD (5-point) via clip-path + golden fill */
  background: radial-gradient(circle at 35% 35%, #fff 0 35%, #FFF6C7 36% 60%, #FFD54F 61% 100%);
  -webkit-clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%,
                             79% 91%, 50% 70%, 21% 91%, 32% 57%,
                             2% 35%, 39% 35%);
          clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%,
                             79% 91%, 50% 70%, 21% 91%, 32% 57%,
                             2% 35%, 39% 35%);
  filter:
    drop-shadow(0 0 8px #FFD700)
    drop-shadow(0 0 18px #FFB300)
    drop-shadow(0 0 36px rgba(255, 183, 0, .9));

  /* Idle most of the interval; fly during the last ~24% */
  animation: skStarCycle var(--sk-comet-interval) linear infinite;
}

/* STREAK (bright line) + CROSS GLINT on the star */
body::after::after,
#headerwrapper::before::after{
  content:"";
  position: absolute;
  left: calc(-30vw);
  top: 50%;
  transform: translateY(-50%);
  width: 32vw;                        /* streak length */
  height: 3px;
  border-radius: 999px;
  background:
    linear-gradient(90deg,
      rgba(255,215,0,0) 0%,
      rgba(255,215,0,.18) 8%,
      rgba(255,215,0,.5) 28%,
      rgba(255,215,0,.95) 55%,
      rgba(255,215,0,0) 100%);
  filter:
    blur(0.6px)
    drop-shadow(0 0 10px rgba(255,215,0,1))
    drop-shadow(0 0 16px rgba(255,195,0,.8));
  opacity: 0;
  animation: skStreakPulse calc(var(--sk-comet-interval)*.24) ease-in-out infinite;
}

/* GLITTER TRAIL that FALLS (spark particles peeling off the streak) */
body::after::before,
#headerwrapper::before::before{
  content:"";
  position: absolute;
  left: calc(-18vw);
  top: 50%;
  transform: translateY(-50%) rotate(0deg);
  width: 20vw;
  height: 10vh;                       /* area for falling sparks */
  pointer-events: none;
  opacity: 0;

  /* a cloud of tiny gold dots we animate downward */
  background:
    radial-gradient(2px 2px at 10% 10%, rgba(255,245,200,.95), transparent 60%),
    radial-gradient(2px 2px at 30% 30%, rgba(255,230,150,.9), transparent 60%),
    radial-gradient(1.5px 1.5px at 50% 20%, rgba(255,220,120,.85), transparent 60%),
    radial-gradient(2px 2px at 70% 40%, rgba(255,205,90,.9), transparent 60%),
    radial-gradient(1.5px 1.5px at 20% 70%, rgba(255,230,150,.85), transparent 60%),
    radial-gradient(2px 2px at 60% 80%, rgba(255,240,170,.95), transparent 60%);
  /* taper the glitter region so it looks like it’s peeling from the streak */
  -webkit-mask-image: radial-gradient(60% 140% at 0% 50%, #000 35%, transparent 85%);
          mask-image: radial-gradient(60% 140% at 0% 50%, #000 35%, transparent 85%);
  filter:
    drop-shadow(0 0 6px rgba(255,215,0,.9))
    drop-shadow(0 0 10px rgba(255,190,0,.6));

  animation:
    skGlitterFall calc(var(--sk-comet-interval)*.24) linear infinite,
    skGlitterFlicker .9s ease-in-out infinite;
}

/* LANE POSITIONS + STAGGER */
body::after{                 /* Lane 1 (upper) */
  top: 22vh;
  animation-delay: 0s;
}
#headerwrapper::before{      /* Lane 2 (lower) */
  top: 68vh;
  animation-delay: calc(var(--sk-comet-interval) * .5);
}

/* Mobile tweaks */
@media (max-width: 992px){
  :root{ --sk-star-size: 16px; }
  body::after::after,
  #headerwrapper::before::after{
    width: 38vw; height: 2px;
  }
  body::after::before,
  #headerwrapper::before::before{
    width: 24vw; height: 12vh;
  }
}

/* ===== Keyframes for star flight & effects ===== */
@keyframes skStarCycle{
  0%   { opacity: 0; transform: translate3d(-22vw, -6vh, 0) rotate(var(--sk-comet-tilt)); }
  76%  { opacity: 0; transform: translate3d(-22vw, -6vh, 0) rotate(var(--sk-comet-tilt)); } /* idle */
  78%  { opacity: 1; } /* appear */
  100% { opacity: 1; transform: translate3d(122vw, 10vh, 0) rotate(var(--sk-comet-tilt)); } /* long fly */
}

@keyframes skStreakPulse{
  0%,76% { opacity: 0; }
  80%    { opacity: .85; }
  92%    { opacity: 1; }
  100%   { opacity: .85; }
}

/* Glitter particles drift downward as the star moves right */
@keyframes skGlitterFall{
  0%,76% { opacity: 0; transform: translateY(-50%) translateY(-10px); }
  80%    { opacity: .85; transform: translateY(-50%) translateY(0); }
  100%   { opacity: .85; transform: translateY(-50%) translateY(28px); }
}

/* Soft flicker to make the glitter sparkle */
@keyframes skGlitterFlicker{
  0%,100%{ filter: drop-shadow(0 0 6px rgba(255,215,0,.8)) drop-shadow(0 0 10px rgba(255,190,0,.55)); }
  50%    { filter: drop-shadow(0 0 9px rgba(255,215,0,1)) drop-shadow(0 0 14px rgba(255,195,0,.85)); }
}

/* ─── MOBILE ADJUSTMENT (neon) ────────────────────────────── */
@media (max-width: 992px){
  :root{
    --sk-flow-opacity:  0.14;
    --sk-bokeh-opacity: 0.30;
    --sk-dots-opacity:  0.45;
  }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce){
  body::before, html::before, html::after { animation: none !important; }
  body::after, #headerwrapper::before { display: none !important; animation: none !important; }
}



/* =======================================================
   LFM Menu Bar – Top-Level Navigation (Stallion matched)
   - Orbitron font
   - Glossy cyan hover/open + neon underline
   - Soft gold edge glow (armor trim)
   ======================================================= */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700&display=swap');

:root{
  --stallion-pink: #FD349C;
  --stallion-cyan: #00D3FF;
  --stallion-gold: #FFD700;
}

/* Top-level nav links (base) */
.lfm_menu_bar .navbar-nav > .nav-item > .nav-link{
  font-family: 'Orbitron', sans-serif;
  font-size: 18px;
  color: #FFFFFF;
  font-weight: 700;
  position: relative;
  transition: color .15s ease, background .2s ease, box-shadow .2s ease, transform .15s ease;
}

/* ---------- Desktop ---------- */
@media (min-width: 992px){
  .lfm_menu_bar .navbar-nav > .nav-item > .nav-link{
    margin: 0 3px;
    padding: 8px 16px;
    border: 1px solid transparent;
    border-radius: 12px;
    /* subtle glass base */
    background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0));
  }

  /* Hover (glossy cyan + gold edge) */
  .lfm_menu_bar .navbar-nav > .nav-item > .nav-link:hover{
    color:#fff;
    background:
      linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,0) 45%),
      linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.10)),
      linear-gradient(180deg, rgba(0,211,255,.90), rgba(0,211,255,.72));
    border-color: var(--stallion-pink);
    box-shadow:
      0 0 10px rgba(255,215,0,.40),               /* gold rim */
      0 6px 16px rgba(0,0,0,.25),
      0 0 12px rgba(0,211,255,.45);
    transform: translateY(-1px);
  }

  /* Opened tab (same as hover, a tad stronger) */
  .lfm_menu_bar .navbar-nav > .nav-item.lfm_tab_opened > .nav-link{
    background:
      linear-gradient(180deg, rgba(255,255,255,.30), rgba(255,255,255,0) 42%),
      linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.12)),
      linear-gradient(180deg, rgba(0,211,255,.95), rgba(0,211,255,.76));
    color:#fff;
    border-color: var(--stallion-pink);
    box-shadow:
      0 0 12px rgba(255,215,0,.55),
      0 8px 18px rgba(0,0,0,.28),
      0 0 14px rgba(0,211,255,.55);
  }

  /* Neon "mane" underline (shown on hover/open) */
  .lfm_menu_bar .navbar-nav > .nav-item > .nav-link::after{
    content:"";
    position:absolute;
    left:10px; right:10px; bottom:-8px;
    height:3px; border-radius:3px;
    background: linear-gradient(90deg, var(--stallion-pink), var(--stallion-cyan));
    box-shadow: 0 0 8px rgba(0,211,255,.6), 0 0 6px rgba(255,215,0,.6);
    opacity:0; transform: scaleX(.3);
    transform-origin:center;
    transition: opacity .18s ease, transform .18s ease;
  }
  .lfm_menu_bar .navbar-nav > .nav-item > .nav-link:hover::after,
  .lfm_menu_bar .navbar-nav > .nav-item.lfm_tab_opened > .nav-link::after{
    opacity:1; transform: scaleX(1);
  }
}

/* ---------- Mobile ---------- */
@media (max-width: 991.98px){
  .lfm_menu_bar .navbar-nav > .nav-item > .nav-link{
    padding: 10px 15px;
    text-align: left;
    border-radius: 10px;
  }

  /* Closed state (use cyan instead of bootstrap blue) */
  .lfm_menu_bar .navbar-nav > .nav-item.lfm_tab_closed > .nav-link{
    color:#FFFFFF;
    background-color: var(--stallion-cyan);
  }
  .lfm_menu_bar .navbar-nav > .nav-item.lfm_tab_closed > .nav-link:hover{
    color:#FFFFFF;
    background-color: #13dbff; /* slightly brighter */
  }

  /* Opened state (pink accent) */
  .lfm_menu_bar .navbar-nav > .nav-item.lfm_tab_opened > .nav-link{
    background-color: var(--stallion-pink);
    color:#fff;
    box-shadow: 0 0 10px rgba(255,215,0,.45);
  }

  /* Arrow indicator */
  .lfm_menu_bar .navbar-nav > .nav-item > .nav-link:after{
    content:"";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
    color: #FFFFFF;
    transform: rotate(-90deg);
    position: absolute;
    right: 1.25rem;
    top: 50%;
    margin-top: -2px;
    transition: transform .12s ease-out, color .12s ease-out;
  }
  .lfm_menu_bar .navbar-nav > .nav-item.lfm_tab_opened > .nav-link:after{
    color: #fff;
    transform: rotate(0deg);
  }
}

/* ==========================================================
   Stallion Second-Level Menu — Orbitron + Gold Edge Shine
   - Gold metallic trim around cyan borders
   - Same effects + no scroll bar
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700&display=swap');

:root{
  --stallion-pink: #FD349C;
  --stallion-pink-rgb: 253,52,156;
  --stallion-cyan: #00D3FF;
  --stallion-dark: #111822;
  --stallion-gold: #FFD700;
}

/* safety: no horizontal scroll */
html, body { overflow-x: hidden; }

.lfm_menu_bar{ margin-bottom: 90px !important; }

/* ----------------- Second-Level Container ----------------- */
.lfm_menu_tab{
  background: rgb(0,211,255);
  position: absolute;
  left: 0; top: 100%;
  display: none;
  z-index: 999;
  width: 100%;
  box-sizing: border-box;
  font-family: 'Orbitron', sans-serif;
  font-weight: 700;
  letter-spacing: .5px;
  border: 10px solid var(--stallion-pink);
  /* add metallic gold rim and glow */
  box-shadow:
    0 0 10px rgba(255,215,0,.5),
    inset 0 0 20px rgba(255,215,0,.3),
    0 10px 26px rgba(0,0,0,.38),
    0 0 28px rgba(var(--stallion-pink-rgb), .28) inset;
  backdrop-filter: saturate(120%) blur(2px);
  overflow: visible;
}

/* animated cyan glow behind items */
.lfm_menu_tab::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(60% 40% at 0% 50%, rgba(255,255,255,.18), transparent 55%),
    radial-gradient(50% 35% at 100% 50%, rgba(255,255,255,.12), transparent 60%);
  background-size: 200% 100%;
  animation: driftGlowPos 10s linear infinite;
  opacity:.9;
}

/* show submenu when parent tab is opened */
li.lfm_tab_opened .lfm_menu_tab{ display:flex; }
.lfm_menu_tab > li{ position: relative; }

/* ----------------- Third-Level Container ----------------- */
.lfm_menu_tab .dropdown-menu{
  position: absolute;
  top: 100%;
  left: 0;
  display: none;
  z-index: 10000;
  min-width: 240px;
  padding: 8px 0;
  margin-top: 10px;
  background: rgb(253, 52, 156);
  border: 3px solid var(--stallion-cyan);
  border-radius: 14px;
  box-shadow:
    0 12px 26px rgba(0,0,0,.36),
    0 0 20px rgba(253,52,156,.46),
    0 0 10px rgba(255,215,0,.5); /* gold edge glow */
}
.lfm_menu_tab > li:hover > .dropdown-menu,
.lfm_menu_tab > li:focus-within > .dropdown-menu{ display:block; }

/* ----------------- Second-Level Links ----------------- */
.lfm_menu_tab > li > a{
  position: relative;
  font-family: 'Orbitron', sans-serif;
  font-size: 17px;
  padding: 10px 20px;
  line-height: 25px;
  color:#1d1d1d;
  text-decoration:none;
  display:block;
  border-radius:16px;
  border:1px solid rgba(0,0,0,.18);
  /* glossy cyan base */
  background:
    linear-gradient(180deg, rgba(255,255,255,.3), rgba(255,255,255,0) 42%),
    linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.12)),
    linear-gradient(180deg, rgba(0,211,255,.9), rgba(0,211,255,.7));
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,.25),
    inset 0 -2px 0 rgba(0,0,0,.12),
    0 8px 18px rgba(var(--stallion-pink-rgb), .22),
    0 0 10px rgba(255,215,0,.3); /* subtle gold glow */
  transition: transform .18s ease, box-shadow .2s ease, background-position .45s ease, filter .2s ease;
  background-size: 100% 100%;
}

/* glossy shine sweep */
.lfm_menu_tab > li > a::before{
  content:"";
  position:absolute; inset:0;
  border-radius:inherit;
  background: linear-gradient(115deg, rgba(255,255,255,.0) 35%, rgba(255,255,255,.55) 50%, rgba(255,255,255,.0) 65%);
  background-size:260% 100%;
  background-position:-130% 0;
  opacity:.7;
  transition:background-position .6s ease;
}

/* neon underline */
.lfm_menu_tab > li > a::after{
  content:"";
  position:absolute; left:14px; right:14px; bottom:6px; height:3px;
  border-radius:3px;
  background: linear-gradient(90deg, var(--stallion-pink), var(--stallion-cyan));
  box-shadow: 0 0 10px rgba(0,211,255,.6), 0 0 6px rgba(255,215,0,.6);
  opacity:0; transform:scaleX(.3);
  transform-origin:center;
  transition:transform .25s ease, opacity .25s ease;
}

/* Hover/focus: brighter, gold rim shimmer */
.lfm_menu_tab > li > a:hover,
.lfm_menu_tab > li > a:focus{
  color:#fff;
  transform: translateY(-1px) scale(1.02);
  filter:saturate(120%);
  box-shadow:
    0 10px 22px rgba(var(--stallion-pink-rgb), .34),
    0 0 0 1px rgba(255,255,255,.18) inset,
    0 14px 28px rgba(0,0,0,.25),
    0 0 18px rgba(0,211,255,.55),
    0 0 12px rgba(255,215,0,.75); /* gold halo */
  animation: btnPulse 1.2s ease-out 1;
}
.lfm_menu_tab > li > a:hover::after,
.lfm_menu_tab > li > a:focus::after{ opacity:1; transform:scaleX(1); }
.lfm_menu_tab > li > a:hover::before,
.lfm_menu_tab > li > a:focus::before{ background-position:130% 0; }

/* ----------------- Third-Level Links ----------------- */
.lfm_menu_tab .dropdown-menu a{
  font-family: 'Orbitron', sans-serif;
  font-size:15px;
  padding:10px 22px 10px 44px;
  color:#fff;
  text-decoration:none;
  white-space:nowrap;
  display:block;
  background-color:rgb(253,52,156);
  border-left:3px solid var(--stallion-cyan);
  border-radius:10px;
  margin:4px 10px;
  transition:transform .16s ease, box-shadow .16s ease, background-color .16s ease;
  box-shadow:inset 0 0 8px rgba(255,215,0,.3);
}

/* horse-head accent */
.lfm_menu_tab .dropdown-menu a::before{
  content:"";
  position:absolute; left:14px; top:50%; transform:translateY(-50%);
  width:18px; height:18px;
  background:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path d='M17.8 7.6c.7 2.3-.1 5.8-3.4 7.7-1.8 1.1-3.2 1.3-4.8 1.3l1.1-2.1c-1.8-.3-3.3-1.6-3.7-3.3-.5-2 .6-4.1 2.6-4.9 1.6-.6 3.3-.3 4.5.7l2.1-.9c.8-.3 1.6.2 1.6 1z' fill='%23FD349C'/>\
<circle cx='15.5' cy='8.5' r='1.1' fill='%2300D3FF'/>\
</svg>") no-repeat center / contain;
  opacity:.95; filter:drop-shadow(0 0 4px rgba(0,211,255,.6));
}

/* third-level hover with gold rim */
.lfm_menu_tab .dropdown-menu a:hover,
.lfm_menu_tab .dropdown-menu a:focus{
  background-color:var(--stallion-cyan);
  color:#fff;
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(0,0,0,.25),
              0 0 20px rgba(var(--stallion-pink-rgb), .45) inset,
              0 0 10px rgba(255,215,0,.7);
}

/* ----------------- Mobile ----------------- */
@media (max-width:991.98px){
  .lfm_menu_tab{
    background-color:#EEEEEE;
    position:relative;
    flex-direction:column;
    top:0;
    padding:5px 0;
    border-width:8px;
  }
  .lfm_menu_tab > li > a{
    padding-left:40px;
    line-height:36px;
    width:100%;
  }
  .lfm_menu_tab .dropdown-menu{
    position:static; display:block;
    margin:6px 10px;
    border-width:2px;
    border-radius:10px;
    box-shadow:none;
  }
  .lfm_menu_tab .dropdown-menu a{ padding-left:54px; }
}

/* animations */
@keyframes driftGlowPos{
  0%{background-position:0% 0%;}
  50%{background-position:100% 0%;}
  100%{background-position:0% 0%;}
}
@keyframes btnPulse{
  0%{box-shadow:0 6px 18px rgba(var(--stallion-pink-rgb), .00),inset 0 0 10px rgba(255,255,255,.08);}
  50%{box-shadow:0 12px 28px rgba(var(--stallion-pink-rgb), .44),inset 0 0 14px rgba(255,255,255,.12);}
  100%{box-shadow:0 8px 20px rgba(var(--stallion-pink-rgb), .36),inset 0 0 10px rgba(255,255,255,.08);}
}



/* ==========================================================
   Stallion Footer — "Awesome Stallion Kick"
   - Neon cyan + pink + gold glow
   - Subtle shimmer animation
   - Clean icon and profile sizing preserved
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700&display=swap');

:root {
  --stallion-pink: #FD349C;
  --stallion-cyan: #00D3FF;
  --stallion-gold: #FFD700;
  --stallion-dark: #0a1018;
}

/* ===== Stallion Footer — Rainbow Beam Shimmer (header-style) ===== */

/* container (keep your existing .lfm_footer styles) */
.lfm_footer{
  position: relative;
  overflow: hidden;
}

/* 1) Rainbow light bar across footer (like the header) */
.lfm_footer .stallion-beam{
  position:absolute; left:0; right:0; top:22px;   /* adjust Y to taste */
  height:90px;                                     /* thickness of beam */
  pointer-events:none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.20), rgba(0,0,0,0) 35%, rgba(0,0,0,.25) 100%),
    linear-gradient(90deg,
      #ff2a6d 0%,
      #ff5f2e 12%,
      #ffb300 24%,
      #f4ff1f 36%,
      #53ff3a 48%,
      #00e1ff 60%,
      #2e6bff 72%,
      #8a3dff 84%,
      #ff2ad1 100%
    );
  filter: saturate(130%) brightness(115%);
  box-shadow:
    0 0 24px rgba(0,211,255,.45),
    0 10px 30px rgba(255,215,0,.35) inset;
  opacity:.95;
}

/* soft vertical “equalizer” bars overlay (animated) */
.lfm_footer .stallion-beam::before{
  content:"";
  position:absolute; inset:0;
  background:
    repeating-linear-gradient(90deg,
      rgba(255,255,255,.06) 0 2px,
      rgba(0,0,0,.08) 2px 6px
    );                 /* thin vertical bars */
  mix-blend-mode: screen;
  animation: beamFlicker 1.8s ease-in-out infinite;
  pointer-events:none;
}

/* 2) White shimmer streak sweeping across */
.lfm_footer .stallion-shimmer{
  position:absolute; left:-30%; top:28px; height:80px; width:60%;
  pointer-events:none;
  background: linear-gradient(90deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,.85) 45%,
      rgba(255,255,255,0) 100%
  );
  filter: blur(1.2px);
  opacity:.75;
  animation: shimmerSweep 6.5s linear infinite;
}

/* 3) Thin core highlight line (very bright) */
.lfm_footer .stallion-core{
  position:absolute; left:-20%; top:68px; height:3px; width:140%;
  background: linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.95) 50%,
    rgba(255,255,255,0) 100%
  );
  box-shadow:
    0 0 16px rgba(255,255,255,.9),
    0 0 24px rgba(0,211,255,.7);
  animation: coreSweep 6.5s linear infinite;
  pointer-events:none;
}

/* Optional: faint scanline glow below the beam */
.lfm_footer .stallion-glow{
  position:absolute; left:0; right:0; top:115px; height:18px;
  background: radial-gradient(50% 120% at 50% 0%,
    rgba(0,211,255,.55) 0%, rgba(0,211,255,0) 70%);
  pointer-events:none;
}

/* --------- Animations --------- */
@keyframes shimmerSweep{
  0%   { transform: translateX(-10%); opacity:.70; }
  50%  { transform: translateX(110%); opacity:.85; }
  100% { transform: translateX(230%); opacity:.70; }
}
@keyframes coreSweep{
  0%   { transform: translateX(-10%); }
  100% { transform: translateX(110%); }
}
@keyframes beamFlicker{
  0%,100% { opacity:.35; }
  50%     { opacity:.55; }
}
/* --- make the beam sit under content --- */
.lfm_footer { position: relative; }
.lfm_footer .stallion-beam,
.lfm_footer .stallion-shimmer,
.lfm_footer .stallion-core,
.lfm_footer .stallion-glow {
  z-index: 0;
}
.lfm_footer .container { position: relative; z-index: 5; }

/* --- high-contrast “glass” cards behind text --- */
.footer-card {
  background: linear-gradient(180deg, rgba(0,0,0,.62), rgba(0,0,0,.44));
  border: 1px solid rgba(255,215,0,.35);
  border-radius: 14px;
  padding: 16px 18px;
  box-shadow:
    0 8px 18px rgba(0,0,0,.35),
    0 0 14px rgba(0,211,255,.25) inset;
  backdrop-filter: blur(2px) saturate(110%);
}

/* --- type legibility on rainbow --- */
.lfm_footer h4,
.lfm_footer h5,
.lfm_footer p,
.lfm_footer a,
.lfm_footer li {
  text-shadow:
    0 2px 6px rgba(0,0,0,.65),
    0 0 8px rgba(0,0,0,.25);
}

/* Optional: stronger heading outline */
.lfm_footer .headline-strong {
  text-shadow:
    0 0 0 #000,  /* tiny faux stroke */
    0 2px 6px rgba(0,0,0,.7),
    0 0 10px rgba(0,0,0,.35);
}

/* =======================================================
   STALLIONKICK TABLES (Neon Pink & Cyan Enhanced)
   - Brighter fonts & stronger neon glow
   - Clear on dark, gold, or rainbow backgrounds
   - Safe to drop into any LFMTE theme
   ======================================================= */

:root {
  --sk-pink: #FD349C;
  --sk-cyan: #00E6FF;
  --sk-gold: #FFD700;
  --sk-white: #faffff;
}

/* Optional wrapper */
.sk-card {
  background: linear-gradient(180deg, rgba(0,0,0,.65), rgba(0,0,0,.45));
  border: 1px solid rgba(255,215,0,.45);
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow:
    0 10px 24px rgba(0,0,0,.35),
    0 0 16px rgba(0,211,255,.35) inset;
  backdrop-filter: blur(2px) saturate(120%);
}

/* Responsive wrapper */
.sk-responsive {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 10px;
}

/* Core table */
.stallionkick-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--sk-white);
  background:
    radial-gradient(120% 140% at 50% -20%, rgba(0,211,255,.10), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.25));
  border: 1px solid rgba(0,211,255,.45);
  box-shadow:
    0 0 0 1px rgba(0,211,255,.3) inset,
    0 0 18px rgba(0,0,0,.45);
  border-radius: 12px;
  overflow: hidden;
  font-family: 'Orbitron', sans-serif;
  letter-spacing: .5px;
}

/* Caption */
.stallionkick-table caption {
  caption-side: top;
  padding: 0 0 10px;
  text-align: left;
  font-weight: 700;
  color: var(--sk-cyan);
  text-shadow:
    0 0 8px rgba(0,211,255,.8),
    0 0 16px rgba(253,52,156,.4);
}

/* Header cells */
.stallionkick-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 12px 14px;
  color: #fff;
  background:
    linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,0) 42%),
    linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.22)),
    linear-gradient(180deg, rgba(0,211,255,.95), rgba(0,211,255,.78));
  border-bottom: 1px solid rgba(255,215,0,.55);
  box-shadow:
    0 2px 0 rgba(255,215,0,.4),
    0 5px 14px rgba(0,211,255,.3);
  text-shadow:
    0 0 8px rgba(255,215,0,.45),
    0 0 12px rgba(0,211,255,.45);
}

/* Body cells */
.stallionkick-table td {
  padding: 11px 14px;
  border-bottom: 1px dashed rgba(0,211,255,.25);
  color: var(--sk-white);
  text-shadow: 0 0 6px rgba(0,211,255,.55);
}

/* Stripe + hover */
.stallionkick-table tbody tr:nth-child(odd) {
  background: rgba(255,255,255,.04);
}
.stallionkick-table tbody tr:nth-child(even) {
  background: rgba(0,0,0,.15);
}
.stallionkick-table tbody tr:hover {
  background: rgba(0,211,255,.12);
  box-shadow: inset 0 0 0 9999px rgba(0,211,255,.08);
  color: var(--sk-pink);
  text-shadow: 0 0 8px rgba(253,52,156,.65);
}

/* Corners */
.stallionkick-table thead tr:first-child th:first-child { border-top-left-radius: 12px; }
.stallionkick-table thead tr:first-child th:last-child { border-top-right-radius: 12px; }
.stallionkick-table tbody tr:last-child td:first-child { border-bottom-left-radius: 12px; }
.stallionkick-table tbody tr:last-child td:last-child { border-bottom-right-radius: 12px; }

/* Utilities */
.sk-num {
  font-weight: 700;
  color: var(--sk-cyan);
  text-align: right;
  text-shadow:
    0 0 10px rgba(0,211,255,.75),
    0 0 16px rgba(0,211,255,.45);
}
.sk-label {
  font-weight: 700;
  color: var(--sk-pink);
  text-shadow: 0 0 8px rgba(253,52,156,.6);
}
.sk-right { text-align: right; }

/* Badges */
.sk-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  letter-spacing: .3px;
  border: 1px solid rgba(255,255,255,.25);
  text-shadow: 0 0 6px rgba(0,0,0,.25);
  box-shadow:
    0 0 10px rgba(0,0,0,.25) inset,
    0 0 10px rgba(0,211,255,.25);
}
.sk-badge--cyan {
  background: linear-gradient(180deg, rgba(0,211,255,1), rgba(0,211,255,.75));
  color: #00131a;
  text-shadow: 0 0 8px rgba(0,211,255,.75);
}
.sk-badge--pink {
  background: linear-gradient(180deg, rgba(253,52,156,1), rgba(253,52,156,.75));
  color: #1a0010;
  text-shadow: 0 0 8px rgba(253,52,156,.65);
}
.sk-badge--gold {
  background: linear-gradient(180deg, rgba(255,215,0,.95), rgba(255,215,0,.75));
  color: #231a00;
  text-shadow: 0 0 6px rgba(255,215,0,.65);
}

/* Buttons */
.sk-btn {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 10px;
  font-weight: 700;
  font-size: 13px;
  color: #000;
  text-decoration: none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.25), rgba(255,255,255,0) 45%),
    linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.12)),
    linear-gradient(180deg, rgba(0,211,255,1), rgba(0,211,255,.8));
  border: 1px solid rgba(253,52,156,.6);
  box-shadow:
    0 2px 0 rgba(255,255,255,.25) inset,
    0 6px 12px rgba(0,0,0,.25);
  transition: transform .15s ease, box-shadow .2s ease, color .2s ease;
}
.sk-btn:hover {
  transform: translateY(-1px);
  color: #fff;
  box-shadow:
    0 0 10px rgba(253,52,156,.65),
    0 10px 18px rgba(0,0,0,.28),
    0 0 12px rgba(0,211,255,.65);
}

/* Compact / wide density */
.stallionkick-table--compact td, .stallionkick-table--compact th { padding: 8px 10px; }
.stallionkick-table--wide td, .stallionkick-table--wide th { padding: 14px 18px; }

.neon-button {
  font-size: 18px;
  background-color: #1a2b47; /* Black background */
  color: white; /* Neon blue text */
  font-weight: bold;
  padding: 5px 10px;
  border: none;
  cursor: pointer;
  text-align: center;
  box-shadow: 
    0 0 8px #2323FF,   /* Close, soft neon glow */
    0 0 16px #2323FF,  /* Medium neon glow */
    0 0 32px #2323FF,  /* Bright blue glow */
    0 0 48px #2323FF,  /* Stronger glow effect */
    0 0 64px #2323FF;  /* Extended, intense glow */
}


.neon-button:hover {
    box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #ff0080, 0 0 30px #ff0080, 0 0 40px #ff0080, 0 0 50px #ff0080, 0 0 100px #ff0080; /* Glowing effect on hover */
    color: #ff0080; /* Change text color on hover */
  }

  .neon-button:active {
    box-shadow: 0 0 5px #fff, 0 0 10px #ff0080, 0 0 20px #ff0080;
    background-color: #333; /* Slight background change when clicked */

}
 .neon-button span {
  display: block;
    font-size: 12px;
    color: #9b59b6; /* Purple text */
    margin-top: 5px;
    text-shadow: 0 0 5px #9b59b6, 0 0 10px #9b59b6, 0 0 20px #9b59b6, 0 0 40px #9b59b6;
    animation: neon-purple-pulse 1.0s infinite alternate;
  }

  @keyframes neon-purple-pulse {
    from {
      text-shadow: 0 0 10px #9b59b6, 0 0 20px #9b59b6, 0 0 30px #9b59b6;
    }
    to {
      text-shadow: 0 0 20px #9b59b6, 0 0 30px #9b59b6, 0 0 50px #9b59b6;
    }
  }