/**
 * TRAILS AI Assessment - Premium Styles
 */

/* ===== CSS Variables ===== */
:root {
  --forest: #1a3a2f;
  --forest-light: #234a3d;
  --cream: #fbf8f5;
  --gold: #c7ae6a;
  --gold-light: #d4bc7f;
  --gold-dark: #b39a5a;
  --gold-vibrant: #d4af37;
  --grey-cool: #9ca3af;
  --dark: #1a1a1a;
  --white: #ffffff;
}

/* ===== Base ===== */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* ===== Page Background ===== */
.assessment-page {
  min-height: 100vh;
  background: url('../images/Home Herojpg.jpg') center/cover no-repeat fixed;
  font-family: 'Inter', sans-serif;
  color: var(--dark);
  position: relative;
}

.assessment-page::before {
  content: '';
  position: fixed;
  inset: 0;
  background: linear-gradient(145deg, rgba(26, 58, 47, 0.85) 0%, rgba(20, 42, 35, 0.92) 100%);
  z-index: 0;
}

/* ===== Assessment Nav Override ===== */
.assessment-nav {
  z-index: 10;
  background: rgba(26, 58, 47, 0.85);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* ===== Container ===== */
.assessment-container {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 140px 20px 40px 20px; /* Extra top padding for nav */
  position: relative;
  z-index: 1;
}

/* ===== Logo ===== */
.assessment-logo {
  text-align: center;
  margin-bottom: 50px;
}

.assessment-logo img {
  height: 100px;
  width: auto;
  filter: drop-shadow(0 4px 20px rgba(0, 0, 0, 0.4));
}

/* ===== Premium Glass Card ===== */
.glass-card {
  background: linear-gradient(165deg,
    rgba(255, 255, 255, 0.95) 0%,
    rgba(251, 248, 245, 0.92) 100%);
  border-radius: 28px;
  border: 1px solid rgba(255, 255, 255, 0.8);
  box-shadow:
    0 25px 50px -12px rgba(0, 0, 0, 0.4),
    0 0 0 1px rgba(255, 255, 255, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  padding: 50px 45px;
  max-width: 560px;
  width: 90%;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

/* ===== Lead Capture Form ===== */
.lead-form {
  width: 100%;
}

.lead-form h2 {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 500;
  color: var(--forest);
  text-align: center;
  margin-bottom: 8px;
  letter-spacing: -0.5px;
}

.lead-form p {
  text-align: center;
  color: #666;
  margin-bottom: 35px;
  font-size: 1.05rem;
}

.form-group {
  margin-bottom: 22px;
}

.form-group label {
  display: block;
  font-weight: 600;
  font-size: 0.85rem;
  margin-bottom: 10px;
  color: var(--forest);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.form-group .optional {
  font-weight: 400;
  color: #999;
  text-transform: none;
  letter-spacing: 0;
}

.form-group input {
  width: 100%;
  padding: 16px 20px;
  border: 2px solid #e8e5e0;
  border-radius: 12px;
  font-size: 1rem;
  font-family: inherit;
  transition: all 0.3s ease;
  background: rgba(255, 255, 255, 0.8);
}

.form-group input:focus {
  outline: none;
  border-color: var(--gold);
  background: var(--white);
  box-shadow: 0 0 0 4px rgba(199, 174, 106, 0.15);
}

.form-group input::placeholder {
  color: #aaa;
}

/* ===== Primary Button ===== */
.btn-primary {
  width: 100%;
  padding: 18px 36px;
  background: linear-gradient(145deg, var(--gold-light) 0%, var(--gold) 50%, var(--gold-dark) 100%);
  color: var(--white);
  border: none;
  border-radius: 12px;
  font-size: 1rem;
  font-weight: 600;
  font-family: inherit;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow:
    0 4px 15px rgba(199, 174, 106, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  margin-top: 10px;
}

.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow:
    0 8px 25px rgba(199, 174, 106, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.btn-primary:active {
  transform: translateY(0);
}

.btn-primary:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

.btn-secondary {
  padding: 14px 28px;
  background: transparent;
  color: var(--forest);
  border: 2px solid var(--forest);
  border-radius: 12px;
  font-size: 1rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: all 0.3s ease;
}

.btn-secondary:hover {
  background: var(--forest);
  color: var(--white);
}

/* ===== Questions Screen ===== */
#screen-questions {
  display: flex;
  flex-direction: column;
  max-width: 620px;
}

/* ===== Progress Bar ===== */
.progress-container {
  width: 100%;
  margin-bottom: 35px;
}

.progress-bar-bg {
  width: 100%;
  height: 5px;
  background: linear-gradient(90deg, #e8e5e0 0%, #f0ede8 100%);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.06);
}

.progress-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--gold) 0%, var(--gold-vibrant) 100%);
  border-radius: 10px;
  transition: width 0.4s ease;
  box-shadow: 0 0 10px rgba(199, 174, 106, 0.5);
}

.progress-text {
  display: block;
  width: 100%;
  text-align: center;
  font-size: 0.8rem;
  color: #888;
  margin-top: 14px;
  font-weight: 500;
  letter-spacing: 0.5px;
}

/* ===== Question Content ===== */
.question-container {
  width: 100%;
  text-align: center;
}

.question-number {
  display: inline-block;
  font-size: 0.7rem;
  color: var(--white);
  background: linear-gradient(145deg, var(--gold-light), var(--gold));
  padding: 6px 16px;
  border-radius: 20px;
  margin-bottom: 25px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-weight: 700;
  box-shadow: 0 2px 8px rgba(199, 174, 106, 0.3);
}

.question-text {
  font-family: 'Playfair Display', serif;
  font-size: 1.6rem;
  font-weight: 500;
  color: var(--forest);
  line-height: 1.4;
  margin-bottom: 40px;
  letter-spacing: -0.3px;
}

/* ===== Answer Options ===== */
.options-container {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 35px;
}

.option-btn {
  width: 100%;
  padding: 20px 28px;
  background: linear-gradient(145deg, var(--white) 0%, #fafaf8 100%);
  border: 2px solid #e8e5e0;
  border-radius: 14px;
  font-size: 1rem;
  font-family: inherit;
  font-weight: 500;
  color: var(--dark);
  cursor: pointer;
  transition: all 0.25s ease;
  text-align: left;
  position: relative;
  overflow: hidden;
}

.option-btn::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--gold);
  opacity: 0;
  transition: opacity 0.25s ease;
}

.option-btn:hover {
  border-color: var(--gold);
  background: linear-gradient(145deg, #fffdf8 0%, #fff 100%);
  transform: translateX(4px);
  box-shadow: 0 4px 20px rgba(199, 174, 106, 0.15);
}

.option-btn:hover::before {
  opacity: 1;
}

.option-btn.selected {
  border-color: var(--gold);
  background: linear-gradient(145deg, var(--gold-light) 0%, var(--gold) 100%);
  color: var(--white);
  transform: translateX(4px);
  box-shadow: 0 6px 25px rgba(199, 174, 106, 0.4);
}

.option-btn.selected::before {
  opacity: 0;
}

.option-btn:focus {
  outline: none;
}

/* ===== Navigation ===== */
.question-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  padding-top: 25px;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  position: relative;
}

.question-nav .btn-primary {
  width: auto;
  min-width: 160px;
}

.btn-back {
  position: absolute;
  left: 0;
  background: none;
  border: none;
  color: #888;
  font-size: 0.9rem;
  font-weight: 500;
  cursor: pointer;
  padding: 10px 16px;
  transition: color 0.2s ease;
}

.btn-back:hover {
  color: var(--forest);
}

/* ===== Skillsat Redirect ===== */
.skillsat-redirect {
  text-align: center;
}

.skillsat-redirect h2 {
  font-family: 'Playfair Display', serif;
  font-size: 1.8rem;
  color: var(--forest);
  margin-bottom: 25px;
}

.skillsat-redirect p {
  color: #555;
  line-height: 1.7;
  margin-bottom: 18px;
}

.skillsat-redirect .highlight {
  font-weight: 600;
  color: var(--forest);
}

.skillsat-buttons {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 35px;
}

/* ===== Loading ===== */
.loading-spinner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 20px;
}

.spinner {
  width: 50px;
  height: 50px;
  border: 3px solid #e8e5e0;
  border-top-color: var(--gold);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.loading-spinner p {
  margin-top: 25px;
  color: #666;
  font-weight: 500;
}

/* ===== Results Report ===== */
.report-container {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.report-glass {
  background: linear-gradient(165deg,
    rgba(255, 255, 255, 0.97) 0%,
    rgba(251, 248, 245, 0.95) 100%);
  border-radius: 28px;
  border: 1px solid rgba(255, 255, 255, 0.8);
  box-shadow:
    0 25px 50px -12px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  overflow: hidden;
  min-height: 600px;
  display: flex;
  flex-direction: column;
}

/* Report Navigation - Redesigned with side arrows */
.report-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px 35px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  background: rgba(255, 255, 255, 0.5);
  gap: 15px;
  flex-wrap: wrap;
}

/* Side arrow buttons - positioned on edges */
.report-nav-btn {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: none;
  background: var(--forest);
  color: var(--white);
  font-size: 1.5rem;
  font-weight: bold;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 15px rgba(26, 58, 47, 0.4);
  z-index: 100;
}

#report-prev {
  left: max(20px, calc(50% - 340px));
}

#report-next {
  right: max(20px, calc(50% - 340px));
}

