/* touch-only-tweaks.css — MAIN-SESSION-OWNED
 * Plan: abstract-wondering-grove (2026-04-28)
 * Purpose: pointer/hover media queries — touch vs mouse cihaz ayrımı.
 * Risk: Düşük (additive, mevcut hover state'i etkilemez — sadece yeni context).
 *
 * Devices:
 *   - Touch-only phones: pointer:coarse, hover:none
 *   - Mouse-enabled iPad/Galaxy Tab + keyboard: pointer:fine, hover:hover
 *   - Hybrid laptop touchscreen: pointer:fine + secondary pointer:coarse
 */

/* ==============================================
 * Touch-only optimizations (most mobile devices)
 * ============================================== */
@media (pointer: coarse) {
  /* Larger tap targets (Apple HIG: 44x44, Google: 48x48) */
  html.mobile-root body.mobile-site button,
  html.mobile-root body.mobile-site a.btn,
  html.mobile-root body.mobile-site .clickable {
    min-height: 44px;
    /* Padding adjusted via existing CSS — no override here, just min-height floor */
  }

  /* Disable hover effects on touch (mevcut :hover state varsa override etmiyor — :active dominates) */
  html.mobile-root body.mobile-site .game-item:hover,
  html.mobile-root body.mobile-site .bs-prov-card:hover,
  html.mobile-root body.mobile-site .game-card:hover {
    /* Touch device: use :active state instead, hover is sticky on touch */
  }

  /* Remove blue tap highlight on iOS */
  html.mobile-root body.mobile-site a,
  html.mobile-root body.mobile-site button,
  html.mobile-root body.mobile-site [role="button"] {
    -webkit-tap-highlight-color: transparent;
  }
}

/* ==============================================
 * Mouse-enabled devices (iPad+keyboard, hybrid laptop)
 * ============================================== */
@media (hover: hover) and (pointer: fine) {
  /* Hover state etkin — mouse cursor değişikliği */
  html.mobile-root body.mobile-site .game-item:hover,
  html.mobile-root body.mobile-site .bs-prov-card:hover {
    cursor: pointer;
    transform: translateY(-1px);
    transition: transform 120ms ease;
  }

  /* Hover-only navigation hints */
  html.mobile-root body.mobile-site nav.mainMenu a:hover {
    color: rgba(255, 255, 255, 1);
  }
}

/* ==============================================
 * Hybrid devices (touchscreen laptop with mouse)
 * ============================================== */
@media (any-hover: hover) and (any-pointer: coarse) {
  /* Both mouse + touch available — use both interaction patterns */
  html.mobile-root body.mobile-site button {
    cursor: pointer;
  }
}

/* ==============================================
 * Reduced motion preference
 * ============================================== */
@media (prefers-reduced-motion: reduce) {
  html.mobile-root body.mobile-site * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ==============================================
 * Dark mode preference (future-ready)
 * ============================================== */
@media (prefers-color-scheme: dark) {
  /* MR is dark by default — placeholder for future light mode toggle */
}
