/**
 * bs Preloader - premium animated preloader styles
 *
 * @author   Bootscore
 * @package  bs Preloader
 * @version  6.0.0
 */

#preloader {
  display: flex;
  background-color: inherit; /* Fallback for existing overrides in child. Replaced by bg-body class */

  /* --------------------------------------------------------------
   * CSS-only failsafe.
   * If JavaScript never runs (script error elsewhere on the page,
   * a blocked/failed asset, etc.) this guarantees the preloader
   * can never block the site forever. It has zero effect on the
   * normal JS-driven experience because the JS always finishes
   * (and hides #preloader) well before this delay elapses.
   * -------------------------------------------------------------- */
  animation: bs-preloader-failsafe-hide .6s ease forwards;
  animation-delay: 7s;
}

@keyframes bs-preloader-failsafe-hide {
  to {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
}

/* Colors / sizing tokens, kept local to the preloader so themes can override easily */
#preloader {
  --bs-preloader-accent: #f0951a;
  --bs-preloader-accent-2: #4a8600;
  --bs-preloader-stage-size: clamp(160px, 28vw, 260px);
}

/**
 * Stage: centered square area holding the badge, glow and logo.
 * All children are centered on top of each other via absolute positioning.
 */
.bs-preloader-stage {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--bs-preloader-stage-size);
  height: var(--bs-preloader-stage-size);
}

/* Glow - soft ambient warmth behind the badge/logo, not a visible disc */
.bs-preloader-glow {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 130%;
  height: 130%;
  transform: translate(-50%, -50%) scale(.8);
  background: radial-gradient(circle, rgba(240, 149, 26, .42) 0%, rgba(240, 149, 26, .2) 38%, rgba(74, 134, 0, .08) 58%, transparent 76%);
  filter: blur(20px);
  opacity: 0;
  pointer-events: none;
  will-change: opacity, transform;
}

/* Badge SVG (drawn / filled / morphed by GSAP).
   Starts hidden: the markup paints early (wp_head) but preloader.js runs
   in the footer, so a default opacity is needed to avoid a flash of the
   fully-formed badge before the entrance tween takes over. Every JS code
   path (full, core-only, no-GSAP, reduced-motion) sets the right visible
   state explicitly, so this default is only ever seen for a beat on very
   first paint - or permanently if JS never runs at all, in which case the
   <noscript> rule in the template hides #preloader entirely. The full
   choreography now runs on every screen size (no mobile-lite path). */
.bs-preloader-badge {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 78%;
  height: 78%;
  transform: translate(-50%, -50%);
  overflow: visible;
  opacity: 0;
  will-change: opacity, transform;
}

.bs-preloader-outer {
  fill: var(--bs-preloader-accent);
}

.bs-preloader-inner {
  fill: #ffffff;
  fill-opacity: 0;
  stroke: #ffffff;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Shine sweep: a soft diagonal highlight animated across the stage.
   The clip wrapper matches the stage bounds and hides overflow so the bar
   can travel from well outside the left edge to well outside the right
   edge without affecting layout. It does not clip its siblings (glow,
   badge, logo) since overflow only applies to its own children. */
.bs-preloader-shine-clip {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.bs-preloader-shine-bar {
  position: absolute;
  top: -25%;
  left: 30%;
  width: 22%;
  height: 150%;
  transform: translateX(-250%) rotate(18deg);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .9), transparent);
  mix-blend-mode: overlay;
  opacity: 0;
}

/* Logo */
.bs-preloader-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 82%;
  height: auto;
  transform: translate(-50%, -50%) scale(.82);
  opacity: 0;
  will-change: opacity, transform;
}

/* Reduced motion: skip choreography entirely, JS reads this too, this is the CSS-only backup */
@media (prefers-reduced-motion: reduce) {
  .bs-preloader-glow,
  .bs-preloader-shine-bar {
    display: none;
  }

  #preloader {
    animation-delay: 2s;
  }
}

/* Small screens: slightly smaller stage only. The full DrawSVG/MorphSVG
   choreography runs identically on all sizes; this just tunes the layout. */
@media (max-width: 576px) {
  #preloader {
    --bs-preloader-stage-size: clamp(120px, 40vw, 200px);
  }
}
