/* DjimlyStore Nexus v4.0.24 — QA consolidation: Naruto readability + global modal safety. */

/* ─────────────────────────────────────────────────────────────
   FREE FIRE × NARUTO — full cinematic background, brand contrast.
   Black text is reserved for white/light cards; dark artwork uses white/blue.
   ───────────────────────────────────────────────────────────── */
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:#04101f!important;
}
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020:before{
  content:"";
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  background:
    linear-gradient(180deg,rgba(2,7,16,.40) 0%,rgba(2,9,20,.54) 27%,rgba(3,12,27,.66) 58%,rgba(3,12,27,.76) 100%),
    url('../events/free-fire-naruto-v4020.jpeg') center top/cover no-repeat!important;
}
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 > .djs-scroller{
  position:relative!important;
  z-index:1!important;
  background:transparent!important;
  background-image:none!important;
  padding-top:10px!important;
}
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 > .djs-scroller:before{
  content:'FREE FIRE × NARUTO  ·  14% OFF JUSQU’AU 14 SEPT.'!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  max-width:calc(100% - 30px)!important;
  min-height:34px!important;
  margin:4px auto 12px!important;
  padding:7px 14px!important;
  border:1px solid rgba(67,174,255,.70)!important;
  border-radius:999px!important;
  background:rgba(2,9,20,.76)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:10px!important;
  line-height:1.2!important;
  font-weight:950!important;
  letter-spacing:.055em!important;
  text-align:center!important;
  text-shadow:0 2px 10px rgba(0,0,0,.75)!important;
  box-shadow:0 10px 30px rgba(0,0,0,.24),inset 0 0 0 1px rgba(255,255,255,.05)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
}

/* Remove the giant white header slab. Keep only a compact floating Retour control. */
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-back-bar,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-back-bar.djs-back-bar-inflow{
  width:100%!important;
  min-height:58px!important;
  margin:0!important;
  padding:8px 14px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  justify-content:flex-start!important;
}
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-back-bar .djs-back-title{
  display:none!important;
}
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-back-bar .djs-return-btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  width:auto!important;
  min-width:108px!important;
  max-width:132px!important;
  height:46px!important;
  min-height:46px!important;
  margin:0!important;
  padding:0 14px!important;
  border:1px solid rgba(95,187,255,.66)!important;
  border-radius:16px!important;
  background:rgba(2,9,20,.76)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  box-shadow:0 10px 26px rgba(0,0,0,.22)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
  font-size:14px!important;
  font-weight:900!important;
}
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-back-bar .djs-return-btn .ms,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-back-bar .djs-return-btn span{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

/* Section heading lives on dark glass: white + DjimlyStore blue, never black on art. */
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-game-pack-title{
  position:relative!important;
  margin:12px 14px!important;
  padding:14px 16px!important;
  border:1px solid rgba(74,178,255,.55)!important;
  border-left:5px solid #35aaf5!important;
  border-radius:16px!important;
  background:linear-gradient(90deg,rgba(2,10,23,.90),rgba(4,17,38,.72))!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  text-shadow:0 2px 9px rgba(0,0,0,.70)!important;
  box-shadow:0 12px 32px rgba(0,0,0,.24)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
}
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-game-pack-title *,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-game-pack-title .ms{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

/* Content/product surfaces stay clean and readable. */
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-content-wrap.djs-game-modern-wrap{
  background:transparent!important;
}
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-game-region-block,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 #djs-game-packs .djs-game-row-v2187,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 #djs-game-info-reviews,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-game-hero-card{
  background:rgba(255,255,255,.985)!important;
  color:#101827!important;
  -webkit-text-fill-color:#101827!important;
  border:1px solid rgba(225,236,245,.98)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.20)!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
}
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 #djs-game-packs .djs-game-row-v2187 *,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-game-region-block *{
  text-shadow:none!important;
}

