/* ==========================================================================
   /RegisterPrint - the paper registration form (registrationPaperFormHtml(),
   RegistrationRenderFunctions.php)

   On a screen: the how-to-print line on the page ground, then the form as
   one parchment card. On paper: the form alone on two Letter pages, its one
   "Office use" box at the foot of the second (a box at the top as well
   would push the form onto a third sheet). The form was drawn for a page
   laid out 992px wide and shrunk onto the paper, and every other page now
   prints at the paper's own width and full size (aca-base.css section 13),
   so section 6 zooms this one to 720/992 - the 992px design on Letter, its
   11pt type printing at about 8pt, as before. The poster's sheet does the
   same.
   ========================================================================== */

.reg-paper-page .reg-paper-section {
    padding-top: var(--aca-space-5);
}

.reg-paper-wrap {
    max-width: 62rem;
    margin: 0 auto;
}

.reg-paper__hint {
    margin: 0 0 var(--aca-space-3);
    color: var(--aca-fg-muted);
    line-height: 1.4;
}

.reg-paper {
    padding: var(--aca-space-5);
    color: var(--aca-fg);
    line-height: 1.3;
}

/* --------------------------------------------------------------------------
   1. Head, office box, foot
   -------------------------------------------------------------------------- */

.reg-paper__head {
    display: flex;
    align-items: center;
    gap: var(--aca-space-4);
    padding-bottom: var(--aca-space-3);
    border-bottom: 2px solid var(--aca-fg-strong);
}

.reg-paper__logo {
    flex: 0 0 auto;
    width: 4.5rem;
    height: auto;
}

.reg-paper__heading {
    flex: 1 1 auto;
    min-width: 0;
}

.reg-paper__school {
    margin: 0;
    color: var(--aca-fg-muted-strong);
    font-weight: 700;
}

.reg-paper__title {
    margin: 0;
    color: var(--aca-fg-strong);
    font-size: var(--aca-text-2xl);
    font-weight: 800;
    line-height: 1.15;
}

.reg-paper__lead {
    margin: var(--aca-space-1) 0 0;
}

.reg-paper__code {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: var(--aca-space-3);
    margin: 0;
}

.reg-paper__qr {
    flex: 0 0 auto;
    width: 6rem;
    height: 6rem;
}

/* As wide as the link, which never breaks: the sentence wraps to it. */
.reg-paper__code-text {
    width: min-content;
}

.reg-paper__code-text strong {
    display: block;
    color: var(--aca-fg-strong);
    white-space: nowrap;
}

/* A fieldset, so its legend sits in a gap of the dashed border - on paper
   too, where a background behind the words would not print. */
.reg-paper__office {
    min-width: 0;
    margin: var(--aca-space-3) 0 0;
    padding: 0 var(--aca-space-3) var(--aca-space-2);
    border: 2px dashed var(--aca-fg-muted);
    border-radius: var(--aca-radius-sm);
}

.reg-paper__office-title {
    width: auto;
    margin: 0;
    padding: 0 var(--aca-space-1);
    color: var(--aca-fg-muted-strong);
    font-size: var(--aca-text-sm);
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.reg-paper__office-lines {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 var(--aca-space-5);
}

/* The foot box's two tick rows (Payment type | Also bought, Paid by |
   Payment plan): both groups on one line, the second at the right edge so
   it reads apart, their ticks set closer than the family's so a wider
   printer font keeps each row on one line; a narrow screen wraps the
   second group under the first. */
.reg-paper__office-ticks {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    column-gap: var(--aca-space-4);
}

.reg-paper__office-ticks .reg-paper__ask,
.reg-paper__office-ticks .reg-paper__choices {
    column-gap: var(--aca-space-2);
}

.reg-paper__office--child {
    margin: var(--aca-space-1) 0;
    padding: 0 var(--aca-space-2) var(--aca-space-1);
}

.reg-paper__foot {
    margin: var(--aca-space-3) 0 0;
    padding-top: var(--aca-space-2);
    border-top: 1px solid var(--aca-fg-strong);
    color: var(--aca-fg-muted);
    text-align: center;
}

/* --------------------------------------------------------------------------
   2. Parts and people
   -------------------------------------------------------------------------- */

.reg-paper__part {
    margin-top: var(--aca-space-2);
}

.reg-paper__part-title {
    display: flex;
    align-items: center;
    gap: var(--aca-space-2);
    margin: 0 0 var(--aca-space-1);
    padding-bottom: var(--aca-space-1);
    border-bottom: 1px solid var(--aca-fg-strong);
    color: var(--aca-fg-strong);
    font-size: var(--aca-text-lg);
    font-weight: 800;
}

.reg-paper__part-number {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border: 2px solid var(--aca-orange);
    border-radius: var(--aca-radius-pill);
    color: var(--aca-orange-ink);
    font-size: var(--aca-text-sm);
}

.reg-paper__cols {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--aca-space-2) var(--aca-space-5);
}

.reg-paper__cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--aca-space-2) var(--aca-space-4);
}

.reg-paper__pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 var(--aca-space-3);
}

.reg-paper__person-title {
    margin: var(--aca-space-1) 0 0;
    color: var(--aca-fg-strong);
    font-size: var(--aca-text-sm);
    font-weight: 800;
}

.reg-paper__sub {
    margin: var(--aca-space-2) 0 0;
    color: var(--aca-fg-strong);
    font-weight: 700;
}

.reg-paper__fact {
    margin: 0;
}

.reg-paper__note {
    margin: 0;
    color: var(--aca-fg-muted);
}

/* The emergency care consent's two lines (registrationPaperConsentHtml()), bulleted above its one tick; on
   paper the bullets move into the line (section 6). */