.report-nav-btn:hover:not(:disabled) {
  background: var(--forest-light);
  transform: translateY(-50%) scale(1.1);
  box-shadow: 0 6px 20px rgba(26, 58, 47, 0.5);
}

.report-nav-btn:disabled {
  opacity: 0.3;
  cursor: not-allowed;
  background: #999;
}

/* Page dots - now section indicators */
.report-page-dots {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 100%;
}

.page-dot {
  width: 32px;
  height: 8px;
  border-radius: 4px;
  background: #ddd;
  transition: all 0.3s ease;
  cursor: pointer;
  position: relative;
}

.page-dot:hover {
  background: var(--forest-light);
  transform: scaleY(1.3);
}

/* Tooltip on hover */
.page-dot:hover::after {
  content: attr(title);
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: var(--forest);
  color: white;
  padding: 6px 12px;
  border-radius: 4px;
  font-size: 0.75rem;
  white-space: nowrap;
  margin-bottom: 8px;
  pointer-events: none;
  z-index: 10;
}

.page-dot.active {
  background: var(--forest);
  width: 48px;
}

/* Section labels for dots on larger screens */
@media (min-width: 768px) {
  .page-dot {
    width: 36px;
    height: 10px;
  }

  .page-dot.active {
    width: 56px;
  }
}