/* ID / product modal: Naruto artwork behind white/light form surfaces. */
html body #djs-portal #djs-game-modal-backdrop.djs-freefire-naruto-v4020,
html body #djs-portal #djs-game-modal-backdrop.djs-game-detail-backdrop-v2187.djs-freefire-naruto-v4020{
  background:rgba(1,7,17,.78)!important;
  backdrop-filter:blur(7px) saturate(1.08)!important;
  -webkit-backdrop-filter:blur(7px) saturate(1.08)!important;
}
html body #djs-portal #djs-game-modal.djs-freefire-naruto-v4020,
html body #djs-portal #djs-game-modal.djs-game-detail-modal-v2187.djs-freefire-naruto-v4020{
  background:
    linear-gradient(180deg,rgba(2,9,21,.32) 0%,rgba(3,12,28,.52) 19%,rgba(248,251,254,.96) 39%,#fff 100%),
    url('../events/free-fire-naruto-v4020.jpeg') center top/cover no-repeat!important;
  border:1px solid rgba(118,198,255,.56)!important;
  box-shadow:0 28px 90px rgba(0,0,0,.44)!important;
}
html body #djs-portal #djs-game-modal.djs-freefire-naruto-v4020:before{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:rgba(2,9,20,.82)!important;
  border:1px solid rgba(68,177,255,.68)!important;
  text-shadow:0 2px 8px rgba(0,0,0,.70)!important;
}
html body #djs-portal #djs-game-modal.djs-freefire-naruto-v4020 .djs-game-detail-pack-v2187,
html body #djs-portal #djs-game-modal.djs-freefire-naruto-v4020 .djs-game-detail-summary-v2187,
html body #djs-portal #djs-game-modal.djs-freefire-naruto-v4020 .djs-game-detail-fields-v2187,
html body #djs-portal #djs-game-modal.djs-freefire-naruto-v4020 .djs-game-detail-note-v2187,
html body #djs-portal #djs-game-modal.djs-freefire-naruto-v4020 .djs-game-detail-actions-v2187{
  background:rgba(255,255,255,.985)!important;
  color:#111827!important;
  -webkit-text-fill-color:#111827!important;
  border-color:#dce8f2!important;
}
html body #djs-portal #djs-game-modal.djs-freefire-naruto-v4020 input,
html body #djs-portal #djs-game-modal.djs-freefire-naruto-v4020 select,
html body #djs-portal #djs-game-modal.djs-freefire-naruto-v4020 textarea{
  color:#111827!important;
  -webkit-text-fill-color:#111827!important;
  background:#fff!important;
  border-color:#cbddea!important;
}

/* ─────────────────────────────────────────────────────────────
   GLOBAL MODAL SAFETY — no bottom dock can sit over a popup CTA.
   JS also sets inline display:none because the global nav itself has
   inline !important visibility/pointer rules in the legacy installer.
   ───────────────────────────────────────────────────────────── */
html body.djs-overlay-open-v4024{
  overflow:hidden!important;
  overscroll-behavior:none!important;
}
html body.djs-overlay-open-v4024 #djs-portal{
  overscroll-behavior:none!important;
}
html body.djs-overlay-open-v4024 #djs-global-bottom-nav,
html body.djs-overlay-open-v4024 #djs-portal > #djs-global-bottom-nav,
html body.djs-overlay-open-v4024 #djs-portal .djs-bottom-nav,
html body.djs-overlay-open-v4024 #djs-portal .djs-legacy-screen-nav{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
html body.djs-overlay-open-v4024 #djs-game-modal-backdrop,
html body.djs-overlay-open-v4024 #djs-tiktok-coins-backdrop,
html body.djs-overlay-open-v4024 .djs-game-detail-backdrop-v2187,
html body.djs-overlay-open-v4024 [class*="backdrop"]{
  z-index:2147483200!important;
}
html body.djs-overlay-open-v4024 #djs-game-modal,
html body.djs-overlay-open-v4024 #djs-tiktok-coins-modal,
html body.djs-overlay-open-v4024 #djs-voucher-popup,
html body.djs-overlay-open-v4024 #djs-wallet-exchange-modal,
html body.djs-overlay-open-v4024 #djs-wallet-transfer-modal,
html body.djs-overlay-open-v4024 #djs-xbet-modal,
html body.djs-overlay-open-v4024 [role="dialog"][aria-modal="true"]{
  z-index:2147483300!important;
  pointer-events:auto!important;
}
html body.djs-overlay-open-v4024 #djs-tiktok-coins-modal.djs-ttc-modal{
  max-height:calc(100dvh - max(18px,env(safe-area-inset-top)) - max(18px,env(safe-area-inset-bottom)))!important;
  padding-bottom:calc(22px + env(safe-area-inset-bottom))!important;
  overscroll-behavior:contain!important;
}
html body.djs-overlay-open-v4024 #djs-game-modal:not(.djs-manual-credentials-v2189){
  max-height:calc(100dvh - 20px)!important;
  overscroll-behavior:contain!important;
}
html body.djs-overlay-open-v4024 #djs-game-modal .djs-game-detail-actions-v2187{
  position:sticky!important;
  bottom:0!important;
  z-index:20!important;
  padding-bottom:calc(14px + env(safe-area-inset-bottom))!important;
}

