app/static/css/print.css

/* =========================================================
   ISP HANDBOOK - CORRECTED PRINT CSS
   Uses real page margins (2.54 cm all sides)
   Removes negative-margin / negative-offset layout tricks
   Keeps decorative elements from breaking content flow
   ========================================================= */

/* ------------------------------
   PAGE SETUP
   ------------------------------ */
@page {
    size: A4;
    margin: 2.54cm;
}

/* Optional cover page: use only if your renderer supports named pages */
@page cover {
    size: A4;
    margin: 0;
}

/* ------------------------------
   RESET
   ------------------------------ */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    font-family: "Century Gothic", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    font-size: 10pt;
    line-height: 1.4;
    color: #000000;
    text-align: justify;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    background: #ffffff;
}

/* ------------------------------
   EXTERNAL PLAYWRIGHT HEADER/FOOTER
   Keep hidden in body flow if using templates
   ------------------------------ */
.page-header,
.page-footer {
    display: none !important;
}

.page-header img {
    display: block;
    width: 8.45in;
    height: 1.03in;
}

/* ------------------------------
   SAFE CONTENT WRAPPER
   ------------------------------ */
.page-content {
    display: block;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 1;
    overflow: visible;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* Prevent accidental blank page after cover */
.cover-page+.page-content,
.cover-page+.toc-page,
.cover-page+.section-block {
    page-break-before: auto;
    break-before: auto;
}

/* Prevent accidental blank page from a leading .page-break */
.page-content> :first-child.page-break,
.page-content> :first-child.section-block.page-break {
    page-break-before: auto;
    break-before: auto;
}

/* ------------------------------
   DECORATIVE RIGHT-SIDE LABEL
   Hidden in the base HTML. Rendered as a PDF overlay
   by pdf_renderer.py onto content pages only.
   Kept here so the <img> loads for src extraction.
   Original: 43.28cm × 3.31cm → 54% × 50% = 23.42cm × 1.65cm
   ------------------------------ */
.hb-right-label {
    position: absolute;
    top: -9999px;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
    pointer-events: none;
}

.hb-right-label img {
    display: block;
}

/* ------------------------------
   TYPOGRAPHY
   ------------------------------ */
.hb-heading-1,
.h2,
h1 {
    font-size: 12pt;
    font-weight: 700;
    color: #1C75BC;
    margin: 0 0 8pt;
    line-height: 1.2;
    text-transform: uppercase;
    text-align: left;
    letter-spacing: 0.2px;
    page-break-after: avoid;
    break-after: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}

.hb-heading-2,
.h3,
h2,
h3,
h4,
h5,
h6 {
    font-size: 12pt;
    font-weight: 700;
    color: #1A9970;
    margin: 10pt 0 6pt;
    line-height: 1.2;
    text-align: left;
    page-break-after: avoid;
    break-after: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}

.hb-paragraph,
.p,
p {
    margin: 0 0 8pt;
    font-size: 10pt;
    line-height: 1.4;
    text-align: justify;
    orphans: 3;
    widows: 3;
}

strong,
b {
    font-weight: 700;
}

em,
i {
    font-style: italic;
}

a,
a:visited {
    color: #1C75BC;
    text-decoration: underline;
    word-break: break-word;
}

/* ------------------------------
   LISTS
   ------------------------------ */
.hb-bullet-list,
.ul,
ul.hb-bullet-list {
    list-style: none !important;
    margin: 0 0 8pt 16pt;
    padding: 0;
    font-size: 10pt;
}

.hb-bullet-list li,
.ul li,
ul.hb-bullet-list li {
    position: relative;
    margin: 0 0 4pt;
    padding-left: 14pt;
    line-height: 1.4;
    page-break-inside: avoid;
    break-inside: avoid;
}

.hb-bullet-list li::before,
.ul li::before,
ul.hb-bullet-list li::before {
    content: "\27A2";
    position: absolute;
    left: 0;
    top: 0;
    color: #000000;
    font-size: 10pt;
    font-weight: 400;
}

/* ordered lists */
.hb-numbered-list,
.ol,
ol.hb-numbered-list {
    list-style: decimal;
    margin: 0 0 8pt 18pt;
    padding: 0;
    font-size: 10pt;
}

.hb-numbered-list li,
.ol li,
ol.hb-numbered-list li {
    margin: 0 0 4pt;
    padding-left: 0;
    line-height: 1.4;
    page-break-inside: avoid;
    break-inside: avoid;
}

.hb-numbered-list li::before,
.ol li::before,
ol.hb-numbered-list li::before {
    content: none;
}

/* ------------------------------
   NOTES / EMPHASIS
   Guideline requires full bold text;
   NOTE and ONLY IF in red.
   ------------------------------ */
.hb-note,
.note {
    margin: 8pt 0 10pt;
    padding: 0;
    border: none;
    background: transparent;
    font-size: 10pt;
    line-height: 1.4;
    font-weight: 700;
    page-break-inside: avoid;
    break-inside: avoid;
}

.hb-note-keyword,
.note-keyword,
.note .keyword,
.only-if {
    color: #C00000;
    font-weight: 700;
}

/* ------------------------------
   BOLD EMPHASIS FOR KEY INFORMATION
   Payment amounts, REGULAR, PRIME, critical terms
   ------------------------------ */
.hb-bold-keyword {
    font-weight: 700;
}

.hb-red-keyword {
    font-weight: 700;
    color: #C00000;
}

/* ------------------------------
   SCHOOL INFO - Green color for school information
   ------------------------------ */
.hb-school-info {
    color: #1A9970;
    font-size: 9.5px;
}

/* ------------------------------
   HELPERS
   ------------------------------ */
.page-break {
    page-break-before: always;
    break-before: page;
}

.avoid-break {
    page-break-inside: avoid;
    break-inside: avoid;
}

.keep-with-next {
    page-break-after: avoid;
    break-after: avoid;
}

.clearfix::after {
    content: "";
    display: block;
    clear: both;
}

.debug-block {
    border: 2px dashed #cc0000;
    padding: 12px;
    background: #fffbe6;
    page-break-inside: avoid;
    break-inside: avoid;
}

/* ------------------------------
   COVER PAGE
   Prefer named page.
   If unsupported by renderer, cover will still render safely.
   ------------------------------ */
.cover-page {
    page: cover;
    page-break-after: always;
    break-after: page;
    margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
}

.cover-img {
    display: block;
    width: 100%;
    height: auto;
}

/* ------------------------------
   FULL-PAGE IMAGE PAGES
   Only use when intentionally full-page.
   ------------------------------ */
.fullpage-img-wrap {
    page: cover;
    page-break-before: always;
    break-before: page;
    page-break-after: always;
    break-after: page;
    margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
}

.fullpage-img {
    display: block;
    width: 100%;
    height: auto;
}

img {
    max-width: 100%;
    height: auto;
}

/* ------------------------------
   TABLES - GLOBAL
   No shading / color fill per guideline
   ------------------------------ */
table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    max-width: 100%;
    overflow: hidden;
    page-break-inside: auto;
    break-inside: auto;
}

