/**
 * WP Magic Cursor - Public Styles
 */

/* ── Hide default cursor ── */
.wmc-hide-cursor,
.wmc-hide-cursor * {
    cursor: none !important;
}

/* ── Cursor container ── */
.wmc-cursor-el {
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 999999;
    will-change: left, top;
    visibility: hidden;
}

.wmc-cursor-inner {
    z-index: 1000001;
}

.wmc-cursor-follower {
    z-index: 1000000;
}

.wmc-cursor-el.wmc-visible {
    visibility: visible;
}

/* Animation wrapper: isolates CSS animations from left/top positioning */
.wmc-anim-wrapper {
    display: inline-block;
    transition: transform 0.3s ease-out, opacity 0.3s ease-out;
}

/* ── Shape cursors ── */
.wmc-cursor-shape {
    border-radius: 50%;
}

.wmc-cursor-shape.wmc-shape-ring {
    background: transparent !important;
    border-radius: 50%;
}

.wmc-cursor-shape.wmc-shape-square {
    border-radius: 2px;
}

.wmc-cursor-shape.wmc-shape-diamond {
    border-radius: 2px;
}

.wmc-cursor-shape.wmc-shape-triangle {
    border-radius: 0 !important;
}

/* ── Follower transition ── */
.wmc-cursor-follower {
    transition: none;
}

/* ── Image cursor ── */
.wmc-cursor-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.wmc-cursor-image i {
    display: block;
}

/* ── Text cursor ── */
.wmc-cursor-text span {
    display: block;
    white-space: nowrap;
    padding: 4px 12px;
    border-radius: 4px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    line-height: 1.4;
}

/* Text background shapes */
.wmc-cursor-text.wmc-text-bg-rounded span {
    border-radius: 50px;
    padding: 4px 14px;
}

.wmc-cursor-text.wmc-text-bg-circle span {
    border-radius: 50%;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    min-width: 2.4em;
    text-align: center;
}

.wmc-cursor-text.wmc-text-bg-square span {
    border-radius: 2px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    min-width: 2.4em;
    text-align: center;
}

/* Text curved along shape */
.wmc-cursor-text svg {
    display: block;
    overflow: visible;
}

/* ── Hover state transitions ── */
.wmc-cursor-el.wmc-transitioning {
    transition: width 0.3s ease, height 0.3s ease, background 0.3s ease,
                border 0.3s ease, opacity 0.3s ease, border-radius 0.3s ease;
}

/* ── Cursor Animations ── */
.wmc-anim-spin { animation: wmc-spin var(--wmc-anim-speed, 1s) linear infinite; }
.wmc-anim-spin-reverse { animation: wmc-spin var(--wmc-anim-speed, 1s) linear infinite reverse; }
.wmc-anim-pulse { animation: wmc-pulse var(--wmc-anim-speed, 1s) ease-in-out infinite; }
.wmc-anim-ping { animation: wmc-ping var(--wmc-anim-speed, 1s) cubic-bezier(0, 0, 0.2, 1) infinite; }
.wmc-anim-bounce { animation: wmc-bounce var(--wmc-anim-speed, 1s) ease infinite; }
.wmc-anim-shake { animation: wmc-shake var(--wmc-anim-speed, 0.5s) ease-in-out infinite; }
.wmc-anim-wobble { animation: wmc-wobble var(--wmc-anim-speed, 1s) ease-in-out infinite; }
.wmc-anim-rubber-band { animation: wmc-rubber-band var(--wmc-anim-speed, 1s) ease infinite; }
.wmc-anim-jello { animation: wmc-jello var(--wmc-anim-speed, 1s) ease infinite; }
.wmc-anim-float { animation: wmc-float var(--wmc-anim-speed, 2s) ease-in-out infinite; }
.wmc-anim-fade-pulse { animation: wmc-fade-pulse var(--wmc-anim-speed, 1.5s) ease-in-out infinite; }
.wmc-anim-heartbeat { animation: wmc-heartbeat var(--wmc-anim-speed, 1.2s) ease-in-out infinite; }
.wmc-anim-flip { animation: wmc-flip var(--wmc-anim-speed, 1s) ease-in-out infinite; }
.wmc-anim-swing { animation: wmc-swing var(--wmc-anim-speed, 1s) ease-in-out infinite; transform-origin: top center; }
.wmc-anim-tada { animation: wmc-tada var(--wmc-anim-speed, 1s) ease-in-out infinite; }
.wmc-anim-flash { animation: wmc-flash var(--wmc-anim-speed, 1s) ease-in-out infinite; }

@keyframes wmc-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes wmc-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.3); }
}

@keyframes wmc-ping {
    0% { transform: scale(1); opacity: 1; }
    75%, 100% { transform: scale(2); opacity: 0; }
}

@keyframes wmc-bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

@keyframes wmc-shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-4px); }
    75% { transform: translateX(4px); }
}

@keyframes wmc-wobble {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(-5deg); }
    75% { transform: rotate(5deg); }
}

@keyframes wmc-rubber-band {
    0%, 100% { transform: scaleX(1) scaleY(1); }
    30% { transform: scaleX(1.25) scaleY(0.75); }
    40% { transform: scaleX(0.75) scaleY(1.25); }
    50% { transform: scaleX(1.15) scaleY(0.85); }
    65% { transform: scaleX(0.95) scaleY(1.05); }
    75% { transform: scaleX(1.05) scaleY(0.95); }
}

@keyframes wmc-jello {
    0%, 100% { transform: skewX(0deg) skewY(0deg); }
    22% { transform: skewX(-12.5deg) skewY(-12.5deg); }
    33% { transform: skewX(6.25deg) skewY(6.25deg); }
    44% { transform: skewX(-3.125deg) skewY(-3.125deg); }
    55% { transform: skewX(1.5625deg) skewY(1.5625deg); }
    66% { transform: skewX(-0.78deg) skewY(-0.78deg); }
    77% { transform: skewX(0.39deg) skewY(0.39deg); }
}

@keyframes wmc-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@keyframes wmc-fade-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

@keyframes wmc-heartbeat {
    0%, 100% { transform: scale(1); }
    14% { transform: scale(1.3); }
    28% { transform: scale(1); }
    42% { transform: scale(1.3); }
    70% { transform: scale(1); }
}

@keyframes wmc-flip {
    0%, 100% { transform: perspective(400px) rotateY(0deg); }
    50% { transform: perspective(400px) rotateY(180deg); }
}

@keyframes wmc-swing {
    0%, 100% { transform: rotate(0deg); }
    20% { transform: rotate(15deg); }
    40% { transform: rotate(-10deg); }
    60% { transform: rotate(5deg); }
    80% { transform: rotate(-5deg); }
}

@keyframes wmc-tada {
    0%, 100% { transform: scale(1) rotate(0deg); }
    10%, 20% { transform: scale(0.9) rotate(-3deg); }
    30%, 50%, 70%, 90% { transform: scale(1.1) rotate(3deg); }
    40%, 60%, 80% { transform: scale(1.1) rotate(-3deg); }
}

@keyframes wmc-flash {
    0%, 50%, 100% { opacity: 1; }
    25%, 75% { opacity: 0; }
}