/**
 * GameBoy D-Pad Custom Cursor
 * WordPress Integration Stylesheet
 * 
 * Add this to your WordPress theme to get the retro GameBoy D-Pad cursor
 */

/* Default cursor - Purple D-Pad */
* {
  cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none"><g><rect x="9" y="3" width="6" height="6" fill="%236b5b7a"/><rect x="3" y="9" width="6" height="6" fill="%236b5b7a"/><rect x="15" y="9" width="6" height="6" fill="%236b5b7a"/><rect x="9" y="15" width="6" height="6" fill="%236b5b7a"/><rect x="9" y="9" width="6" height="6" fill="%23d5b3e0"/><rect x="10" y="4" width="4" height="4" fill="%23e8d5f0"/><rect x="4" y="10" width="4" height="4" fill="%23e8d5f0"/><rect x="16" y="10" width="4" height="4" fill="%23e8d5f0"/><rect x="10" y="16" width="4" height="4" fill="%23e8d5f0"/><rect x="10" y="10" width="4" height="4" fill="%23e8d5f0"/><rect x="11" y="5" width="2" height="2" fill="%23b89bc5"/><rect x="5" y="11" width="2" height="2" fill="%23b89bc5"/><rect x="17" y="11" width="2" height="2" fill="%23b89bc5"/><rect x="11" y="17" width="2" height="2" fill="%23b89bc5"/></g></svg>') 24 24, auto;
}

/* Interactive elements - Green D-Pad */
button,
a,
a *,
input,
input *,
input[type="submit"],
input[type="button"],
input[type="reset"],
input[type="text"],
input[type="search"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="url"],
input[type="number"],
textarea,
select,
[role="button"],
.wp-block-button a,
.wp-block-button a *,
.wapuu-gallery-card,
.wapuu-gallery-card *,
.pagination-button,
.about-button,
.detail-close,
.about-modal-close,
.wapuu-gallery-controls button,
.search-input,
.filter-select,
.wp-block-search__input {
  cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none"><g><rect x="9" y="3" width="6" height="6" fill="%237aa87a"/><rect x="3" y="9" width="6" height="6" fill="%237aa87a"/><rect x="15" y="9" width="6" height="6" fill="%237aa87a"/><rect x="9" y="15" width="6" height="6" fill="%237aa87a"/><rect x="9" y="9" width="6" height="6" fill="%23b8e6b8"/><rect x="10" y="4" width="4" height="4" fill="%23d8f5d8"/><rect x="4" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="16" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="10" y="16" width="4" height="4" fill="%23d8f5d8"/><rect x="10" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="11" y="5" width="2" height="2" fill="%239fcc9f"/><rect x="5" y="11" width="2" height="2" fill="%239fcc9f"/><rect x="17" y="11" width="2" height="2" fill="%239fcc9f"/><rect x="11" y="17" width="2" height="2" fill="%239fcc9f"/></g></svg>') 24 24, pointer !important;
}

/* Explicit hover states for better coverage */
button:hover,
a:hover,
a:hover *,
input:hover,
input:hover *,
textarea:hover,
select:hover,
.wapuu-gallery-card:hover,
.wapuu-gallery-card:hover *,
.pagination-button:hover:not(:disabled),
.about-button:hover,
.detail-close:hover,
.about-modal-close:hover,
.search-input:hover,
.filter-select:hover {
  cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none"><g><rect x="9" y="3" width="6" height="6" fill="%237aa87a"/><rect x="3" y="9" width="6" height="6" fill="%237aa87a"/><rect x="15" y="9" width="6" height="6" fill="%237aa87a"/><rect x="9" y="15" width="6" height="6" fill="%237aa87a"/><rect x="9" y="9" width="6" height="6" fill="%23b8e6b8"/><rect x="10" y="4" width="4" height="4" fill="%23d8f5d8"/><rect x="4" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="16" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="10" y="16" width="4" height="4" fill="%23d8f5d8"/><rect x="10" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="11" y="5" width="2" height="2" fill="%239fcc9f"/><rect x="5" y="11" width="2" height="2" fill="%239fcc9f"/><rect x="17" y="11" width="2" height="2" fill="%239fcc9f"/><rect x="11" y="17" width="2" height="2" fill="%239fcc9f"/></g></svg>') 24 24, pointer !important;
}

