/* =========================================================
   HOTWIN88 — Dragon theme (SEO-first / Soft)
   Priority: Core Web Vitals, readability, mobile, crawl-safe
   - Minimal animation (static by default)
   - High text contrast
   - No canvas / JS / video / heavy filters
   - Decorative layers: pointer-events none + aria-hidden in HTML
   ========================================================= */

:root {
  --dragon-bg: #0d0706;
  --dragon-bg-2: #160a08;
  --dragon-surface: #1c0c0a;
  --dragon-crimson: #a31616;
  --dragon-red: #d42121;
  --dragon-fire: #e85a12;
  --dragon-orange: #f08a2e;
  --dragon-gold: #e8c25a;
  --dragon-gold-deep: #a67c1a;
  --dragon-text: #fff8e8;
  --dragon-text-muted: #e8d9b8;
  --dragon-border: rgba(232, 194, 90, 0.4);
  --dragon-radius: 12px;
}

/* ---------- Base (static, cheap paint) ---------- */
body.theme-dragon-fire {
  background: linear-gradient(180deg, var(--dragon-bg) 0%, var(--dragon-bg-2) 100%) !important;
  color: var(--dragon-text);
  position: relative;
  overflow-x: hidden;
}

body.theme-dragon-fire .gradient {
  background: transparent !important;
}

/* Single subtle top glow — no animated layers, no dotted texture (saves paint) */
body.theme-dragon-fire::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 180px;
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(ellipse 80% 100% at 50% 0%, rgba(232, 90, 18, 0.12), transparent 70%);
}

body.theme-dragon-fire::after {
  display: none; /* was fire wash — disabled for SEO/perf */
}

body.theme-dragon-fire > * {
  position: relative;
  z-index: 1;
}

/* ---------- Decor: disabled by default for SEO mode ---------- */
.dragon-fx {
  display: none; /* no embers / side bans in SEO-first mode */
}

/* Optional: enable slim side bans only on very wide screens (static) */
@media (min-width: 1280px) {
  .dragon-fx {
    display: block;
    pointer-events: none;
    position: fixed;
    inset: 0;
    z-index: 2;
    overflow: hidden;
  }

  .dragon-embers {
    display: none !important; /* never animate particles in SEO mode */
  }

  .dragon-side-ban {
    position: fixed;
    top: 18%;
    width: 36px;
    height: min(320px, 42vh);
    border-radius: 3px 3px 14px 14px;
    background: linear-gradient(
      180deg,
      var(--dragon-gold) 0%,
      var(--dragon-gold-deep) 10%,
      var(--dragon-crimson) 10%,
      #6b1010 90%,
      var(--dragon-gold-deep) 90%,
      var(--dragon-gold) 100%
    );
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
    opacity: 0.75;
    /* static — no animation */
  }

  .dragon-side-ban::before {
    content: "龍";
    position: absolute;
    top: 20%;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    color: var(--dragon-gold);
    writing-mode: vertical-rl;
    width: 100%;
  }

  .dragon-side-ban::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -14px;
    transform: translateX(-50%);
    border-left: 14px solid transparent;
    border-right: 14px solid transparent;
    border-top: 14px solid var(--dragon-gold);
  }

  .dragon-side-ban--left { left: 8px; }
  .dragon-side-ban--right { right: 8px; }
}

/* Top accent line — static (no pulse) */
.dragon-top-ribbon {
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--dragon-fire), var(--dragon-gold), var(--dragon-fire), transparent);
  /* no box-shadow animation, light static glow only */
  box-shadow: 0 0 8px rgba(232, 90, 18, 0.25);
}

.dragon-top-ribbon::before {
  display: none;
}

/* ---------- Announcement ---------- */
body.theme-dragon-fire #shopify-section-announcement_bar_slider {
  background: #1a0a08 !important;
  border-bottom: 1px solid var(--dragon-border);
}

body.theme-dragon-fire .hura-announcement-bar .hura-message {
  color: var(--dragon-text) !important;
  font-weight: 600;
}

body.theme-dragon-fire .announcement_link {
  color: var(--dragon-gold) !important;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ---------- Header ---------- */
body.theme-dragon-fire .section-header,
body.theme-dragon-fire .header-wrapper,
body.theme-dragon-fire sticky-header.header-wrapper {
  background: #120806 !important;
  border-bottom: 1px solid var(--dragon-border) !important;
}

body.theme-dragon-fire .header {
  background: transparent !important;
}

body.theme-dragon-fire .header__menu-item a,
body.theme-dragon-fire .header_nav a,
body.theme-dragon-fire #right_menu_items li a {
  color: var(--dragon-text) !important;
}

