/*
  DESMOCHEE v163 · 2.3.6T
  SVG UI ICON LAYER
  ---------------------------------------------
  Capa aditiva: no cambia geometría de juego ni reglas.
  Normaliza únicamente SVGs de navegación, pausa y ayuda.
*/

.ui-svg-icon,
.menu-action-svg img,
.menu-quick-svg img,
.pause-svg-icon img,
.back-svg-icon,
.inline-back-svg,
#howToPlayModal .topic-icon.has-svg-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}

/* Menú principal */
body:not(.game-open) .menu-action-svg,
body:not(.game-open) .menu-quick-svg {
  display: grid !important;
  place-items: center !important;
}
body:not(.game-open) .menu-action-svg img {
  width: 22px;
  height: 22px;
  opacity: .92;
}
body:not(.game-open) .btn-offline .menu-action-svg img {
  filter: brightness(0) saturate(100%);
  opacity: .78;
}
body:not(.game-open) .menu-quick-svg img {
  width: 20px;
  height: 20px;
  opacity: .86;
}

/* Pausa */
/*
  Los SVG nuevos ya vienen dibujados dentro del <img>.
  La UI híbrida antigua todavía generaba un segundo icono con ::before,
  por eso en 6R/6S se veían dos símbolos superpuestos.
*/
.pause-svg-icon::before {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}
.pause-svg-icon img {
  width: 20px !important;
  height: 20px !important;
  opacity: .88;
}
.pause-action.primary .pause-svg-icon img {
  filter: brightness(0) saturate(100%);
  opacity: .72;
}
.pause-action.danger .pause-svg-icon img {
  opacity: .78;
}

/* Botones Atrás */
.pilot-back .back-svg-icon,
.rules-back .back-svg-icon,
.collection-back .back-svg-icon {
  width: 22px;
  height: 22px;
  opacity: .88;
}
.inline-back-svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  opacity: .82;
}
.tutorial-selector-close,
.tutorial-coach-action.secondary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
}

/* ¿Cómo jugar? */
#howToPlayModal .topic-icon.has-svg-icon {
  display: grid !important;
  place-items: center !important;
  color: transparent !important;
  font-size: 0 !important;
}
#howToPlayModal .topic-icon.has-svg-icon::before {
  content: none !important;
  display: none !important;
}
#howToPlayModal .topic-icon.has-svg-icon img {
  width: 23px;
  height: 23px;
  opacity: .84;
}
#howToPlayModal .topic.open .topic-icon.has-svg-icon img {
  opacity: .96;
}
