/** components.id-based.css
 * ID-based styles for major unique UI components
 * These styles supplement component CSS files with ID-specific responsive behavior
 */

/* Radial Menu Toggle Button - Base Styles */
#action-menu-mobile-btn {
  position: fixed;
  bottom: 2vh;
  right: 2vw;
  width: 12vh;
  height: 12vh;
  background: transparent;
  border: 3px solid #333;
  border-radius: 50%;
  display: none; /* Hidden by default to prevent flash before unleash screen */
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 0 20px rgba(255, 213, 77, 0.6), 0 0.4vh 1.2vh rgba(0,0,0,0.3);
  z-index: 10700; /* Above radial menu and all other UI elements */
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  color: #000;
}

/* Left corner variant */
#action-menu-mobile-btn[data-corner="left"] {
  left: 2vw;
  right: auto;
}

/* Mobile-specific ID overrides - show buttons when narrow OR touch device */
@media (max-width: 1024px) {
  #dice-tray {
    /* Mobile dice tray positioning and animation */
    transition: left 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
  
  /* Show mobile buttons when screen is narrow or touch device */
  #dice-toggle-btn,
  #action-menu-mobile-btn {
    display: flex !important;
    visibility: visible !important;
  }
}

/* Desktop-specific ID styles - hide buttons when wide screen */
@media (min-width: 1025px) {
  /* Hide mobile buttons completely in true desktop mode - aggressive hiding */
  #dice-toggle-btn,
  #action-menu-mobile-btn {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    opacity: 0 !important;
    /* Force off-screen as extra safety in case display rules fail */
    position: fixed !important;
    left: -9999px !important;
    top: -9999px !important;
  }
  
  /* Hide mini player cards on desktop - they're mobile-only */
  .cmp-mini-player-cards,
  .mini-player-card-container {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  
}