/*
  print.css -- the *structure* of the printed page: where tables sit, the box
  model of cards, the caterer grid, page setup. The *look* (fonts, colours,
  rules, ornament) lives in print-styles.css, one block per named style.

  Loaded all the time, because the same markup is shown in the on-screen
  preview. The `@media print` block at the bottom is the only print-only part.

  Colours and fonts here come from CSS variables that each style sets; the
  fallbacks below are a plain black-on-white default.
*/

/* ---- the page itself ------------------------------------------------- */

.print-doc {
  box-sizing: border-box;
  padding: 14mm;
  position: relative;
  background: var(--pd-paper, #ffffff);
  color: var(--pd-ink, #1a1a1a);
  font-family: var(--pd-serif, var(--font-serif));
  font-size: 11pt;
  line-height: 1.35;
}

.pd-head {
  position: relative;
  margin-bottom: 8mm;
  padding-bottom: 3mm;
  border-bottom: 1px solid var(--pd-line, #999);
}

.pd-title {
  font-family: var(--pd-display, var(--pd-serif, var(--font-serif)));
  font-size: 20pt;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.pd-meta {
  margin-top: 1mm;
  color: var(--pd-ink-soft, #666);
  font-size: 10pt;
}

.pd-empty {
  color: var(--pd-ink-soft, #666);
}

/* Ornament slots - each style fills what it uses; the rest stay invisible. */
.pd-frame,
.pd-ornament,
.pd-fan,
.pd-rule {
  display: none;
}

/* ---- floor plan + table cards (positioned) ------------------------- */

.pd-floor {
  position: relative;
  margin: 0 auto;
}

.pd-table {
  position: absolute;
  box-sizing: border-box;
  border: 1px solid var(--pd-table-line, #555);
}

.pd-table--round {
  border-radius: 50%;
}

.pd-table--sweetheart {
  border-radius: 16px;
}

.pd-tlabel {
  position: absolute;
  transform: translate(-50%, -50%);
  max-width: 26mm;
  font-size: 9pt;
  font-weight: 600;
  line-height: 1.1;
  text-align: center;
  overflow-wrap: break-word;
}

.pd-seatname {
  position: absolute;
  transform: translate(-50%, -50%);
  width: 58px;
  font-size: 7pt;
  line-height: 1.05;
  text-align: center;
  overflow-wrap: break-word;
}

.pd-seatname--empty {
  color: var(--pd-faint, #bbb);
}

/* Table cards: a regular grid, one card per table (see .pd-cardgrid below) -
   not positioned to match the room. */
.pd-cardgrid--tables {
  grid-template-columns: 1fr 1fr;
  gap: 5mm;
}

.pd-card {
  break-inside: avoid;
  box-sizing: border-box;
  padding: 4mm 5mm;
  background: var(--pd-paper, #ffffff);
  border: 1px solid var(--pd-table-line, #555);
}

.pd-card__name {
  margin-bottom: 2mm;
  padding-bottom: 1mm;
  border-bottom: 1px solid var(--pd-line, #ccc);
  font-size: 10pt;
  font-weight: 600;
}

.pd-card__list {
  margin: 0;
  padding-left: 1.3em;
  font-size: 8.5pt;
  line-height: 1.4;
}

.pd-empty-seat {
  color: var(--pd-faint, #bbb);
}

/* ---- caterer's list (flowing table) ------------------------------- */

.pd-cater-block {
  margin-bottom: 7mm;
  break-inside: avoid;
}

.pd-cater-title {
  font-family: var(--pd-display, var(--pd-serif, var(--font-serif)));
  margin: 0 0 2mm;
  font-size: 12pt;
}

.pd-cater {
  width: 100%;
  border-collapse: collapse;
  font-size: 9.5pt;
}

.pd-cater th,
.pd-cater td {
  padding: 2mm 2.5mm;
  border: 1px solid var(--pd-line, #999);
  text-align: left;
  vertical-align: top;
}

.pd-cater th {
  font-weight: 600;
}

.pd-cater th:first-child,
.pd-cater td:first-child {
  width: 12mm;
  text-align: center;
}

.pd-cater th:nth-child(3),
.pd-cater td:nth-child(3) {
  width: 30mm;
}

.pd-cater th:nth-child(4),
.pd-cater td:nth-child(4) {
  width: 48mm;
}

.pd-blank {
  height: 8mm;
}

/* ---- escort list (the entrance board) --------------------------- */

.pd-escort {
  column-count: 2;
  column-gap: 12mm;
  font-size: 10pt;
}

.pd-escort-group {
  break-inside: avoid;
  margin-bottom: 4mm;
}

.pd-escort-letter {
  font-family: var(--pd-display, var(--font-serif));
  font-size: 12pt;
  font-weight: 600;
  border-bottom: 1px solid var(--pd-line, #999);
  margin-bottom: 1.5mm;
}

.pd-escort-row {
  display: flex;
  align-items: baseline;
  gap: 2mm;
  padding: 0.6mm 0;
}

.pd-escort-dots {
  flex: 1 1 auto;
  border-bottom: 1px dotted var(--pd-faint, #bbb);
  transform: translateY(-2px);
}

.pd-escort-table {
  flex: 0 0 auto;
  color: var(--pd-ink-soft, #555);
}

/* ---- cut-out card grids (escort cards + place cards) ----------- */

.pd-cardgrid {
  display: grid;
}

.pd-cardgrid--escort {
  grid-template-columns: 1fr 1fr;
}

.pd-cutcard {
  break-inside: avoid;
  box-sizing: border-box;
  min-height: 42mm;
  padding: 6mm 5mm;
  border: 1px dashed var(--pd-faint, #bbb);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.pd-cutcard__name {
  font-family: var(--pd-display, var(--font-serif));
  font-size: 13pt;
}

.pd-cutcard__table {
  margin-top: 2mm;
  font-size: 9pt;
  color: var(--pd-ink-soft, #555);
}

/* tent-fold place cards: flat 3.5in x 4in, folded across the middle */
.pd-cardgrid--place {
  grid-template-columns: 88.9mm 88.9mm;
  justify-content: center;
}

.pd-place-card {
  break-inside: avoid;
  box-sizing: border-box;
  width: 88.9mm;
  height: 101.6mm;
  border: 1px dashed var(--pd-faint, #ccc);
  display: flex;
  flex-direction: column;
}

.pd-place-half {
  flex: 1 1 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 5mm;
}

.pd-place-half--top {
  transform: rotate(180deg);
}

.pd-place-fold {
  border-top: 1px dashed var(--pd-faint, #999);
}

.pd-place-name {
  font-family: var(--pd-display, var(--font-serif));
  font-size: 16pt;
  line-height: 1.15;
}

.pd-place-table {
  margin-top: 2.5mm;
  font-size: 9pt;
  color: var(--pd-ink-soft, #555);
}

/* the cut-out layouts are working sheets - no header, frame or ornament */
.pd-layout--escort-cards .pd-head,
.pd-layout--place-cards .pd-head,
.pd-layout--escort-cards .pd-frame,
.pd-layout--place-cards .pd-frame,
.pd-layout--escort-cards .pd-ornament,
.pd-layout--place-cards .pd-ornament {
  display: none !important;
}

/* ---- "not yet seated" footer ------------------------------------- */

.pd-unseated {
  margin-top: 7mm;
  padding-top: 3mm;
  border-top: 1px solid var(--pd-line, #ccc);
  font-size: 9pt;
  color: var(--pd-ink-soft, #333);
}

/* ---- on screen: hide the print-only region ---------------------- */

.print-region {
  display: none;
}

/* ---- when actually printing ----------------------------------- */

@media print {
  html,
  body {
    background: #ffffff;
  }

  /* Hide the whole app (header, warnings strip, main, styles, scripts);
     show only the print region. */
  body > :not(.print-region) {
    display: none !important;
  }

  .print-region {
    display: block !important;
  }

  /* @page margin handles the paper margin; the doc's own padding is on top,
     so drop it back to a sensible single margin. */
  .print-region .print-doc {
    width: auto;
    transform: none !important;
    padding: 12mm;
  }

  .pd-cater thead {
    display: table-header-group; /* repeat header on each page */
  }
}
