/* WebPtoPDF.org main stylesheet */

/* General Styles */
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Converter Styles */
#drop-area {
  transition: all 0.3s ease;
}

#drop-area.highlight {
  border-color: #3182ce;
  background-color: #ebf8ff;
}

.file-item {
  animation: fadeIn 0.5s;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Status Messages */
.status-error {
  background-color: #FEE2E2;
  border-left: 4px solid #EF4444;
  color: #991B1B;
  padding: 10px 15px;
  border-radius: 4px;
}

.status-warning {
  background-color: #FEF3C7;
  border-left: 4px solid #F59E0B;
  color: #92400E;
  padding: 10px 15px;
  border-radius: 4px;
}

.status-success {
  background-color: #D1FAE5;
  border-left: 4px solid #10B981;
  color: #065F46;
  padding: 10px 15px;
  border-radius: 4px;
}

.status-progress {
  background-color: #E0E7FF;
  border-left: 4px solid #6366F1;
  color: #4338CA;
  padding: 10px 15px;
  border-radius: 4px;
}

/* FAQ item styles */
.faq-question {
  position: relative;
  cursor: pointer;
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, padding 0.3s ease;
}

.faq-answer.active {
  max-height: 500px;
  padding-top: 1.25rem;
}

.faq-icon {
  transition: transform 0.3s ease;
}

.faq-icon.active {
  transform: rotate(-180deg);
}

/* Back to top button */
#back-to-top {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
}

#back-to-top.visible {
  opacity: 1;
  visibility: visible;
}

/* Language selector styling - Multi-column layout */
.language-dropdown {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: 300px !important;
  max-width: 90vw;
}

/* Ensure the language menu stays visible when moving between button and dropdown */
.language-selector:hover .language-dropdown,
.language-dropdown:hover {
  display: grid !important;
}