/* =====================================================
   OrthoMed — PRINT STYLESHEET
   Loaded with media="print", so browsers only fetch it
   when the page is actually being printed.

   Goal: the printed sheet should read like a document, not
   like a screenshot of a website. Interface furniture goes,
   content stays — and crucially the product photography
   stays, in colour.
===================================================== */

@page {
  size: A4;
  margin: 14mm 12mm 16mm;
}

/* -----------------------------------------------------
   BASE
----------------------------------------------------- */
/* The theme sizes everything in rem off a 16px root, which is far too large
   on paper. Moving the root is one lever that scales the whole page. */
html {
  font-size: 10.5pt;
}
body {
  background: #fff !important;
  color: #111 !important;
  line-height: 1.5;
}

/* Print in ink, not in brand colour. Once the coloured backgrounds are gone,
   the theme's muted blue-greys (#546e7a and friends) come out faint, so every
   run of text is forced dark. None of the panels kept in colour contain HTML
   text, so nothing is darkened onto a dark background. */
body, div, p, li, span, td, th, dt, dd, small, label, figcaption,
strong, em, b, i, a, blockquote,
h1, h2, h3, h4, h5, h6 {
  color: #111 !important;
}

/* The theme fixes the header and offsets <main> with an inline
   padding-top, which would leave a blank band on every print. */
#site-header {
  position: static !important;
  backdrop-filter: none !important;
}
main,
#main-content {
  padding-top: 0 !important;
  min-height: 0 !important;
}

.container {
  max-width: none !important;
  padding: 0 !important;
}
.section-pad {
  padding: 14pt 0 !important;
}

/* -----------------------------------------------------
   IMAGES — the part that usually goes wrong
   -----------------------------------------------------
   The product artwork is light line-work on a dark navy
   panel. Browsers drop background colours when printing, so
   without an explicit colour-adjust the panel disappears and
   the artwork prints white-on-white, i.e. blank. These are
   the few places where the ink is worth spending.
----------------------------------------------------- */
.product-main-img,
.product-card-img,
.product-thumb,
.product-category-badge,
.feature-icon {
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

img,
svg {
  max-width: 100% !important;
  height: auto !important;
  /* Never split an image across two sheets. */
  break-inside: avoid;
  page-break-inside: avoid;
}

figure,
.product-main-img,
.product-card-img {
  break-inside: avoid;
  page-break-inside: avoid;
}

.product-main-img {
  height: auto !important;
  min-height: 0 !important;
  padding: 10mm !important;
  max-width: 105mm;
}
.product-main-img img {
  max-height: 80mm !important;
}

/* Alternate views are useful on paper; keep them small. */
.product-thumbs {
  gap: 4mm !important;
  margin-top: 4mm !important;
}
.product-thumb {
  width: 18mm !important;
  height: 18mm !important;
}

/* -----------------------------------------------------
   HEADER — reduced to a plain masthead
----------------------------------------------------- */
#site-header {
  background: #fff !important;
  border-bottom: 1pt solid #111 !important;
  margin-bottom: 8mm;
}
.header-inner {
  height: auto !important;
  padding: 0 0 4mm !important;
}
.logo-text .brand {
  color: #111 !important;
  font-size: 15pt !important;
}
.logo-text .tagline {
  color: #444 !important;
  /* The screen tracking is far too wide once the type shrinks for print. */
  letter-spacing: 0.4px !important;
  font-size: 7pt !important;
}
.logo-text {
  max-width: none !important;
}

/* -----------------------------------------------------
   OVERLAYS
   Lead-capture popups, cookie bars and anything else
   floating above the page will otherwise print as a grey
   wash over the whole first sheet. Matched by name as well
   as by class, because these come from plugins and CSS
   cannot select on "position: fixed".
----------------------------------------------------- */
.leadflow-popup,
.leadflow-popup-overlay,
.orthomed-popup-overlay,
.orthomed-popup-box,
#orthoLeadPopup,
.modal-overlay,
.modal-box,
dialog,
[role="dialog"],
[aria-modal="true"],
[class*="popup"],
[class*="modal"],
[class*="overlay"],
[class*="backdrop"],
[class*="cookie"],
[class*="toast"],
[id*="popup"],
[id*="Popup"],
[id*="modal"] {
  display: none !important;
}