thead {
    display: table-header-group;
}

tfoot {
    display: table-row-group;
}

tr {
    page-break-inside: avoid;
    break-inside: avoid;
}

.hb-table,
.tbl {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    max-width: 100%;
    margin: 8pt 0 10pt;
    font-size: 9.5pt;
    line-height: 1.3;
    border: 1px solid #333333;
}

.hb-table th,
.hb-table td,
.tbl th,
.tbl td {
    border: 1px solid #333333;
    padding: 5pt 6pt;
    vertical-align: top;
    word-wrap: break-word;
    overflow-wrap: break-word;
    font-size: 9.5pt;
    line-height: 1.3;
    background: transparent;
    color: #000000;
}

.hb-table th,
.tbl th {
    font-weight: 700;
    background: transparent;
    text-align: left;
}

/* comparison table */
.hb-table-comparison,
.tbl-comparison {
    font-size: 9pt;
}

.hb-table-comparison th,
.tbl-comparison th {
    text-align: center;
    font-size: 9pt;
    background: transparent;
}

/* ------------------------------
   PROGRAM TABLES
   No shading
   ------------------------------ */
.hb-programs,
table.programs {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    max-width: 100%;
    margin: 8pt 0 10pt;
    border: 1px solid #333333;
    font-family: "Century Gothic", "Segoe UI", sans-serif;
}

