/* Firefox-specific fixes for select dropdowns to match Chrome look */

@-moz-document url-prefix() {
  /* Light mode select styling */
  select[data-flux-select-native] {
    color: #3f3f46 !important; /* zinc-700 */
    background-color: white !important;
  }

  /* Dark mode select styling */
  html.dark select[data-flux-select-native] {
    color: #d4d4d8 !important; /* zinc-300 */
    background-color: rgba(255, 255, 255, 0.1) !important; /* white/10 */
  }

  /* Light mode option styling */
  select[data-flux-select-native] option {
    color: #3f3f46 !important; /* zinc-700 */
    background-color: white !important;
  }

  /* Dark mode option styling */
  html.dark select[data-flux-select-native] option {
    color: white !important;
    background-color: #27272a !important; /* zinc-800 */
  }

  /* Remove native appearance for consistency */
  select[data-flux-select-native] {
    -moz-appearance: none !important;
    appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.5rem center !important;
    background-size: 1.5em 1.5em !important;
    padding-right: 2.5rem !important;
  }

  /* Dark mode dropdown arrow */
  html.dark select[data-flux-select-native] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%239ca3af'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") !important;
  }

  /* Focus style for accessibility */
  select[data-flux-select-native]:focus {
    outline: 2px solid rgba(139, 92, 246, 0.5) !important; /* violet-500 with opacity */
    outline-offset: 2px !important;
  }
}