/* -----------------------------------------------------
   HIDE INTERFACE FURNITURE
   Anything that cannot be acted on from a sheet of paper.
----------------------------------------------------- */
#main-nav,
.header-actions,
.hamburger,
.wa-btn,
.float-wa,
.float-wa-popup,
.float-wa-btn,
.float-wa-pulse,
.hero-bg-pattern,
.hero-glow,
.hero-visual,
.implant-showcase,
.implant-ring,
.floating-card,
.product-filters,
.filter-btn,
.enquiry-form-box,
.form-group,
.form-row,
.btn,
.social-links,
.footer-col,
.footer-pdf,
.pdf-download-btn,
.print-page-btn,
.section-divider,
.scroll-indicator,
#wpadminbar,
.skip-link {
  display: none !important;
}

/* -----------------------------------------------------
   HERO — compact, on white
----------------------------------------------------- */
#hero {
  min-height: 0 !important;
  padding: 0 0 8mm !important;
  background: #fff !important;
  color: #111 !important;
  display: block !important;
}
.hero-inner {
  display: block !important;
  padding: 0 !important;
}
.hero-title,
.hero-title span,
.hero-subtitle,
.stat-label {
  color: #111 !important;
}
.hero-badge {
  border: 0.5pt solid #555 !important;
  color: #111 !important;
  background: none !important;
}
.hero-stats {
  gap: 10mm !important;
  margin-bottom: 6mm !important;
}
.stat-num {
  color: #111 !important;
  font-size: 15pt !important;
}

/* -----------------------------------------------------
   DARK SECTIONS — flipped to save ink, text darkened so
   nothing turns white-on-white
----------------------------------------------------- */
#why-us,
#site-footer {
  background: #fff !important;
  color: #111 !important;
}
#why-us .section-title,
#why-us .section-subtitle,
#why-us .feature-card,
#why-us .feature-card *,
#why-us h2,
#why-us h3,
#why-us p,
#site-footer,
#site-footer p,
#site-footer a,
#site-footer .brand,
#site-footer .tagline {
  color: #111 !important;
}
.section-badge {
  background: none !important;
  border: 0.5pt solid #666 !important;
  color: #111 !important;
}

/* -----------------------------------------------------
   PRODUCT PAGE — a single column reads better on paper
----------------------------------------------------- */
.product-single {
  display: block !important;
}
.product-gallery {
  position: static !important;
  margin-bottom: 8mm;
}
.product-info-title {
  font-size: 18pt !important;
}
.product-meta {
  break-inside: avoid;
  page-break-inside: avoid;
}
.product-meta {
  gap: 4mm 8mm !important;
}
.product-meta-label {
  color: #444 !important;
}
.certifications,
.cert-badge {
  break-inside: avoid;
  page-break-inside: avoid;
  color: #111 !important;
}

/* Sizes stay as chips — they read cleanly on paper — but lose the selected
   state, which means nothing once it cannot be changed. */
.size-option,
.size-option.active {
  border: 0.5pt solid #999 !important;
  background: none !important;
  color: #111 !important;
  padding: 1mm 3mm !important;
  break-inside: avoid;
}
.variations-section {
  break-inside: avoid;
  page-break-inside: avoid;
}

/* -----------------------------------------------------
   CARDS AND GRIDS
----------------------------------------------------- */
.products-grid,
.features-grid,
.testimonials-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 6mm !important;
}
.product-card-img {
  height: 32mm !important;
}
.product-card-img img {
  max-height: 28mm !important;
}
.product-card-body {
  padding: 3mm !important;
}

