/* ==========================================================================
   Veranda — print
   --------------------------------------------------------------------------
   Aimed squarely at the menu: a member of staff should be able to hit print
   and get a clean, black-on-white list they can put on a clipboard.
   ========================================================================== */

@media print {
  @page {
    margin: 14mm 12mm;
  }

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

  /* Anything that is navigation, decoration or interaction goes away. */
  .site-header,
  .drawer,
  .menu-rail,
  .gallery-filters,
  .to-top,
  .lightbox,
  .grain,
  .hero__lights,
  .hero__scroll,
  .dev-notice,
  .menu-category__mascot,
  .site-footer .footer-list,
  .btn,
  .btn-row,
  .skip-link {
    display: none !important;
  }

  .menu-masthead {
    margin: 0 !important;
    padding: 0 0 6mm !important;
    background: none !important;
    color: #000 !important;
    border-bottom: 1.5pt solid #000;
  }
  .menu-masthead::before,
  .menu-masthead::after { display: none !important; }
  .menu-masthead__lede { color: #333 !important; }

  .container { max-width: none; padding: 0; }

  .menu-body { padding: 6mm 0 0 !important; }

  /* Two columns on paper, because a kafeneio menu is a list not an essay. */
  .menu-list {
    display: block;
    columns: 2;
    column-gap: 10mm;
  }

  .menu-category {
    break-inside: avoid-page;
    page-break-inside: avoid;
  }
  .menu-category + .menu-category { margin-top: 8mm !important; }

  .menu-category__head {
    display: block;
    border-bottom: 1pt solid #000 !important;
    margin-bottom: 3mm !important;
    padding-bottom: 1.5mm !important;
  }
  .menu-category__title { font-size: 14pt; color: #000 !important; }
  .menu-category__index { color: #555 !important; }
  .menu-category__note { text-align: left; font-size: 9.5pt; color: #444 !important; }

  .menu-item {
    break-inside: avoid;
    page-break-inside: avoid;
    padding: 1.4mm 0;
    border-bottom: 0.4pt dotted #999 !important;
  }
  .menu-item__name { font-size: 10.5pt; color: #000 !important; }
  .menu-item__desc { font-size: 9pt; color: #444 !important; }
  .menu-item__price { color: #000 !important; }
  .menu-item__price--placeholder { border: 0.5pt dashed #666 !important; color: #333 !important; }
  .menu-item__allergens { color: #555 !important; font-size: 8.5pt; }

  .badge {
    border: 0.4pt solid #000 !important;
    background: none !important;
    color: #000 !important;
    padding: 0 1mm;
  }

  .menu-foot {
    border-top: 1pt solid #000 !important;
    margin-top: 8mm !important;
    padding-top: 3mm !important;
  }
  .menu-foot__text { color: #333 !important; font-size: 9pt; }

  .site-footer {
    background: none !important;
    border-top: 0.5pt solid #999 !important;
    color: #333 !important;
    padding: 4mm 0 0 !important;
  }
  .site-footer::before { display: none !important; }
  .footer-grid { display: block; }
  .footer-brand__mark { display: none; }

  /* Print the destination of a link so a paper menu still carries the details. */
  a[href^='tel:']::after { content: ' (' attr(href) ')'; font-size: 8.5pt; }
  a[href^='tel:']::after { content: ' ' attr(href); }

  img { max-width: 100% !important; }

  /* Reveal animations must never leave printed content invisible. */
  [data-reveal],
  .gallery-item {
    opacity: 1 !important;
    transform: none !important;
  }
}
