/* 
 * JPG to PNG Converter Styles
 * For unitconvertertool.com
 */

/* Main container styling */
.jpg2png_x7f3e9_container {
  text-align: center;
  padding: 40px 20px;
  font-family: Arial, sans-serif;
  background: #f8f9fb !important;
  border-radius: 12px;
  max-width: 600px;
  margin: auto;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

/* Heading styles */
.jpg2png_x7f3e9_heading {
  font-size: 28px !important;
  font-weight: bold !important;
  margin-bottom: 10px !important;
  color: #222 !important;
  font-family: Arial, sans-serif !important;
}

/* Paragraph styles */
.jpg2png_x7f3e9_description {
  font-size: 16px !important;
  color: #555 !important;
  margin: 8px 0 !important;
  font-family: Arial, sans-serif !important;
}

/* Upload button container */
.jpg2png_x7f3e9_upload-box {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  margin: 20px 0 !important;
}

/* Upload button styling */
.jpg2png_x7f3e9_upload-btn {
  background: #2f80ed !important;
  color: white !important;
  padding: 14px 28px !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  font-size: 16px !important;
  font-weight: bold !important;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1) !important;
  transition: background 0.3s !important;
  text-decoration: none !important;
  display: inline-block !important;
}
.jpg2png_x7f3e9_upload-btn:hover {
  background: #1d6adb !important;
}

/* Drop area text */
.jpg2png_x7f3e9_drop-text {
  font-size: 14px !important;
  color: #777 !important;
  margin-top: 10px !important;
  font-family: Arial, sans-serif !important;
}

/* Download button styling */
.jpg2png_x7f3e9_download-link {
  display: inline-block !important;
  margin: 10px !important;
  padding: 12px 20px !important;
  background: #27ae60 !important;
  color: white !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  font-weight: bold !important;
  transition: background 0.3s !important;
}
.jpg2png_x7f3e9_download-link:hover {
  background: #1e874b !important;
}

/* Progress bar container */
.jpg2png_x7f3e9_progress-bar-container {
  width: 100% !important;
  background-color: #f1f1f1 !important;
  border-radius: 4px !important;
  margin: 15px 0 !important;
  overflow: hidden !important;
}

/* Progress bar */
.jpg2png_x7f3e9_progress-bar {
  height: 20px !important;
  background-color: #4CAF50 !important;
  width: 0% !important;
  transition: width 0.3s !important;
}

/* Progress text */
#progressText {
  font-size: 14px;
  color: #555;
  margin-top: 5px;
}

/* Error messages container */
#errorMessages {
  color: #e74c3c;
  margin: 10px 0;
  font-size: 14px;
}

/* Individual error message */
.error-item {
  background-color: #fdecea;
  padding: 8px 12px;
  border-radius: 4px;
  margin-bottom: 5px;
  border-left: 3px solid #e74c3c;
}