/* UNIFIED ADMIN DROPDOWN STYLING - One style for ALL dropdowns */

/* Base dropdown styling for all admin dropdowns */
select.input-glass,
select.input-glass-compact {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  color: white !important;
  cursor: pointer !important;
  padding-right: 32px !important;
}

/* Standard size dropdowns */
select.input-glass {
  font-size: 0.85rem !important;
  padding: 16px 40px 16px 20px !important;
  min-height: 56px !important;
}

/* Compact size dropdowns */
select.input-glass-compact {
  font-size: 0.75rem !important;
  padding: 8px 32px 8px 12px !important;
  min-height: 36px !important;
}

/* Dropdown options styling - applies to ALL admin dropdowns */
select.input-glass option,
select.input-glass-compact option {
  background: rgba(0, 0, 0, 0.9) !important;
  color: white !important;
  padding: 8px 16px !important;
}

/* ENHANCED: Stronger base option styling for all dropdowns */
select.input-glass option,
select.input-glass-compact option {
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border: none !important;
}

/* Disabled options - applies to ALL */
select.input-glass option[disabled],
select.input-glass-compact option[disabled] {
  color: rgba(255, 255, 255, 0.5) !important;
}

/* Selected disabled options (placeholder text) - FORCE WHITE TEXT */
select.input-glass option[disabled]:checked,
select.input-glass option[disabled][selected],
select.input-glass-compact option[disabled]:checked,
select.input-glass-compact option[disabled][selected] {
  color: white !important;
  background: rgba(255, 255, 255, 0.05) !important;
}

/* When dropdown shows selected disabled option as placeholder - comprehensive fix */
select.input-glass:has(option[disabled]:checked),
select.input-glass-compact:has(option[disabled]:checked),
select.input-glass[data-placeholder="true"],
select.input-glass-compact[data-placeholder="true"] {
  color: white !important;
}

/* Cross-browser fix for select with disabled option selected */
select.input-glass,
select.input-glass-compact {
  color: white !important;
}

/* ENHANCED: Gallery page specific fixes for option visibility issues */
#gallery-style-filter {
  color: white !important;
}

#gallery-style-filter option {
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  padding: 8px 16px !important;
}

#gallery-style-filter option:checked,
#gallery-style-filter option[selected] {
  background: linear-gradient(135deg, rgba(102, 126, 234, 0.9), rgba(59, 130, 246, 0.8)) !important;
  color: #ffffff !important;
  font-weight: bold !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
}

#gallery-style-filter option:hover {
  background: linear-gradient(135deg, rgba(102, 126, 234, 0.6), rgba(59, 130, 246, 0.5)) !important;
  color: #ffffff !important;
}

/* Shop and Gallery page compatibility */
select.input-glass.text-xs {
  font-size: 0.75rem !important;
}

select.input-glass.text-sm {
  font-size: 0.875rem !important;
}

/* Selected/checked options - applies to ALL */
select.input-glass option:checked,
select.input-glass option[selected],
select.input-glass-compact option:checked,
select.input-glass-compact option[selected] {
  background: rgba(102, 126, 234, 0.8) !important;
  color: white !important;
  font-weight: bold !important;
}

/* Gallery page specific fix for option visibility */
#gallery-style-filter option:checked,
#gallery-style-filter option[selected] {
  background: rgba(102, 126, 234, 0.9) !important;
  color: #ffffff !important;
  font-weight: bold !important;
}

/* Browser-specific fixes for dropdown option visibility */
@supports (-webkit-appearance: none) {
  select.input-glass option:checked,
  select.input-glass-compact option:checked {
    background: rgba(102, 126, 234, 0.9) !important;
    color: #ffffff !important;
    font-weight: bold !important;
  }
}

/* Firefox specific fix */
@-moz-document url-prefix() {
  select.input-glass option:checked,
  select.input-glass-compact option:checked {
    background-color: rgba(102, 126, 234, 0.8) !important;
    color: #ffffff !important;
    font-weight: bold !important;
  }
}

/* Hover states - applies to ALL */
select.input-glass option:hover,
select.input-glass-compact option:hover {
  background: rgba(102, 126, 234, 0.6) !important;
  color: white !important;
}

/* Gallery page specific hover fix */
#gallery-style-filter option:hover {
  background: rgba(102, 126, 234, 0.6) !important;
  color: #ffffff !important;
}

/* Additional cross-browser hover fixes */
@supports (-webkit-appearance: none) {
  select.input-glass option:hover,
  select.input-glass-compact option:hover {
    background: rgba(102, 126, 234, 0.6) !important;
    color: #ffffff !important;
  }
}

/* Focus states - applies to ALL */
select.input-glass:focus,
select.input-glass-compact:focus {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.15) !important;
}

@media (max-width: 768px) {
  select.input-glass {
    font-size: 0.75rem !important;
    padding: 12px 32px 12px 16px !important;
    min-height: 48px !important;
  }
  
  select.input-glass-compact {
    font-size: 0.7rem !important;
    padding: 6px 28px 6px 10px !important;
    min-height: 32px !important;
  }
}

@media (max-width: 480px) {
  select.input-glass {
    font-size: 0.7rem !important;
    padding: 10px 28px 10px 14px !important;
    min-height: 44px !important;
  }
  
  select.input-glass-compact {
    font-size: 0.65rem !important;
    padding: 5px 26px 5px 8px !important;
    min-height: 30px !important;
  }
}

/* All admin dropdowns now use the unified styling above */
