/* Split from headernew.css: desktop megamenu styles */

.games-megamenu-toggle{
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  cursor: pointer;
  background: rgba(255,255,255,.06);
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: .2px;
  box-shadow: 0 10px 26px rgba(0,0,0,.35);
  white-space: nowrap;
  width: auto;
  min-width: 110px;
}

.games-megamenu-toggle .megamenu-arrow{
  color: #fff;
  opacity: .9;
  transition: transform .18s ease;
}

.games-megamenu-toggle:where(:hover,:focus-visible){
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.16);
  box-shadow: 0 14px 34px rgba(0,0,0,.45);
  outline: none;
}

/* 5.1) Триггеры open/close (close заменяет open) */

.games-megamenu-trigger{
  position: relative;
  display: inline-block;
  z-index: 1250;
}

#gamesMegaMenuToggle{
  position: relative;
  display: inline-flex !important;
}

#gamesMegaMenuClose{
  position: absolute;
  inset: 0;
  display: none !important;
  justify-content: center;
  gap: 0 !important;
  padding: 10px 20px;
}

.games-megamenu.open #gamesMegaMenuToggle{
  visibility: hidden;
}

.games-megamenu.open #gamesMegaMenuClose{
  display: inline-flex !important;
  background: #eb10101f;
}

/* 6) MegaMenu — дропдаун под шапкой (fixed) */

.games-megamenu{
  position: relative;
}

/* 6.0) Затемнение страницы при открытом мегаменю (не трогаем шапку) */
body::before{
  content: "";
  position: fixed;
  left: 0;
  right: 0;
  top: var(--header-height,72px);
  bottom: 0;
  background: rgba(0,0,0,.55);
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease;
  z-index: 990;
}

body.megamenu-open::before{
  opacity: 1;
  pointer-events: auto;
}

.games-megamenu-dropdown{
  position: fixed;
  z-index: 1248;
  --mm-col-pad: 22px;
  --mm-divider: rgba(255,255,255,.10);
  --mm-divider-glow: rgba(119,9,255,.16); 
  left: 0;
  right: 0;
  width: auto;
  height: 55vh;
  min-height: 300px;
  top: var(--header-height,72px);
  background: rgba(12,12,14,.94);
  border-bottom: 1px solid transparent;
  border-image: linear-gradient(90deg, rgba(114, 15, 254, 0.2) 0%, rgba(37, 99, 235, .55) 35%, rgba(114, 15, 254, .65) 70%, rgba(255, 225, 115, 0.2) 100%);
  border-image-slice: 1;
  box-shadow: 0 12px 40px rgba(0,0,0,.45);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);  
  display: none;
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity .25s ease, transform .25s ease;
  padding-block: 20px 24px;
  padding-inline: var(--page-gutter);
  padding-bottom: 40px;
  overflow: hidden;
  border-radius: 0 0 20px 20px;
  z-index: 1248;
}

.games-megamenu.open .games-megamenu-dropdown{
  display: block;
  opacity: 1;
  transform: translateY(0);
}

/* 6.1) Внутренняя раскладка: left fixed / center flex / right fixed + pinned right */

.megamenu-content{
  display: flex;
  align-items: flex-start;
  gap: 0;
  width: 100%;
}
/* визуальные разделители между колонками */
.megamenu-left,
.megamenu-center{
  position: relative;
}

.megamenu-left::after,
.megamenu-center::after{
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 1px;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,0) 0%,
    var(--mm-divider) 18%,
    rgba(255,255,255,.06) 82%,
    rgba(255,255,255,0) 100%
  );
  box-shadow: 0 0 26px var(--mm-divider-glow);
  opacity: .9;
  pointer-events: none;
}

.megamenu-left{
  flex: 0 0 340px;
}

.megamenu-center{
  flex: 1 1 auto;
  min-width: 0;
  overflow-y: visible;
  display: flex;
  flex-direction: column;
}

.megamenu-right{
  flex: 0 0 318px;
  margin-left: auto;
  padding-left: var(--mm-col-pad);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  overflow: visible;
}

.megamenu-right-title{
  align-self: stretch;
  font-size: 15px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #b7b7b7;
  margin: 0 0 10px;
  min-height: 36px;
  line-height: 1;
  display: flex;
  align-items: center;
  gap: 10px;
}

