/* ==========================================================================
   The cursor: a gold arrow with a charcoal edge, and the same gold as a
   pointing hand over whatever can be clicked (images/cursor/*.svg). It
   reads on the cream pages and on the charcoal sidebar alike. No trail and
   no animation. Typing boxes keep the text cursor, disabled controls the
   "not allowed" one.

   Every stylesheet that wants a hand writes cursor: var(--cursor-hand,
   pointer), so the gold hand shows wherever this file is loaded and the
   system's hand everywhere else.
   ========================================================================== */

:root {
    --cursor-arrow: url("../../images/cursor/arrow.svg") 3 2, default;
    --cursor-hand: url("../../images/cursor/hand.svg") 10 3, pointer;
}

html {
    cursor: var(--cursor-arrow);
}

a[href],
area[href],
summary,
label[for],
[role="button"],
[role="tab"],
[role="link"],
input[type="checkbox"],
input[type="radio"],
input[type="submit"],
input[type="button"],
input[type="reset"],
input[type="file"],
input[type="color"],
input[type="range"] {
    cursor: var(--cursor-hand);
}

select {
    cursor: var(--cursor-arrow);
}

input:not([type]),
input[type="text"],
input[type="search"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
textarea,
[contenteditable="true"] {
    cursor: text;
}

:disabled,
[aria-disabled="true"] {
    cursor: not-allowed;
}