.fmm_hinter { position: absolute; padding: 2%; border-radius: 4px; font-size: 12px; font-family: inherit; text-align: center;
display:none !important; z-index: 1200 !important; padding-inline: .8rem; top: 90%;
  transform: translateY(-50%); width: max-content;}

.sticker-text {
  position: relative;
  display: inline-block;
}

.fmm_hinter_l {left: -190px;}

.fmm_hinter_r {right: -190px;}

.fmm_hinter_l_txt {right: calc(100% - 6rem); margin-right: .5rem}

.fmm_hinter_r_txt {left: calc(100% - 6rem); margin-left: .5rem}

.fmm_hinter b::before { display: inline-block; font-size: 21px; position: absolute;font-family: Material Icons; top: 4px; z-index: -1;}

.fmm_hinter_l b::before {content: 'fast_forward';right: -10px;}

.fmm_hinter_r b::before {content: 'fast_rewind';left: -10px;}

.fmm_hinter_l_txt b::before {content: 'fast_forward';right: -10px;}

.fmm_hinter_r_txt b::before {content: 'fast_rewind';left: -10px;}

.fmm_sticker_base_span:hover > .fmm_hinter { display: inline-block !important;}
.fmm_sticker_base_span {pointer-events: none !important;} 
.fmm_title_text_sticker:hover > .fmm_hinter { display: inline-block !important;}


/* ==========================================================================
   TP3D 4.2.0: posición manual de los stickers
   Cada "slot" es una esquina/ancla + ajuste fino. Variables (las arma PHP):
   --tp-x / --tp-y   escritorio      --tp-mx / --tp-my   celular (opcional)
   --tp-gap          separación entre stickers apilados
   ========================================================================== */
.fmm_sticker_holder { display: none !important; }

.fmm_sticker_slot {
  position: absolute;
  z-index: 9;
  display: flex;
  flex-direction: column;
  gap: var(--tp-gap, 4px);
  pointer-events: none;
  box-sizing: border-box;
  --tp-ex: var(--tp-x, 6px);
  --tp-ey: var(--tp-y, 6px);
}

/* Horizontal: el slot ocupa el ancho de la imagen menos el corrimiento,
   así los tamaños en % de los stickers de imagen se calculan igual que antes. */
.fmm_sticker_slot[data-h="left"]   { left: var(--tp-ex);  width: calc(100% - var(--tp-ex)); align-items: flex-start; text-align: left; }
.fmm_sticker_slot[data-h="right"]  { right: var(--tp-ex); width: calc(100% - var(--tp-ex)); align-items: flex-end;   text-align: right; }
.fmm_sticker_slot[data-h="center"] { left: 0; width: 100%; transform: translateX(var(--tp-ex)); align-items: center; text-align: center; }

/* Vertical: "centro" es distancia desde arriba (como en las versiones anteriores). */
.fmm_sticker_slot[data-v="top"],
.fmm_sticker_slot[data-v="center"] { top: var(--tp-ey); }
.fmm_sticker_slot[data-v="bottom"] { bottom: var(--tp-ey); }

@media (max-width: 767px) {
  .fmm_sticker_slot {
    --tp-ex: var(--tp-mx, var(--tp-x, 6px));
    --tp-ey: var(--tp-my, var(--tp-y, 6px));
  }
}

.fmm_sticker_slot > .fmm_sticker_base_span {
  position: relative;
  display: block;
  max-width: 100%;
  z-index: 9;
}
.fmm_sticker_slot > .fmm_title_text_sticker { display: inline-block; }
.fmm_sticker_slot > .fmm_sticker_is_image { width: 100%; }
/* Sin alto de línea: si no, el line-height del theme suma espacio arriba/abajo de la imagen
   y la separación entre stickers apilados queda más grande que la configurada (4.2.4) */
.fmm_sticker_slot > .fmm_sticker_is_image > .sticker-text { display: block; width: 100%; line-height: 0; font-size: 0; }
.fmm_sticker_slot img { display: inline-block; max-width: 100%; height: auto; box-shadow: unset; background: transparent !important; border: none !important; vertical-align: top; }

/* Estilos de texto que antes venían dentro de cada plantilla */
.fmm_title_text_sticker .sticker-text { -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; padding: 5px; display: inline-block; text-align: center; }
.fmm_title_text_sticker i { display: inline-block; font-style: normal; }