/* ==========================================================================
   Print Stylesheet for michaelharper.net
   Purpose: Clean, professional resume output

   WHAT'S HIDDEN IN PRINT:
   - Sidebar navigation (#sideNav) - contains duplicate "Michael Harper" and avatar
   - Social icons (.social-icons) - not useful in print
   - CTA buttons (.cta-buttons) - interactive elements not needed
   - Proof bullets (.proof-bullets) - redundant with experience content
   - Dev icons (.dev-icons) - decorative only
   - Skills section (#skills) - space optimization
   - Interests section (#interests) - space optimization
   - Education section (#education) - space optimization
   - Horizontal rules (hr) - cleaner layout
   - Duplicate date elements (.flex-shrink-0) - using .print-date instead
   ========================================================================== */

/* Hide print-only elements on screen */
.print-date {
  display: none;
}

/* ==========================================================================
   Print Media Styles
   ========================================================================== */
@media print {

  /* --------------------------------------------------------------------------
     1. HIDE ELEMENTS - Remove non-essential content for print
     -------------------------------------------------------------------------- */

  /* Hide sidebar/navigation (contains duplicate grey "Michael Harper" and avatar) */
  #sideNav,
  nav.navbar {
    display: none !important;
  }

  /* Hide decorative/interactive elements */
  .social-icons,
  .cta-buttons,
  .proof-bullets {
    display: none !important;
  }

  /* Hide decorative icon sections */
  .dev-icons,
  .list-inline.dev-icons,
  ul.dev-icons {
    display: none !important;
  }

  /* Hide sections to save space - Skills, Interests, Education */
  #skills,
  #interests,
  #education {
    display: none !important;
  }

  /* Hide horizontal rules for cleaner look */
  hr,
  hr.m-0 {
    display: none !important;
  }

  /* Hide the duplicate date at end of job entries (using .print-date instead) */
  #experience .flex-shrink-0,
  .experience-item > .flex-shrink-0,
  .d-flex > .flex-shrink-0 {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    position: absolute !important;
    left: -9999px !important;
  }

  /* --------------------------------------------------------------------------
     2. PAGE SETUP - Margins and basic typography
     -------------------------------------------------------------------------- */

  @page {
    margin: 0.4in 0.5in;
    size: letter;
  }

  body {
    padding: 0 !important;
    margin: 0 !important;
    font-size: 10.5pt !important;
    line-height: 1.4 !important;
    color: #000 !important;
    background: #fff !important;
  }

  /* Remove container padding */
  .container-fluid {
    padding: 0 !important;
    margin: 0 !important;
  }

  /* --------------------------------------------------------------------------
     3. SECTION LAYOUT - Tighten spacing
     -------------------------------------------------------------------------- */

  section.resume-section {
    padding: 0 !important;
    margin: 0 0 0.5rem 0 !important;
    min-height: auto !important;
    display: block !important;
    align-items: initial !important;
    page-break-inside: auto;
  }

  .resume-section-content {
    padding: 0 !important;
    margin: 0 !important;
  }

  /* --------------------------------------------------------------------------
     4. HEADER/NAME - Main title styling
     -------------------------------------------------------------------------- */

  h1#print-name,
  h1.mb-0 {
    font-size: 26pt !important;
    margin: 0 0 0.15rem 0 !important;
    line-height: 1.1 !important;
  }

  /* Both name parts same size, Harper gets accent color */
  #first-name {
    font-size: 26pt !important;
    color: #000 !important;
  }

  #last-name {
    font-size: 26pt !important;
    color: #bd5d38 !important;
  }

  /* Contact info subheading */
  .subheading.mb-5 {
    font-size: 10pt !important;
    margin-bottom: 0.3rem !important;
    color: #333 !important;
  }

  /* Tagline */
  p.lead {
    font-size: 11pt !important;
    font-weight: 600 !important;
    margin-bottom: 0.4rem !important;
    color: #333 !important;
  }

  /* --------------------------------------------------------------------------
     5. SECTION HEADINGS
     -------------------------------------------------------------------------- */

  h2.mb-5 {
    font-size: 14pt !important;
    color: #bd5d38 !important;
    margin: 0.6rem 0 0.4rem 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid #bd5d38;
    padding-bottom: 0.1rem !important;
  }

  /* --------------------------------------------------------------------------
     6. EXPERIENCE ENTRIES
     -------------------------------------------------------------------------- */

  /* Job entry container - avoid page breaks within */
  .experience-item,
  .d-flex.flex-column.flex-md-row.justify-content-between.mb-5 {
    margin-bottom: 0.6rem !important;
    padding-bottom: 0 !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Job titles */
  #experience h3.mb-0,
  h3.mb-0 {
    font-size: 11pt !important;
    font-weight: 700 !important;
    margin: 0 !important;
    line-height: 1.3 !important;
    color: #000 !important;
    display: inline !important;
  }

  /* Add separator after job title */
  #experience h3.mb-0::after {
    content: " | ";
    color: #666;
    font-weight: normal;
  }

  /* Company names - inline after title */
  #experience .subheading.mb-2,
  .subheading.mb-3,
  .subheading.mb-2 {
    font-size: 11pt !important;
    display: inline !important;
    text-transform: none !important;
    font-weight: 400 !important;
    color: #333 !important;
    margin: 0 !important;
  }

  /* Show print-date (dates below title/company line) */
  .print-date {
    display: block !important;
    margin: 0.15rem 0 0.25rem 0 !important;
  }

  .print-date .text-primary,
  .print-date span {
    color: #bd5d38 !important;
    font-size: 9.5pt !important;
    font-weight: 600 !important;
  }

  /* Experience summary paragraph */
  .experience-summary {
    font-size: 10pt !important;
    font-style: italic !important;
    color: #333 !important;
    margin-bottom: 0.25rem !important;
    line-height: 1.35 !important;
  }

  /* Experience bullet points */
  .experience-bullets {
    margin: 0 0 0.25rem 0 !important;
    padding-left: 1.1rem !important;
  }

  .experience-bullets li {
    font-size: 9.5pt !important;
    line-height: 1.35 !important;
    margin-bottom: 0.15rem !important;
    color: #000 !important;
  }

  .experience-bullets li:last-child {
    margin-bottom: 0 !important;
  }

  /* --------------------------------------------------------------------------
     7. TYPOGRAPHY - General text styles
     -------------------------------------------------------------------------- */

  p {
    font-size: 10pt !important;
    line-height: 1.4 !important;
    margin-bottom: 0.3rem !important;
    orphans: 3;
    widows: 3;
  }

  /* Links should be black in print */
  a {
    color: #000 !important;
    text-decoration: none !important;
  }

  /* --------------------------------------------------------------------------
     8. PAGE BREAK CONTROLS
     -------------------------------------------------------------------------- */

  /* Prevent headings from being orphaned at page bottom */
  h2, h3 {
    page-break-after: avoid;
    break-after: avoid;
  }

  /* Keep experience items together */
  .experience-item {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Allow natural flow - don't force breaks */
  .print-page-break {
    page-break-before: auto !important;
    break-before: auto !important;
  }

  /* --------------------------------------------------------------------------
     9. UTILITY CLASS OVERRIDES
     -------------------------------------------------------------------------- */

  .mb-5 {
    margin-bottom: 0.4rem !important;
  }

  .mb-4 {
    margin-bottom: 0.35rem !important;
  }

  .mb-3 {
    margin-bottom: 0.25rem !important;
  }

  .mb-2 {
    margin-bottom: 0.15rem !important;
  }

  .mb-0 {
    margin-bottom: 0 !important;
  }

  .pt-5, .py-5, .pb-5 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Flex grow for content area */
  .flex-grow-1 {
    padding-right: 0 !important;
  }
}