/* Active/pressing state - Darker green, smaller */
button:active,
a:active,
input:active,
textarea:active,
select:active,
.wapuu-gallery-card:active,
.pagination-button:active,
.about-button:active,
.detail-close:active,
.about-modal-close:active,
.search-input:active,
.filter-select:active {
  cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="44" height="44" viewBox="0 0 22 22" fill="none"><g><rect x="8" y="2" width="6" height="6" fill="%235a7a5a"/><rect x="2" y="8" width="6" height="6" fill="%235a7a5a"/><rect x="14" y="8" width="6" height="6" fill="%235a7a5a"/><rect x="8" y="14" width="6" height="6" fill="%235a7a5a"/><rect x="8" y="8" width="6" height="6" fill="%239fcc9f"/><rect x="9" y="3" width="4" height="4" fill="%23b8e6b8"/><rect x="3" y="9" width="4" height="4" fill="%23b8e6b8"/><rect x="15" y="9" width="4" height="4" fill="%23b8e6b8"/><rect x="9" y="15" width="4" height="4" fill="%23b8e6b8"/><rect x="9" y="9" width="4" height="4" fill="%23b8e6b8"/></g></svg>') 22 22, pointer !important;
}


/* Disabled elements - Gray D-Pad */
button:disabled,
input:disabled,
select:disabled,
.pagination-button:disabled,
[aria-disabled="true"] {
  cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none"><g><rect x="9" y="3" width="6" height="6" fill="%23b8b8b8"/><rect x="3" y="9" width="6" height="6" fill="%23b8b8b8"/><rect x="15" y="9" width="6" height="6" fill="%23b8b8b8"/><rect x="9" y="15" width="6" height="6" fill="%23b8b8b8"/><rect x="9" y="9" width="6" height="6" fill="%23d8d8d8"/><rect x="10" y="4" width="4" height="4" fill="%23efefef"/><rect x="4" y="10" width="4" height="4" fill="%23efefef"/><rect x="16" y="10" width="4" height="4" fill="%23efefef"/><rect x="10" y="16" width="4" height="4" fill="%23efefef"/><rect x="10" y="10" width="4" height="4" fill="%23efefef"/></g></svg>') 24 24, not-allowed;
}

/* Range slider cursor */
input[type="range"]::-webkit-slider-thumb,
.volume-slider::-webkit-slider-thumb {
  cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" viewBox="0 0 24 24" fill="none"><g><rect x="9" y="3" width="6" height="6" fill="%237aa87a"/><rect x="3" y="9" width="6" height="6" fill="%237aa87a"/><rect x="15" y="9" width="6" height="6" fill="%237aa87a"/><rect x="9" y="15" width="6" height="6" fill="%237aa87a"/><rect x="9" y="9" width="6" height="6" fill="%23b8e6b8"/><rect x="10" y="4" width="4" height="4" fill="%23d8f5d8"/><rect x="4" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="16" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="10" y="16" width="4" height="4" fill="%23d8f5d8"/><rect x="10" y="10" width="4" height="4" fill="%23d8f5d8"/></g></svg>') 48 48, pointer;
}

input[type="range"]::-moz-range-thumb,
.volume-slider::-moz-range-thumb {
  cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" viewBox="0 0 24 24" fill="none"><g><rect x="9" y="3" width="6" height="6" fill="%237aa87a"/><rect x="3" y="9" width="6" height="6" fill="%237aa87a"/><rect x="15" y="9" width="6" height="6" fill="%237aa87a"/><rect x="9" y="15" width="6" height="6" fill="%237aa87a"/><rect x="9" y="9" width="6" height="6" fill="%23b8e6b8"/><rect x="10" y="4" width="4" height="4" fill="%23d8f5d8"/><rect x="4" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="16" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="10" y="16" width="4" height="4" fill="%23d8f5d8"/><rect x="10" y="10" width="4" height="4" fill="%23d8f5d8"/></g></svg>') 48 48, pointer;
}

/* WordPress specific elements */
.wp-block-navigation__container a,
.wp-block-navigation-item a,
.menu-item a {
  cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" viewBox="0 0 24 24" fill="none"><g><rect x="9" y="3" width="6" height="6" fill="%237aa87a"/><rect x="3" y="9" width="6" height="6" fill="%237aa87a"/><rect x="15" y="9" width="6" height="6" fill="%237aa87a"/><rect x="9" y="15" width="6" height="6" fill="%237aa87a"/><rect x="9" y="9" width="6" height="6" fill="%23b8e6b8"/><rect x="10" y="4" width="4" height="4" fill="%23d8f5d8"/><rect x="4" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="16" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="10" y="16" width="4" height="4" fill="%23d8f5d8"/><rect x="10" y="10" width="4" height="4" fill="%23d8f5d8"/><rect x="11" y="5" width="2" height="2" fill="%239fcc9f"/><rect x="5" y="11" width="2" height="2" fill="%239fcc9f"/><rect x="17" y="11" width="2" height="2" fill="%239fcc9f"/><rect x="11" y="17" width="2" height="2" fill="%239fcc9f"/></g></svg>') 48 48, pointer;
}