.hb-programs th,
.hb-programs td,
table.programs th,
table.programs td {
    border: 1px solid #333333;
    padding: 4.5pt 5pt;
    vertical-align: top;
    word-wrap: break-word;
    overflow-wrap: break-word;
    font-size: 8.75pt;
    line-height: 1.25;
    background: transparent;
    color: #000000;
}

.hb-programs th,
table.programs th {
    font-weight: 700;
    background: transparent;
    text-transform: none;
    text-align: left;
    letter-spacing: 0;
}

.hb-programs th:nth-child(1),
.hb-programs td:nth-child(1),
table.programs th:nth-child(1),
table.programs td:nth-child(1) {
    width: 22%;
}

.hb-programs th:nth-child(2),
.hb-programs td:nth-child(2),
table.programs th:nth-child(2),
table.programs td:nth-child(2) {
    width: 14%;
}

.hb-programs th:nth-child(3),
.hb-programs td:nth-child(3),
table.programs th:nth-child(3),
table.programs td:nth-child(3) {
    width: 16%;
}

.hb-programs th:nth-child(4),
.hb-programs td:nth-child(4),
table.programs th:nth-child(4),
table.programs td:nth-child(4) {
    width: 30%;
}

.hb-programs th:nth-child(5),
.hb-programs td:nth-child(5),
table.programs th:nth-child(5),
table.programs td:nth-child(5) {
    width: 18%;
}

/* career list inside programs table */
.hb-career-list,
.career-list {
    margin: 0;
    padding-left: 12pt;
    list-style-type: disc;
}

.hb-career-list li,
.career-list li {
    margin: 0 0 2pt;
    padding-left: 0;
    line-height: 1.2;
    font-size: 8.75pt;
}

.hb-career-list li::before,
.career-list li::before {
    content: none;
}

/* ------------------------------
   TABLE OF CONTENTS
   Stable within content width
   ------------------------------ */
.toc-page {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    page-break-after: auto;
    break-after: auto;
}

.toc {
    width: 100%;
    margin: 0;
    padding: 0;
}

.toc-heading {
    display: block;
    width: 100%;
    font-size: 12pt;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0 0 8pt;
    color: #1C75BC;
    line-height: 1.2;
}

.toc-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    margin: 0;
    border: none;
}

.toc-table td {
    border: none;
    vertical-align: bottom;
    padding: 2pt 0;
    line-height: 1.2;
    font-size: 10pt;
    color: #111111;
    background: transparent;
}

.toc-title {
    padding-right: 6pt;
}

.toc-dots {
    border-bottom: 1px dotted #777777;
    height: 0.9em;
    padding: 0;
}

.toc-pagenum {
    width: 34pt;
    text-align: right;
    font-weight: 700;
    color: #111111;
    white-space: nowrap;
    padding-left: 6pt;
}

.toc-row--major .toc-title,
.toc-row--bold .toc-title {
    font-weight: 700;
}

.toc-row--sub .toc-title {
    font-weight: 400;
}

.toc-row--upper .toc-title {
    text-transform: uppercase;
    letter-spacing: 0.1px;
}

.toc-row--indent-1 .toc-title {
    padding-left: 12pt;
}

.toc-row--indent-2 .toc-title,
.toc-row--deep .toc-title {
    padding-left: 24pt;
}

