/* Print layout: DIN A4, only the inner content of the CV card is put on paper. */

@page {
    size: A4 portrait;
    margin: 15mm 14mm;
}

@media print {

    html,
    body,
    body.bg-dark.text-light {
        background: #fff !important;
        background-image: none !important;
        color: #000 !important;
        width: 100%;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 10.5pt;
        line-height: 1.35;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* Strip away the screen chrome: only the card body content reaches the paper. */
    .container {
        max-width: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .cv-card {
        background: #fff !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        max-width: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .cv-card > .card-body {
        padding: 0 !important;
    }

    /* Elements that make no sense on paper. */
    .show-more-btn,
    .print-button,
    .contact-icon,
    script {
        display: none !important;
    }

    /* Everything that is collapsed on screen is fully expanded on paper. */
    .collapse-skill-list {
        max-height: none !important;
        overflow: visible !important;
        transition: none !important;
    }

    /* Header */
    .cv-header-photo {
        flex: 0 0 30% !important;
        max-width: 30% !important;
        margin-bottom: 0 !important;
    }

    .cv-header-info {
        flex: 0 0 70% !important;
        max-width: 70% !important;
        text-align: left !important;
    }

    /* Source portrait is only 247x236px, so keep it small to stay sharp at 300dpi. */
    .cv-profile-img {
        width: 24mm !important;
        height: 24mm !important;
        border: 1px solid #999 !important;
        background: #fff !important;
        transform: none !important;
        image-rendering: auto;
    }

    .cv-profile-img:hover {
        transform: none !important;
    }

    .cv-title {
        color: #000 !important;
        font-size: 22pt !important;
        margin-bottom: 0.15rem !important;
    }

    .job-title,
    .cv-section-title,
    .cv-sidebar h6 {
        color: #1f3350 !important;
    }

    .job-title {
        font-size: 13pt !important;
    }

    .blockquote-footer {
        color: #444 !important;
    }

    .cv-sidebar,
    .cv-main,
    .cv-section-text,
    .timeline .timeline-item h5,
    .cv-sidebar span {
        color: #000 !important;
    }

    /* Printed contact details (icons are useless on paper). */
    .print-contact {
        display: table !important;
        border-collapse: collapse;
        margin: 0 0 0.9rem 0;
        font-size: 8.5pt;
        color: #000 !important;
    }

    .print-contact th,
    .print-contact td {
        border: none;
        padding: 0.05rem 0;
        vertical-align: top;
        white-space: nowrap;
    }

    .print-contact th {
        font-weight: 600;
        text-align: left;
        padding-right: 6mm;
        color: #1f3350 !important;
    }

    a,
    a:visited {
        color: #000 !important;
        text-decoration: none !important;
    }

    /* Keep the two column layout, Bootstrap breakpoints do not apply at A4 width. */
    .row {
        display: flex !important;
        flex-wrap: wrap !important;
    }

    .cv-sidebar {
        flex: 0 0 32% !important;
        max-width: 32% !important;
        padding-right: 6mm !important;
        border-right: 1px solid #ccc;
    }

    .cv-main {
        flex: 0 0 68% !important;
        max-width: 68% !important;
        padding-left: 6mm !important;
    }

    /* Skills */
    .skill {
        margin-bottom: 0.1rem !important;
        padding-left: 0 !important;
        font-size: 8pt !important;
        line-height: 1.25;
        flex-wrap: nowrap !important;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .skill > div:first-child {
        flex: 0 0 62% !important;
        max-width: 62% !important;
        padding-right: 0 !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .skill > div:last-child {
        flex: 0 0 38% !important;
        max-width: 38% !important;
        padding-left: 0 !important;
        white-space: nowrap;
    }

    .cv-sidebar .skill span {
        font-size: 7pt !important;
        line-height: 1;
    }

    .skill-star {
        opacity: 1 !important;
        transform: none !important;
        animation: none !important;
        filter: none !important;
    }

    .skill-star i {
        color: #b58900 !important;
        font-size: 6.5pt;
    }

    .cv-sidebar h6 {
        margin-bottom: 0.4rem !important;
        font-size: 10pt;
        border-bottom: 1px solid #ccc;
        padding-bottom: 0.15rem;
    }

    /* Sections */
    .cv-section-title {
        font-size: 13pt !important;
        margin-bottom: 0.6rem !important;
        border-bottom: 1px solid #ccc;
        padding-bottom: 0.15rem;
        break-after: avoid;
        page-break-after: avoid;
    }

    section,
    .cv-sidebar > div {
        break-inside: auto;
        margin-bottom: 0.9rem !important;
    }

    .cv-hr {
        display: none !important;
    }

    /* Experience timeline */
    .timeline {
        border-left: 1px solid #bbb !important;
        margin-left: 3mm !important;
    }

    .timeline .timeline-item {
        margin-bottom: 1rem !important;
        padding-left: 5mm !important;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .timeline .timeline-item::before {
        background-color: #333 !important;
        border: 1px solid #fff !important;
        width: 9px;
        height: 9px;
        left: -5px;
        top: 3px;
    }

    .timeline .timeline-item h5 {
        font-size: 11.5pt !important;
        margin-bottom: 0.2rem !important;
    }

    .timeline .timeline-item h5 span {
        color: #1f3350 !important;
    }

    .experience-meta {
        font-size: 9pt !important;
        color: #333 !important;
    }

    .experience-meta .d-none.d-sm-inline,
    .experience-meta .dash {
        display: inline !important;
    }

    .experience-meta .d-block.d-sm-inline {
        display: inline !important;
    }

    .experience-hr {
        border-color: #ddd !important;
        margin: 0.25rem 0 0.35rem 0 !important;
    }

    .experience-description,
    .experience-tasks {
        font-size: 10pt;
    }

    .experience-tasks ul {
        margin-bottom: 0 !important;
    }

    .experience-technologies {
        margin-top: 0.4rem !important;
    }

    .experience-technologies .badge {
        background: #fff !important;
        color: #000 !important;
        border: 1px solid #888;
        font-weight: 400;
        font-size: 7.5pt;
        padding: 0.15em 0.45em;
    }

    /* Footer prints once at the end of the document. */
    .cv-footer {
        margin-top: 1rem !important;
        font-size: 8pt !important;
        color: #555 !important;
        border-top: 1px solid #ccc;
        padding-top: 0.35rem;
    }

    /* Avoid orphan/widow lines. */
    p,
    li,
    h5,
    h6 {
        orphans: 3;
        widows: 3;
    }
}