/* ==========================================================================
   Print Stylesheet
   Beautiful print/PDF layout with book-like typography
   ========================================================================== */

@media print {
  /* ==========================================================================
     Base Reset & Page Setup
     ========================================================================== */

  *,
  *::before,
  *::after {
    box-shadow: none !important;
    text-shadow: none !important;
  }

  @page {
    size: letter;
    margin: 1in 1.25in;
  }

  @page :first {
    margin-top: 1.5in;
  }

  /* ==========================================================================
     Typography - Book-like Serif Font
     ========================================================================== */

  html {
    font-size: 12pt;
  }

  body {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 12pt;
    line-height: 1.5;
    color: #000;
    background: #fff;
    max-width: none;
    margin: 0;
    padding: 0;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* ==========================================================================
     Hide UI Chrome & Navigation
     ========================================================================== */

  /* Navigation and header */
  .site-header,
  .site-nav,
  .site-title,
  nav {
    display: none !important;
  }

  /* Footer */
  .site-footer {
    display: none !important;
  }

  /* Reading progress bar */
  .reading-progress-bar {
    display: none !important;
  }

  /* Command palette and related UI */
  .command-palette-backdrop,
  .command-palette,
  #command-palette-styles {
    display: none !important;
  }

  /* Margin column (used for sidenotes layout) */
  .margin-column {
    display: none !important;
  }

  /* Sidenote toggle checkboxes */
  .sidenote-toggle {
    display: none !important;
  }

  /* Annotation UI elements */
  .annotation-tooltip,
  .annotation-remove-tooltip,
  .annotation-note-input,
  .annotation-note-view {
    display: none !important;
  }

  /* Reading time badge */
  .post-reading-time {
    display: none !important;
  }

  /* ==========================================================================
     Main Content Layout
     ========================================================================== */

  .main-content {
    max-width: none;
    margin: 0;
    padding: 0;
  }

  .post {
    max-width: none;
  }

  .post-body {
    display: block;
    grid-template-columns: none;
  }

  .post-content {
    max-width: none;
  }

  /* ==========================================================================
     Post Header
     ========================================================================== */

  .post-header {
    margin-bottom: 2em;
    padding-bottom: 1em;
    border-bottom: 1pt solid #ccc;
  }

  .post-title {
    font-size: 24pt;
    font-weight: bold;
    line-height: 1.2;
    margin: 0 0 0.5em 0;
  }

  .post-date {
    font-size: 11pt;
    font-style: italic;
    color: #444;
  }

  /* ==========================================================================
     Typography - Headings
     ========================================================================== */

  h1, h2, h3, h4, h5, h6 {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-weight: bold;
    line-height: 1.3;
    color: #000;
    page-break-after: avoid;
    page-break-inside: avoid;
    break-after: avoid;
    break-inside: avoid;
  }

  /* Keep headings with following content */
  h1, h2, h3, h4, h5, h6 {
    orphans: 3;
    widows: 3;
  }

  h1 {
    font-size: 24pt;
    margin-top: 0;
    margin-bottom: 0.75em;
  }

  h2 {
    font-size: 18pt;
    margin-top: 1.5em;
    margin-bottom: 0.5em;
    padding-top: 0.5em;
    border-top: 0.5pt solid #ddd;
  }

  h3 {
    font-size: 14pt;
    margin-top: 1.25em;
    margin-bottom: 0.5em;
  }

  h4 {
    font-size: 12pt;
    margin-top: 1em;
    margin-bottom: 0.5em;
  }

  h5 {
    font-size: 11pt;
    margin-top: 1em;
    margin-bottom: 0.5em;
  }

  h6 {
    font-size: 10pt;
    margin-top: 1em;
    margin-bottom: 0.5em;
    text-transform: uppercase;
    letter-spacing: 0.05em;
  }

  /* ==========================================================================
     Typography - Body Text
     ========================================================================== */

  p {
    margin: 0 0 1em 0;
    max-width: none;
    orphans: 3;
    widows: 3;
    text-align: justify;
    hyphens: auto;
  }

  /* ==========================================================================
     Links
     ========================================================================== */

  a {
    color: #000;
    text-decoration: underline;
  }

  /* Show URL after links in parentheses */
  a[href^="http"]::after,
  a[href^="https"]::after {
    content: " (" attr(href) ")";
    font-size: 0.85em;
    color: #555;
    word-break: break-all;
  }

  /* Don't show URL for internal links or anchors */
  a[href^="#"]::after,
  a[href^="/"]::after {
    content: none;
  }

  /* Don't show URL if link text is the URL itself */
  a[href]:not([href^="#"]):not([href^="/"]):empty::after {
    content: none;
  }

  /* ==========================================================================
     Lists
     ========================================================================== */

  ul, ol {
    margin: 0 0 1em 0;
    padding-left: 1.5em;
    max-width: none;
  }

  li {
    margin-bottom: 0.25em;
  }

  /* ==========================================================================
     Blockquotes
     ========================================================================== */

  blockquote {
    margin: 1.5em 0;
    padding: 0.5em 1em;
    border-left: 3pt solid #999;
    font-style: italic;
    color: #333;
    background: none;
    max-width: none;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  blockquote p:last-child {
    margin-bottom: 0;
  }

  blockquote cite {
    display: block;
    margin-top: 0.5em;
    font-size: 0.9em;
    font-style: normal;
    color: #555;
  }

  /* ==========================================================================
     Code Blocks - Print Optimized
     ========================================================================== */

  code,
  kbd,
  samp {
    font-family: "Courier New", Courier, monospace;
    font-size: 0.9em;
  }

  /* Inline code */
  :not(pre) > code {
    padding: 0.1em 0.3em;
    background-color: #f5f5f5;
    border: 0.5pt solid #ddd;
    border-radius: 2pt;
  }

  /* Code blocks */
  pre {
    margin: 1em 0;
    padding: 1em;
    background-color: #f8f8f8;
    border: 0.5pt solid #ddd;
    font-size: 9pt;
    line-height: 1.4;
    max-width: none;
    overflow: visible;
    white-space: pre-wrap;
    word-wrap: break-word;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  pre code {
    padding: 0;
    background: none;
    border: none;
    font-size: inherit;
  }

  /* ==========================================================================
     Tables
     ========================================================================== */

  table {
    width: 100%;
    margin: 1em 0;
    border-collapse: collapse;
    font-size: 10pt;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  th, td {
    padding: 0.5em;
    text-align: left;
    border: 0.5pt solid #999;
  }

  th {
    font-weight: bold;
    background-color: #f0f0f0;
  }

  /* ==========================================================================
     Images & Figures
     ========================================================================== */

  img {
    max-width: 100% !important;
    height: auto !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  figure {
    margin: 1.5em 0;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  figcaption {
    margin-top: 0.5em;
    font-size: 0.9em;
    font-style: italic;
    color: #555;
    text-align: center;
  }

  /* ==========================================================================
     Horizontal Rules
     ========================================================================== */

  hr {
    margin: 2em 0;
    border: 0;
    border-top: 0.5pt solid #ccc;
  }

  /* ==========================================================================
     Sidenotes - Convert to Numbered Footnotes
     On print, sidenotes appear inline as bracketed footnotes
     ========================================================================== */

  /* The clickable sidenote number in text */
  label.sidenote-number {
    display: inline;
    font-size: 0.75em;
    vertical-align: super;
    line-height: 0;
    color: #000;
    font-weight: bold;
    cursor: default;
  }

  label.sidenote-number::before {
    content: "[";
  }

  label.sidenote-number::after {
    content: "]";
  }

  /* The sidenote content - displayed as inline footnote */
  .sidenote {
    display: block;
    float: none;
    width: auto;
    margin: 0.75em 0 0.75em 2em;
    padding: 0.5em 0.75em;
    font-size: 0.9em;
    line-height: 1.4;
    color: #333;
    background-color: #f9f9f9;
    border-left: 2pt solid #999;
    position: static;
    clear: both;
  }

  /* Sidenote number inside the aside */
  .sidenote > .sidenote-number {
    display: inline;
    font-size: 0.85em;
    font-weight: bold;
    color: #000;
    margin-right: 0.5em;
  }

  .sidenote > .sidenote-number::before {
    content: "[";
  }

  .sidenote > .sidenote-number::after {
    content: "] ";
  }

  /* ==========================================================================
     Annotations - Highlights and Notes
     Visible inline with distinct styling
     ========================================================================== */

  /* Highlighted text - subtle underline instead of background */
  .annotation-highlight {
    background-color: transparent !important;
    text-decoration: underline;
    text-decoration-style: dotted;
    text-decoration-color: #666;
    cursor: default;
  }

  /* Remove the note indicator dot */
  .annotation-highlight.has-note::after {
    display: none !important;
  }

  /* For highlights with notes, add a visual marker */
  .annotation-highlight.has-note {
    text-decoration: underline;
    text-decoration-style: double;
    text-decoration-color: #333;
  }

  /*
   * Note: Annotation notes are stored in localStorage and rendered dynamically
   * by JavaScript. For print, we rely on the CSS to style any visible notes.
   * The actual note content would need JS intervention to render in print.
   * The styling here provides visual distinction for highlighted passages.
   */

  /* ==========================================================================
     Page Break Control
     ========================================================================== */

  /* Avoid breaks inside important elements */
  blockquote,
  pre,
  table,
  figure,
  .sidenote {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Avoid orphaned headings - keep with following content */
  h1, h2, h3, h4, h5, h6 {
    page-break-after: avoid;
    break-after: avoid;
  }

  /* Allow breaks after paragraphs but avoid widows/orphans */
  p {
    orphans: 3;
    widows: 3;
  }

  /* Article should avoid starting at bottom of page */
  article {
    page-break-before: auto;
  }

  /* ==========================================================================
     Utility Classes for Print Control
     ========================================================================== */

  /* Force a page break before an element */
  .print-page-break-before {
    page-break-before: always;
    break-before: always;
  }

  /* Force a page break after an element */
  .print-page-break-after {
    page-break-after: always;
    break-after: always;
  }

  /* Hide elements in print */
  .print-hidden,
  .no-print {
    display: none !important;
  }

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

/* Hide print-only elements on screen */
@media screen {
  .print-only {
    display: none !important;
  }
}
