/* ==================================================================
   REYNX STUDIO — Custom Cursor (shared · all pages)
   حلقة رفيعة + نقطة سريعة بـ mix-blend difference
   → بيقلب لونه لوحده على الخلفية البيضا والسودا
   يشتغل بس مع ماوس حقيقي (JS بيحطّ الكلاس rx-has-cursor)
   ================================================================== */

.rx-cursor,
.rx-cursor-dot {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000000; /* فوق مودال اللوجن (999999) واللودر (99999) */
    pointer-events: none;
    opacity: 0;
    mix-blend-mode: difference;
    will-change: transform;
}

.rx-cursor {
    width: 34px;
    height: 34px;
    margin: -17px 0 0 -17px;
    border: 1px solid rgba(255, 255, 255, .9);
    border-radius: 50%;
    transition: width .3s ease, height .3s ease, margin .3s ease,
                opacity .3s ease, background-color .3s ease;
}

/* على الروابط والأزرار: الحلقة تكبر وتمتلئ خفيف */
.rx-cursor.is-active {
    width: 58px;
    height: 58px;
    margin: -29px 0 0 -29px;
    background: rgba(255, 255, 255, .16);
}

.rx-cursor-dot {
    width: 5px;
    height: 5px;
    margin: -2.5px 0 0 -2.5px;
    border-radius: 50%;
    background: #ffffff;
    transition: opacity .3s ease;
}

/* الكلاس بيتضاف من الـ JS بس — لو الـ JS وقع، الكيرسور الطبيعي يفضل موجود */
html.rx-has-cursor,
html.rx-has-cursor *,
html.rx-has-cursor *::before,
html.rx-has-cursor *::after { cursor: none !important; }

html.rx-has-cursor input,
html.rx-has-cursor textarea { cursor: text !important; }

@media (prefers-reduced-motion: reduce) {
    .rx-cursor, .rx-cursor-dot { display: none !important; }
}