.toc-table a,
.toc-table a:visited {
    color: #111111;
    text-decoration: none;
}

/* ------------------------------
   SECTION BLOCKS
   ------------------------------ */
.section-block {
    display: block;
    width: 100%;
    margin: 0 0 8pt;
    padding: 0;
    border: none;
}

.section-block> :first-child {
    margin-top: 0;
}

.summary-section {
    display: block;
}

/* ------------------------------
   ENROLMENT STEPS
   Dedicated page block
   ------------------------------ */
.hb-enrollment-steps,
.sec-steps {
    page-break-before: always;
    break-before: page;
    page-break-after: always;
    break-after: page;
}

.hb-step {
    margin: 0 0 8pt;
    padding: 0 0 2pt;
    page-break-inside: avoid;
    break-inside: avoid;
}

.hb-step-title {
    font-size: 10pt;
    font-weight: 700;
    color: #1A9970;
    margin: 0 0 4pt;
    line-height: 1.2;
    page-break-after: avoid;
    break-after: avoid;
}

.hb-step-qr-wrap {
    margin: 4pt 0 6pt;
}

.hb-step-qr {
    display: block;
    width: 72pt;
    height: 72pt;
    margin: 4pt 0 6pt;
}

/* legacy step support */
.sec-steps .h3 {
    margin: 0 0 4pt;
    font-size: 10pt;
    color: #1A9970;
}

.sec-steps .p {
    margin: 0 0 6pt;
}

.sec-steps .ul {
    margin: 0 0 6pt 16pt;
}

/* ------------------------------
   UNIVERSITY / SCHOOL PAGE
   ------------------------------ */
.uni,
.hb-school-profile {
    page-break-before: always;
    break-before: page;
    padding: 0;
}

.hb-uni-name,
.uni-name {
    font-size: 14pt;
    font-weight: 700;
    margin: 0 0 6pt;
    color: #1C75BC;
    line-height: 1.2;
    text-transform: none;
    letter-spacing: 0.1px;
}

.hb-uni-name a,
.hb-uni-name-link,
.uni-name a.uni-name-link {
    color: #1C75BC;
    text-decoration: underline;
    font-weight: 700;
}

/* School info directly below school name in green */
.hb-summary-title,
.summary-title {
    font-size: 10pt;
    font-weight: 700;
    text-transform: uppercase;
    margin: 6pt 0 4pt;
    color: #1A9970;
    letter-spacing: 0.2px;
}

.hb-summary-ul,
.summary-ul {
    list-style: none;
    margin: 0 0 8pt;
    padding: 0;
}

.hb-summary-ul li,
.summary-ul li {
    margin: 0 0 3pt;
    padding: 0;
    font-size: 10pt;
    line-height: 1.3;
    color: #1A9970;
}

.hb-summary-ul li::before,
.summary-ul li::before {
    content: none;
}

.hb-lbl,
.lbl {
    font-weight: 700;
    color: #1A9970;
}

.hb-uni-website,
.uni-website {
    margin: 4pt 0 8pt;
    font-size: 10pt;
    color: #1A9970;
}

/* top school layout */
.hb-school-top-table,
.school-top-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    margin: 0 0 6pt;
    border: none;
}

.hb-school-top-table td,
.school-top-table td {
    border: none;
    padding: 0;
    vertical-align: top;
}

.hb-school-top-summary,
.school-top-summary {
    width: 52%;
    padding-right: 10pt !important;
}

.hb-school-top-campus,
.school-top-campus {
    width: 48%;
    text-align: right;
}

.hb-campus-img,
.campus-top-img {
    display: block;
    width: 100%;
    max-height: 180pt;
    height: auto;
    border: 1px solid #333333;
    object-fit: cover;
}

.hb-campus-caption,
.campus-top-cap {
    margin-top: 3pt;
    font-size: 9pt;
    color: #666666;
    font-style: italic;
    text-align: right;
    line-height: 1.2;
}

