/* Canton Buying Desk — protected document library (ds/) */
.cbd-ds-doc .cbd-ds-article,
.cbd-ds-doc .cbd-ds-article table,
.cbd-ds-doc .cbd-ds-article p,
.cbd-ds-doc .cbd-ds-article td,
.cbd-ds-doc .cbd-ds-article th,
.cbd-ds-doc .cbd-ds-article li {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.cbd-ds-main {
  position: relative;
  width: 100%;
}

.cbd-ds-article {
  position: relative;
  width: 100%;
}

.cbd-ds-article > * {
  position: relative;
  z-index: 1;
}

/* Fixed viewport tile — desktop */
.cbd-ds-doc::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  height: 100dvh;
  z-index: 2147483646;
  pointer-events: none;
  opacity: 0.08;
  background-image: var(--cbd-watermark-url, url("/images/cantonbuyingdesk.png"));
  background-repeat: repeat;
  background-size: 260px auto;
  -webkit-background-size: 260px auto;
  background-position: center center;
  transform: rotate(-28deg) scale(1.35);
  -webkit-transform: rotate(-28deg) scale(1.35);
  transform-origin: center center;
  -webkit-transform-origin: center center;
}

@media (max-width: 768px), (hover: none) and (pointer: coarse) {
  .cbd-ds-doc::before {
    display: none;
  }
}

/* JS-injected mobile watermark layer (see ds-doc-protection.js) */
#cbd-ds-watermark-layer {
  position: fixed;
  inset: 0;
  width: 100%;
  max-width: 100vw;
  height: 100%;
  height: 100dvh;
  z-index: 2147483646;
  pointer-events: none;
  opacity: 0.08;
  background-repeat: repeat;
  background-size: 260px auto;
  -webkit-background-size: 260px auto;
  background-position: center center;
  transform: rotate(-28deg) scale(1.15);
  -webkit-transform: rotate(-28deg) scale(1.15);
  transform-origin: center center;
  -webkit-transform-origin: center center;
  overflow: hidden;
}

/*
 * Mobile alignment: inline body { max-width: 210mm } + wide tables overflow the
 * viewport, so the page looks left-heavy with the right edge clipped. Keep content
 * unchanged; constrain shell to viewport and symmetric side padding.
 */
@media (max-width: 768px) {
  body.cbd-ds-doc {
    width: 100% !important;
    max-width: 100vw !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    box-sizing: border-box !important;
    overflow-x: hidden;
  }

  body.cbd-ds-doc .cbd-ds-main,
  body.cbd-ds-doc .cbd-ds-article {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Wide inspection tables: scroll inside article, not the whole page */
  body.cbd-ds-doc .cbd-ds-article {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  body.cbd-ds-doc .doc-header {
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px;
  }

  body.cbd-ds-doc .doc-header__logo {
    flex: 0 0 auto;
  }

  body.cbd-ds-doc .doc-header__tagline {
    flex: 1 1 100%;
    max-width: 100%;
    text-align: center;
    word-wrap: break-word;
    overflow-wrap: anywhere;
  }

  body.cbd-ds-doc table {
    max-width: 100%;
  }

  /* Multi-column print layouts overflow narrow screens — stack without editing HTML */
  body.cbd-ds-doc .stage-grid,
  body.cbd-ds-doc .defect-grid,
  body.cbd-ds-doc .inspection-stages {
    grid-template-columns: 1fr !important;
  }

  body.cbd-ds-doc .toolbox-grid,
  body.cbd-ds-doc .glossary-grid {
    max-width: 100%;
  }
}

@media print {
  .cbd-ds-doc,
  .cbd-ds-doc * {
    display: none !important;
    visibility: hidden !important;
  }
}