/**
 * CV Tailoring Interface - WSJ STYLE REDIRECT
 * This file now redirects all old CV tailoring styles to WSJ system
 * All old classes are preserved for compatibility but use WSJ styles
 */

/* Import WSJ styles as the foundation */
@import url("wsj-cv-display.css");

/* ============================================
   REDIRECT OLD CLASSES TO WSJ STYLES
   All old CV tailoring classes now use WSJ styling
   ============================================ */

/* Main CV Tailoring Container - Now uses WSJ styling */
.cv-tailoring-container,
.wsj-cv-tailoring-container {
  background: white !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 30px !important;
  margin: 20px 0 !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
  font-family: "Minion Pro", Georgia, "Times New Roman", serif !important;
}

/* Header - WSJ style */
.cv-tailoring-header,
.wsj-cv-header {
  border-bottom: 2px solid #f0f0f0 !important;
  padding-bottom: 20px !important;
  margin-bottom: 25px !important;
  text-align: left !important;
}

.cv-tailoring-header h3,
.wsj-cv-header h3 {
  font-size: 24px !important;
  color: #1a472a !important;
  margin: 0 !important;
  font-weight: 700 !important;
  font-family: "Minion Pro", Georgia, serif !important;
  letter-spacing: -0.5px !important;
}

.cv-tailoring-header p,
.wsj-cv-header p {
  color: #666 !important;
  font-size: 14px !important;
  margin: 10px 0 0 !important;
  font-style: italic !important;
}

/* Upload Options - WSJ grid layout */
.cv-upload-options,
.wsj-cv-upload-options,
.wsj-cv-upload-grid {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  gap: 25px !important;
  align-items: start !important;
}

