/**
 * Ponteiros em pixel art, gerados por scripts/build-cursors.mjs. Nao editar a mao: reeditar os
 * desenhos no script e rodar npm run design:cursors.
 *
 * Referencia dos computadores dos anos 90, linha Windows. Preenchimento claro com contorno escuro,
 * entao o mesmo desenho aparece no tema claro e no escuro.
 */
/**
 * Cada regra vem em duas linhas: a primeira e o desenho em tamanho unico, que todo navegador
 * entende, e a segunda troca por image-set, que serve a versao densa em tela retina. Onde
 * image-set nao existe, a segunda linha nao e entendida e a primeira continua valendo.
 *
 * Os enderecos vao escritos por extenso, sem passar por variavel. Com var() dentro de image-set, um
 * navegador que nao resolvesse a variavel derrubaria a declaracao inteira na hora de computar o
 * valor, e ai nao sobra nem a primeira linha: o ponteiro sumia do site todo.
 *
 * O ultimo valor de cada lista e o ponteiro do sistema, usado se o desenho nao carregar.
 */
/* arrow: 24x32 px, ponto quente 0 0 */
body {
  cursor:
    url("cursors/arrow.png") 0 0,
    default;
  cursor:
    image-set(url("cursors/arrow.png") 1x, url("cursors/arrow@2x.png") 2x) 0 0,
    default;
}

/* hand: 32x32 px, ponto quente 10 0 */
a[href],
button,
summary,
label,
select,
[role="button"],
[role="tab"],
input[type="checkbox"],
input[type="radio"] {
  cursor:
    url("cursors/hand.png") 10 0,
    pointer;
  cursor:
    image-set(url("cursors/hand.png") 1x, url("cursors/hand@2x.png") 2x) 10 0,
    pointer;
}

/* beam: 14x32 px, ponto quente 6 14 */
p,
h1,
h2,
h3,
h4,
h5,
h6,
li,
dt,
dd,
figcaption,
blockquote,
td,
th,
input[type="text"],
input[type="email"],
input[type="search"],
textarea,
[contenteditable="true"] {
  cursor:
    url("cursors/beam.png") 6 14,
    text;
  cursor:
    image-set(url("cursors/beam.png") 1x, url("cursors/beam@2x.png") 2x) 6 14,
    text;
}

/**
 * Nao ha desligamento por prefers-contrast. Uma versao anterior devolvia o ponteiro do sistema em
 * prefers-contrast: more, com o argumento de nao atropelar ajustes de acessibilidade. Na pratica
 * apagava o ponteiro do site inteiro para quem usa o contraste aumentado do sistema, que e uma
 * preferencia comum, e o argumento nao se sustenta: estes desenhos sao preto e branco puro, com
 * contorno fechado, entao ja tem mais contraste que a maioria dos ponteiros de sistema. O ajuste
 * que de fato merecia respeito e o de tamanho do ponteiro, e para esse nao existe media query
 * nenhuma, ou seja, o desligamento nao protegia o caso que importava.
 */

/**
 * Estados que precisam continuar legiveis mantem o ponteiro do sistema. Os seletores nomeiam o
 * elemento porque [disabled] sozinho perderia para input[type="checkbox"] na especificidade.
 */
button[disabled],
input[disabled],
select[disabled],
textarea[disabled],
[aria-disabled="true"] {
  cursor: not-allowed;
}