/* Custom cursor styles for docs.agencyg.de — mirrors the shop exactly.
 * JS at /assets/cursor.js drives all geometry (width/height/border-radius/
 * transform); this file provides only colour/border/glow per variant +
 * hide-native-cursor rules. */

html.has-custom-cursor,
html.has-custom-cursor body,
html.has-custom-cursor *:not(input):not(textarea):not([contenteditable="true"]) {
  cursor: none !important;
}
html.has-custom-cursor input,
html.has-custom-cursor textarea,
html.has-custom-cursor [contenteditable="true"] {
  cursor: text !important;
}

.custom-cursor-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: radial-gradient(circle at 32% 28%, #fff7d6 0%, #ffe49a 25%, #c9a227 70%, #7e6215 100%);
  box-shadow:
    0 0 0 1.5px rgba(10, 8, 0, 0.55),
    0 0 0 2.5px rgba(255, 230, 150, 0.35),
    0 0 14px rgba(201, 162, 39, 0.85),
    0 0 3px rgba(255, 230, 150, 1);
  will-change: transform;
  transform: translate3d(0, 0, 0);
  transition: opacity 0.2s;
}

.custom-cursor-ring {
  border: 2px solid rgba(201, 162, 39, 0.85);
  background: rgba(201, 162, 39, 0);
  box-shadow:
    0 0 0 1px rgba(10, 8, 0, 0.35),
    0 0 14px -2px rgba(201, 162, 39, 0.5);
  will-change: transform, width, height, border-radius;
  transition:
    background-color 0.22s cubic-bezier(.2, 1, .3, 1),
    border-color 0.22s cubic-bezier(.2, 1, .3, 1),
    border-width 0.22s cubic-bezier(.2, 1, .3, 1),
    box-shadow 0.22s cubic-bezier(.2, 1, .3, 1),
    opacity 0.2s;
}

.custom-cursor-ring.variant-interactive,
.custom-cursor-ring.variant-wrap {
  border-color: rgba(255, 228, 130, 1);
  border-width: 2px;
  background: rgba(201, 162, 39, 0.10);
  box-shadow:
    0 0 0 1px rgba(10, 8, 0, 0.4),
    0 0 28px -4px rgba(201, 162, 39, 0.45),
    inset 0 0 22px rgba(201, 162, 39, 0.1);
}

.custom-cursor-ring.variant-text {
  border: none;
  background: rgba(255, 228, 130, 1);
  box-shadow:
    0 0 0 0.5px rgba(10, 8, 0, 0.5),
    0 0 12px rgba(201, 162, 39, 0.7);
}

.custom-cursor-ring.variant-none {
  border: 0;
  background: transparent;
  box-shadow: none;
}

.custom-cursor-ring.is-clicking {
  animation: cursorClickPulse 0.22s ease-out;
}
@keyframes cursorClickPulse {
  0%   { filter: brightness(1); }
  50%  { filter: brightness(1.4) saturate(1.3); }
  100% { filter: brightness(1); }
}

@media (pointer: coarse), (prefers-reduced-motion: reduce) {
  .custom-cursor-dot, .custom-cursor-ring { display: none !important; }
  html.has-custom-cursor,
  html.has-custom-cursor body,
  html.has-custom-cursor *:not(input):not(textarea):not([contenteditable="true"]) {
    cursor: auto !important;
  }
}

/* ── Accessibility fallbacks ──────────────────────────────────
 * Users who ask for higher contrast (OS pref "Increase Contrast"
 * on mac / "High Contrast" on Windows) or are on Windows High
 * Contrast Mode get the native system cursor back. Same for
 * prefers-contrast:more. Our brand-tinted cursor is subtle by
 * design and can vanish against a custom high-contrast palette.
 * Keyboard / screen-reader users already ignore the cursor —
 * the focus-visible ring on buttons handles their navigation.
 */
@media (forced-colors: active), (prefers-contrast: more) {
  .custom-cursor-dot, .custom-cursor-ring,
  .ag-cursor-dot, .ag-cursor-ring,
  .pp-cursor-dot, .pp-cursor-ring { display: none !important; }
  html.has-custom-cursor,
  html.has-custom-cursor body,
  html.has-custom-cursor *:not(input):not(textarea):not([contenteditable="true"]) {
    cursor: auto !important;
  }
}