@charset "UTF-8";
/* Root styles */
* {
    --light-text: rgb(0, 0, 0);
    --light-bg: rgb(216, 216, 216);
    --dark-text: rgb(243, 243, 243);
    --dark-bg: rgb(18, 18, 18);
    box-sizing: border-box;
    border-collapse: collapse;
    font-family: Arial, Helvetica, sans-serif;
}
:root {
    color-scheme: light dark;
    color: light-dark(rgb(0, 0, 0), rgb(243, 243, 243));
    background-color: light-dark(rgb(216, 216, 216), rgb(18, 18, 18));
    border-color: light-dark(rgb(0, 0, 0), rgb(243, 243, 243));
    /* Prevent font scaling in landscape while allowing user zoom */
    /* https://stackoverflow.com/a/2711132 */
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}
.light {
    color-scheme: light;
    color: var(--light-text);
    background-color: var(--light-bg);
    border-color: var(--light-text);
}
.dark {
    color-scheme: dark;
    color: var(--dark-text);
    background-color: var(--dark-bg);
    border-color: var(--dark-text);
}
#schemeSelectorContainer {
    padding-top: 1em;
}
/* Elemental styles */
body {
    margin-inline: 0.25in;
}
header,
footer,
form {
    margin: auto;
    max-width: 8in;
}
header h1.subhead {
    font-size: 1.5em;
}
fieldset {
    border: 1px solid;
    margin-top: 1.5em;
    padding-inline: 0.75em;
}
fieldset div:has(label[for$="Initials"]) {
    vertical-align: top;
}
input,
textarea,
select {
    font-size: 1em;
    background-color: light-dark(rgb(252, 252, 252),rgb(54, 54, 54));
}
select {
    padding: 2px;
}
legend {
    box-sizing: content-box;
    background-color: light-dark(hsl(195, 53%, 72%), hsl(240, 100%, 27%));
    border: 1px solid;
    padding: 0.5em;
    position: relative;
    right: calc(0.75em + 1px);
    width: calc(100% + 0.5em);
}
legend h2 {
    margin-block: 0;
}
label:has(+input:required):not([for$="Initials"])::after,
label:has(+textarea:required)::before,
span.required::after {
    color: light-dark(crimson, red) !important;
    content: " * ";
    font-weight: bold;
}
label:not(:has(+ textarea:required)),
span:not(.required) {
    margin-right: 0.25em;
}
label+input:not([type="radio"]) {
    margin-right: 0.25em;
}
input[id*="stName"] {
    max-width: 12.5em;
}
input[id*="iddleName"] {
    max-width: 8em;
}
input[type="number"] {
    width: 6ch;
}
input.dateMonth,
input.dateDay {
    width: 3em;
}
input.dateYear {
    width: 4.25em;
}
input:not([type="radio"]),
select,
textarea {
    border: 1.5px solid;
    border-radius: 0px !important;
}
textarea {
    display: block;
    margin-top: 0.5em;
    resize: none;
    overflow-y: scroll;
    width: 100%;
}
.centeredContainer {
    margin-inline: auto;
    max-width: fit-content;
}
button {
    font-size: 1em;
    color: light-dark(var(--light-text),var(--dark-text));
    background-color: light-dark(hsl(195, 53%, 72%), hsl(240, 100%, 27%));
    padding: 0.5em;
    &:hover {
        background-color: light-dark(hsl(195, 53%, 81%), hsl(240, 100%, 54%));
    }
    &:disabled {
        background-color: silver;
        color: gray;
    }
}
#makePDFButton {
    font-size: 1.15em;
    font-weight: bold;
}
a {
    &:link {
        color: light-dark(rgb(45, 54, 252), rgb(0, 144, 234));
    }
    &:visited {
        color: light-dark(rgb(162, 0, 162), rgb(243, 0, 243));
    }
    &:hover {
        color: light-dark(rgb(144, 72, 0), rgb(189, 126, 0));
    }
    &:active {
        color: light-dark(rgb(0, 108, 54), rgb(0, 153, 0));
    }
}
/* Field/Class styles */
.formLine {
    margin-block: 0.75em;
}
.fullName,
.address {
    width: 22em;
}
.initials {
    width: 3.6em;
}
.zip {
    width: 11ch;
}
.phone {
    width: 20ch;
}
.phoneContainer {
    display: inline-block;
    margin-block: 0.25em;
    margin-right: 0.5em;
}
.phoneArea,
.phonePrefix {
    width: 5ch;
}
.phoneLine {
    width: 6ch;
}
.agreement {
    display: grid;
    grid-template-columns: 1fr 10fr;
}
#grade {
    width: 10em;
}
#schoolType {
    width: 18ex;
}
/* Flex/Grid styles */
.conditions,
.services {
    display: grid;
}
.conditions {
    grid-auto-flow: column;
}
#ptMedicalHistoryConditions .conditions {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
#familyMedicalHistoryConditions .conditions {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(5, 1fr);
}
#systemsPhysiological .conditions {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
#systemsSensory .conditions {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
#systemsSocial .conditions {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(6, 1fr);
    grid-auto-flow: row;
}
#systemsRepetitive .conditions {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(4, 1fr);
}
#systemsOther .conditions {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(5, 1fr);
}
.services {
    grid-template-columns: 1fr;
}
.services .flexQuestion {
    column-gap: 1em;
}
.flexQuestion {
    display: flex;
    flex-flow: row wrap;
    align-content: center;
    align-items: center;
    border: 0.5px solid;
    padding: 5px;
}
.numberQuestionContainer,
.radioQuestionContainer {
    display: grid;
    width: 100%;
    align-items: center;
}
.numberQuestionContainer {
    grid-template-columns: 2.5fr 1fr;
}
.radioQuestionContainer {
    grid-template-columns: 3fr 0.7fr;
    gap: 5px;
}
.questionContainer,
.textQuestionContainer {
    display: flex;
    align-items: center;
}
.services .radioQuestionContainer,
.services .textQuestionContainer {
    flex-basis: 48%;
}
.conditions .textQuestionContainer {
    flex-basis: 100%;
}
.flexQuestion input+label {
    margin-right: 0.75em;
}
.siblingGrid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 0.25em;
    width: 67%;
}
.siblingNameField {
    width: calc(100% - 4em);
}
.siblingGrid .ageField {
    max-width: 5.8em;
}
/* "Radio" button and label styles */
input[type="radio"] {
    /* margin-left: 0.5em; */
    /* margin-right: 0.25em; */
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
input[type="radio"]+label {
    border: 2px solid transparent;
    margin-right: 0;
    padding: 2px;
}
input[type="radio"]:hover+label {
    border: 2px solid light-dark(rgba(0, 0, 0, 50%), rgba(243, 243, 243, 50%));
}
input[type="radio"]:checked+label {
    border: 2px solid;
    font-weight: bold;
}
.optionsContainer {
    padding-block: 2px;
    width: fit-content;
}
.formLine>.radioQuestionContainer {
    grid-template-columns: 1fr 2fr;
}
div[id="gender"]>.radioQuestionContainer {
    width: 16em;
}
div[id="emCtPhoneType"]>.radioQuestionContainer {
    width: 19em;
}
div[id$="RelType"]>.radioQuestionContainer {
    grid-template-columns: 16ex auto;
}
div[id^="parents"]>.radioQuestionContainer {
    grid-template-columns: 1.25fr 4fr;
}
#medAlg>.radioQuestionContainer,
#devHist>.radioQuestionContainer {
    grid-template-columns: auto 1fr;
}
.educationQuestionContainer {
    display: grid;
    grid-template-columns: 1.1fr 18ex 2fr;
    align-items: center;
}
/* Responsive styles */
@media screen and (max-width:799px) {
    body {
        margin-inline: 4px;
    }
    header,
    footer,
    form,
    fieldset {
        margin: 0;
        width: 100%;
    }
    #schemeSelectorContainer {
        margin-bottom: 1em;
    }
    .formLine {
        margin-block: 1.25em;
    }
    label:not([for*="sibling"]):not([for$="Initials"])+input:not([type="radio"]):not([type="checkbox"]):not([class^="date"]):not([class^="phone"]) {
        display: block;
        margin-block: 1em;
    }
    label+input.initials,
    label+input.zip,
    label+input#pregTerm {
        display: inline;
    }
    .fullName,
    .address {
        width: 100%;
    }
    .phoneContainer {
        margin-block: 0.75em;
    }
    .agreement {
        display: grid;
        grid-template-columns: 1.5fr 8fr;
    }
    .siblingGrid {
        width: 100%;
    }
    .siblingGrid input {
        margin-top: 5px;
    }
    .flexQuestion {
        min-height: 3em;
    }
    #medAlg>.radioQuestionContainer {
        grid-template-columns: 1.1fr 1fr;
    }
    div[id^="neq"]>.radioQuestionContainer,
    div[id^="vax"]>.radioQuestionContainer,
    div[id^="parents"]>.radioQuestionContainer {
        grid-template-columns: 22ex auto;
    }
    .educationQuestionContainer {
        display: grid;
        grid-template-columns: 3fr 2.25fr;
        align-items: center;
    }
    .conditions,
    .services {
        grid-template-columns: 1fr !important;
        grid-auto-flow: row !important;
    }
    .services .radioQuestionContainer,
    .services .textQuestionContainer {
        flex-basis: 100%;
    }
    .services .optionsContainer {
        margin-top: 0.25em;
    }
}
/* Print styles */
@page {
    margin-top: 0.5in;
    margin-bottom: 0.5in;
    margin-left: 0.5in;
    margin-right: 0.5in;
}
/*
^ Source - https://stackoverflow.com/a/25452499
Posted by William Hertling, modified by me.
Retrieved 2026-03-31, License - CC BY-SA 3.0
*/
@media print {
    *:not(legend) {
        margin-block: 0pt !important;
        margin-inline: 1pt !important;
        padding-block: 0pt !important;
        padding-inline: 1pt !important;
    }
    :root {
        color-scheme: light;
        color: black;
        background-color: white;
        border-color: black;
        font-size: 11pt;
    }
    header,
    fieldset {
        margin-bottom: 0.05in !important;
    }
    h1 {
        font-size: 16pt !important;
    }
    h1.subhead {
        font-size: 14pt !important;
    }
    legend {
        background-color: white;
        width: 8in;
        left: -0.5pt;
        border: 2pt solid;
        padding: 2pt;
    }
    h2 {
        font-size: 12pt !important;
    }
    h3, h4, .formLine {
        font-size: 11.5pt !important;
        margin-block: 2pt !important;
    }
    .conditions,
    .services {
        margin-inline: auto !important;
    }
    .dateContainer,
    .phoneContainer,
    .radioQuestionContainer {
        margin-left: 0pt !important;
        padding-left: 0pt !important;
    }
    #genderCtr,
    #emCtPhoneTypeCtr {
        margin-block: 6pt !important;
    }
    .dateContainer,
    div[id$="RelType"]>.radioQuestionContainer {
        width: fit-content;
    }
    div[id^="neq"]>.radioQuestionContainer,
    div[id^="vax"]>.radioQuestionContainer,
    div[id^="parents"]>.radioQuestionContainer {
        grid-template-columns: 2in auto;
    }
    .siblingGrid {
        margin-block: 0.1in !important;
    }
    button,
    .instructions,
    #schemeSelectorContainer {
        display: none;
    }
    label,
    input,
    textarea,
    select {
        margin-block: 0.25pt !important;
        padding-block: 0.5pt !important;
        border-radius: 0pt !important;
    }
    input {
        border-color: transparent !important;
        border-bottom-color: black !important;
    }
    .conditions input,
    .services input {
        border-width: 0pt !important;
        margin-block: 0.5pt !important;
    }
    textarea {
        margin-block: 1pt !important;
        margin-inline: auto !important;
        overflow-y: hidden;
    }
    ::placeholder {
        color: transparent !important; /* Makes placeholders invisible */
    }
    div,
    textarea,
    legend,
    fieldset {
        break-inside: avoid;
    }
    /*
    ^ Source - https://stackoverflow.com/a/907719
    Posted by Dmitri Farkov, modified by me.
    Retrieved 2025-11-27, License - CC BY-SA 4.0
    */
    #birthHistory {
        break-before: page;
    }
}