/* ==========================================================================
   ClassKit Global - Dual Paper Engine (US Letter 8.5x11" vs ISO A4)
   Calibrated for zero margin clipping on both US & International printers.
   ========================================================================== */

/* 1. Header Toolbar Paper Toggle Widget */
.paper-toggle-widget {
  display: inline-flex;
  align-items: center;
  background-color: var(--bg-subtle, #F8FAFC);
  border: 1px solid var(--border-light, #E2E8F0);
  border-radius: var(--radius-md, 8px);
  padding: 2px 3px;
  gap: 2px;
}

.paper-toggle-btn {
  padding: 4px 9px;
  font-size: 11.5px;
  font-weight: 700;
  background: transparent;
  border: none;
  color: var(--text-muted, #64748B);
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.15s ease;
  user-select: none;
  font-family: inherit;
}

.paper-toggle-btn.active,
.paper-toggle-btn:hover {
  background-color: #FFFFFF;
  color: var(--text-main, #0F172A);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* 2. On-Screen Preview Canvas Calibration */
body.paper-letter .a4-sheet,
body.paper-letter .scale-sheet,
body.paper-letter .worksheet-page,
body.paper-letter .maze-sheet,
body.paper-letter .pixel-art-sheet,
body.paper-letter .bug-sheet,
body.paper-letter .sudoku-sheet,
body.paper-letter .crypto-sheet,
body.paper-letter .fraction-sheet,
body.paper-letter .target-maze-sheet,
body.paper-letter .coord-sheet,
body.paper-letter .function-sheet,
body.paper-letter .flowchart-sheet,
body.paper-letter .stack-sheet,
body.paper-letter [class*="-sheet"] {
  width: var(--letter-width, 215.9mm) !important;
  height: var(--letter-height, 279.4mm) !important;
  min-height: var(--letter-height, 279.4mm) !important;
  max-height: var(--letter-height, 279.4mm) !important;
  box-sizing: border-box !important;
  padding-top: 7mm !important;
  padding-bottom: 6mm !important;
}

body.paper-a4 .a4-sheet,
body.paper-a4 .scale-sheet,
body.paper-a4 .worksheet-page,
body.paper-a4 .maze-sheet,
body.paper-a4 .pixel-art-sheet,
body.paper-a4 .bug-sheet,
body.paper-a4 .sudoku-sheet,
body.paper-a4 .crypto-sheet,
body.paper-a4 .fraction-sheet,
body.paper-a4 .target-maze-sheet,
body.paper-a4 .coord-sheet,
body.paper-a4 .function-sheet,
body.paper-a4 .flowchart-sheet,
body.paper-a4 .stack-sheet,
body.paper-a4 [class*="-sheet"] {
  width: var(--a4-width, 210mm) !important;
  height: var(--a4-height, 297mm) !important;
  min-height: var(--a4-height, 297mm) !important;
  max-height: var(--a4-height, 297mm) !important;
  box-sizing: border-box !important;
}

/* 3. Pure Print Engine Rules */
@media print {
  body.paper-letter {
    width: 215.9mm !important;
  }

  body.paper-letter .a4-sheet,
  body.paper-letter .scale-sheet,
  body.paper-letter .worksheet-page,
  body.paper-letter .maze-sheet,
  body.paper-letter .pixel-art-sheet,
  body.paper-letter .bug-sheet,
  body.paper-letter .sudoku-sheet,
  body.paper-letter .crypto-sheet,
  body.paper-letter .fraction-sheet,
  body.paper-letter .target-maze-sheet,
  body.paper-letter .coord-sheet,
  body.paper-letter .function-sheet,
  body.paper-letter .flowchart-sheet,
  body.paper-letter .stack-sheet,
  body.paper-letter [class*="-sheet"] {
    width: 215.9mm !important;
    height: 279.4mm !important;
    min-height: 279.4mm !important;
    max-height: 279.4mm !important;
    padding-top: 6mm !important;
    padding-bottom: 5mm !important;
    box-sizing: border-box !important;
    page-break-after: always !important;
    page-break-inside: avoid !important;
  }

  body.paper-a4 .a4-sheet,
  body.paper-a4 .scale-sheet,
  body.paper-a4 .worksheet-page,
  body.paper-a4 .maze-sheet,
  body.paper-a4 .pixel-art-sheet,
  body.paper-a4 .bug-sheet,
  body.paper-a4 .sudoku-sheet,
  body.paper-a4 .crypto-sheet,
  body.paper-a4 .fraction-sheet,
  body.paper-a4 .target-maze-sheet,
  body.paper-a4 .coord-sheet,
  body.paper-a4 .function-sheet,
  body.paper-a4 .flowchart-sheet,
  body.paper-a4 .stack-sheet,
  body.paper-a4 [class*="-sheet"] {
    width: 210mm !important;
    height: 297mm !important;
    min-height: 297mm !important;
    max-height: 297mm !important;
    box-sizing: border-box !important;
    page-break-after: always !important;
    page-break-inside: avoid !important;
  }
}