.megamenu-right-title::after{
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: linear-gradient(90deg, rgba(255,255,255,.14), rgba(255,255,255,0));
  opacity: .9;  
}

/* 6.2) Левый список игр — одинаковые строки, без стрелок; SVG фикс */

.megamenu-left-title{
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #b7b7b7;
  margin: 0 0 10px;
  min-height: 36px;
  line-height: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
}

.megamenu-left-title::after{
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: linear-gradient(90deg, rgba(255,255,255,.14), rgba(255,255,255,0));
  opacity: .9;  
}

/* отступ — только справа под скролл; слева вплотную к колонке */

.games-megamenu-list{
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-left: 0;
  padding-right: 8px;
  padding-bottom: 8px;
  max-height: calc(50vh - 70px);
  overflow: auto;
  scrollbar-gutter: stable;
}

.games-megamenu-list .game-arrow{
  display: none !important;
}

.games-megamenu-game{
  height: 44px;
  min-height: 44px;
  margin-right: 8px;
  padding-left: 12px;
  padding-right: 12px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #e9e9e9;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.06);
  cursor: pointer;
  position: relative;
  transition: background .15s ease, border-color .15s ease;
}

@media (hover:hover){
  .games-megamenu-game:hover{
    background: rgba(255,255,255,.06);
    border-color: rgba(255,255,255,.10);
  }  
}

.games-megamenu-game.active{
  background: linear-gradient(90deg, rgba(37,99,235,.95), rgba(114,15,254,.95));
  border-color: rgba(114,15,254,.55);
  color: #fff;
}

.games-megamenu-game.active::before{
  content: "";
  position: absolute;
  left: 4px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(114,15,254,.95), rgba(37,99,235,.95));
  opacity: .95;
}

.games-megamenu-game .nav-svg{
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.06);  
}

/* поддерживаем как inline <svg>, так и <img> */

.games-megamenu-game .nav-svg svg,
.games-megamenu-game .nav-svg img,
.games-megamenu-game .nav-svg .nav-svg-img{
  width: 26px;
  height: 26px;
  display: block;
  object-fit: contain;
  margin: 0;
}

.games-megamenu-game .game-title{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 6.3) Центр: заголовок/кнопка сверху; категории — грид 3→2→1 */

.megamenu-top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 36px;
  margin-bottom: 16px;
  padding: 0px 0px 8px 14px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.megamenu-top .megamenu-game-title{
  margin: 0;
}

.megamenu-game-title{
  font-size: 15px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #b7b7b7;
  margin: 0;
}

.megamenu-all-btn{
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 14px;
  margin-right: 22px;
  border-radius: 10px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  font-size: 13px;
}

.megamenu-all-btn:hover{
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.12);
}

.games-megamenu-categories{
  display: grid;
  gap: 16px;
  padding-right: 12px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  max-height: calc(55vh - 82px);
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-gutter: stable both-edges;
  contain: layout paint;
  padding-bottom: 6px;
}

.games-megamenu-categories,
.games-megamenu-categories *{
  min-width: 0;
  overflow-wrap: anywhere;
}

.megamenu-cat{
  padding: 12px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  transition: border-color .15s ease, background .15s ease;
}

@media (hover:hover){
  .megamenu-cat:hover{
    background: rgba(255,255,255,.04);
    border-color: rgba(255,255,255,.10);
  }
}

.megamenu-cat h4{
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
}

.megamenu-cat h4 a{
  color: inherit;
  text-decoration: none;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 6px 10px;
  border-radius: 10px;
  transition: background .15s ease, opacity .15s ease;  
}

.megamenu-cat h4 a::after{
  content: "›";
  margin-left: auto;
  opacity: .55;
}

@media (hover:hover){
  .megamenu-cat h4 a:hover{
    opacity: .98;
    background: rgba(255,255,255,.06);
  }
}