.hb-campus-placeholder,
.campus-placeholder-cell {
    width: 100%;
    min-height: 120pt;
    border: 1px dashed #999999;
    color: #666666;
    font-size: 10pt;
    padding: 10pt;
    background: transparent;
}

/* ------------------------------
   BENEFITS SECTION
   Guideline colors retained
   ------------------------------ */
.hb-benefits-section,
.benefits-section {
    clear: both;
    margin: 8pt 0 8pt;
    page-break-inside: avoid;
    break-inside: avoid;
}

.hb-benefits-heading {
    margin: 0 0 4pt;
    line-height: 1.3;
}

.hb-benefits-bar,
.benefits-bar {
    display: inline-block;
    background: #00F600;
    color: #000000;
    font-weight: 700;
    padding: 2pt 6pt;
    font-size: 10pt;
    line-height: 1.35;
}

.hb-benefits-ul,
.benefits-ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.hb-benefits-ul li,
.hb-benefit-item,
.benefit-li {
    margin: 3pt 0;
    padding: 0;
    font-size: 9.75pt;
    line-height: 1.35;
    background: none;
    border: none;
}

.hb-benefits-ul li::before,
.hb-benefit-item::before,
.benefit-li::before {
    content: "\27A2";
    display: inline-block;
    margin-right: 6pt;
    color: #000000;
}

.hb-benefit-text,
.benefit-text {
    display: inline-block;
    background: #00FCFC;
    padding: 1pt 4pt;
}

.benefit-bullet {
    display: none;
}

/* ------------------------------
   UNIVERSITY SUMMARY LIST
   Black, bold, numbered
   ------------------------------ */
.hb-university-list {
    margin: 0 0 10pt 18pt;
    padding: 0;
    list-style: decimal;
    font-size: 10pt;
    color: #000000;
}

.hb-university-list li {
    margin: 0 0 4pt;
    padding-left: 0;
    font-weight: 700;
    line-height: 1.4;
    color: #000000;
}

.hb-university-list li::before {
    content: none;
}

/* ------------------------------
   QUALIFICATION / MUTED TEXT
   ------------------------------ */
.hb-qualify,
.qualify {
    margin: 8pt 0 6pt;
    font-weight: 700;
    font-size: 10pt;
    font-style: italic;
    color: #1A9970;
}

.hb-muted,
.muted {
    color: #666666;
    font-size: 10pt;
}

/* ------------------------------
   SECTION-SPECIFIC OVERRIDES
   ------------------------------ */
.sec-overview .hb-heading-1,
.sec-overview .h2 {
    margin-top: 0;
}

.sec-overview .hb-paragraph,
.sec-overview .p {
    text-align: justify;
    line-height: 1.4;
}

.sec-qualification .hb-heading-2,
.sec-qualification .h3 {
    margin-top: 10pt;
}

.sec-qualification .hb-table,
.sec-qualification .tbl {
    margin: 6pt 0 10pt;
}

.sec-policy .hb-heading-2,
.sec-policy .h3 {
    margin-top: 10pt;
    padding-bottom: 0;
}

.sec-policy .hb-note,
.sec-policy .note {
    margin-top: 8pt;
}

.sec-policy .hb-table,
.sec-policy .tbl {
    margin: 6pt 0 10pt;
}

.sec-refund .hb-table,
.sec-refund .tbl {
    margin: 6pt 0 10pt;
}

.sec-contributions .hb-paragraph,
.sec-contributions .p,
.sec-contributions .hb-bullet-list li,
.sec-contributions .ul li {
    font-weight: 700;
    color: #1A9970;
}

.sec-contributions .hb-table,
.sec-contributions .tbl {
    margin: 6pt 0 10pt;
}

.sec-funding .hb-table,
.sec-funding .tbl {
    margin: 6pt 0 10pt;
}

/* Images must stay inside margins */
.page-content img {
    max-width: 100%;
    height: auto;
}