/**
 * Print Styles
 * Loaded separately with media="print" to avoid blocking screen rendering.
 * These styles only apply when printing documents.
 */

/* Hide interactive UI elements - be specific to avoid hiding content */
button,
.btn,
.btn-primary,
.btn-secondary,
.btn-outline,
nav,
header:not(.print-header),
.tiptap-editor-container,
.bubble-menu,
.MenuBar,
#download-dropdown,
[role="navigation"],
.no-print {
  display: none !important;
}

/* Hide specific UI containers - NOT all flex containers */
.print\:hidden,
[data-print-hide="true"] {
  display: none !important;
}

/* Respect hidden answer keys in assessments/worksheets */
.answer-key-wrapper[style*="display: none"],
.answer-key-wrapper[style*="display:none"] {
  display: none !important;
}

/* Show elements that should only appear in print */
.print-only {
  display: block !important;
}

/* Ensure the print-only view takes full width */
.print-block {
  display: block !important;
}

.hidden.print-block {
  display: block !important;
}

/* Adjust page for print - smaller margins for more content */
@page {
  margin: 1.5cm;
  size: letter;
}

/* Body print styles */
body {
  background: white !important;
  color: black !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12pt;
  line-height: 1.5;
}

/* Clean up decorative elements but preserve borders for structure */
.shadow-md,
.shadow-lg,
.shadow-xl {
  box-shadow: none !important;
}

.rounded-lg,
.rounded-xl,
.rounded-2xl {
  border-radius: 0 !important;
}

/* Clean background for print */
.bg-white,
.bg-gray-100,
.bg-gray-50,
.bg-gray-800,
.dark\:bg-gray-800,
.dark\:bg-gray-900 {
  background-color: white !important;
}

/* Ensure good contrast for text */
p, li, span, div, h1, h2, h3, h4, h5, h6 {
  color: black !important;
  text-shadow: none !important;
}

/* Links should be visible with underline, but no URL suffix */
a, a[href] {
  color: black !important;
  text-decoration: underline !important;
}

a[href]:after {
  content: none !important;
}

/* Table styling for print */
table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.5em 0;
  page-break-inside: auto;
}

th, td {
  border: 1px solid #333;
  padding: 6px 8px;
  text-align: left;
  vertical-align: top;
  font-size: 10pt;
  page-break-inside: avoid;
}

th {
  background-color: #f0f0f0 !important;
  font-weight: bold;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

tr {
  page-break-inside: avoid;
  break-inside: avoid;
}

/* Page break controls for better document flow */
h1, h2, h3 {
  page-break-after: avoid;
  break-after: avoid;
}

.activity-box, .content-section {
  page-break-inside: avoid;
  break-inside: avoid;
}

/* Ensure content sections stay together */
section, article, .card, .glass-card {
  page-break-inside: avoid;
  break-inside: avoid;
}

/* Full width for print content */
.prose, .quill-content {
  max-width: none !important;
  width: 100% !important;
}

/* Fix list formatting in print - ensure inline display */
ul, ol {
  display: block !important;
  list-style-position: outside !important;
  padding-left: 2em !important;
  margin-left: 0 !important;
}

ul {
  list-style-type: disc !important;
}

ol {
  list-style-type: decimal !important;
}

li {
  display: list-item !important;
  margin-bottom: 0.5em !important;
}

/* Ensure list markers and content stay on same line */
.prose li, .quill-content li {
  display: list-item !important;
  page-break-inside: avoid;
  break-inside: avoid;
}

.prose ul, .prose ol,
.quill-content ul, .quill-content ol {
  display: block !important;
  list-style-position: outside !important;
}

/* Student Notes Print Styles */
.vocabulary-box {
  /* Use strong borders instead of background colors */
  border: 2px solid #000 !important;
  border-left: 6px solid #000 !important;
  padding: 12pt 16pt !important;
  margin: 12pt 0 !important;
  page-break-inside: avoid !important;
  break-inside: avoid !important;
  /* Try background colors but don't rely on them */
  background-color: #f8f9fa !important;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

.vocabulary-box::before {
  content: "📝 VOCABULARY:" !important;
  display: block !important;
  font-weight: bold !important;
  font-size: 12pt !important;
  text-transform: uppercase !important;
  margin-bottom: 8pt !important;
  color: #000 !important;
  border-bottom: 1px solid #000 !important;
  padding-bottom: 4pt !important;
}

.key-point {
  /* Use strong borders and patterns */
  border: 2px solid #000 !important;
  border-left: 6px solid #000 !important;
  padding: 8pt 12pt !important;
  margin: 8pt 0 !important;
  page-break-inside: avoid !important;
  break-inside: avoid !important;
  /* Try background but don't rely on it */
  background-color: #fffacd !important;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
  /* Add a pattern with text */
  position: relative !important;
}

.key-point::before {
  content: "⭐ KEY POINT:" !important;
  display: block !important;
  font-weight: bold !important;
  font-size: 11pt !important;
  text-transform: uppercase !important;
  margin-bottom: 6pt !important;
  color: #000 !important;
  text-decoration: underline !important;
}

/* Make text bold and more readable */
.vocabulary-box p,
.vocabulary-box div {
  color: #000 !important;
  font-weight: 500 !important;
}

.key-point p,
.key-point div {
  color: #000 !important;
  font-weight: 500 !important;
}

/* Ensure good contrast for all student notes content */
.student-notes {
  color: #000 !important;
}

.student-notes h1,
.student-notes h2,
.student-notes h3 {
  color: #000 !important;
  border-bottom: 2px solid #000 !important;
  padding-bottom: 4pt !important;
}

/* Make sure page breaks work well */
.student-notes h1 {
  page-break-before: always !important;
  margin-top: 0 !important;
}

.student-notes h2 {
  page-break-after: avoid !important;
  margin-top: 16pt !important;
}
