/* WICION P51 · el brillo deslizante respeta Color del efecto. */
/* Wicion V24 · efectos públicos de Vestimenta + animaciones robustas de Informativo */
.dress-row{
    isolation:isolate;
    --dress-effect-color:#d7b06a;
    --dress-effect-opacity:.55;
    --dress-effect-opacity-pct:55%;
    --dress-effect-blend:soft-light;
    --dress-shine-width:30%;
    --dress-effect-speed:3.2s;
}

.dress-icon-colorized{
    width:var(--dress-icon-size,74px);
    height:var(--dress-icon-size,74px);
    flex:0 0 var(--dress-icon-size,74px);
    display:grid;
    place-items:center;
    background:transparent;
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-position:center;
    -webkit-mask-size:contain;
    mask-repeat:no-repeat;
    mask-position:center;
    mask-size:contain;
}
.dress-icon-colorized img{width:100%!important;height:100%!important;object-fit:contain;display:block;transition:opacity .16s ease}
.dress-icon-colorized.is-mask-ready{background:var(--dress-icon-color,#1f2a44)}
.dress-icon-colorized.is-mask-ready img{opacity:0}

.dress-row.dress-effect-shine{overflow:hidden}
.dress-row.dress-effect-shine::after{
    content:"";
    position:absolute;
    z-index:5;
    pointer-events:none;
    top:-55%;bottom:-55%;left:-48%;width:var(--dress-shine-width,30%);
    background:linear-gradient(100deg,transparent,var(--dress-effect-color,#d7b06a),transparent);
    opacity:var(--dress-effect-opacity,.55);
    mix-blend-mode:var(--dress-effect-blend,soft-light);
    transform:skewX(-18deg);
    animation:wicionDressShine var(--dress-effect-speed,3.2s) ease-in-out infinite;
}
.dress-row.dress-effect-glow{animation:wicionDressGlow var(--dress-effect-speed,3.2s) ease-in-out infinite}
.dress-row.dress-effect-border{animation:wicionDressBorder var(--dress-effect-speed,3.2s) ease-in-out infinite}
.dress-row.dress-effect-float{animation:wicionDressFloat var(--dress-effect-speed,3.2s) ease-in-out infinite}
.dress-row.dress-effect-heartbeat{animation:wicionDressHeartbeat var(--dress-effect-speed,3.2s) ease-in-out infinite}

@keyframes wicionDressShine{0%,16%{left:-48%}58%,100%{left:128%}}
@keyframes wicionDressGlow{
    0%,100%{box-shadow:var(--card-shadow)}
    50%{box-shadow:0 0 24px color-mix(in srgb,var(--dress-effect-color) var(--dress-effect-opacity-pct,55%),transparent)}
}
@keyframes wicionDressBorder{
    0%,100%{border-color:var(--seg-border,var(--border-color));box-shadow:var(--card-shadow)}
    50%{border-color:color-mix(in srgb,var(--dress-effect-color) var(--dress-effect-opacity-pct,55%),transparent);box-shadow:0 0 0 2px color-mix(in srgb,var(--dress-effect-color) var(--dress-effect-opacity-pct,55%),transparent),0 8px 24px rgba(0,0,0,.10)}
}
@keyframes wicionDressFloat{0%,100%{translate:0 0}50%{translate:0 -6px}}
@keyframes wicionDressHeartbeat{0%,100%{scale:1}42%{scale:1.015}55%{scale:1}70%{scale:1.009}}

/* Informativo: estas reglas van al final para ganar a estilos antiguos. */
.info-icon .info-icon-shape{
    display:inline-flex!important;
    transform-origin:center center!important;
    will-change:transform,filter;
}
@keyframes wicionInfoPulseV24{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@keyframes wicionInfoFloatV24{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes wicionInfoBounceV24{0%,100%{transform:translateY(0)}35%{transform:translateY(-10px)}60%{transform:translateY(2px)}}
@keyframes wicionInfoSwingV24{0%,100%{transform:rotate(0)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}
@keyframes wicionInfoSpinV24{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes wicionInfoGlowV24{0%,100%{filter:drop-shadow(0 0 0 transparent)}50%{filter:drop-shadow(0 0 12px currentColor)}}

.info-icon.icon-anim-pulse .info-icon-shape{animation:wicionInfoPulseV24 var(--info-icon-anim-duration,1.8s) ease-in-out infinite!important}
.info-icon.icon-anim-float .info-icon-shape{animation:wicionInfoFloatV24 var(--info-icon-anim-duration,2.4s) ease-in-out infinite!important}
.info-icon.icon-anim-bounce .info-icon-shape{animation:wicionInfoBounceV24 var(--info-icon-anim-duration,1.7s) ease-in-out infinite!important}
.info-icon.icon-anim-swing .info-icon-shape{animation:wicionInfoSwingV24 var(--info-icon-anim-duration,1.8s) ease-in-out infinite!important}
.info-icon.icon-anim-glow .info-icon-shape{animation:wicionInfoGlowV24 var(--info-icon-anim-duration,2s) ease-in-out infinite!important}
.info-icon.icon-anim-rotate .info-icon-shape,
.info-icon.icon-anim-spin .info-icon-shape,
.info-icon.icon-anim-girar .info-icon-shape{animation:wicionInfoSpinV24 var(--info-icon-anim-duration,2.2s) linear infinite!important}

/* Compatibilidad con la animación guardada para el círculo del ícono. */
.info-icon[data-circle-anim="pulse"]{animation:wicionInfoPulseV24 var(--info-circle-anim-duration,2.2s) ease-in-out infinite!important}
.info-icon[data-circle-anim="float"]{animation:wicionInfoFloatV24 var(--info-circle-anim-duration,2.2s) ease-in-out infinite!important}
.info-icon[data-circle-anim="swing"]{animation:wicionInfoSwingV24 var(--info-circle-anim-duration,2.2s) ease-in-out infinite!important}
.info-icon[data-circle-anim="rotate"],
.info-icon[data-circle-anim="spin"],
.info-icon[data-circle-anim="girar"]{animation:wicionInfoSpinV24 var(--info-circle-anim-duration,2.2s) linear infinite!important}