.megamenu-sublist{
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.megamenu-sublist a{
  display: block;
  padding: 6px 10px;
  border-radius: 10px;
  font-size: 13px;
  color: #c9c9c9;
  text-decoration: none;
  transition: background .15s ease, color .15s ease;
}

.megamenu-sublist a:hover{
  color: #fff;
  background: rgba(255,255,255,.06)
}

/* ===== MegaMenu Hot Offer — компактная карточка ===== */

.games-megamenu-dropdown .mm-hot-card{
  --mm-card-w: 260px;
  --mm-img-h: 150px;
  --mm-pad-x: 1rem;
  --mm-overlap: 26px;
  width: var(--mm-card-w);
  min-width: var(--mm-card-w);
  max-width: var(--mm-card-w);
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--nt-card-bg);
  border: 1px solid var(--nt-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 18px rgba(0,0,0,.22) !important;
  overflow: hidden;
  cursor: pointer;
  transform: none;
  transition: box-shadow var(--nt-transition, .22s ease),
              border-color var(--nt-transition, .22s ease);
}

@media (hover:hover){
  .games-megamenu-dropdown .mm-hot-card:hover{
    transform: none !important;
    border-color: rgba(119,9,255,.38) !important;
    box-shadow:
      0 12px 34px rgba(0,0,0,.38),
      0 0 0 1px rgba(119,9,255,.22),
      0 0 28px rgba(119,9,255,.20) !important;
  }
}

/* Anti-flicker / drag smoothness (safe for cube variant too) */
.games-megamenu-dropdown .mm-hot-face,
.games-megamenu-dropdown .mm-hot-face *{
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.games-megamenu-dropdown .mm-hot-3d.is-cube.is-dragging .mm-hot-3d-inner,
.games-megamenu-dropdown .mm-hot-3d-inner.mm-hot-no-trans{
  transition: none !important;
}
.games-megamenu-dropdown .mm-hot-card .product-img{
  transform: translateZ(0.01px);
}
/* картинка фикс-высоты + затемнение снизу */

.games-megamenu-dropdown .mm-hot-imgbox{
  position: relative;
  flex: 0 0 var(--mm-img-h);
  height: var(--mm-img-h);
  overflow: hidden;
  background: #0f1117;
}

.games-megamenu-dropdown .mm-hot-img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.games-megamenu-dropdown .mm-hot-imgbox::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 70%;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.48) 40%, rgba(0,0,0,.92) 100%);
  pointer-events: none;
}

/* бейдж компактный справа */

.games-megamenu-dropdown .mm-hot-badge{
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  font-size: 11px;
  line-height: 1;
  font-weight: 800;
  color: var(--badge-text, #fff);
  background: var(--badge-bg, #7709FF);
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 4px 12px rgba(0,0,0,.28);
}

.games-megamenu-dropdown .mm-hot-badge .badge-ico{
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  background: currentColor;
  -webkit-mask: var(--badge-icon) no-repeat center / contain;
  mask: var(--badge-icon) no-repeat center / contain;
}

.games-megamenu-dropdown .mm-hot-badge .badge-label{
  display: inline-block;
}

/* контент — «заезжает» на картинку, тянется по высоте; цена внизу */

.games-megamenu-dropdown .mm-hot-content{
  position: relative;
  z-index: 1;
  margin-top: calc(var(--mm-overlap) * -1);
  padding: .7rem var(--mm-pad-x) 1.1rem;
  display: flex;
  flex-direction: column;
  gap: .6rem;
  flex: 1 1 auto;
  min-height: 0;
}

/* описание тянется, не перекрывает низ карточки */

.games-megamenu-dropdown .mm-hot-desc{
  overflow: hidden;
}

.games-megamenu-dropdown .mm-hot-title{
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1.25;
  color: #fff;
  margin: 0 0 .18rem;
  text-shadow: 0 1px 12px rgba(0,0,0,.45);
}

/* SunEditor HTML — без фикс-высоты, с микро-отступами и переносами */

.games-megamenu-dropdown .mm-hot-desc{
  flex: 1 1 auto;
  min-height: 0;
}

.games-megamenu-dropdown .mm-hot-short{
  display: block;
  font-size: 11.5px;
  line-height: 1.28;
  color: #cfd6e6;
  padding-inline: 2px;
  padding-bottom: 10px;
  overflow: hidden;
  position: relative;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.games-megamenu-dropdown .mm-hot-short ul{
  margin: 2px 0 0;
  padding-left: 16px;
  list-style-position: inside;
}

.games-megamenu-dropdown .mm-hot-short li{
  margin: 2px 0;
}

.games-megamenu-dropdown .mm-hot-short p{
  margin: 0 0 4px;
}

.games-megamenu-dropdown .mm-hot-short b,
.games-megamenu-dropdown .mm-hot-short strong{
  font-weight: 700;
}

/* мягкий фейд только при переполнении */

.games-megamenu-dropdown .mm-hot-short::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 14px;
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    rgba(18,18,18,0) 0%,
    rgba(18,18,18,0.06) 35%,
    #121212 100%
  );
}

/* цена — в потоке, прижата вниз/вправо (оставили общий класс для скрипта валют) */

/* блок цены прижат к левой стороне и повторяет логику главной */

.games-megamenu-dropdown .mm-hot-card .product-price-from-overlay{
  position: static;
  background: transparent;
  padding: 0;
  display: flex;
  align-items: baseline;
  gap: .42rem;
  color: #fff;
  font-weight: 900;
  font-size: 13.5px;
  letter-spacing: .2px;
  text-shadow: 0 2px 16px rgba(0,0,0,.65);
}

/* точки слайдера (уникальные) — если используешь */

/* MegaMenu Right Title */

.megamenu-right-title{
  font-size: 13px;
  font-weight: 700;
  color: #b7b7b7;
  margin-bottom: 12px;
  letter-spacing: .12em;
}

/* карточка + точки — в строку, точки сбоку */

.games-megamenu-dropdown .mm-hot-row{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  flex-wrap: nowrap;
}

.games-megamenu-dropdown .mm-hot-hint{
  width: 260px;              
  display: flex;
  justify-content: center;
  pointer-events: none;      
  opacity: .9;
}

.games-megamenu-dropdown .mm-hot-hint-video{
  width: 60px;
  height: 60px;
  object-fit: contain;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.45));
  opacity: 0.6;
}

