/* ================================================
   Cursor Position Fix
   
   Problem 1: Custom cursor is offset from actual mouse position
   Cause: position:fixed without top/left means static position != (0,0),
          transform: translate(mx,my) adds to the static position
   Fix: Add top:0; left:0; on desktop only
   
   Problem 2: Custom cursor visible on mobile (top-left corner)
   Cause: Theme-specific-fixes-2.css restores cursor with high-specificity
          selectors like [data-theme="xxx"] .cursor-dot { display:block }
          which override the base CSS mobile media query
   Fix: Use equally high-specificity selectors to hide cursor on mobile
        for ALL themes (including the 18 restored ones)
   
   Generated: 2026-08-21
   ================================================ */

/* ---- Desktop: fix cursor position offset ---- */
@media (min-width: 769px) {
  .cursor-dot,
  .cursor-ring {
    top: 0 !important;
    left: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* ---- Mobile: force hide cursor for ALL themes ----
   Use high-specificity attribute selectors to override
   theme rules like [data-theme="darkroom"] .cursor-dot { display:block }
   
   We use [data-theme] as a universal attribute selector that matches
   any theme, with same specificity as the theme-specific rules. */

@media (max-width: 768px) {
  [data-theme] .cursor-dot,
  [data-theme] .cursor-ring {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
  }
  
  /* Also hide when data-theme is on html or body directly */
  html[data-theme] .cursor-dot,
  html[data-theme] .cursor-ring,
  body[data-theme] .cursor-dot,
  body[data-theme] .cursor-ring {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
  }
}