/* ================================================================
   Ironhorde Online - Custom MMORPG War Cursor & Trail
   Shared across all pages
   ================================================================ */

/* --- Custom cursor (SVG war crosshair) --- */
html,
body {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cline x1='16' y1='2' x2='16' y2='12' stroke='%23c9a44a' stroke-width='1.5' stroke-linecap='round'/%3E%3Cline x1='16' y1='20' x2='16' y2='30' stroke='%23c9a44a' stroke-width='1.5' stroke-linecap='round'/%3E%3Cline x1='2' y1='16' x2='12' y2='16' stroke='%23c9a44a' stroke-width='1.5' stroke-linecap='round'/%3E%3Cline x1='20' y1='16' x2='30' y2='16' stroke='%23c9a44a' stroke-width='1.5' stroke-linecap='round'/%3E%3Ccircle cx='16' cy='16' r='3' fill='none' stroke='%23c9a44a' stroke-width='1'/%3E%3Ccircle cx='16' cy='16' r='1' fill='%23c9a44a'/%3E%3C/svg%3E") 16 16, crosshair;
}

/* --- Pointer cursor for interactive elements + all their children --- */
a, a *,
button, button *,
[role="button"], [role="button"] *,
input[type="submit"],
.btn-fire, .btn-fire *,
.btn-outline, .btn-outline *,
.nav-cta, .nav-cta *,
.rank-tab, .rank-tab *,
.nav-link, .nav-link *,
.hamburger, .hamburger *,
.soc-btn, .soc-btn *,
.ncard-link, .ncard-link *,
.dl-mirrors a, .dl-mirrors a *,
.footer-col a, .footer-col a *,
.login-tab, .login-tab *,
.back-link, .back-link * {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M8 4 L8 22 L12 18 L16 26 L19 24.5 L15 17 L20 17 Z' fill='%23c9a44a' stroke='%23000' stroke-width='0.8'/%3E%3C/svg%3E") 8 4, pointer;
}

/* --- Text cursor for inputs --- */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
textarea,
[contenteditable="true"] {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cline x1='16' y1='4' x2='16' y2='28' stroke='%23c9a44a' stroke-width='1.5'/%3E%3Cline x1='12' y1='4' x2='20' y2='4' stroke='%23c9a44a' stroke-width='1.2'/%3E%3Cline x1='12' y1='28' x2='20' y2='28' stroke='%23c9a44a' stroke-width='1.2'/%3E%3C/svg%3E") 16 16, text;
}

/* --- Cursor trail ring element --- */
.cursor-ring {
    position: fixed;
    top: 0; left: 0;
    width: 36px; height: 36px;
    border: 1px solid rgba(201,164,74,0.4);
    border-radius: 50%;
    pointer-events: none;
    z-index: 99999;
    transform: translate(-50%, -50%);
    transition: width 0.15s ease, height 0.15s ease, border-color 0.2s ease, background 0.2s ease;
    mix-blend-mode: screen;
}

/* Ring shrinks and glows on hovering interactive elements */
.cursor-ring.cursor-hover {
    width: 20px; height: 20px;
    border-color: rgba(201,164,74,0.8);
    background: rgba(201,164,74,0.08);
}

/* --- Spark trail particles (CSS for JS-created elements) --- */
.cursor-spark {
    position: fixed;
    pointer-events: none;
    z-index: 99998;
    border-radius: 50%;
    mix-blend-mode: screen;
}