@media (prefers-reduced-motion: reduce){
  .games-megamenu-dropdown .mm-hot-hint{ display: none; }
}

/* Карточка = как на странице игры, но с фиксированной шириной */

.games-megamenu-dropdown .product-card-new{
  --mm-card-w: 250px;
  width: var(--mm-card-w);
  min-width: var(--mm-card-w);
  max-width: var(--mm-card-w);
  color: inherit;
  text-decoration: none;
}

.games-megamenu-dropdown .product-img-box{
  position: relative;
  aspect-ratio: 3/2;
  background: #121212;
}

.games-megamenu-dropdown .product-img-box img{
  object-position: center;
  user-select: none;
  -webkit-user-drag: none;  
}

.games-megamenu-dropdown .product-card-new:hover .product-img-box img,
.games-megamenu-dropdown .product-card-new:hover .product-title-overlay::before{
  transform: scale(1.05);
}

/* Картинка и бейдж — как в game.css */

.games-megamenu-dropdown .product-badge-new{
  position: absolute;
  top: .6rem;
  right: .6rem;
  z-index: 2;
  --badge-text: #fff;
  --badge-bg: var(--nt-primary);
  --badge-icon: none;
  padding: .35rem .6rem;
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: var(--badge-text);
  background: var(--badge-bg);
  border-radius: 6px;
}

.games-megamenu-dropdown .product-badge-new .badge-ico{
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  display: inline-block;
  background: currentColor;
  -webkit-mask: var(--badge-icon) no-repeat center / contain;
  mask: var(--badge-icon) no-repeat center / contain;
}

/* Контент и прижатие цены вниз */

.games-megamenu-dropdown .product-content{
  display: flex;
  flex-direction: column;
  gap: .6rem;
  padding: .7rem 1rem 1.1rem;
  background: #121212;
  flex: 1;
  z-index: 1;
}

.games-megamenu-dropdown .product-title{
  font-size: 1.05rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.25;
}