.reg-paper__points {
    margin: 0;
    padding-left: var(--aca-space-5);
}

/* --------------------------------------------------------------------------
   3. Answers: a ruled line, ticks, the date of birth
   -------------------------------------------------------------------------- */

.reg-paper__line {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    column-gap: var(--aca-space-2);
}

.reg-paper__label {
    flex: 0 1 auto;
    padding-top: var(--aca-space-1);
    font-weight: 600;
}

.reg-paper__rule {
    flex: 1 1 5rem;
    min-width: 5rem;
    height: 1.625rem;
    border-bottom: 1px solid var(--aca-fg);
}

.reg-paper__rule--row {
    flex-basis: 100%;
}

.reg-paper__dob {
    column-gap: var(--aca-space-3);
}

.reg-paper__dob .reg-paper__label {
    flex-basis: 100%;
}

.reg-paper__dob-part {
    display: inline-flex;
    align-items: flex-end;
    gap: var(--aca-space-1);
}

.reg-paper__caption {
    color: var(--aca-fg-muted);
}

.reg-paper__rule--month,
.reg-paper__rule--day,
.reg-paper__rule--year {
    flex: 0 0 auto;
    min-width: 0;
}

.reg-paper__rule--month,
.reg-paper__rule--year {
    width: 3rem;
}

.reg-paper__rule--day {
    width: 2rem;
}

.reg-paper__ask {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0 var(--aca-space-3);
    padding-top: 2px;
}

.reg-paper__ask .reg-paper__label {
    padding-top: 0;
}

.reg-paper__choices {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0 var(--aca-space-3);
}

.reg-paper__choice {
    display: inline-flex;
    align-items: baseline;
    gap: var(--aca-space-2);
}

.reg-paper__box {
    flex: 0 0 auto;
    align-self: center;
    width: 1rem;
    height: 1rem;
    border: 2px solid var(--aca-fg);
}

.reg-paper__if {
    color: var(--aca-fg-muted);
    font-style: italic;
    font-weight: 400;
}

.reg-paper__req {
    margin-left: 2px;
    color: var(--aca-orange-ink);
    font-weight: 800;
}

/* --------------------------------------------------------------------------
   4. Agreements, signature, address
   -------------------------------------------------------------------------- */

.reg-paper__agreements {
    column-count: 2;
    column-gap: var(--aca-space-5);
}

.reg-paper__agreement-title {
    margin: var(--aca-space-1) 0 0;
    color: var(--aca-fg-strong);
    font-size: var(--aca-text-sm);
    font-weight: 800;
    break-after: avoid;
}

.reg-paper__agreement-text {
    margin: 0 0 var(--aca-space-1);
}

.reg-paper__sign {
    display: grid;
    grid-template-columns: 2fr 2fr 1fr;
    gap: 0 var(--aca-space-4);
}

.reg-paper__address {
    display: flex;
    flex-wrap: wrap;
    gap: 0 var(--aca-space-4);
}

.reg-paper__address > .reg-paper__line {
    flex: 1 1 10rem;
}

.reg-paper__address > .reg-paper__line:last-child {
    flex: 3 1 20rem;
}

/* --------------------------------------------------------------------------
   5. Phones and tablets: one column - on a screen only, because a printed
   page matches max-width: 991px too (its width is the paper's) and keeps the
   columns.
   -------------------------------------------------------------------------- */

@media screen and (max-width: 991px) {
    .reg-paper {
        padding: var(--aca-space-4);
    }

    .reg-paper__head {
        flex-wrap: wrap;
    }

    .reg-paper__code {
        flex-basis: 100%;
    }

    .reg-paper__code-text {
        width: auto;
        min-width: 0;
    }

    .reg-paper__code-text strong {
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .reg-paper__office-lines,
    .reg-paper__cols,
    .reg-paper__cols--3,
    .reg-paper__pair,
    .reg-paper__sign {
        grid-template-columns: minmax(0, 1fr);
    }

    .reg-paper__agreements {
        column-count: 1;
    }
}

/* --------------------------------------------------------------------------
   6. Paper: two Letter pages, the card's frame dropped; a block never splits
   across the page break.
   -------------------------------------------------------------------------- */

@media print {
    @page {
        size: letter portrait;
        margin: 0.4in 0.5in;
    }

    /* The 992px design on Letter (the sheet's head says why); at 11pt the
       children and their "More than three children?" line share page one. */
    .reg-paper-page {
        zoom: 0.7258;
        font-size: 11pt;
    }

    .reg-paper-page .reg-paper-section {
        padding: 0;
    }

    .reg-paper-wrap {
        max-width: none;
    }

    .reg-paper {
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
        break-inside: auto;
    }

    .reg-paper__person,
    .reg-paper__office,
    .reg-paper__line,
    .reg-paper__ask,
    .reg-paper__points,
    .reg-paper__sign,
    .reg-paper__agreement-text {
        break-inside: avoid;
    }

    /* The children fill most of the first page: where a printer's fonts run
       longer, they go on over the break line by line instead of all moving on. */
    .reg-paper__cols--3 > .reg-paper__person {
        break-inside: auto;
    }

    .reg-paper__part-title {
        break-inside: avoid;
        break-after: avoid;
    }

    /* The consent's bullets inside the line, narrow, and no gutter (a bullet
       hung in a narrow one is cut off at the sheet's edge): its longer line
       then keeps to one printed line in the usual printer fonts, and with
       Daycare offered the whole part still ends on page one. */
    .reg-paper__points {
        padding-left: 0;
        list-style: none;
    }

    .reg-paper__points > li::before {
        content: "\2022";
        margin-right: var(--aca-space-1);
    }
}
