Visual overhaul: premium PDF styling - app/static/css/print.css

app/static/css/print.css

@@ -115,14 +115,16 @@ body {
 .hb-heading-1,
 .h2,
 h1 {
-    font-size: 12pt;
+    font-size: 12.5pt;
     font-weight: 700;
     color: #0263A3;
-    margin: 0 0 8pt;
-    line-height: 1.2;
+    margin: 4pt 0 10pt;
+    padding-bottom: 5pt;
+    border-bottom: 2pt solid #0263A3;
+    line-height: 1.25;
     text-transform: uppercase;
     text-align: left;
-    letter-spacing: 0.2px;
+    letter-spacing: 0.4px;
     page-break-after: avoid;
     break-after: avoid;
     page-break-inside: avoid;
@@ -136,12 +138,15 @@ h3,
 h4,
 h5,
 h6 {
-    font-size: 10pt;
+    font-size: 10.5pt;
     font-weight: 700;
     color: #199970;
-    margin: 10pt 0 6pt;
-    line-height: 1.2;
+    margin: 12pt 0 6pt;
+    padding-bottom: 3pt;
+    border-bottom: 1pt solid #C8E6DC;
+    line-height: 1.25;
     text-align: left;
+    letter-spacing: 0.2px;
     page-break-after: avoid;
     break-after: avoid;
     page-break-inside: avoid;
@@ -151,9 +156,9 @@ h6 {
 .hb-paragraph,
 .p,
 p {
-    margin: 8pt 0 0;
+    margin: 6pt 0 2pt;
     font-size: 10pt;
-    line-height: 1.4;
+    line-height: 1.5;
     text-align: justify;
     orphans: 3;
     widows: 3;
@@ -172,7 +177,8 @@ i {
 a,
 a:visited {
     color: #0263A3;
-    text-decoration: underline;
+    text-decoration: none;
+    border-bottom: 0.5pt solid #0263A3;
     word-break: break-word;
 }
 
@@ -183,18 +189,18 @@ a:visited {
 .ul,
 ul.hb-bullet-list {
     list-style: none !important;
-    margin: 0 0 8pt 16pt;
+    margin: 4pt 0 10pt 16pt;
     padding: 0;
-    font-size: 9pt;
+    font-size: 9.5pt;
 }
 
 .hb-bullet-list li,
 .ul li,
 ul.hb-bullet-list li {
     position: relative;
-    margin: 0 0 4pt;
-    padding-left: 14pt;
-    line-height: 1.4;
+    margin: 0 0 5pt;
+    padding-left: 16pt;
+    line-height: 1.45;
     page-break-inside: avoid;
     break-inside: avoid;
 }
@@ -202,13 +208,13 @@ ul.hb-bullet-list li {
 .hb-bullet-list li::before,
 .ul li::before,
 ul.hb-bullet-list li::before {
-    content: "\27A2";
+    content: "\27A4";
     position: absolute;
     left: 0;
     top: 0;
-    color: #000000;
-    font-size: 9pt;
-    font-weight: 400;
+    color: #0263A3;
+    font-size: 8pt;
+    font-weight: 700;
 }
 
 /* ordered lists */
@@ -244,8 +250,9 @@ ol.hb-numbered-list li::before {
 
 .hb-sub-bullets li::before {
     content: "\2713" !important;
-    color: #000000;
+    color: #199970;
     font-size: 9pt;
+    font-weight: 700;
 }
 
 /* ------------------------------
@@ -255,12 +262,13 @@ ol.hb-numbered-list li::before {
    ------------------------------ */
 .hb-note,
 .note {
-    margin: 8pt 0 10pt;
-    padding: 0;
-    border: none;
-    background: transparent;
+    margin: 10pt 0 12pt;
+    padding: 8pt 10pt 8pt 14pt;
+    border-left: 3.5pt solid #C00000;
+    background: #FFF8F8;
+    border-radius: 0 2pt 2pt 0;
     font-size: 10pt;
-    line-height: 1.4;
+    line-height: 1.45;
     font-weight: 700;
     page-break-inside: avoid;
     break-inside: avoid;
@@ -377,7 +385,7 @@ img {
 
 /* ------------------------------
    TABLES - GLOBAL
-   No shading / color fill per guideline
+   Professional styling with branded headers
    ------------------------------ */
 table {
     width: 100%;
@@ -408,33 +416,50 @@ tr {
     border-collapse: collapse;
     table-layout: fixed;
     max-width: 100%;
-    margin: 8pt 0 10pt;
+    margin: 10pt 0 14pt;
     font-size: 9.5pt;
-    line-height: 1.3;
-    border: 1px solid #333333;
+    line-height: 1.35;
+    border: none;
 }
 
 .hb-table th,
 .hb-table td,
 .tbl th,
 .tbl td {
-    border: 1px solid #333333;
-    padding: 5pt 6pt;
+    border: 0.75pt solid #CBD5E1;
+    padding: 6pt 8pt;
     vertical-align: top;
     word-wrap: break-word;
     overflow-wrap: break-word;
     font-size: 9.5pt;
-    line-height: 1.3;
+    line-height: 1.35;
     background: transparent;
-    color: #000000;
+    color: #1a1a1a;
     text-align: left;
 }
 
 .hb-table th,
 .tbl th {
     font-weight: 700;
-    background: transparent;
+    background: #0263A3;
+    color: #ffffff;
     text-align: left;
+    border-color: #0558A0;
+    letter-spacing: 0.3px;
+    font-size: 9pt;
+    text-transform: uppercase;
+    padding: 7pt 8pt;
+}
+
+/* Alternating row striping */
+.hb-table tbody tr:nth-child(even),
+.tbl tbody tr:nth-child(even) {
+    background: #F4F7FA;
+}
+
+.hb-table tbody tr:nth-child(odd),
+.tbl tbody tr:nth-child(odd) {
+    background: #ffffff;
 }
 
 /* comparison table */
@@ -447,28 +472,43 @@ tr {
 .tbl-comparison th {
     text-align: left;
     font-size: 9pt;
-    background: transparent;
+    background: #0263A3;
+    color: #ffffff;
 }
 
 .hb-table th.is-regular-col,
 .hb-table td.is-regular-col,
 .tbl th.is-regular-col,
 .tbl td.is-regular-col {
-    color: #31849B;
+    color: #ffffff;
     font-weight: 700;
+    background: #31849B;
+}
+
+.hb-table td.is-regular-col,
+.tbl td.is-regular-col {
+    color: #31849B;
+    background: transparent;
 }
 
 .hb-table th.is-prime-col,
 .hb-table td.is-prime-col,
 .tbl th.is-prime-col,
 .tbl td.is-prime-col {
-    color: #1F497D;
+    color: #ffffff;
     font-weight: 700;
+    background: #1F497D;
+}
+
+.hb-table td.is-prime-col,
+.tbl td.is-prime-col {
+    color: #1F497D;
+    background: transparent;
 }
 
 /* ------------------------------
    PROGRAM TABLES
-   No shading
+   Branded header, refined borders
    ------------------------------ */
 .hb-programs,
 table.programs {
@@ -476,8 +516,8 @@ table.programs {
     border-collapse: collapse;
     table-layout: fixed;
     max-width: 100%;
-    margin: 8pt 0 10pt;
-    border: 1px solid #333333;
+    margin: 10pt 0 14pt;
+    border: none;
     font-family: "Century Gothic", "Segoe UI", sans-serif;
 }
 
@@ -485,26 +525,40 @@ table.programs {
 .hb-programs td,
 table.programs th,
 table.programs td {
-    border: 1px solid #333333;
-    padding: 4.5pt 5pt;
+    border: 0.75pt solid #CBD5E1;
+    padding: 5pt 6pt;
     vertical-align: top;
     word-wrap: break-word;
     overflow-wrap: break-word;
     font-size: 8.75pt;
-    line-height: 1.25;
+    line-height: 1.3;
     background: transparent;
-    color: #000000;
+    color: #1a1a1a;
 }
 
 .hb-programs th,
 table.programs th {
     font-weight: 700;
-    background: transparent;
-    text-transform: none;
+    background: #199970;
+    color: #ffffff;
+    text-transform: uppercase;
     text-align: left;
-    letter-spacing: 0;
+    letter-spacing: 0.3px;
+    font-size: 8.5pt;
+    border-color: #168760;
+    padding: 6pt 6pt;
 }
 
+/* Program table alternating rows */
+.hb-programs tbody tr:nth-child(even),
+table.programs tbody tr:nth-child(even) {
+    background: #F0FAF6;
+}
+
+.hb-programs tbody tr:nth-child(odd),
+table.programs tbody tr:nth-child(odd) {
+    background: #ffffff;
+}
 .hb-programs td,
 table.programs td {
     text-align: left;
@@ -588,12 +642,15 @@ table.programs td:nth-child(5) {
 .toc-heading {
     display: block;
     width: 100%;
-    font-size: 12pt;
+    font-size: 14pt;
     font-weight: 700;
     text-transform: uppercase;
-    margin: 0 0 8pt;
+    margin: 0 0 14pt;
+    padding-bottom: 6pt;
+    border-bottom: 2.5pt solid #0263A3;
     color: #0263A3;
     line-height: 1.2;
+    letter-spacing: 0.6px;
 }
 
 .toc-table {
@@ -607,10 +664,10 @@ table.programs td:nth-child(5) {
 .toc-table td {
     border: none;
     vertical-align: bottom;
-    padding: 2pt 0;
-    line-height: 1.2;
+    padding: 3.5pt 0;
+    line-height: 1.3;
     font-size: 10pt;
-    color: #111111;
+    color: #222222;
     background: transparent;
     text-align: left;
 }
@@ -620,7 +677,7 @@ table.programs td:nth-child(5) {
 }
 
 .toc-dots {
-    border-bottom: 1px dotted #777777;
+    border-bottom: 1pt dotted #AABBCC;
     height: 0.9em;
     padding: 0;
 }
@@ -629,7 +686,7 @@ table.programs td:nth-child(5) {
     width: 34pt;
     text-align: right;
     font-weight: 700;
-    color: #111111;
+    color: #0263A3;
     white-space: nowrap;
     padding-left: 6pt;
 }
@@ -659,8 +716,9 @@ table.programs td:nth-child(5) {
 
 .toc-table a,
 .toc-table a:visited {
-    color: #111111;
+    color: #222222;
     text-decoration: none;
+    border-bottom: none;
 }
 
 /* ------------------------------
@@ -669,7 +727,7 @@ table.programs td:nth-child(5) {
 .section-block {
     display: block;
     width: 100%;
-    margin: 0 0 8pt;
+    margin: 0 0 12pt;
     padding: 0;
     border: none;
 }
@@ -695,18 +753,20 @@ table.programs td:nth-child(5) {
 }
 
 .hb-step {
-    margin: 0 0 8pt;
-    padding: 0 0 2pt;
+    margin: 0 0 12pt;
+    padding: 8pt 0 8pt 12pt;
+    border-left: 3pt solid #199970;
+    background: #F6FBF9;
     page-break-inside: avoid;
     break-inside: avoid;
 }
 
 .hb-step-title {
-    font-size: 10pt;
+    font-size: 10.5pt;
     font-weight: 700;
     color: #199970;
     margin: 0 0 4pt;
-    line-height: 1.2;
+    line-height: 1.25;
     page-break-after: avoid;
     break-after: avoid;
 }
@@ -756,20 +816,23 @@ table.programs td:nth-child(5) {
 
 .hb-uni-name,
 .uni-name {
-    font-size: 14pt;
+    font-size: 15pt;
     font-weight: 700;
-    margin: 0 0 6pt;
+    margin: 0 0 3pt;
+    padding-bottom: 5pt;
+    border-bottom: 2.5pt solid #0263A3;
     color: #0263A3;
     line-height: 1.2;
     text-transform: none;
-    letter-spacing: 0.1px;
+    letter-spacing: 0.2px;
 }
 
 .hb-uni-name a,
 .hb-uni-name-link,
 .uni-name a.uni-name-link {
     color: #0263A3;
-    text-decoration: underline;
+    text-decoration: none;
+    border-bottom: none;
     font-weight: 700;
 }
 
@@ -854,8 +917,9 @@ table.programs td:nth-child(5) {
     width: 100%;
     max-height: 180pt;
     height: 180pt;
-    border: 1px solid #333333;
+    border: 0.75pt solid #CBD5E1;
     object-fit: cover;
+    box-shadow: 0 1pt 4pt rgba(0,0,0,0.10);
 }
 
 .hb-campus-caption,
@@ -867,11 +931,11 @@ table.programs td:nth-child(5) {
 .campus-placeholder-cell {
     width: 100%;
     min-height: 120pt;
-    border: 1px dashed #999999;
-    color: #666666;
+    border: 1pt dashed #CBD5E1;
+    color: #94A3B8;
     font-size: 10pt;
     padding: 10pt;
-    background: transparent;
+    background: #F8FAFC;
 }
 
 /* ------------------------------
@@ -894,12 +958,13 @@ table.programs td:nth-child(5) {
 .hb-benefits-bar,
 .benefits-bar {
     display: inline-block;
-    background: #00F600;
-    color: #000000;
+    background: linear-gradient(135deg, #199970 0%, #00C853 100%);
+    color: #ffffff;
     font-weight: 700;
-    padding: 2pt 6pt;
+    padding: 4pt 12pt;
     font-size: 10pt;
     line-height: 1.35;
+    letter-spacing: 0.3px;
 }
 
 .hb-benefits-ul,
@@ -932,8 +997,9 @@ table.programs td:nth-child(5) {
 .hb-benefit-text,
 .benefit-text {
     display: inline-block;
-    background: #00FCFC;
-    padding: 1pt 4pt;
+    background: #E0F7FA;
+    padding: 2pt 6pt;
+    border-left: 2pt solid #00BCD4;
 }
 
 .benefit-bullet {
@@ -945,19 +1011,19 @@ table.programs td:nth-child(5) {
    Black, bold, numbered
    ------------------------------ */
 .hb-university-list {
-    margin: 0 0 10pt 18pt;
+    margin: 4pt 0 12pt 18pt;
     padding: 0;
     list-style: decimal;
     font-size: 10pt;
-    color: #000000;
+    color: #1a1a1a;
 }
 
 .hb-university-list li {
-    margin: 0 0 4pt;
+    margin: 0 0 5pt;
     padding-left: 0;
     font-weight: 700;
-    line-height: 1.4;
-    color: #000000;
+    line-height: 1.45;
+    color: #0263A3;
 }
 
 .hb-university-list li::before {
@@ -969,12 +1035,15 @@ table.programs td:nth-child(5) {
    ------------------------------ */
 .hb-qualify,
 .qualify {
-    margin: 8pt 0 6pt;
+    margin: 10pt 0 8pt;
     font-weight: 700;
     font-size: 10pt;
     font-style: normal;
-    color: #000000;
-    width: 50%;
+    color: #1a1a1a;
+    width: 100%;
+    padding: 8pt 10pt;
+    background: #F4F7FA;
+    border-left: 3pt solid #0263A3;
 }
 
 .hb-muted,
@@ -1073,10 +1142,11 @@ table.programs td:nth-child(5) {
 .sec-contributions table.programs th,
 .sec-funding .hb-programs th,
 .sec-funding table.programs th {
-    color: #199970;
+    color: #ffffff;
     font-weight: 700;
     font-size: 10pt;
     line-height: 1.2;
+    background: #199970;
 }
 
 .sec-funding .hb-table,
@@ -1091,8 +1161,9 @@ table.programs td:nth-child(5) {
 
 .sec-funding .hb-table th,
 .sec-funding .tbl th {
-    color: #199970;
+    color: #ffffff;
     font-weight: 700;
+    background: #199970;
 }
 
 /* Images must stay inside margins */
@@ -1107,12 +1178,13 @@ table.programs td:nth-child(5) {
 
 /* Banner heading (teal background bar) */
 .hb-banner-heading {
-    background-color: #199970;
+    background: linear-gradient(135deg, #199970 0%, #0D7B55 100%);
     color: #FFFFFF !important;
-    padding: 6pt 10pt;
-    margin: 10pt 0 6pt;
-    font-size: 11pt;
+    padding: 8pt 14pt;
+    margin: 12pt 0 8pt;
+    font-size: 11.5pt;
     font-weight: 700;
+    letter-spacing: 0.4px;
 }
 
 /* Page break before Relocation Cost */
@@ -1123,13 +1195,13 @@ table.programs td:nth-child(5) {
 
 /* Relocation cost table — merged note cell */
 .hb-relocation-table {
-    margin: 0 0 10pt;
+    margin: 0 0 12pt;
 }
 
 .hb-relocation-table td {
     vertical-align: top;
-    padding: 3pt 6pt;
-    border: 1pt solid #CCCCCC;
+    padding: 5pt 8pt;
+    border: 0.75pt solid #CBD5E1;
     font-size: 9.5pt;
 }
 
@@ -1144,17 +1216,18 @@ table.programs td:nth-child(5) {
 
 /* ISP FINANCING line */
 .hb-isp-financing {
-    margin: 14pt 0 6pt;
-    padding: 6pt 0;
-    border-top: 1.5pt solid #000000;
-    border-bottom: 1.5pt solid #000000;
+    margin: 16pt 0 8pt;
+    padding: 8pt 0;
+    border-top: 2pt solid #0263A3;
+    border-bottom: 2pt solid #0263A3;
     text-align: center;
-    font-size: 10pt;
+    font-size: 10.5pt;
+    letter-spacing: 0.3px;
 }
 
 .hb-isp-financing strong {
     font-weight: 700;
-    color: #000000;
+    color: #0263A3;
 }
 
 .hb-isp-financing em {
@@ -1167,7 +1240,8 @@ table.programs td:nth-child(5) {
 .hb-credit-note {
     text-align: center;
     color: #199970;
-    font-size: 10pt;
+    font-size: 10.5pt;
     font-weight: 700;
-    margin: 6pt 0;
+    margin: 8pt 0;
+    letter-spacing: 0.2px;
 }