.games-megamenu-dropdown .product-desc{
  font-size: .95rem;
  color: var(--nt-text-dim, #cfd6e6);
  line-height: 1.35;
}

/* short description в шапке = как на странице игры */

.games-megamenu-dropdown .product-desc .card-short-description{
  margin: .25rem 0 0;
  padding: 0;
  max-height: calc(1.35em * 3);
}

.games-megamenu-dropdown .product-desc .card-short-description ul{
  margin: 0;
  padding: 0;
  list-style: none;
}

.games-megamenu-dropdown .product-desc .card-short-description li{
  position: relative;
  padding-left: 1.05rem;
  margin: .1rem 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.games-megamenu-dropdown .product-desc .card-short-description li::before{
  content: "";
  position: absolute;
  left: 0;
  top: .55em;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--nt-primary);
}

/* Блок цены — как на странице игры */

.games-megamenu-dropdown .product-price-bottom{
  margin-top: auto;
  align-self: flex-start;
  display: flex;
  flex-direction: column;
  gap: .28rem;
}

.games-megamenu-dropdown .price-save-badge{
  display: inline-block;
  align-self: flex-start;
  background: #51cf66;
  color: #0b1c0b;
  padding: .14rem .46rem;
  font-size: 11px;
  font-weight: 800;
  border-radius: 6px;
}

.games-megamenu-dropdown .product-price-from-overlay{
  display: flex;
  align-items: baseline;
  gap: .42rem;
  color: #fff;
  font-weight: 900;
  font-size: 13.5px;
  letter-spacing: .2px;
  text-shadow: 0 2px 16px rgba(0,0,0,.65);
}

.games-megamenu-dropdown .product-price-from-overlay .from-label{
  color: #b8b8c7;
  font-weight: 600;
  margin-right: .08rem;
}

.games-megamenu-dropdown .product-price-from-overlay .old-price{
  color: #9aa0a6;
  text-decoration: line-through;
  font-weight: 700;
}

.games-megamenu-dropdown .product-price-from-overlay .current-price{
  color: #ffffff;
  font-weight: 800;
}

.games-megamenu-dropdown .product-price-from-overlay.has-discount .current-price{
  color: #51cf66;
}

/* === Megamenu: заголовок поверх картинки + градиент как на странице игры === */

.games-megamenu-dropdown .product-title-overlay{
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  padding: .7rem 1rem .8rem;
  pointer-events: none;
  z-index: 1;
}

.games-megamenu-dropdown .product-title-overlay::before{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.9), rgba(0,0,0,0));
  transform-origin: 50% 100%;
  transition: transform .45s ease;
  z-index: -1;
}

.games-megamenu-dropdown .product-card-new .product-title{
  position: relative;
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.games-megamenu-dropdown .product-img-box img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform-origin: 50% 50%;
  transition: transform .45s ease;
  aspect-ratio: 3 / 2;
}


/* Mega hot-offer 3D / desktop filter */

/* 3D flip animation for MegaMenu Hot Offer */
.games-megamenu-dropdown .mm-hot-3d{
  width: var(--mm-card-w, 250px);
  min-width: var(--mm-card-w, 250px);
  max-width: var(--mm-card-w, 250px);
  perspective: 1100px;
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;  
}

.games-megamenu-dropdown .mm-hot-3d.is-cube{ cursor: grab; }
.games-megamenu-dropdown .mm-hot-3d.is-cube.is-dragging{ cursor: grabbing; }
.games-megamenu-dropdown .mm-hot-3d.is-cube.is-dragging .mm-hot-3d-inner{
  transition: none !important;
}
.games-megamenu-dropdown .mm-hot-3d.is-cube.is-dragging .mm-hot-face{
  pointer-events: none;
}

/* While dragging/rotating: disable inner hover transitions (prevents blink/jitter) */
.games-megamenu-dropdown .mm-hot-3d.is-cube.is-dragging .product-img-box img,
.games-megamenu-dropdown .mm-hot-3d.is-cube.is-dragging .product-title-overlay::before,
.games-megamenu-dropdown .mm-hot-3d.is-cube.is-animating .product-img-box img,
.games-megamenu-dropdown .mm-hot-3d.is-cube.is-animating .product-title-overlay::before{
  transition: none !important;
}
/* Safety: never "lift" the offer card on hover (only glow) */
.games-megamenu-dropdown .mm-hot-card,
.games-megamenu-dropdown .mm-hot-card:hover{
  transform: none !important;
}

/* Hot offers: cube 3D rotate (more complex than simple flip) */
.games-megamenu-dropdown .mm-hot-3d.is-cube{
  /* --cube-z is set dynamically from JS (half of card width) */
  --cube-z: 130px;
}

.games-megamenu-dropdown .mm-hot-3d.is-cube .mm-hot-3d-inner{
  transform-style: preserve-3d;
  transition: transform 720ms cubic-bezier(.2,.75,.25,1);
  transform: translateZ(calc(var(--cube-z) * -1)) rotateY(var(--cube-rot, 0deg));
  will-change: transform;
}

