/* Google Translate Custom Styling */

/* Container styling */
#google_translate_element {
  font-family: 'Inter', sans-serif;
  direction: ltr;
}

/* Main widget styling */
.goog-te-gadget {
  color: #333 !important;
  font-size: 14px !important;
  font-family: 'Inter', sans-serif !important;
  white-space: nowrap;
}

.goog-te-gadget-simple {
  background-color: #ffffff !important;
  border: 1px solid #ddd !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: #333 !important;
  cursor: pointer !important;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1) !important;
  transition: all 0.3s ease !important;
}

.goog-te-gadget-simple:hover {
  box-shadow: 0 4px 10px rgba(0,0,0,0.15) !important;
  border-color: #3498db !important;
}

/* Hide the default Google Translate icon and text */
.goog-te-gadget-icon {
  display: none !important;
}

.goog-te-menu-value span:first-child {
  display: none !important;
}

/* Custom language selector text */
.goog-te-menu-value:before {
  content: "🌐 Select Language" !important;
  color: #333 !important;
  font-family: 'Inter', sans-serif !important;
}

.goog-te-menu-value {
  color: #333 !important;
  font-family: 'Inter', sans-serif !important;
}

/* Dropdown menu styling */
.goog-te-menu-frame {
  max-width: 100% !important;
  max-height: 100% !important;
}

.goog-te-menu2 {
  max-width: 100% !important;
  overflow: auto !important;
  box-sizing: border-box !important;
  border-radius: 8px !important;
}

/* Language options styling */
.goog-te-menu2-item {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  padding: 8px 12px !important;
  color: #333 !important;
}

.goog-te-menu2-item:hover {
  background-color: #f5f5f5 !important;
}

.goog-te-menu2-item-selected {
  background-color: #3498db !important;
  color: white !important;
}

/* Responsive design */
@media (max-width: 768px) {
  .goog-te-gadget-simple {
    padding: 6px 10px !important;
    font-size: 12px !important;
    max-width: 150px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  
  .goog-te-menu-value:before {
    content: "🌐 Language" !important;
  }
}

/* Dark mode support */
[data-theme="dark"] .goog-te-gadget-simple {
  background-color: #2d2d2d !important;
  border-color: #404040 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .goog-te-menu-value:before {
  color: #ffffff !important;
}

[data-theme="dark"] .goog-te-gadget {
  color: #ffffff !important;
}

[data-theme="dark"] .goog-te-menu2-item {
  color: #ffffff !important;
  background-color: #2d2d2d !important;
}

[data-theme="dark"] .goog-te-menu2-item:hover {
  background-color: #3d3d3d !important;
}