@media(max-width:620px){
  html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020:before{
    background-position:50% top!important;
    background-size:cover!important;
  }
  html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 > .djs-scroller{
    background:transparent!important;
    background-image:none!important;
  }
  html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-back-bar .djs-return-btn{
    min-width:104px!important;max-width:118px!important;height:44px!important;min-height:44px!important;border-radius:15px!important;
  }
  html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-game-pack-title{
    margin:10px 12px!important;padding:12px 14px!important;font-size:19px!important;
  }
}
/* Eliminate any legacy gray gutters around the active Naruto screen. */
html body.djs-freefire-flow-v4023 #djs-portal,
html body.djs-freefire-flow-v4023 #djs-portal .djs-app-shell{
  background:#04101f!important;
}

/* v4.0.25 performance override — keep the Naruto treatment but avoid stacking
   expensive backdrop filters over large mobile/PWA surfaces. */
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 > .djs-scroller:before,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-back-bar .djs-return-btn,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-game-pack-title,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-game-region-block,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 #djs-game-packs .djs-game-row-v2187,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 #djs-game-info-reviews,
html body #djs-portal #djs-screen-game.djs-freefire-naruto-v4020 .djs-game-hero-card,
html body #djs-portal #djs-game-modal-backdrop.djs-freefire-naruto-v4020,
html body #djs-portal #djs-game-modal-backdrop.djs-game-detail-backdrop-v2187.djs-freefire-naruto-v4020{
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
@media(max-width:760px){
  html body #djs-portal #djs-game-modal.djs-freefire-naruto-v4020{
    box-shadow:0 16px 42px rgba(0,0,0,.30)!important;
  }
}


/* v4.0.29 — Feedback service picker stacking hotfix.
   The broad v4.0.24 [class*="backdrop"] rule must never lift the feedback
   dimmer above its own service panel. Keep the shade behind the white sheet
   and guarantee every service row/search/close control receives taps. */
html body.djs-overlay-open-v4024 #djs-portal .djs-feedback-service-sheet-v4027 .djs-feedback-service-backdrop-v4027,
html body #djs-portal .djs-feedback-service-sheet-v4027 .djs-feedback-service-backdrop-v4027{
  z-index:0!important;
  pointer-events:auto!important;
}
html body.djs-overlay-open-v4024 #djs-portal .djs-feedback-service-sheet-v4027 .djs-feedback-service-panel-v4027,
html body #djs-portal .djs-feedback-service-sheet-v4027 .djs-feedback-service-panel-v4027{
  z-index:2!important;
  pointer-events:auto!important;
  opacity:1!important;
  filter:none!important;
  -webkit-filter:none!important;
}
html body #djs-portal .djs-feedback-service-sheet-v4027 .djs-feedback-service-panel-head-v4027,
html body #djs-portal .djs-feedback-service-sheet-v4027 .djs-feedback-service-search-v4028,
html body #djs-portal .djs-feedback-service-sheet-v4027 .djs-feedback-service-options-v4027,
html body #djs-portal .djs-feedback-service-sheet-v4027 .djs-feedback-service-options-v4027>button{
  position:relative!important;
  z-index:3!important;
  pointer-events:auto!important;
}
html body #djs-portal .djs-feedback-service-sheet-v4027 .djs-feedback-service-options-v4027>button{
  cursor:pointer!important;
  touch-action:manipulation!important;
}