.games-megamenu-dropdown .mm-hot-3d.is-cube .mm-hot-front{
  transform: rotateY(0deg) translateZ(calc(var(--cube-z) + 0.2px));
}

.games-megamenu-dropdown .mm-hot-3d.is-cube .mm-hot-right{
  transform: rotateY(90deg) translateZ(calc(var(--cube-z) + 0.2px));
}

.games-megamenu-dropdown .mm-hot-3d.is-cube .mm-hot-left{
  transform: rotateY(-90deg) translateZ(calc(var(--cube-z) + 0.2px));
}

/* Side faces shouldn't be clickable in resting state */
.games-megamenu-dropdown .mm-hot-3d.is-cube .mm-hot-right,
.games-megamenu-dropdown .mm-hot-3d.is-cube .mm-hot-left{
  pointer-events: none;
}

/* Prevent hover-lift glitches while the cube is rotating */
.games-megamenu-dropdown .mm-hot-3d.is-cube.is-animating .mm-hot-card{
  transform: none !important;
}

/* Disable clicks during rotation (keeps it feeling solid) */
.games-megamenu-dropdown .mm-hot-3d.is-cube.is-animating .mm-hot-face{
  pointer-events: none;
}

/* Utility: reset cube rotation without transition (used by JS after each step) */
.games-megamenu-dropdown .mm-hot-3d-inner.mm-hot-no-trans{
  transition: none !important;
}

.games-megamenu-dropdown .mm-hot-3d-inner{
  display: grid;
  transform-style: preserve-3d;
  transition: transform 650ms cubic-bezier(.2,.75,.25,1);
  will-change: transform;
}

.games-megamenu-dropdown .mm-hot-3d.is-flipped .mm-hot-3d-inner{
  transform: rotateY(180deg);
}

.games-megamenu-dropdown .mm-hot-face{
  grid-area: 1 / 1;
  backface-visibility: hidden;
  transform-style: preserve-3d;
}

.games-megamenu-dropdown .mm-hot-back{
  transform: rotateY(180deg);
}

.games-megamenu-dropdown .mm-hot-3d:not(.is-flipped) .mm-hot-back{
  pointer-events: none;
}

.games-megamenu-dropdown .mm-hot-3d.is-flipped .mm-hot-front{
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce){
  .games-megamenu-dropdown .mm-hot-3d-inner{ transition: none; }
}

/* --- Desktop MegaMenu: games filter --- */
.mm-game-search{
  margin: 0 0 10px;
  padding-right: 8px;
}

.mm-game-search-box{
  position: relative;
  display: flex;
  align-items: center;
  height: 40px;
  border-radius: 14px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.06);
  padding-left: 38px;
  margin-right: 8px;
  transition: border-color .15s ease, background .15s ease;
}

.mm-game-search-box::before{
  content: "";
  position: absolute;
  left: 12px;
  width: 18px;
  height: 18px;
  opacity: .8;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'><circle cx='11' cy='11' r='8'/><line x1='21' y1='21' x2='16.65' y2='16.65'/></svg>") center/contain no-repeat;
}

.mm-game-search-box:focus-within{
  background: rgba(255,255,255,.055);
  border-color: rgba(114,15,254,.55);
}

.mm-game-search-box input{
  width: 100%;
  height: 100%;
  border: 0;
  outline: none;
  background: transparent;
  color: #fff;
  font-size: 14px;
  padding-right: 42px;
}

.mm-game-search-clear{
  position: absolute;
  right: 6px;
  width: 30px;
  height: 30px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.22);
  color: #fff;
  transition: background .12s ease, border-color .12s ease, color .12s ease;
}

.mm-game-search-clear[hidden]{
  display: none !important;
}

@media (hover:hover){
  .mm-game-search-clear:hover{
    background: rgba(255,255,255,.06);
    border-color: rgba(255,255,255,.14);
    color: #fff;
  }
}

.games-megamenu-game.is-filtered-out{
  display: none !important;
}

.mm-game-mark{
  background: rgba(114,15,254,.35);
  color: #fff;
  padding: 0 2px;
  border-radius: 4px;
}