/* ============================================================
   تنسيق الطباعة — الإجازة في صفحة A4 واحدة
   The sheet IS the page: margins are zero here because the sheet
   carries its own 12mm padding. app.js has already shrunk the text
   to fit, so nothing should ever spill onto a second sheet.
   ============================================================ */

@page {
  size: A4 portrait;
  margin: 0;
}

html, body {
  background: #fff !important;
  color: #000;
  margin: 0 !important;
  padding: 0 !important;
}

/* Hide every bit of screen chrome. Page headings and the settings submenu
   count as chrome too: left in, they push the 296mm sheet onto a second page. */
.no-print,
.topbar,
.site-foot,
.ejaza-toolbar,
.subnav,
.inset-guide,
.inset-handle,
.inset-readout,
.seal-grip,
.page-title,
.page-head,
.card-title,
.alert,
.btn,
form {
  display: none !important;
}

.wrap, main.wrap, main.plain-main {
  max-width: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* The on-screen shrink-to-fit-the-window transform must not apply on paper. */
.sheet-wrap, .sheet-wrap.zoomed {
  transform: none !important;
  display: block !important;
  height: auto !important;
  overflow: visible !important;
}

.sheet {
  width: 210mm !important;
  height: 296mm !important;
  padding: 12mm !important;
  margin: 0 !important;
  border: none !important;
  box-shadow: none !important;
  background: #fff !important;
  overflow: hidden !important;
  break-inside: avoid;
  page-break-inside: avoid;
  break-after: avoid;
  page-break-after: avoid;
}

/* The ornamental border-image is suppressed when the browser prints without
   background graphics; the two solid rules below always come out. */
.sheet-frame::before { border-color: #a9853f !important; }
.sheet-frame::after  { border-color: #a9853f !important; }

.ejaza-body { color: #000; }
.sheet-head .sheet-title { color: #17553f !important; }
.student-name { border-bottom-color: #000 !important; }
.dblank { border-bottom-color: #000 !important; }

/* The stamp space is printed with its box and caption, so the shaykh can see
   exactly where to put his seal and signature by hand.
   No rules here on purpose: .stamp-area and .stamp-hint are left entirely to
   app.css, so the printed box is the same thin grey dashed box as the preview -
   1px dashed rgba(0,0,0,.16) with the caption in the soft ink colour. Anything
   heavier here (an !important border, a black caption) would print darker than
   what the shaykh saw on screen. A border is page content, so it prints without
   the "Background graphics" option. Once a seal image has been uploaded the box
   is not drawn - the image itself fills the space. */

/* The editor's dashed outline on the signature and seal is an outline, not a
   background, so it would otherwise print. */
.seal-editable { outline: none !important; }

.verify { color: #666; }

a { color: inherit; text-decoration: none; }
a[href]::after { content: none !important; }

/* الطباعة بدقة عالية — high-resolution printing
   Every frame and ornament is vector SVG, so it re-renders at the printer's
   resolution rather than being scaled from a screen-sized bitmap. These two
   declarations stop the browser dropping or flattening them. */
.sheet.frame-image { padding: 0 !important; }
/* The artwork and the wash are <img> elements, so they print regardless of the
   "Background graphics" setting. Only their size needs pinning. */
.frame-art  { width: 210mm !important; height: 296mm !important; }
.frame-wash { display: block !important; }

.sheet, .sheet-frame, .sheet-orn, .signature {
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
  image-rendering: auto;
}
.sheet-orn { display: block !important; }