/* ==================================================
   PRINT V2
   The Open Shelf
================================================== */

@media print {

/* ==================================================
   1. Page Setup
================================================== */

@page {

    size: Letter;

    margin: 0.5in;

}

html,
body {

    margin: 0;

    padding: 0;

    background: white;

}

body {

    font-family:
        "Poppins",
        "Trebuchet MS",
        "Segoe UI",
        sans-serif;

}

/* ==================================================
   2. Hide Screen Interface
================================================== */

.hero,
.sidebar,
.canvas-header {

    display: none !important;

}

/* ==================================================
   3. Printable Layout
================================================== */

.app {

    max-width: none;

    padding: 0;

    margin: 0;

}

.workspace {

    display: block;

}

.canvas {

    background: white;

    padding: 0;

    margin: 0;

    box-shadow: none;

    border-radius: 0;

}

.document-stack {

    display: block;

}

.paper {

    width: 100%;

    margin: 0;

    padding: 0;

    background: white;

    border: none;

    border-radius: 0;

    box-shadow: none;

    min-height: auto !important;

}

/* ==================================================
   4. Worksheet Structure
================================================== */

.worksheet {

    display: flex;

    flex-direction: column;

}

.worksheet-header {

    margin-bottom: 0.25in;

}

.worksheet-body {

    display: flex;

    justify-content: center;

    margin-bottom: 0.20in;

}

/* ==================================================
   5. Puzzle Grid
================================================== */

.puzzle-grid {

    width: 100%;

    max-width: 6.4in;

    margin: 0 auto;

    border-collapse: collapse;

    table-layout: fixed;

}

.puzzle-grid td {

    width: 0.38in !important;
    height: 0.38in !important;

    padding: 0 !important;

    font-size: 11pt !important;

}

    /* ==================================================
   6. Word Bank
================================================== */

.word-bank-section {

    display: block !important;

    visibility: visible !important;

    margin-top: 0.15in;

    page-break-inside: avoid;

    break-inside: avoid;

}

.word-list {

    display: grid !important;

    visibility: visible !important;

    grid-template-columns: repeat(auto-fit, minmax(1.2in, 1fr));

    gap: 0.08in;

}

.word-list li {

    display: list-item !important;

    visibility: visible !important;

    margin: 0;

    padding: 0.05in;

    text-align: center;

}
/* ==================================================
   7. Answer Key
================================================== */

.answer-key-grid {

    width: 100%;

    max-width: 7in;

    margin: 0 auto;

    table-layout: fixed;

    border-collapse: collapse;

}

.answer-key-grid td {

    width: auto;

    aspect-ratio: 1;

    padding: 0;

    font-size: 13pt;

}

/* ==================================================
   8. Page Breaks
================================================== */

.print-page {

    page-break-after: auto;
    break-after: auto;

}

.worksheet {

    page-break-inside: avoid;
    break-inside: avoid;

}

.answer-key-section {

    page-break-before: always;
    break-before: page;

    page-break-inside: avoid;
    break-inside: avoid;

}

}