/*
 * cursor.css
 * Ægir Prediction — custom cursor set.
 *
 * Applies the brass+squall "Acoustic Console" cursor (Variant A from
 * the picker at .tmp/cursor_mockups/) site-wide, with per-state
 * overrides for interactive elements.
 *
 * Cross-browser fallback chain (left → right, first supported wins):
 *   1. SVG cursor (Chromium / Firefox / Safari modern desktop)
 *   2. PNG  cursor (Edge legacy, older Firefox, IE11 quirks)
 *   3. System keyword (everything else — touch devices, very old
 *      browsers, anything that declines custom cursors entirely)
 *
 * Why both SVG and PNG? SVG is the modern win — it scales crisp on
 * Retina + non-Retina without two assets — but a handful of browsers
 * (older Edge, Firefox pre-95 on some platforms, embedded WebViews)
 * silently ignore SVG cursor URLs. Listing PNG between SVG and the
 * keyword fallback means those browsers still get the brass console
 * cursor instead of jumping all the way to the OS arrow.
 *
 * Hotspot coordinates (in the 24×24 source frame):
 *   default      tip at (2, 2)
 *   pointer      centre (12, 12)
 *   text         centre (12, 12)
 *   crosshair    centre (12, 12)
 *   grab         centre (12, 12)
 *   grabbing     centre (12, 12)
 *   not-allowed  centre (12, 12)
 */

html,
body {
    cursor: url('cursors/cursor-default.svg') 2 2,
            url('cursors/cursor-default.png') 2 2,
            default;
}

/* Interactive: anything the user expects to click. Replaces the
   system "pointing hand" with the sonar reticle. */
a,
button,
[role="button"],
.btn,
.btn-primary,
.btn-secondary,
.tile,
.bridge,
.lang-pill,
summary,
input[type="submit"],
input[type="button"],
.marine-snow-toggle,
.cta,
label[for] {
    cursor: url('cursors/cursor-crosshair-simple.svg') 12 12,
            url('cursors/cursor-crosshair-simple.png') 12 12,
            pointer;
}

/* Text-input contexts. */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="number"],
input[type="tel"],
textarea,
[contenteditable="true"] {
    cursor: url('cursors/cursor-text.svg') 12 12,
            url('cursors/cursor-text.png') 12 12,
            text;
}

/* Disabled controls get the in-palette "not-allowed" reticle. */
:disabled,
.disabled,
[aria-disabled="true"] {
    cursor: url('cursors/cursor-notallowed.svg') 12 12,
            url('cursors/cursor-notallowed.png') 12 12,
            not-allowed;
}

/* Draggable handles (none on the public site yet but ready for any
   the console picks up later — keeps the rule next to the file so a
   future drag affordance is one selector away from styled). */
[draggable="true"],
.grabbable {
    cursor: url('cursors/cursor-grab.svg') 12 12,
            url('cursors/cursor-grab.png') 12 12,
            grab;
}

[draggable="true"]:active,
.grabbable:active,
.grabbing {
    cursor: url('cursors/cursor-grab.svg') 12 12,
            url('cursors/cursor-grab.png') 12 12,
            grabbing;
}

/* Crosshair for precision-pick contexts (chart canvases, future map
   embeds). Available as an opt-in class — not a default state. */
.precision-pick {
    cursor: url('cursors/cursor-crosshair.svg') 12 12,
            url('cursors/cursor-crosshair.png') 12 12,
            crosshair;
}