body.theme-dragon-fire .header__menu-item:hover a,
body.theme-dragon-fire .header_nav a:hover {
  color: var(--dragon-gold) !important;
}

/* Prefer solid logo rendering over drop-shadow filters (cheaper) */
body.theme-dragon-fire .brand--logo img {
  filter: none;
}

/* ---------- CTA buttons ---------- */
body.theme-dragon-fire .login,
body.theme-dragon-fire .login-button,
body.theme-dragon-fire .register,
body.theme-dragon-fire .register-button {
  background: linear-gradient(180deg, #e07020 0%, #b01818 100%) !important;
  border: 2px solid var(--dragon-gold) !important;
  color: #fff !important;
  text-shadow: none;
  box-shadow: none;
  transition: opacity 0.15s ease;
}

body.theme-dragon-fire .login:hover,
body.theme-dragon-fire .register:hover,
body.theme-dragon-fire .login-button:hover,
body.theme-dragon-fire .register-button:hover {
  opacity: 0.92;
  transform: none; /* avoid layout-adjacent motion */
  box-shadow: none;
}

/* ---------- Product media (static frame) ---------- */
body.theme-dragon-fire .product__media.media,
body.theme-dragon-fire .product__media {
  border-radius: var(--dragon-radius) !important;
  overflow: hidden;
  border: 2px solid var(--dragon-border) !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
  background: #120806;
}

body.theme-dragon-fire .product__media img,
body.theme-dragon-fire .image-magnify-lightbox {
  border-radius: calc(var(--dragon-radius) - 2px);
}

/* No infinite glow animation — static accent only */
body.theme-dragon-fire .product__media-gallery {
  padding: 4px;
  border-radius: calc(var(--dragon-radius) + 2px);
  background: linear-gradient(135deg, rgba(232, 194, 90, 0.35), rgba(180, 30, 30, 0.25));
  box-shadow: none;
  animation: none !important;
}

/* Titles — high contrast for SEO readability / UX */
body.theme-dragon-fire .product__title h1,
body.theme-dragon-fire .product-title-style h1,
body.theme-dragon-fire .product-title-style h2 {
  color: #fffef8 !important;
  text-shadow: none;
  font-weight: 700;
}

body.theme-dragon-fire .product_tag_display {
  color: var(--dragon-gold) !important;
  font-weight: 700;
}

body.theme-dragon-fire .actual_price_bold,
body.theme-dragon-fire #price-item-sale {
  color: var(--dragon-gold) !important;
  text-shadow: none;
}

/* LOB cards — simple hover opacity, no transform jank */
body.theme-dragon-fire .list-lob {
  background: var(--dragon-surface);
  border: 1px solid var(--dragon-border);
  border-radius: 10px;
  box-shadow: none;
  transition: border-color 0.15s ease;
}

body.theme-dragon-fire .list-lob:hover {
  transform: none;
  border-color: rgba(232, 194, 90, 0.65);
}

body.theme-dragon-fire .apl_lob_title {
  color: var(--dragon-text) !important;
}

body.theme-dragon-fire .apl_lob_price {
  color: var(--dragon-gold) !important;
}

/* ---------- SEO content panel ---------- */
body.theme-dragon-fire .dragon-content-panel {
  position: relative;
  overflow: hidden;
  background: #1a0c0a !important;
  border: 1px solid var(--dragon-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35) !important;
  color: var(--dragon-text) !important;
}

body.theme-dragon-fire .dragon-content-panel::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--dragon-fire), var(--dragon-gold), var(--dragon-fire), transparent);
  z-index: 3;
}

body.theme-dragon-fire .dragon-content-panel h2 {
  color: var(--dragon-gold) !important;
  text-shadow: none;
  -webkit-text-fill-color: unset !important;
  background: none !important;
}

body.theme-dragon-fire .dragon-content-panel p,
body.theme-dragon-fire .dragon-content-panel li,
body.theme-dragon-fire .dragon-content-panel ol {
  color: var(--dragon-text) !important;
  line-height: 1.75;
}

/* Corners: static unicode, low opacity, not keyword content */
body.theme-dragon-fire .dragon-corner {
  position: absolute;
  font-size: 22px;
  line-height: 1;
  color: rgba(232, 194, 90, 0.35);
  z-index: 3;
  pointer-events: none;
  text-shadow: none;
}