/* Upload/Paste Boxes - WSJ premium style */
.cv-upload-box,
.cv-paste-box,
.wsj-upload-box,
.wsj-paste-box {
  background: linear-gradient(135deg, #faf7f2, #fff) !important;
  border: 2px dashed #e0e0e0 !important;
  border-radius: 10px !important;
  padding: 25px !important;
  text-align: center !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.cv-upload-box:hover,
.cv-paste-box:hover,
.wsj-upload-box:hover,
.wsj-paste-box:hover {
  border-color: #1a472a !important;
  box-shadow: 0 8px 24px rgba(26, 71, 42, 0.15) !important;
  transform: translateY(-2px) !important;
}

/* Upload icon */
.upload-icon {
  font-size: 48px !important;
  margin-bottom: 15px !important;
  filter: grayscale(20%) !important;
}

/* Headings in upload boxes */
.cv-upload-box h4,
.cv-paste-box h4,
.wsj-upload-box h4,
.wsj-paste-box h4 {
  font-size: 16px !important;
  color: #1a472a !important;
  margin: 0 0 10px !important;
  font-weight: 600 !important;
  font-family: "Minion Pro", Georgia, serif !important;
}

.cv-upload-box p,
.wsj-upload-box p {
  color: #666 !important;
  font-size: 13px !important;
  margin: 0 0 20px !important;
}

/* OR Divider - WSJ style */
.cv-upload-divider {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.cv-upload-divider::after {
  content: "OR" !important;
  background: white !important;
  padding: 8px 12px !important;
  border: 2px solid #f0f0f0 !important;
  border-radius: 20px !important;
  color: #999 !important;
  font-weight: 600 !important;
  font-size: 13px !important;
}

.cv-upload-divider::before {
  display: none !important;
}

/* Textarea - WSJ style */
#cv-paste-text,
textarea[id*="cv"] {
  width: 100% !important;
  min-height: 60px !important;
  padding: 12px !important;
  border-radius: 6px !important;
  font-size: 20px !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  resize: vertical !important;
  transition: all 0.2s !important;
  background: white !important;
}

#cv-paste-text:focus,
textarea[id*="cv"]:focus {
  outline: none !important;
  border-color: #1a472a !important;
  box-shadow: 0 0 0 3px rgba(26, 71, 42, 0.1) !important;
}

/* All buttons - WSJ premium style */
.cv-upload-btn,
.cv-process-btn,
.wsj-upload-btn,
.wsj-process-btn,
.cv-upload-container button,
button[onclick*="CV"],
button[onclick*="cv"] {
  background: linear-gradient(135deg, #1a472a, #2d6a4f) !important;
  color: white !important;
  border: none !important;
  padding: 12px 30px !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  cursor: pointer !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-shadow: 0 4px 12px rgba(26, 71, 42, 0.25) !important;
  text-transform: none !important;
  letter-spacing: 0.5px !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.cv-upload-btn:hover,
.cv-process-btn:hover,
.wsj-upload-btn:hover,
.wsj-process-btn:hover,
.cv-upload-container button:hover,
button[onclick*="CV"]:hover,
button[onclick*="cv"]:hover {
  background: linear-gradient(135deg, #2d6a4f, #1a472a) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(26, 71, 42, 0.35) !important;
}

/* CV Download Button - WSJ Gold Premium */
.cv-download-btn {
  display: inline-block !important;
  background: linear-gradient(135deg, #d4af37, #f4d03f) !important;
  color: #1a472a !important;
  padding: 14px 32px !important;
  margin: 12px 0 !important;
  border: none !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  cursor: pointer !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3) !important;
  font-family: "Minion Pro", Georgia, serif !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  position: relative !important;
  overflow: hidden !important;
}

.cv-download-btn::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.4),
    transparent
  ) !important;
  transition: left 0.6s ease !important;
}

.cv-download-btn:hover {
  background: linear-gradient(135deg, #f4d03f, #d4af37) !important;
  box-shadow: 0 6px 24px rgba(212, 175, 55, 0.4) !important;
  transform: translateY(-3px) scale(1.02) !important;
}

.cv-download-btn:hover::before {
  left: 100% !important;
}

/* Processing states - WSJ style */
.cv-processing,
.wsj-cv-processing {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
  background: linear-gradient(135deg, #f0f9f4, #fff) !important;
  border-radius: 12px !important;
  margin: 16px 0 !important;
}

.cv-processing-spinner,
.wsj-spinner {
  width: 40px !important;
  height: 40px !important;
  border: 3px solid #f0f0f0 !important;
  border-top-color: #1a472a !important;
  border-radius: 50% !important;
  animation: wsj-spin 1s linear infinite !important;
  margin-right: 16px !important;
}

@keyframes wsj-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.cv-processing-text,
.wsj-processing-text {
  color: #1a472a !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  font-family: "Minion Pro", Georgia, serif !important;
}

/* Success/Error messages - WSJ style */
.cv-success-message,
.wsj-cv-success {
  background: linear-gradient(135deg, #f0f9f4, #fff) !important;
  border-left: 4px solid #2d6a4f !important;
  padding: 16px 20px !important;
  margin: 16px 0 !important;
  border-radius: 8px !important;
  color: #1a472a !important;
  font-size: 15px !important;
  font-weight: 500 !important;
}

.cv-error-message {
  background: #fef5f5 !important;
  border-left: 4px solid #c00 !important;
  padding: 16px 20px !important;
  margin: 16px 0 !important;
  border-radius: 8px !important;
  color: #721c24 !important;
  font-size: 15px !important;
}

/* CV Stats - WSJ metrics style */
.cv-stats,
.wsj-cv-stats {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 15px !important;
  margin: 20px 0 !important;
}

.cv-stat-item {
  background: linear-gradient(135deg, #f0f9f4, #fff) !important;
  border-left: 3px solid #2d6a4f !important;
  border-radius: 6px !important;
  padding: 12px 16px !important;
}

.cv-stat-label {
  font-size: 12px !important;
  color: #666 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  margin-bottom: 4px !important;
  font-weight: 500 !important;
}

.cv-stat-value {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #1a472a !important;
  font-family: "Minion Pro", Georgia, serif !important;
}

/* Preview container - WSJ document style */
.cv-preview-container,
.wsj-cv-preview-container,
.wsj-cv-container {
  background: white !important;
  border: 1px solid #e0e0e0 !important;
  border-radius: 8px !important;
  padding: 30px !important;
  margin: 20px 0 !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08) !important;
  font-family: "Minion Pro", Georgia, "Times New Roman", serif !important;
}

/* File input styling */
#cv-file-upload,
#cv-file-input,
input[type="file"][id*="cv"] {
  display: none !important;
}

/* File selected text */
#file-selected {
  margin-top: 15px !important;
  color: #2d6a4f !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
  .cv-upload-options,
  .wsj-cv-upload-options,
  .wsj-cv-upload-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  .cv-upload-divider::after {
    margin: 20px 0 !important;
  }

  .cv-tailoring-container,
  .wsj-cv-tailoring-container {
    padding: 20px !important;
    margin: 15px 0 !important;
  }

  .cv-download-btn {
    width: 100% !important;
    padding: 16px !important;
  }
}

/* Override any conflicting styles with WSJ priority */
.wsj-cv-instant-preview,
.wsj-cv-display {
  font-family: "Minion Pro", Georgia, "Times New Roman", serif !important;
}

/* Ensure WSJ renderer takes precedence */
.WSJCVRendererUltimate * {
  font-family: inherit !important;
}
