/* ============================================================
   resume-print.css — printed resume.

   Implements Figma node 11936:34878 ("ShashankKesarwani") from
   On-Going-Designs. The frame is 596 x 842 at 1px = 1pt, i.e. exactly
   A4, with 32pt side margins giving a 532pt content column — so the
   design's values transcribe directly into points with no rescaling.

   Screen view is untouched; everything here is inside @media print.

   Note on the rules under each heading: the Figma file draws them as a
   0.5px vector (imgVector1) repeated six times. A border-bottom is the
   correct CSS primitive for a straight hairline and reproduces the same
   532pt x 0.5px geometry, so the divider is drawn rather than embedded
   as an SVG. No glyph or icon assets appear in this design.

   @page needs !important: the page's own inline print block sets
   @page{margin:14mm}, which otherwise wins.
   ============================================================ */
@media print{
  @page{ size:A4; margin:32pt !important; }

  html,body{
    font-family:'Inter',system-ui,sans-serif !important;
    font-size:8.4pt !important;
    line-height:normal !important;
    color:#000 !important;
    background:#fff !important;
  }

  /* ---- masthead ------------------------------------------------ */
  .doc header{ text-align:center !important; margin:0 0 15pt !important; }

  .doc__name{                       /* 16pt semibold, uppercase */
    font-size:16pt !important; font-weight:600 !important;
    text-transform:uppercase !important; letter-spacing:0 !important;
    line-height:normal !important; margin:0 0 7pt !important; color:#000 !important;
  }
  .doc__role{                       /* 11pt medium */
    font-size:11pt !important; font-weight:500 !important;
    line-height:normal !important; margin:0 0 10pt !important; color:#000 !important;
  }
  .doc__contact{                    /* 11pt medium, 24pt gaps, no separators */
    display:flex !important; justify-content:center !important; align-items:center !important;
    gap:24pt !important; flex-wrap:nowrap !important;
    font-size:11pt !important; font-weight:500 !important;
    line-height:normal !important; margin:0 !important; color:#000 !important;
  }
  .doc__contact .sep{ display:none !important; }   /* design uses gaps, not dots */
  .doc__contact a{ color:#2559b3 !important; text-decoration:underline !important; }
  .doc__contact a[href^="tel"], .doc__contact a[href^="mailto"]{
    color:#000 !important; text-decoration:none !important;
  }
  .doc header + hr{ display:none !important; }

  /* ---- section headings: 10pt uppercase + hairline rule -------- */
  .doc__h{
    font-size:10pt !important; font-weight:600 !important;
    text-transform:uppercase !important; letter-spacing:0 !important;
    line-height:normal !important; color:#000 !important;
    margin:0 0 4pt !important; padding-bottom:4pt !important;
    border-bottom:0.5pt solid #000 !important;
  }
  section{ margin:0 0 14pt !important; }

  /* ---- roles: blue title left, company and dates right ---------- */
  .doc__job{
    display:grid !important; grid-template-columns:1fr auto !important;
    align-items:baseline !important; column-gap:12pt !important;
    margin:0 0 10pt !important;
  }
  .doc__job-title{
    grid-column:1 !important; margin:0 !important;
    font-size:10pt !important; font-weight:600 !important;
    color:#2559b3 !important; line-height:normal !important;
  }
  .doc__job-meta{
    grid-column:2 !important; margin:0 !important; text-align:right !important;
    white-space:nowrap !important; font-size:10pt !important; font-weight:600 !important;
    color:#000 !important; line-height:normal !important;
  }
  .doc__job ul{ grid-column:1 / -1 !important; margin:4pt 0 0 !important; }

  /* ---- body copy ------------------------------------------------ */
  p{ font-size:8.4pt !important; line-height:normal !important; margin:0 !important;
     text-align:left !important; hyphens:none !important; max-width:none !important; }
  li{ font-size:8.4pt !important; line-height:normal !important; margin:0 !important;
      text-align:left !important; hyphens:none !important; max-width:none !important; }
  ul,ol{ margin:0 !important; padding-left:13.5pt !important; list-style:disc !important; }
  /* the left-align rule above must not reach the centred masthead */
  .doc header p, .doc header div{ text-align:center !important; }

  /* ---- Recognitions: two entries side by side ------------------- */
  .doc__two{
    display:flex !important; gap:105pt !important; align-items:center !important;
    font-size:8.4pt !important; line-height:normal !important;
  }
  .doc__two > div{ display:block !important; }
  .doc__entry-sub, .doc__entry-main{
    font-size:8.4pt !important; font-weight:400 !important;
    line-height:normal !important; margin:0 !important;
    /* these are flex items, so display:inline would be blockified and
       flex-shrink would squeeze them into a one-character column */
    flex:0 0 auto !important; white-space:nowrap !important;
  }
  /* the design reads "Best Performer of the Month - SpeakX | May 2025",
     i.e. award first; the markup has the sub line first, so flip it */
  /* An entry pair (award + company) must never wrap internally... */
  .doc__two > div{
    display:flex !important; flex-wrap:nowrap !important; gap:0 !important;
  }
  /* ...but the Education section must wrap, because its heading takes a
     full-width flex line. With nowrap the heading pushed both entry
     lines off the right edge of the page entirely. */
  .doc section:has(> .doc__entry-main):not(:has(.doc__job)){
    display:flex !important; flex-wrap:wrap !important; gap:0 !important;
  }
  .doc section:has(> .doc__entry-main) > .doc__h{ flex:0 0 100% !important; }
  .doc__entry-main{ order:1 !important; }
  .doc__entry-sub { order:2 !important; }
  /* flex strips plain whitespace between items, so the separator
     carries its own non-breaking spaces */
  .doc__entry-sub::before{ content:"\00a0-\00a0" !important; }

  /* ---- pagination ----------------------------------------------- */
  .doc__h, .doc__job-title{ break-after:avoid; page-break-after:avoid; }
  li, p, .doc__job{ break-inside:avoid; page-break-inside:avoid; }

  /* ---- colour to ink -------------------------------------------- */
  *{ background:transparent !important; box-shadow:none !important; }
  .doc hr{ display:none !important; }
}