/* Report Content */
.report-content {
  flex: 1;
  padding: 50px;
  overflow-y: auto;
}

/* Ensure report container doesn't sit behind fixed nav arrows */
.report-container {
  padding-left: 70px;
  padding-right: 70px;
}

.report-page {
  display: none;
  animation: fadeSlide 0.4s ease;
  background: transparent !important;
}

.report-page.active {
  display: block;
  background: transparent !important;
}

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

/* Cover Page */
.report-cover {
  text-align: center;
  padding: 60px 20px;
  background: transparent;
}

/* Ensure all report sections are transparent */
.report-intro,
.report-score,
.report-category,
.report-recommendations,
.report-cta {
  background: transparent;
}

.report-cover .logo {
  height: 70px;
  margin-bottom: 50px;
}

.report-cover h1 {
  font-family: 'Playfair Display', serif;
  font-size: 2.5rem;
  font-weight: 500;
  color: var(--forest);
  margin-bottom: 20px;
  letter-spacing: -0.5px;
}

.report-cover .company-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.5rem;
  color: var(--gold);
  margin-bottom: 50px;
  font-style: italic;
}

.report-cover .date {
  color: #888;
  font-size: 0.9rem;
}

.report-cover .report-instruction {
  color: var(--gold);
  font-size: 0.95rem;
  margin-top: 50px;
  font-weight: 500;
}

/* Report Sections */
.report-intro h2,
.report-score h2,
.report-category h2,
.report-recommendations h2,
.report-cta h2 {
  font-family: 'Playfair Display', serif;
  font-size: 1.6rem;
  color: var(--forest);
  margin-bottom: 25px;
}

.report-intro p,
.report-recommendations p {
  color: #444;
  line-height: 1.8;
  margin-bottom: 18px;
}

.report-intro h3 {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  color: var(--forest);
  margin: 35px 0 18px;
}

/* Score Ring */
.score-ring-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 40px 0;
}

.score-ring {
  position: relative;
  width: 200px;
  height: 200px;
}

.score-ring-small {
  width: 130px;
  height: 130px;
}

.score-ring svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}

.score-ring-bg {
  fill: none;
  stroke: #e8e5e0;
  stroke-width: 10;
}

.score-ring-fill {
  fill: none;
  stroke-width: 10;
  stroke-linecap: round;
  transition: stroke-dashoffset 1.2s ease-out;
  filter: drop-shadow(0 2px 6px rgba(199, 174, 106, 0.4));
}

.score-ring-small .score-ring-bg,
.score-ring-small .score-ring-fill {
  stroke-width: 8;
}

