/* ═══════════════════════════════════════════════════════════
   SymposiON · Laurel Cursor
   ───────────────────────────────────────────────────────────
   Fully INDEPENDENT of the Theme & Season engines. Driven by:
     • body[data-cursor="laurel"]   → toggled by js/cursor-toggle.js
     • body[data-sym-theme="…"]      → the EXISTING theme attribute,
                                        read here only for colour.
   Because colour is selected purely in CSS, switching themes
   recolours the cursor automatically with zero JS coupling.

   Coarse-pointer / touch devices are excluded via @media, so the
   laurel cursor never applies there (system behaviour preserved).

   Shapes (normalised to 32×32 in images/cursors/):
     arrow-*    → laurel sprig  (default / whole page)
     pointer-*  → laurel duo    (clickable elements)
   Colours:
     *-gilt   → every theme except the two below
     *-terra  → Coral Aegean  (data-sym-theme="coral")
     *-violet → Orphic Night  (data-sym-theme="orphic")
═══════════════════════════════════════════════════════════ */

@media (hover: hover) and (pointer: fine) {

  /* ── Default · gilt ─────────────────────────────────────── */
  body[data-cursor="laurel"] {
    cursor: url("../images/cursors/arrow-gilt.png") 4 3, auto;
  }
  body[data-cursor="laurel"] a,
  body[data-cursor="laurel"] button,
  body[data-cursor="laurel"] summary,
  body[data-cursor="laurel"] label[for],
  body[data-cursor="laurel"] select,
  body[data-cursor="laurel"] [role="button"],
  body[data-cursor="laurel"] [role="tab"],
  body[data-cursor="laurel"] [role="link"],
  body[data-cursor="laurel"] [onclick],
  body[data-cursor="laurel"] .clickable {
    cursor: url("../images/cursors/pointer-gilt.png") 8 4, pointer;
  }

  /* Keep the native text caret inside editable fields */
  body[data-cursor="laurel"] input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  body[data-cursor="laurel"] textarea,
  body[data-cursor="laurel"] [contenteditable="true"] {
    cursor: text;
  }
  body[data-cursor="laurel"] [disabled],
  body[data-cursor="laurel"] .is-disabled,
  body[data-cursor="laurel"] .theme-opt--locked {
    cursor: not-allowed;
  }

  /* ── Coral Aegean · terra-gem ───────────────────────────── */
  body[data-cursor="laurel"][data-sym-theme="coral"] {
    cursor: url("../images/cursors/arrow-terra.png") 4 3, auto;
  }
  body[data-cursor="laurel"][data-sym-theme="coral"] a,
  body[data-cursor="laurel"][data-sym-theme="coral"] button,
  body[data-cursor="laurel"][data-sym-theme="coral"] summary,
  body[data-cursor="laurel"][data-sym-theme="coral"] label[for],
  body[data-cursor="laurel"][data-sym-theme="coral"] select,
  body[data-cursor="laurel"][data-sym-theme="coral"] [role="button"],
  body[data-cursor="laurel"][data-sym-theme="coral"] [role="tab"],
  body[data-cursor="laurel"][data-sym-theme="coral"] [role="link"],
  body[data-cursor="laurel"][data-sym-theme="coral"] [onclick],
  body[data-cursor="laurel"][data-sym-theme="coral"] .clickable {
    cursor: url("../images/cursors/pointer-terra.png") 8 4, pointer;
  }

  /* ── Orphic Night · violet ──────────────────────────────── */
  body[data-cursor="laurel"][data-sym-theme="orphic"] {
    cursor: url("../images/cursors/arrow-violet.png") 4 3, auto;
  }
  body[data-cursor="laurel"][data-sym-theme="orphic"] a,
  body[data-cursor="laurel"][data-sym-theme="orphic"] button,
  body[data-cursor="laurel"][data-sym-theme="orphic"] summary,
  body[data-cursor="laurel"][data-sym-theme="orphic"] label[for],
  body[data-cursor="laurel"][data-sym-theme="orphic"] select,
  body[data-cursor="laurel"][data-sym-theme="orphic"] [role="button"],
  body[data-cursor="laurel"][data-sym-theme="orphic"] [role="tab"],
  body[data-cursor="laurel"][data-sym-theme="orphic"] [role="link"],
  body[data-cursor="laurel"][data-sym-theme="orphic"] [onclick],
  body[data-cursor="laurel"][data-sym-theme="orphic"] .clickable {
    cursor: url("../images/cursors/pointer-violet.png") 8 4, pointer;
  }
}

/* ═══════════════════════════════════════════════════════════
   Theme-picker · "Δείκτης · Cursor" group
   (styling for the markup appended to #theme-panel)
═══════════════════════════════════════════════════════════ */
.tp-cursor-row {
  display: flex;
  margin-top: 6px;
  padding-top: 8px;
  border-top: 1px solid rgba(255, 255, 255, 0.10);
}
.tp-col--cursor {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 6px;
}
.tp-col--cursor .tp-group-label { width: 100%; }
.tp-col--cursor .cursor-opt {
  flex: 1 1 220px;
  width: auto;
}

.cursor-opt__swatch {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.06);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px 20px;
  font-size: 15px;
  line-height: 1;
}
.cursor-opt__swatch--classic::before { content: "↖"; }
.cursor-opt__swatch--laurel {
  background-image: url("../images/cursors/arrow-gilt.png");
}
body[data-sym-theme="coral"] .cursor-opt__swatch--laurel {
  background-image: url("../images/cursors/arrow-terra.png");
}
body[data-sym-theme="orphic"] .cursor-opt__swatch--laurel {
  background-image: url("../images/cursors/arrow-violet.png");
}
