/* Print sheet for one product record. Screen rules style the print button only. */

#print-sheet {
  flex: 0 0 auto;
  min-height: 32px;
  margin: 0 12px;
  white-space: nowrap;
}

.print-footer {
  display: none;
}

@media (max-width: 700px) {
  #print-sheet {
    display: block;
    width: 100%;
    min-height: 44px;
    margin: 8px 0 0;
    white-space: normal;
  }
}

@page {
  margin: 12mm;
}

@media print {
  /* Screen ratings use a 200 px cap. The identity card uses a 670 px cap. Print shows the full blocks. */
  #front-door,
  .share-link,
  .masthead,
  .catalogue,
  #product-list,
  #new-products,
  #new-list,
  #public-standard,
  #internal-tools,
  .sheet-toolbar,
  .record-toolbar,
  #back-to-list,
  #loading,
  #view-tabs,
  #port-panel,
  #keyboard-dialog,
  #keyboard-help,
  .banner-toggle,
  .library-label,
  #library-select,
  #all-library,
  .sku-toggle,
  .sku-summary,
  #print-sheet,
  .sheet-footer,
  #boxes,
  #unpositioned,
  .art-heading,
  #aspect-note,
  .coverage-heading,
  #coverage,
  .filter-menu,
  .search-wrap,
  .list-controls,
  .offline,
  #sections > details:not([data-section="Ports"]) {
    display: none !important;
  }

  body,
  body[data-phone-screen="list"],
  body[data-phone-screen="detail"] {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
    background: #fff !important;
    color: #000 !important;
  }

  .workspace,
  main:not(#front-door),
  .hero,
  .art-card,
  .identity-card {
    display: block !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    float: none !important;
    box-shadow: none !important;
  }

  main {
    padding: 0 !important;
  }

  #art-stage {
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
  }

  #art-frame {
    position: static !important;
    width: auto !important;
    height: auto !important;
    max-height: 60mm !important;
  }

  #product-image {
    width: auto !important;
    height: auto !important;
    max-width: 80mm !important;
    max-height: 60mm !important;
    object-fit: contain !important;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  h1 {
    font-size: 18pt !important;
    margin: 0 0 4px !important;
    break-after: avoid;
    page-break-after: avoid;
  }

  .ratings-heading,
  .sku-heading,
  summary {
    break-after: avoid;
    page-break-after: avoid;
  }

  #ratings,
  #ratings[data-print-open="true"] {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    content-visibility: visible !important;
  }

  .rating {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .rating span,
  #skus span,
  .print-footer,
  .print-footer p {
    font-size: 9pt !important;
  }

  #skus,
  #skus.sku-collapsed,
  #skus.sku-open {
    display: flex !important;
    flex-wrap: wrap !important;
    max-height: none !important;
    overflow: visible !important;
    height: auto !important;
  }

  #skus span {
    height: auto !important;
    white-space: normal !important;
  }

  #sections > details[data-section="Ports"] {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
    break-inside: auto;
    page-break-inside: auto;
  }

  #sections > details[data-section="Ports"]::details-content {
    content-visibility: visible !important;
    display: block !important;
    height: auto !important;
  }

  .section-content {
    overflow: visible !important;
    max-width: none !important;
  }

  #sections > details[data-section="Ports"] button {
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    color: #000 !important;
    font-weight: 650;
  }

  .data-table {
    width: 100%;
    border-collapse: collapse;
    break-inside: auto;
    page-break-inside: auto;
  }

  .data-table thead {
    display: table-header-group;
  }

  .data-table tr {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .data-table th,
  .data-table td {
    border: 1px solid #203b51;
    padding: 2px 4px;
    font-size: 9pt;
  }

  .print-footer {
    display: block !important;
    margin-top: 12px;
    padding-top: 6px;
    border-top: 1px solid #203b51;
    color: #000 !important;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .print-footer a {
    color: #000 !important;
    text-decoration: none;
  }
}