.score-value {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.score-value .percentage {
  font-family: 'Playfair Display', serif;
  font-size: 3.5rem;
  font-weight: 600;
  color: var(--forest);
}

.score-ring-small .score-value .percentage {
  font-size: 2rem;
}

.score-value .tier-label {
  font-size: 0.8rem;
  color: #888;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin-top: 5px;
  font-weight: 600;
}

/* Tier Colors */
.tier-low .score-ring-fill { stroke: var(--grey-cool); }
.tier-medium .score-ring-fill { stroke: var(--gold); }
.tier-high .score-ring-fill { stroke: var(--gold-vibrant); }

/* Tier Badge */
.tier-badge {
  display: inline-block;
  padding: 8px 22px;
  border-radius: 25px;
  color: var(--white);
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin-bottom: 25px;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.15);
}

.tier-low .tier-badge { background: var(--grey-cool); }
.tier-medium .tier-badge { background: var(--gold); }
.tier-high .tier-badge { background: var(--gold-vibrant); }

.report-score, .report-category {
  text-align: center;
}

.tier-message, .category-feedback {
  color: #444;
  line-height: 1.8;
  text-align: left;
  margin-top: 35px;
}

/* Recommendations */
.recommendations-list {
  list-style: none;
  margin-top: 25px;
}

.recommendations-list li {
  padding: 16px 0 16px 35px;
  position: relative;
  color: #444;
  line-height: 1.7;
  border-bottom: 1px solid #eee;
}

.recommendations-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 22px;
  width: 18px;
  height: 18px;
  background: linear-gradient(145deg, var(--gold-light), var(--gold));
  border-radius: 50%;
}

/* CTA Page */
.report-cta {
  text-align: center;
  padding: 50px 30px;
}

.report-cta p {
  color: #666;
  margin-bottom: 35px;
  font-size: 1.05rem;
}

.cta-buttons {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 320px;
  margin: 0 auto 40px;
}

.share-links {
  margin-top: 40px;
  padding-top: 35px;
  border-top: 1px solid #eee;
}

.share-links p {
  font-size: 0.85rem;
  color: #888;
  margin-bottom: 18px;
}

.share-buttons {
  display: flex;
  justify-content: center;
  gap: 14px;
}

.share-btn {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 2px solid #ddd;
  background: transparent;
  color: #666;
  font-size: 1.1rem;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.share-btn:hover {
  border-color: var(--gold);
  color: var(--gold);
  background: rgba(199, 174, 106, 0.1);
}

/* Congrats Banner */
.congrats-banner {
  background: linear-gradient(145deg, var(--gold) 0%, var(--gold-dark) 100%);
  color: var(--white);
  padding: 28px;
  text-align: center;
  margin: -50px -50px 35px -50px;
  box-shadow: 0 4px 15px rgba(199, 174, 106, 0.3);
  page-break-inside: avoid;
}

.congrats-banner h3 {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-weight: 600;
  margin-bottom: 10px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}

.congrats-banner p {
  font-size: 0.9rem;
}

.congrats-banner a {
  color: var(--forest);
  font-weight: 600;
  text-decoration: underline;
}

/* ===== Responsive ===== */
@media (max-width: 768px) {
  .glass-card {
    padding: 40px 30px;
    border-radius: 24px;
  }

  .lead-form h2 {
    font-size: 1.75rem;
  }

  .question-text {
    font-size: 1.35rem;
  }

  .report-content {
    padding: 35px 25px;
  }

  .score-ring {
    width: 170px;
    height: 170px;
  }

  .score-value .percentage {
    font-size: 3rem;
  }

  .report-cover h1 {
    font-size: 2rem;
  }

  .congrats-banner {
    margin: -40px -30px 30px -30px;
  }

  .report-container {
    padding-left: 0;
    padding-right: 0;
  }

  /* Mobile nav arrows - smaller and closer to edges */
  .report-nav-btn {
    width: 44px;
    height: 44px;
    font-size: 1.25rem;
  }

  #report-prev {
    left: 10px;
  }

  #report-next {
    right: 10px;
  }

  .page-dot {
    width: 24px;
    height: 6px;
  }

  .page-dot.active {
    width: 36px;
  }
}

@media (max-width: 480px) {
  .assessment-container {
    padding: 25px 15px;
  }

  .glass-card {
    padding: 35px 22px;
  }

  .lead-form h2 {
    font-size: 1.5rem;
  }

  .question-text {
    font-size: 1.2rem;
  }

  .option-btn {
    padding: 16px 20px;
    font-size: 0.95rem;
  }

  .score-ring {
    width: 150px;
    height: 150px;
  }

  .score-value .percentage {
    font-size: 2.5rem;
  }

  .score-ring-small {
    width: 110px;
    height: 110px;
  }

  .congrats-banner {
    margin: -35px -22px 25px -22px;
    padding: 22px 15px;
  }
}