body.theme-dragon-fire .dragon-corner--tl { top: 10px; left: 12px; }
body.theme-dragon-fire .dragon-corner--tr { top: 10px; right: 12px; transform: scaleX(-1); }
body.theme-dragon-fire .dragon-corner--bl { bottom: 10px; left: 12px; transform: scaleY(-1); }
body.theme-dragon-fire .dragon-corner--br { bottom: 10px; right: 12px; transform: scale(-1); }

/* ---------- FAQ (readable, high contrast) ---------- */
body.theme-dragon-fire .faq-section {
  background: #160a08 !important;
  border: 1px solid var(--dragon-border);
  box-shadow: none;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.theme-dragon-fire .faq-section h2 {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: var(--dragon-gold) !important;
  color: var(--dragon-gold) !important;
}

body.theme-dragon-fire .faq-item {
  background: #1c0c0a !important;
  border: 1px solid rgba(232, 194, 90, 0.28) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

body.theme-dragon-fire .faq-item:hover {
  border-color: rgba(232, 194, 90, 0.5) !important;
  box-shadow: none !important;
}

body.theme-dragon-fire .faq-question {
  color: var(--dragon-text) !important;
}

body.theme-dragon-fire .faq-answer p {
  color: var(--dragon-text-muted) !important;
}

/* ---------- Fixed footer nav ---------- */
body.theme-dragon-fire .asik-fixed-footer {
  background: #120806 !important;
  border-top: 1px solid var(--dragon-border) !important;
  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.35) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.theme-dragon-fire .asik-fixed-footer a {
  color: var(--dragon-text) !important;
}

body.theme-dragon-fire .asik-fixed-footer a:hover,
body.theme-dragon-fire .asik-fixed-footer a.tada {
  color: var(--dragon-gold) !important;
  text-shadow: none;
}

/* ---------- Site footer ---------- */
body.theme-dragon-fire .footer,
body.theme-dragon-fire .shopify-section-group-footer-group,
body.theme-dragon-fire #footerAccordion {
  background: #0d0706 !important;
  color: var(--dragon-text-muted) !important;
  border-top: 1px solid rgba(232, 194, 90, 0.22);
}

body.theme-dragon-fire .footer-block__heading,
body.theme-dragon-fire .headerBlu {
  color: var(--dragon-gold) !important;
}

body.theme-dragon-fire .footer_content_list,
body.theme-dragon-fire .footer a {
  color: var(--dragon-text-muted) !important;
}

body.theme-dragon-fire .footer a:hover {
  color: var(--dragon-gold) !important;
}

body.theme-dragon-fire .button--primary,
body.theme-dragon-fire button.button {
  background: linear-gradient(180deg, #e07020, #b01818) !important;
  color: #fff !important;
  border-color: var(--dragon-gold) !important;
}

body.theme-dragon-fire ::selection {
  background: rgba(232, 90, 18, 0.4);
  color: #fff;
}

body.theme-dragon-fire .product__info-wrapper,
body.theme-dragon-fire .product__info-container {
  color: var(--dragon-text);
}

body.theme-dragon-fire .sku-pdp,
body.theme-dragon-fire .barcode-pdp,
body.theme-dragon-fire .product__tax {
  color: var(--dragon-text-muted) !important;
}

body.theme-dragon-fire .nosubmit,
body.theme-dragon-fire input[type="search"] {
  background: #1c0c0a !important;
  color: var(--dragon-text) !important;
  border: 1px solid var(--dragon-border) !important;
}

/* Product page spacing: keep content easy to scan (SEO UX) */
body.theme-dragon-fire .product__title h1 {
  line-height: 1.3;
}

/* Mobile: zero decorative FX, max readability */
@media (max-width: 989px) {
  .dragon-fx {
    display: none !important;
  }

  body.theme-dragon-fire::before {
    height: 100px;
    opacity: 0.85;
  }

  body.theme-dragon-fire .dragon-content-panel .dragon-corner {
    font-size: 16px;
    opacity: 0.7;
  }

  body.theme-dragon-fire .product__media-gallery {
    padding: 3px;
  }
}

/* Accessibility: no motion */
@media (prefers-reduced-motion: reduce) {
  body.theme-dragon-fire *,
  body.theme-dragon-fire *::before,
  body.theme-dragon-fire *::after {
    animation: none !important;
    transition: none !important;
  }

  .dragon-fx,
  .dragon-embers {
    display: none !important;
  }
}

/* Print / reader-friendly */
@media print {
  .dragon-fx,
  .dragon-top-ribbon,
  .asik-fixed-footer {
    display: none !important;
  }

  body.theme-dragon-fire {
    background: #fff !important;
    color: #000 !important;
  }
}