.product-card,
.feature-card,
.testimonial-card {
  break-inside: avoid;
  page-break-inside: avoid;
  border: 0.5pt solid #ccc !important;
  box-shadow: none !important;
  background: #fff !important;
}

/* -----------------------------------------------------
   LISTS
   The theme's global reset zeroes padding, which clips the
   markers off content lists once they are printed.
----------------------------------------------------- */
.entry-content ul,
.product-desc ul,
.entry-content ol,
.product-desc ol {
  padding-left: 6mm !important;
  margin: 2mm 0 4mm !important;
}
.entry-content ul,
.product-desc ul {
  list-style: disc outside !important;
}
.entry-content ol,
.product-desc ol {
  list-style: decimal outside !important;
}
.entry-content li,
.product-desc li {
  display: list-item !important;
  margin-bottom: 1mm !important;
}

/* -----------------------------------------------------
   TABLES
----------------------------------------------------- */
table {
  border-collapse: collapse !important;
  width: 100% !important;
}
thead {
  /* Repeat the header row when a table spans sheets. */
  display: table-header-group;
}
tr,
img {
  break-inside: avoid;
  page-break-inside: avoid;
}
th,
td {
  border: 0.5pt solid #bbb !important;
  padding: 2mm 3mm !important;
  color: #111 !important;
}
th {
  background: #eee !important;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

/* -----------------------------------------------------
   LINKS — a URL you cannot click is worth spelling out
----------------------------------------------------- */
a {
  text-decoration: none !important;
}
.entry-content a,
.product-desc a {
  text-decoration: underline !important;
}
.entry-content a[href^="http"]::after,
.product-desc a[href^="http"]::after {
  content: " (" attr(href) ")";
  font-size: 8.5pt;
  color: #444;
  word-break: break-all;
}
/* Internal anchors and mailto/tel already read as their label. */
.entry-content a[href^="#"]::after,
.entry-content a[href^="mailto"]::after,
.entry-content a[href^="tel"]::after {
  content: "";
}

/* -----------------------------------------------------
   TYPOGRAPHY AND PAGINATION
----------------------------------------------------- */
h1, h2, h3, h4 {
  color: #111 !important;
  break-after: avoid;
  page-break-after: avoid;
  break-inside: avoid;
}
h1 { font-size: 20pt !important; }
h2 { font-size: 14pt !important; }
h3 { font-size: 12pt !important; }

p, li, blockquote {
  orphans: 3;
  widows: 3;
}

blockquote {
  border-left: 2pt solid #999 !important;
  padding-left: 4mm !important;
  color: #333 !important;
}

.breadcrumbs {
  font-size: 8.5pt !important;
  color: #555 !important;
}

/* -----------------------------------------------------
   FOOTER — keep the contact details, drop the navigation
----------------------------------------------------- */
#site-footer {
  border-top: 1pt solid #111 !important;
  margin-top: 8mm;
  padding-top: 4mm !important;
}
.footer-main {
  padding: 0 !important;
}
.footer-grid {
  display: block !important;
}
.footer-brand p {
  font-size: 9pt !important;
}
.footer-bottom {
  border-top: 0 !important;
  padding: 2mm 0 0 !important;
  font-size: 8.5pt !important;
}

/* The source URL, so a printed sheet can be traced back. */
.print-source {
  display: block !important;
  font-size: 8.5pt;
  color: #444 !important;
  margin-top: 3mm;
  word-break: break-all;
}

/* Secondary text, re-muted after the blanket darkening above. */
.breadcrumbs,
.breadcrumbs a,
.print-source,
.footer-bottom,
.footer-bottom a,
.product-meta-label,
.stat-label {
  color: #555 !important;
}

/* -----------------------------------------------------
   ANIMATION HAS NO MEANING ON PAPER
----------------------------------------------------- */
*,
*::before,
*::after {
  animation: none !important;
  transition: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
}