/* ===== Screen/PDF visibility toggles ===== */
.pdf-only {
  display: none !important;
}

/* ===== Animations ===== */
.fade-in {
  animation: fadeIn 0.4s ease;
}

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

/* ===== Print / PDF Export ===== */
@media print {
  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  .assessment-page {
    background: var(--white) !important;
  }

  .assessment-page::before {
    display: none !important;
  }

  .report-nav,
  .screen-only,
  .share-links {
    display: none !important;
  }

  .pdf-only {
    display: block !important;
  }

  .report-container {
    max-width: 100%;
  }

  .report-glass {
    background: var(--white) !important;
    box-shadow: none !important;
    border: none !important;
  }

  .report-content {
    padding: 30px !important;
  }

  .report-page {
    display: block !important;
    page-break-inside: avoid;
    page-break-after: always;
    background: var(--white) !important;
    padding: 20px 0 !important;
  }

  .report-page:last-child {
    page-break-after: auto;
  }

  .report-cover,
  .report-intro,
  .report-score,
  .report-category,
  .report-recommendations,
  .report-cta {
    background: var(--white) !important;
  }

  .congrats-banner {
    background: var(--forest) !important;
    color: var(--white) !important;
    -webkit-print-color-adjust: exact !important;
  }

  h1, h2, h3, .question-text, .report-cover h1 {
    color: var(--forest) !important;
  }

  p, li, .tier-message, .category-feedback {
    color: #333 !important;
  }

  .tier-badge {
    -webkit-print-color-adjust: exact !important;
  }

  .score-ring-bg {
    stroke: #ddd !important;
  }

  .score-value .percentage {
    color: var(--forest) !important;
  }
}

/* ============================================
   PDF EXPORT MODE
   Triggered by adding 'pdf-mode' class to body
   ============================================ */

/* Hide the dark overlay pseudo-element */
body.pdf-mode .assessment-page::before {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

/* Override the page background */
body.pdf-mode .assessment-page {
  background: #ffffff !important;
}

/* Override container */
body.pdf-mode .assessment-container {
  background: #ffffff !important;
}

/* Override report glass - solid white, no transparency */
body.pdf-mode .report-glass {
  background: #ffffff !important;
  box-shadow: none !important;
  border: none !important;
}

/* Override report content */
body.pdf-mode .report-content {
  background: #ffffff !important;
}

/* Show all report pages */
body.pdf-mode .report-page {
  display: block !important;
  background: #ffffff !important;
}

/* Hide navigation */
body.pdf-mode .report-nav {
  display: none !important;
}

/* Hide interactive/screen-only elements */
body.pdf-mode .screen-only,
body.pdf-mode .share-links {
  display: none !important;
}

/* Show PDF-only elements */
body.pdf-mode .pdf-only {
  display: block !important;
}

/* Force dark text on all headings */
body.pdf-mode h1,
body.pdf-mode h2,
body.pdf-mode h3 {
  color: #1a3a2f !important;
}

/* Force dark text on all body content */
body.pdf-mode p,
body.pdf-mode li {
  color: #333333 !important;
}

body.pdf-mode span {
  color: #333333 !important;
}

body.pdf-mode .tier-message,
body.pdf-mode .tier-message p,
body.pdf-mode .category-feedback,
body.pdf-mode .category-feedback p {
  color: #333333 !important;
}

body.pdf-mode .score-value .percentage {
  color: #1a3a2f !important;
}

body.pdf-mode .score-value .tier-label {
  color: #666666 !important;
}

/* Preserve congrats banner styling */
body.pdf-mode .congrats-banner {
  background: #1a3a2f !important;
}

body.pdf-mode .congrats-banner h3,
body.pdf-mode .congrats-banner p,
body.pdf-mode .congrats-banner a,
body.pdf-mode .congrats-banner span {
  color: #ffffff !important;
}

/* Preserve tier badge styling */
body.pdf-mode .tier-badge {
  color: #ffffff !important;
}

/* Company name on cover */
body.pdf-mode .company-name {
  color: #c7ae6a !important;
}

/* Date text */
body.pdf-mode .date {
  color: #666666 !important;
}

/* Recommendation list items */
body.pdf-mode .recommendations-list li {
  color: #333333 !important;
}

body.pdf-mode .recommendations-list li::before {
  background: #c7ae6a !important;
}