/* DjimlyStore Digital v2.39.90 — standalone News, Tutorials, category catalogue, OTP and mobile-safe checkout */

/* --------------------------------------------------------------------------
   Tutorials — premium responsive page + embedded in-card player
   -------------------------------------------------------------------------- */
html body #djs-portal #djs-screen-tutorials{
  --t-bg:#f3f6f9;--t-card:#fff;--t-ink:#102133;--t-muted:#66788a;--t-line:#dce6ef;--t-accent:#ff9418;
  background:var(--t-bg)!important;color:var(--t-ink)!important;overflow-x:hidden!important;
}
html body #djs-portal #djs-screen-tutorials .djs-scroller{
  padding-bottom:calc(118px + env(safe-area-inset-bottom))!important;overflow-x:hidden!important;
}
html body #djs-portal .djs-tutorials-v23989{background:var(--t-bg)!important;color:var(--t-ink)!important;min-height:100%!important}
html body #djs-portal .djs-tutorial-hero-v23989{
  position:relative;overflow:hidden;background:linear-gradient(135deg,#071827 0%,#0e3550 55%,#0c6ea5 100%)!important;
  color:#fff!important;padding:42px 22px 38px!important;border:0!important;
}
html body #djs-portal .djs-tutorial-hero-v23989:after{content:"";position:absolute;right:-60px;top:-95px;width:250px;height:250px;border-radius:50%;background:rgba(255,255,255,.07);pointer-events:none}
html body #djs-portal .djs-tutorial-hero-v23989 small{color:#ffad45!important;-webkit-text-fill-color:#ffad45!important;font-size:11px!important;letter-spacing:.14em!important}
html body #djs-portal .djs-tutorial-hero-v23989 h1{color:#fff!important;-webkit-text-fill-color:#fff!important;font-size:clamp(32px,8vw,46px)!important;line-height:1.02!important;letter-spacing:-.035em!important}
html body #djs-portal .djs-tutorial-hero-v23989 p{color:#d8e6ef!important;-webkit-text-fill-color:#d8e6ef!important;max-width:700px!important;font-size:15px!important;line-height:1.6!important;margin-top:14px!important}
html body #djs-portal .djs-tutorial-grid-v23989{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:22px!important;padding:28px 18px 44px!important;width:min(980px,100%)!important;max-width:100%!important;margin:auto!important;
}
html body #djs-portal .djs-tutorial-card-v23989{display:block!important;min-width:0!important;width:100%!important;color:var(--t-ink)!important;background:var(--t-card)!important;border:1px solid var(--t-line)!important;border-radius:22px!important;overflow:hidden!important;box-shadow:0 10px 30px rgba(18,45,69,.08)!important}
html body #djs-portal .djs-tutorial-player-slot-v23990{position:relative;width:100%!important;max-width:100%!important;overflow:hidden!important;background:#050608!important;aspect-ratio:16/9!important}
html body #djs-portal .djs-tutorial-cover-button-v23990{display:block!important;width:100%!important;height:100%!important;border:0!important;padding:0!important;margin:0!important;border-radius:0!important;background:#eef2f6!important;overflow:hidden!important;cursor:pointer!important}
html body #djs-portal .djs-tutorial-cover-button-v23990:disabled{cursor:default!important;opacity:1!important}
html body #djs-portal .djs-tutorial-cover-v23989 img{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;object-fit:contain!important;object-position:center!important;background:#eef2f6!important}
html body #djs-portal .djs-tutorial-play-v23989{width:54px!important;height:54px!important;border:3px solid rgba(255,255,255,.9)!important;background:#ff9418!important;box-shadow:0 8px 25px rgba(255,148,24,.34)!important}
html body #djs-portal .djs-tutorial-play-v23989 .ms{font-size:29px!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
html body #djs-portal .djs-tutorial-coming-v23989{left:12px!important;bottom:12px!important;background:rgba(5,13,22,.82)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;font-size:10px!important}
html body #djs-portal .djs-tutorial-copy-v23990{padding:14px 15px 16px!important}
html body #djs-portal .djs-tutorial-card-v23989 h3{margin:0 0 6px!important;color:var(--t-ink)!important;-webkit-text-fill-color:var(--t-ink)!important;font-size:18px!important;line-height:1.25!important;font-weight:900!important}
html body #djs-portal .djs-tutorial-card-v23989 p{margin:0!important;color:var(--t-muted)!important;-webkit-text-fill-color:var(--t-muted)!important;font-size:12px!important;line-height:1.48!important}
html body #djs-portal .djs-tutorial-inline-player-v23990{position:relative;width:100%;height:100%;display:grid;place-items:center;background:#000}
html body #djs-portal .djs-tutorial-inline-player-v23990 video{display:block;width:100%!important;height:100%!important;aspect-ratio:16/9!important;object-fit:contain!important;background:#000!important;border:0!important}
html body #djs-portal .djs-tutorial-player-close-v23990{position:absolute;z-index:8;right:9px;top:9px;width:38px;height:38px;border:1px solid rgba(255,255,255,.3);border-radius:50%;background:rgba(0,0,0,.7);color:#fff;display:grid;place-items:center;backdrop-filter:blur(8px)}
html body #djs-portal .djs-tutorial-video-fallback-v23990{position:absolute;left:10px;right:10px;bottom:10px;padding:9px 11px;border-radius:12px;background:rgba(0,0,0,.75);color:#fff;font-size:11px;text-align:center}.djs-tutorial-video-fallback-v23990 a{color:#80c9ff!important;font-weight:850}
html body #djs-portal .djs-tutorial-image-placeholder-v23990{display:grid;place-items:center;width:100%;height:100%;color:#8ba0b3}.djs-tutorial-image-placeholder-v23990 .ms{font-size:42px!important}
html body #djs-portal .djs-tutorial-video-overlay-v23989{display:none!important}
@media(max-width:700px){html body #djs-portal .djs-tutorial-grid-v23989{grid-template-columns:1fr!important;gap:18px!important;padding:20px 14px 34px!important}html body #djs-portal .djs-tutorial-hero-v23989{padding:34px 18px 30px!important}html body #djs-portal .djs-tutorial-card-v23989{border-radius:18px!important}html body #djs-portal .djs-tutorial-play-v23989{width:50px!important;height:50px!important}}

/* Dark mode: never render black text on the dark Tutorial hero/cards. */
html body #djs-portal.djs-dark #djs-screen-tutorials,html body [data-theme="dark"] #djs-screen-tutorials{--t-bg:#08111a;--t-card:#0f1b26;--t-ink:#f6f9fc;--t-muted:#aebdca;--t-line:#263746;background:var(--t-bg)!important}
html body #djs-portal.djs-dark .djs-tutorial-cover-button-v23990 img,html body [data-theme="dark"] .djs-tutorial-cover-button-v23990 img{background:#101922!important}

/* --------------------------------------------------------------------------
   Full category catalogue — reference-style 3-column mobile layout
   -------------------------------------------------------------------------- */
html body #djs-portal #djs-screen-category-browser{background:#fff!important;color:#101114!important;overflow-x:hidden!important}
html body #djs-portal #djs-screen-category-browser .djs-category-browser-scroller{padding-bottom:calc(120px + env(safe-area-inset-bottom))!important;overflow-x:hidden!important}
html body #djs-portal .djs-category-browser-shell{width:min(980px,100%)!important;max-width:100%!important;padding:12px 14px 34px!important;margin:auto!important;overflow:hidden!important}
html body #djs-portal .djs-category-browser-head{position:relative;display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px!important;align-items:center!important;gap:8px!important;min-height:60px!important}
html body #djs-portal .djs-category-browser-picker{justify-self:center!important;border:0!important;background:transparent!important;box-shadow:none!important;min-width:0!important;padding:0!important}
html body #djs-portal .djs-category-browser-picker>span:first-child{display:none!important}
html body #djs-portal .djs-category-browser-picker select{appearance:none!important;border:0!important;background:transparent!important;font-size:20px!important;font-weight:900!important;text-align:center!important;text-align-last:center!important;color:#101114!important;padding:0 4px!important;max-width:190px!important}
html body #djs-portal .djs-category-browser-picker>span:last-child{color:#101114!important;font-size:20px!important}
html body #djs-portal .djs-category-browser-back,html body #djs-portal .djs-category-browser-cart{width:42px!important;height:42px!important;border:0!important;border-radius:50%!important;background:#fff!important;color:#101114!important;box-shadow:none!important}
html body #djs-portal .djs-category-browser-category-tabs{display:flex!important;gap:7px!important;overflow-x:auto!important;scrollbar-width:none!important;margin:2px -14px 14px!important;padding:2px 14px 7px!important;white-space:nowrap!important;overscroll-behavior-x:contain!important}.djs-category-browser-category-tabs::-webkit-scrollbar{display:none!important}
html body #djs-portal .djs-category-browser-category-tabs button{flex:0 0 auto!important;border:1px solid #e2e6ea!important;border-radius:999px!important;background:#fff!important;color:#6a7179!important;padding:8px 12px!important;font-size:11px!important;font-weight:850!important}
html body #djs-portal .djs-category-browser-category-tabs button.active{background:#101114!important;border-color:#101114!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
html body #djs-portal .djs-category-browser-meta{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin:7px 0 10px!important}.djs-category-browser-meta b{font-size:15px!important;color:#101114!important}.djs-category-browser-meta small{font-size:9px!important;max-width:55%!important;text-align:right!important;color:#7b828a!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html body #djs-portal .djs-category-browser-search{height:50px!important;border:0!important;border-radius:7px!important;background:#f1f4f6!important;box-shadow:none!important;margin-bottom:12px!important}.djs-category-browser-search input{font-size:15px!important;color:#111!important}.djs-category-browser-search .ms{color:#7b8793!important}
html body #djs-portal .djs-category-browser-tabs{justify-content:flex-end!important;gap:18px!important;border:0!important;margin:0 0 12px!important;min-height:auto!important}.djs-category-browser-tabs button{flex:0 0 auto!important;border:0!important;background:transparent!important;padding:6px 0!important;font-size:13px!important;font-weight:800!important;color:#111!important}.djs-category-browser-tabs button.active{color:#f5a200!important}.djs-category-browser-tabs button.active:after{display:none!important}
html body #djs-portal .djs-category-browser-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:22px 9px!important;align-items:start!important;width:100%!important;max-width:100%!important}
html body #djs-portal .djs-category-showcase-card{min-width:0!important;width:100%!important;max-width:100%!important;padding:0!important;margin:0!important;border:0!important;background:transparent!important;color:#101114!important;text-align:left!important;box-shadow:none!important;overflow:visible!important}
html body #djs-portal .djs-category-product-media{position:relative!important;display:grid!important;place-items:center!important;width:100%!important;aspect-ratio:1/1!important;border-radius:12px!important;overflow:hidden!important;background:#f5f6f7!important;border:1px solid #edf0f2!important;padding:5px!important}
html body #djs-portal .djs-category-product-media img,html body #djs-portal .djs-category-product-media .djs-product-photo{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;object-fit:contain!important;object-position:center!important;border-radius:9px!important;background:transparent!important}
html body #djs-portal .djs-category-discount{left:auto!important;right:4px!important;top:4px!important;background:#ff8a00!important;border-radius:5px!important;padding:4px 6px!important;font-size:8px!important;line-height:1!important}
html body #djs-portal .djs-category-product-name{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;white-space:normal!important;overflow:hidden!important;margin:7px 1px 0!important;color:#101114!important;-webkit-text-fill-color:#101114!important;font-size:10.5px!important;font-weight:780!important;line-height:1.18!important;min-height:25px!important}
html body #djs-portal .djs-category-product-metrics{display:flex!important;align-items:center!important;gap:3px!important;margin:4px 1px 0!important;min-width:0!important}.djs-category-stars .ms{font-size:9px!important}.djs-category-product-metrics small{font-size:7.5px!important;color:#7d858d!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html body #djs-portal .djs-category-cashback{display:block!important;margin:3px 1px 0!important;color:#11995c!important;font-size:7.5px!important;font-weight:900!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html body #djs-portal .djs-category-product-price{display:flex!important;align-items:baseline!important;gap:4px!important;margin:4px 1px 0!important;min-width:0!important}.djs-category-product-price s{font-size:7.5px!important;color:#9098a0!important}.djs-category-product-price b{font-size:10px!important;color:#101114!important;font-weight:900!important;white-space:nowrap!important}
html body #djs-portal .djs-category-showcase-card .djs-ff-card-countdown{transform:scale(.72)!important;transform-origin:left top!important;margin:4px 0 -8px!important;max-width:142%!important}
@media(min-width:700px){html body #djs-portal .djs-category-browser-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:28px 16px!important}.djs-category-product-name{font-size:12px!important}.djs-category-product-price b{font-size:12px!important}}
@media(max-width:370px){html body #djs-portal .djs-category-browser-shell{padding-left:9px!important;padding-right:9px!important}.djs-category-browser-grid{gap:18px 6px!important}.djs-category-product-name{font-size:9.5px!important}.djs-category-product-price b{font-size:9px!important}.djs-category-product-metrics small{font-size:6.8px!important}}

/* Full logo/image visibility for Streaming, Gift cards and product detail views. */
html body #djs-portal .djs-product-card__img img,
html body #djs-portal .djs-home-square-media img,
html body #djs-portal .djs-account-ref-product-media img,
html body #djs-portal .djs-game-pack-photo img,
html body #djs-portal .djs-pack-list-card img,
html body #djs-portal #djs-screen-product img.djs-product-photo,
html body #djs-portal #djs-screen-game img.djs-product-photo{
  object-fit:contain!important;object-position:center!important;max-width:100%!important;max-height:100%!important;
}
html body #djs-portal .djs-product-card__img,html body #djs-portal .djs-home-square-media,html body #djs-portal .djs-account-ref-product-media{overflow:hidden!important;border-radius:14px!important;background:#f6f7f8!important;padding:5px!important}

/* Gift Card v2.39.90 benefits: 1% campaign + 1.5% cashback remain separate. */
html body #djs-portal [data-category="giftcards"] .djs-cashback,
html body #djs-portal [data-category="giftcard"] .djs-cashback,
html body #djs-portal #djs-screen-product.djs-product-giftcards .djs-pack-cashback{color:#0d9957!important;font-weight:950!important}

/* Streaming price treatment — keep the approved countdown untouched. */
html body #djs-portal #djs-screen-game .djs-pack-list-card .djs-pack-price{
  font-size:clamp(18px,4.8vw,25px)!important;font-weight:950!important;letter-spacing:-.035em!important;line-height:1!important;color:#111827!important;
}
html body #djs-portal #djs-screen-game .djs-pack-list-card s,html body #djs-portal #djs-screen-game .djs-pack-list-card .djs-pack-old-price{color:#6f7780!important;font-size:11px!important;text-decoration-thickness:2px!important}

/* Product/game modal primary CTA always remains above the fixed bottom navigation. */
@media(max-width:700px){
  html body #djs-portal #djs-screen-game .djs-scroller,html body #djs-portal #djs-screen-product .djs-scroller{padding-bottom:calc(180px + env(safe-area-inset-bottom))!important}
  html body #djs-portal #djs-game-modal .djs-game-detail-actions-v2187{position:sticky!important;bottom:calc(78px + env(safe-area-inset-bottom))!important;z-index:45!important;margin-top:14px!important;padding:10px 12px!important;background:rgba(255,255,255,.97)!important;backdrop-filter:blur(14px)!important;border-radius:18px!important;box-shadow:0 -6px 22px rgba(14,31,48,.08)!important}
  html body #djs-portal #djs-game-modal #djs-game-modal-submit{min-height:56px!important;border-radius:16px!important;visibility:visible!important;position:relative!important;z-index:46!important}
}

/* Streaming OTP buttons / delivered code. */
html body #djs-portal .djs-sub-otp-request,html body #djs-portal .djs-sub-otp-sent{border-color:#b9dcf4!important;background:#eff8ff!important;color:#086ba8!important;-webkit-text-fill-color:#086ba8!important;font-weight:900!important}.djs-sub-otp-request .ms,.djs-sub-otp-sent .ms{color:#086ba8!important}
html body #djs-portal .djs-sub-otp-request.is-pending{background:#fff7e7!important;color:#8c6200!important;-webkit-text-fill-color:#8c6200!important;border-color:#f3daa2!important;opacity:1!important}
html body #djs-portal .djs-sub-otp-code-v23990{margin:14px 0;padding:14px;border-radius:17px;background:linear-gradient(135deg,#eef8ff,#f7fbff);border:1px solid #b9ddf5}.djs-sub-otp-code-v23990>span{display:block;font-size:9px;font-weight:950;letter-spacing:.12em;color:#39708f}.djs-sub-otp-code-v23990>div{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:5px}.djs-sub-otp-code-v23990 code{font-size:27px;font-weight:950;letter-spacing:4px;color:#0a5d91}.djs-sub-otp-code-v23990 small{display:block;margin-top:5px;color:#63798a;font-size:10px}
html body #djs-portal .djs-sub-otp-pending-v23990{display:flex;align-items:center;gap:8px;margin:14px 0;padding:12px 14px;border-radius:15px;background:#fff7e7;color:#825b00;font-weight:850;font-size:12px}

/* Orders: eye icon must be visible on the pale-blue Voir commande button. */
html body #djs-portal #djs-screen-orders .djs-order-view-btn .ms,html body #djs-portal #djs-screen-orders .djs-order-view-btn span.ms{color:#075eaa!important;-webkit-text-fill-color:#075eaa!important;font-variation-settings:'FILL' 1!important;opacity:1!important}
html body #djs-portal #djs-screen-orders .djs-order-view-btn{color:#0875bd!important;-webkit-text-fill-color:#0875bd!important;font-weight:900!important}

/* Final mobile safety: no page content trapped under the fixed nav. */
html body #djs-portal .djs-screen .djs-scroller{scroll-padding-bottom:calc(120px + env(safe-area-inset-bottom))}
