/* PHSD Vaccine Ordering - form styling.
   Every rule is scoped to body.phsd2-order-form, a class the plugin adds
   only on pages rendering form 28. Nothing here affects any other
   form or page. */

/* ===== Site chrome on the ordering form ===== */
body.phsd2-order-form .mht-navbar-nav,
body.phsd2-order-form .article-breadcrumbs,
body.phsd2-order-form .footer__menus { display: none !important; }

body.phsd2-order-form .mht-navbar-right > *:not(.desktop-language):not(:has(.desktop-language)) { display: none !important; }

body.phsd2-order-form .entry-content > .wp-block-heading,
body.phsd2-order-form .article-body > .wp-block-heading { display: none !important; }

body.phsd2-order-form .mht-navbar-bottom { position: relative !important; }

body.phsd2-order-form .language-selector {
  position: absolute !important;
  right: 40px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  z-index: 5;
}
body.phsd2-order-form .desktop-language {
  display: inline-block !important;
  font-family: UnitPro, sans-serif;
  font-weight: 300;
  font-size: 0.9375rem;
  color: var(--primary, #00747A);
  text-decoration: none;
  padding: 4px 8px;
  white-space: nowrap;
}
body.phsd2-order-form .desktop-language:focus-visible {
  outline: 2px solid var(--primary, #00747A);
  outline-offset: 2px;
}
@media (max-width: 782px) {
  body.phsd2-order-form .language-selector { right: 16px !important; }
}
body.phsd2-order-form .article-body { padding-top: 24px; }


/* ===== Form styling ===== */
/* ---- Primary buttons: Submit + Next (identical styling) ---- */
body.phsd2-order-form .gform_wrapper.gform_wrapper input[type="submit"].gform_button.button, body.phsd2-order-form .gform_wrapper.gform_wrapper input.gform_next_button.button {
  width: fit-content;
  padding: 12px 28px;
  border-radius: 6px;
  background-color: var(--primary);
  color: #fff;
  border: 1px solid var(--primary);
  cursor: pointer;
  -webkit-appearance: none !important;
  text-decoration: none;
}/* ---- Secondary buttons: Previous + Save (white / outlined) ---- */
body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_previous_button.button, body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_save_link.button {
  width: fit-content;
  padding: 12px 28px;
  border-radius: 6px;
  background-color: #fff;
  color: #6b7280;
  border: 1px solid #cfd6df;
  cursor: pointer;
  -webkit-appearance: none !important;
  text-decoration: none;
  display: inline-block;
}/* Optional hover states */
body.phsd2-order-form .gform_wrapper.gform_wrapper input.gform_next_button.button:hover, body.phsd2-order-form .gform_wrapper.gform_wrapper input[type="submit"].gform_button.button:hover {
  filter: brightness(0.95);
}body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_previous_button.button:hover, body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_save_link.button:hover {
  background-color: #f9fafb;
}/* =========================================================
   Details page — even vertical spacing + row alignment
   ========================================================= */

/* Even, roomy gaps between all fields */
body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_fields {
  row-gap: 20px !important;
  column-gap: 24px !important;
}/* Consistent label-to-input spacing on every field */
body.phsd2-order-form .gform_wrapper.gform_wrapper .gfield_label {
  margin-bottom: 6px !important;
}/* Normalize the Address complex field's sub-labels
   (Street Address, Address Line 2, City, Province, Postal Code) */
body.phsd2-order-form .gform_wrapper.gform_wrapper .ginput_complex label, body.phsd2-order-form .gform_wrapper.gform_wrapper .ginput_container_address label {
  margin-top: 4px !important;
  margin-bottom: 4px !important;
  line-height: 1.3 !important;
}/* Give the address sub-rows their own even spacing */
body.phsd2-order-form .gform_wrapper.gform_wrapper .ginput_container_address {
  row-gap: 16px !important;
}/* ---- Phone / Email row alignment ---- */

/* Make fields in the same row top-align instead of stretching unevenly */
body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_fields > .gfield:not(.vax-dose):not(.vax-info):not(.rs-cell):not(.rs-elig) {
  align-self: start !important;
}/* Email field: keep GF's native two-input layout, just tidy sub-label spacing.
   "Enter Email" / "Confirm Email" stay below the inputs (GF default). */
body.phsd2-order-form .gform_wrapper.gform_wrapper .ginput_container_email {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
}body.phsd2-order-form .gform_wrapper.gform_wrapper .ginput_container_email label {
  margin: 4px 0 0 0 !important;
  font-size: 13px !important;
  color: #6b7280 !important;
}/* Ensure all inputs in the row share the same height */
body.phsd2-order-form .gform_wrapper.gform_wrapper input[type="text"], body.phsd2-order-form .gform_wrapper.gform_wrapper input[type="email"], body.phsd2-order-form .gform_wrapper.gform_wrapper input[type="tel"], body.phsd2-order-form .gform_wrapper.gform_wrapper select {
  height: 42px !important;
  box-sizing: border-box !important;
}body.phsd2-order-form .gform_wrapper.gform_wrapper .gf_progressbar_percentage.percentbar_blue {
  background:
    linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.25) 50%, rgba(255,255,255,0) 100%),
    linear-gradient(90deg, #044e54 0%, #0a7d84 50%, #0d9aa3 100%);
  background-size: 40% 100%, 100% 100%;
  background-repeat: no-repeat;
  color: #fff;
  animation: progressStreak 2.5s linear infinite;
}@keyframes progressStreak {0% { background-position: -50% 0, 0 0; }100% { background-position: 150% 0, 0 0; }
}/* Date field fills its column */
body.phsd2-order-form .gform_wrapper.gform_wrapper .ginput_container_date {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
}body.phsd2-order-form .gform_wrapper.gform_wrapper .ginput_container_date input {
  flex: 1 1 auto !important;
  width: 100% !important;
  box-sizing: border-box !important;
}body.phsd2-order-form .gform_wrapper .gfield.contact-changed-check {
  margin: 8px 0 !important;
  padding: 10px 12px !important;
  border: 1px solid #cfd6df !important;
  background: #fff !important;
  box-sizing: border-box !important;
}body.phsd2-order-form .gform_wrapper .gfield.contact-changed-check .gfield_label {
  display: none !important;   /* the choice text carries the message */
}body.phsd2-order-form .gform_wrapper .gfield.contact-changed-check .gchoice {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  font-size: 13px !important;
}body.phsd2-order-form .gform_wrapper .gfield.contact-changed-check .gchoice label {
  margin: 0 !important;
  line-height: 1.4 !important;
  font-weight: 400 !important;
}body.phsd2-order-form .gform_wrapper .gfield.contact-changed-check input[type="checkbox"] {
  margin-top: 2px !important;
  flex: 0 0 auto !important;
}body.phsd2-order-form .gform_wrapper .gfield.contact-changed-check {
  background: #f8fafc !important;   /* faint grey-blue instead of white */
}/* ===== File upload field — matches details- blocks ===== */

body.phsd2-order-form .gform_wrapper .gfield.details-upload {
  margin: 8px 0 !important;
  padding: 0 !important;
}body.phsd2-order-form .gform_wrapper .gfield.details-upload .gfield_label {
  background: #e1e5eb;
  font-weight: 700;
  font-size: 13px;
  color: #000;
  padding: 8px 12px !important;
  margin: 0 !important;
  border: 1px solid #cfd6df;
  border-bottom: none;
  display: block;
}body.phsd2-order-form .gform_wrapper .gfield.details-upload .ginput_container {
  border: 1px solid #cfd6df;
  background: #fff;
  padding: 14px 16px !important;
  margin: 0 !important;
}/* --- Basic single-file upload (input[type=file]) --- */
body.phsd2-order-form .gform_wrapper .gfield.details-upload input[type="file"] {
  width: 100%;
  padding: 8px;
  border: 1px dashed #cfd6df;
  background: #fafbfc;
  box-sizing: border-box;
  font-size: 13px;
}/* --- Multi-file / drag-and-drop uploader --- */
body.phsd2-order-form .gform_wrapper .gfield.details-upload .gform_drop_area {
  border: 1px dashed #cfd6df !important;
  background: #fafbfc !important;
  border-radius: 0 !important;
  padding: 24px 16px !important;
  text-align: center;
  color: #4b5563;
  font-size: 13px;
}body.phsd2-order-form .gform_wrapper .gfield.details-upload .gform_drop_instructions {
  display: block;
  margin-bottom: 10px;
  color: #4b5563;
}body.phsd2-order-form .gform_wrapper .gfield.details-upload .gform_button_select_files {
  background: #fff !important;
  border: 1px solid #cfd6df !important;
  border-radius: 0 !important;
  color: #1f2937 !important;
  padding: 8px 16px !important;
  font-size: 13px !important;
  cursor: pointer;
}body.phsd2-order-form .gform_wrapper .gfield.details-upload .gform_button_select_files:hover {
  background: #f8fafc !important;
}/* Uploaded-file list */
body.phsd2-order-form .gform_wrapper .gfield.details-upload .ginput_preview, body.phsd2-order-form .gform_wrapper .gfield.details-upload .gfield_fileupload_filename {
  border-top: 1px solid #f0f2f5;
  padding: 8px 0;
  font-size: 13px;
}/* Roomy field pages: Information (2) + Provider Details (3) */
body.phsd2-order-form [id^="gform_page_"][id$="_2"] .gform_fields, body.phsd2-order-form [id^="gform_page_"][id$="_3"] .gform_fields {
  row-gap: 20px !important;
  column-gap: 24px !important;
}/* Flush pages: Attestation (4) + vaccine table pages (6–9) */
body.phsd2-order-form [id^="gform_page_"][id$="_4"] .gform_fields, body.phsd2-order-form [id^="gform_page_"][id$="_6"] .gform_fields, body.phsd2-order-form [id^="gform_page_"][id$="_7"] .gform_fields, body.phsd2-order-form [id^="gform_page_"][id$="_8"] .gform_fields, body.phsd2-order-form [id^="gform_page_"][id$="_9"] .gform_fields {
  column-gap: 0 !important;
  row-gap: 0 !important;
}body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_next_button, body.phsd2-order-form .gform_wrapper .gform-theme-button.gform_next_button {
  color: #fff !important;
}body.phsd2-order-form [id^="gform_page_"][id$="_9"] .gform_save_link {
  display: none !important;
}/* =========================================================
   Shared "details" card system — used by Information (p2),
   Attestation (p4), and any block using .details-* markup.
   Lives here (global) so no single content block owns it.
   ========================================================= */
body.phsd2-order-form .details-info {
  width: 100%;
  margin: 16px 0 24px 0;
  box-sizing: border-box;
}body.phsd2-order-form .details-info *, body.phsd2-order-form .details-info *::before, body.phsd2-order-form .details-info *::after { box-sizing: border-box; }body.phsd2-order-form .details-info strong { font-weight: 300; color: #000; }body.phsd2-order-form .details-info a { color: var(--wp--preset--color--primary); }body.phsd2-order-form .details-block {
  width: 100%;
  border: 1px solid #cfd6df;
  margin-bottom: 16px;
}body.phsd2-order-form .details-block:last-child { margin-bottom: 0; }body.phsd2-order-form .details-title {
  background: #e1e5eb;
  padding: 8px 12px;
  border-bottom: 1px solid #cfd6df;
  font-family: UnitPro, sans-serif;
  font-weight: 300;
  color: var(--wp--preset--color--tertiary);
}body.phsd2-order-form .details-body { padding: 12px; }body.phsd2-order-form .details-body p { margin: 0 0 1rem 0; }body.phsd2-order-form .details-body p:last-child { margin-bottom: 0; }body.phsd2-order-form .details-subhead { font-weight: 400; color: #000; margin: 0 0 6px 0; }body.phsd2-order-form .details-body ul { margin: 0 0 1rem 0; padding-left: 1.25rem; }body.phsd2-order-form .details-body li { margin-bottom: .5rem; }body.phsd2-order-form .details-body li:last-child { margin-bottom: 0; }body.phsd2-order-form .details-caution {
  margin-top: 1rem !important;
  padding: 10px 12px;
  background: #fafafa;
  border-left: 3px solid #000;
}body.phsd2-order-form .details-contact-table { width: 100%; border-collapse: collapse; }body.phsd2-order-form .details-contact-table td {
  padding: 8px 0;
  vertical-align: top;
  border-bottom: 1px solid #f0f2f5;
}body.phsd2-order-form .details-contact-table tr:last-child td { border-bottom: none; }body.phsd2-order-form .details-contact-label { width: 32%; padding-right: 16px; color: var(--font-gray); }/* ---- 1. auto-generated range hint: visually hidden ------------------ */
body.phsd2-order-form [id^="gform_page_"][id$="_6"] .gfield_description.instruction, body.phsd2-order-form [id^="gform_page_"][id$="_7"] .gfield_description.instruction, body.phsd2-order-form [id^="gform_page_"][id$="_9"] .gfield_description.instruction {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}body.phsd2-order-form [id^="gform_page_"][id$="_6"] .gfield--type-number.gfield_error, body.phsd2-order-form [id^="gform_page_"][id$="_7"] .gfield--type-number.gfield_error, body.phsd2-order-form [id^="gform_page_"][id$="_9"] .gfield--type-number.gfield_error {
  position: relative !important;
}body.phsd2-order-form [id^="gform_page_"][id$="_6"] .gfield--type-number .gfield_validation_message, body.phsd2-order-form [id^="gform_page_"][id$="_7"] .gfield--type-number .gfield_validation_message, body.phsd2-order-form [id^="gform_page_"][id$="_9"] .gfield--type-number .gfield_validation_message, body.phsd2-order-form [id^="gform_page_"][id$="_6"] .gfield--type-number .validation_message, body.phsd2-order-form [id^="gform_page_"][id$="_7"] .gfield--type-number .validation_message, body.phsd2-order-form [id^="gform_page_"][id$="_9"] .gfield--type-number .validation_message {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  z-index: 30 !important;
  width: max-content !important;
  max-width: 300px !important;
  white-space: normal !important;
  margin: 4px 0 0 0 !important;
  padding: 8px 10px !important;
  background: #fff9f9 !important;
  border: 1px solid #c02b0a !important;
  border-radius: 4px !important;
  box-shadow: 0 4px 12px rgba(15, 23, 32, 0.18) !important;
  font-size: 0.8125rem !important;
  line-height: 1.35 !important;
  pointer-events: none;   /* don't block the input underneath */
}/* Keep the errored input itself marked, since the message now floats away */
body.phsd2-order-form [id^="gform_page_"][id$="_6"] .gfield--type-number.gfield_error input, body.phsd2-order-form [id^="gform_page_"][id$="_7"] .gfield--type-number.gfield_error input, body.phsd2-order-form [id^="gform_page_"][id$="_9"] .gfield--type-number.gfield_error input {
  border: 1px solid #c02b0a !important;
  background: #fff9f9 !important;
}/* Narrow screens: the overlay can sit off-screen at the right edge, so
   anchor it to the right instead. */
body.phsd2-order-form @media (max-width: 820px) {body.phsd2-order-form [id^="gform_page_"][id$="_6"] .gfield--type-number .gfield_validation_message, body.phsd2-order-form [id^="gform_page_"][id$="_7"] .gfield--type-number .gfield_validation_message, body.phsd2-order-form [id^="gform_page_"][id$="_9"] .gfield--type-number .gfield_validation_message, body.phsd2-order-form [id^="gform_page_"][id$="_6"] .gfield--type-number .validation_message, body.phsd2-order-form [id^="gform_page_"][id$="_7"] .gfield--type-number .validation_message, body.phsd2-order-form [id^="gform_page_"][id$="_9"] .gfield--type-number .validation_message {
    left: auto !important;
    right: 0 !important;
    max-width: 220px !important;
  }
}/* ===== Comment box ===== */
/* ---- 1. reorder: label, description, then the input ---- */
body.phsd2-order-form #field_10_218 {
  display: flex !important;
  flex-direction: column !important;
}body.phsd2-order-form #field_10_218 .gfield_label { order: 1; }body.phsd2-order-form #field_10_218 .gfield_description { order: 2; }body.phsd2-order-form #field_10_218 .ginput_container { order: 3; }body.phsd2-order-form #field_10_218 .gfield_validation_message, body.phsd2-order-form #field_10_218 .validation_message { order: 4; }/* ---- 2. style the description as a notice ---- */
body.phsd2-order-form #field_10_218 .gfield_description {
  position: relative;
  margin: 0 0 10px 0 !important;
  padding: 10px 12px 10px 36px !important;
  border-left: 3px solid #b7791f;
  background: #fdf8ec;
  border-radius: 3px;
  box-sizing: border-box;
  font-family: UnitPro, sans-serif;
  font-weight: 300;
  font-size: 0.8125rem !important;
  line-height: 1.5;
  color: #4b5563;
  width: 100%;
}/* Warning triangle, drawn in CSS so no image or escape sequence is needed. */
body.phsd2-order-form #field_10_218 .gfield_description::before {
  content: "";
  position: absolute;
  left: 12px;
  top: 12px;
  width: 16px;
  height: 16px;
  background-color: #b7791f;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 9v4'/><path d='M12 17h.01'/><path d='M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/></svg>") no-repeat center / contain;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 9v4'/><path d='M12 17h.01'/><path d='M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/></svg>") no-repeat center / contain;
}/* The PHI sentence, wrapped in <strong> in the Description box. */
body.phsd2-order-form #field_10_218 .gfield_description strong {
  display: block;
  margin-top: 6px;
  font-weight: 400;
  color: #000;
}/* ===== Mobile enhancements ===== */
/* ---------- 1) PAGINATION (phone <=799) ---------- */
body.phsd2-order-form @media (max-width: 799px) {body.phsd2-order-form .gform_wrapper .gf_page_steps, body.phsd2-order-form #gf_page_steps_10 {
    display:flex !important; flex-wrap:wrap !important; justify-content:flex-start !important;
    align-items:center !important; gap:8px 8px !important;
    padding:0 !important; margin-bottom:14px !important;
    border:none !important; background:transparent !important; box-shadow:none !important;
  }body.phsd2-order-form .gform_wrapper .gf_step {
    flex:0 0 auto !important; margin:0 3px !important; padding:0 !important; width:auto !important;
    display:flex !important; align-items:center !important; justify-content:center !important;
  }body.phsd2-order-form .gform_wrapper .gf_step_label { display:none !important; }body.phsd2-order-form .gform_wrapper .gf_step_number {
    width:32px !important; height:32px !important; min-width:32px !important; max-width:32px !important;
    line-height:1 !important;
    display:flex !important; align-items:center !important; justify-content:center !important;
    font-size:13px !important; padding:0 !important; box-sizing:border-box !important;
  }body.phsd2-order-form .gform_wrapper .gf_step_completed .gf_step_number, body.phsd2-order-form .gform_wrapper .gf_step_active .gf_step_number {
    transform:none !important; animation:none !important;
    position:relative !important;
  }body.phsd2-order-form .gform_wrapper .gf_step_completed .gf_step_number svg, body.phsd2-order-form .gform_wrapper .gf_step_completed .gf_step_number img, body.phsd2-order-form .gform_wrapper .gf_step_completed .gf_step_number::before {
    display:none !important; content:none !important;
  }body.phsd2-order-form .gform_wrapper .gf_step_completed .gf_step_number { font-size:0 !important; }body.phsd2-order-form .gform_wrapper .gf_step_completed .gf_step_number::after {
    content:"✓" !important;
    display:flex !important; align-items:center !important; justify-content:center !important;
    position:absolute !important; top:0 !important; left:0 !important; right:0 !important; bottom:0 !important;
    font-size:16px !important; line-height:1 !important; color:#fff !important; font-weight:400 !important;
  }body.phsd2-order-form .gf-mobile-stepcue {
    display:block; text-align:left; font-family:UnitPro,sans-serif; font-weight:400;
    font-size:0.95rem; color:var(--primary,#00747A); margin:0 0 8px 0;
  }
}@media (min-width: 800px) {body.phsd2-order-form .gf-mobile-stepcue { display:none; } }/* ---------- 2) FOOTER BUTTONS ---------- */
body.phsd2-order-form @media (max-width: 1004px) {body.phsd2-order-form .gform_wrapper .gform-page-footer, body.phsd2-order-form .gform_wrapper .gform_page_footer {
    display:flex !important; flex-direction:column !important; align-items:flex-start !important;
    gap:10px !important;
  }body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_previous_button, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_next_button, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_button, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_save_link, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_previous_button, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_next_button, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_button, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_save_link {
    margin:0 !important; float:none !important; align-self:flex-start !important;
    min-height:44px !important;   /* comfortable touch target */
  }body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_previous_button, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_previous_button { order:1 !important; }body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_next_button, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_button, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_next_button, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_button { order:2 !important; }body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_save_link, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_save_link { order:3 !important; }
}@media (max-width: 699px) {body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_previous_button, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_next_button, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_button, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_save_link, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_previous_button, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_next_button, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_button, body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_save_link {
    width:100% !important; text-align:center !important; justify-content:center !important; align-self:stretch !important;
  }
}/* ---------- 3) INJECTED dose caption (phone card only, <=799) ---------- */
body.phsd2-order-form .gf-dose-cap { display:none; }@media (max-width: 799px) {body.phsd2-order-form .gf-dose-cap {
    display:block !important; font-family:UnitPro,sans-serif !important;
    font-size:0.8125rem !important; font-weight:400 !important;
    color:#4b5563 !important; line-height:1.25 !important; margin:0 0 5px 0 !important;
  }
}/* ---------- 4) TABLET TABLE (800-1024) ---------- */
body.phsd2-order-form @media (min-width: 800px) and (max-width: 1024px) {body.phsd2-order-form .vax-grid, body.phsd2-order-form .rs-grid { font-size:0.85rem !important; width:100% !important; align-items:stretch !important; }body.phsd2-order-form .vax-info-box { align-items:stretch !important; min-height:100% !important; }body.phsd2-order-form .vax-info-box > div, body.phsd2-order-form .vax-header-row > div, body.phsd2-order-form .rs-cell, body.phsd2-order-form .rs-header-row > div {
    padding:8px !important; font-size:0.82rem !important; line-height:1.3 !important;
    overflow-wrap:anywhere !important; word-break:break-word !important; align-items:flex-start !important;
  }body.phsd2-order-form .gform_wrapper .gfield.vax-dose, body.phsd2-order-form .gform_wrapper .gfield.rs-cell {
    padding:6px 8px !important; min-height:64px !important;
    display:flex !important; flex-direction:column !important; justify-content:center !important;
  }/* 16px minimum: anything smaller makes iOS Safari zoom the page on focus,
     and 800-1024 is exactly the iPad range. */
  body.phsd2-order-form .gform_wrapper .gfield.vax-dose input, body.phsd2-order-form .gform_wrapper .gfield.rs-cell input {
    height:40px !important; font-size:16px !important; width:100% !important; box-sizing:border-box !important;
  }
}/* ---------- 5) PHONE CARD LAYOUT (<=799) ---------- */
body.phsd2-order-form @media (max-width: 799px) {body.phsd2-order-form .vax-header-row, body.phsd2-order-form .vax-grid.vax-header-row, body.phsd2-order-form .rs-header-row { display:none !important; }body.phsd2-order-form .vax-grid, body.phsd2-order-form .rs-grid {
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    border:none !important; font-size:1rem !important;
    gap:0 !important;
  }body.phsd2-order-form .gform_wrapper .gfield.vax-info, body.phsd2-order-form .gform_wrapper .gfield.vax-info--6, body.phsd2-order-form .gform_wrapper .gfield.vax-info--8 {
    grid-column:1 / -1 !important; margin:0 !important; padding:0 !important;
  }body.phsd2-order-form .vax-info-box, body.phsd2-order-form .vax-info-box--2col, body.phsd2-order-form .vax-info-box--3col {
    display:block !important; grid-template-columns:1fr !important;
    border:1px solid #cfd6df !important; border-bottom:none !important;
    border-radius:8px 8px 0 0 !important; background:#f7f9fa !important; margin-top:16px !important;
  }body.phsd2-order-form .vax-info-box > div { border:none !important; border-bottom:1px solid #eef1f3 !important; padding:8px 12px !important; }body.phsd2-order-form .vax-info-box > div:last-child { border-bottom:none !important; }body.phsd2-order-form .vax-info-box .vax-name {
    font-size:1.0625rem !important; font-weight:400 !important; color:#000 !important; background:#eef2f4 !important;
  }body.phsd2-order-form .vax-pack { justify-content:flex-start !important; text-align:left !important; }body.phsd2-order-form .vax-pack::before { content:"Packaging: "; color:#6b7280; margin-right:4px; }body.phsd2-order-form .gform_wrapper .gfield.vax-dose {
    grid-column:span 1 !important;
    width:auto !important; margin:0 !important; float:none !important;
    border:1px solid #cfd6df !important; border-top:none !important; border-right:none !important;
    padding:10px 12px !important; min-height:0 !important; background:#fff !important;
    box-sizing:border-box !important; display:block !important;
  }body.phsd2-order-form .gform_wrapper .gfield.vax-required { border-right:1px solid #cfd6df !important; border-radius:0 0 8px 8px !important; }body.phsd2-order-form .gform_wrapper .gfield.vax-dose input {
    width:100% !important; height:44px !important; font-size:16px !important;
    text-align:left !important; padding:6px 10px !important; box-sizing:border-box !important;
  }/* ===== RESPIRATORY (phone) ===== */
  body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-info, body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-info-solo, body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-elig-gf, body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-band, body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-band-note, body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-blackout {
    grid-column:1 / -1 !important;
    align-self:auto !important; min-height:0 !important; margin:0 !important;
  }body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-cell {
    grid-column:span 6 !important;
    align-self:auto !important; min-height:0 !important; margin:0 !important;
    display:block !important;
    border:1px solid #cfd6df !important; border-top:none !important; border-right:none !important;
    padding:10px 12px !important; box-sizing:border-box !important;
  }body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-onhand { border-radius:0 0 0 8px !important; }body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-order { border-right:1px solid #cfd6df !important; border-radius:0 0 8px 0 !important; }body.phsd2-order-form #gform_fields_10_9 .rs-header-inner { display:none !important; }body.phsd2-order-form #gform_fields_10_9 .rs-info-inner {
    display:block !important; grid-template-columns:1fr !important;
    border:1px solid #cfd6df !important; border-bottom:none !important;
    border-radius:8px 8px 0 0 !important; background:#f7f9fa !important;
    min-height:0 !important; height:auto !important; margin-top:16px !important;
  }body.phsd2-order-form #gform_fields_10_9 .rs-info-inner > div { border:none !important; border-bottom:1px solid #eef1f3 !important; padding:8px 12px !important; }body.phsd2-order-form #gform_fields_10_9 .rs-info-inner > div:last-child { border-bottom:none !important; }body.phsd2-order-form #gform_fields_10_9 .rs-name { background:#eef2f4 !important; padding:8px 12px !important; }/* Label hidden visually, NOT removed from the accessibility tree. The
     injected caption carries the visible name; aria-label on the input
     carries it for assistive tech. */
  body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-cell > label, body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-cell .gfield_label, body.phsd2-order-form .gform_wrapper .gfield.vax-dose > label, body.phsd2-order-form .gform_wrapper .gfield.vax-dose .gfield_label {
    position:absolute !important; width:1px !important; height:1px !important;
    padding:0 !important; margin:-1px !important; overflow:hidden !important;
    clip:rect(0 0 0 0) !important; white-space:nowrap !important; border:0 !important;
  }body.phsd2-order-form #gform_fields_10_9 > .gfield.rs-cell input {
    width:100% !important; height:44px !important; font-size:16px !important;
    text-align:left !important; padding:6px 10px !important; box-sizing:border-box !important;
  }
}/* ===== Step navigation ===== */
/* ===== Animated Steps ===== */
body.phsd2-order-form .gform_wrapper .gf_progressbar_wrapper { padding: 0; margin-bottom: 24px; }body.phsd2-order-form .gform_wrapper .gf_step { transition: all 0.35s ease; opacity: 0.55; }body.phsd2-order-form .gform_wrapper .gf_step_number {
  border: 2px solid #cfd6df !important;
  background: #fff !important;
  color: #6b7280 !important;
  font-family: UnitPro, sans-serif !important;
  transition: background 0.35s ease, border-color 0.35s ease, color 0.35s ease, transform 0.35s ease;
}body.phsd2-order-form .gform_wrapper .gf_step_completed { opacity: 1; }body.phsd2-order-form .gform_wrapper .gf_step_completed .gf_step_number {
  background: var(--primary, #00747A) !important;
  border-color: var(--primary, #00747A) !important;
  color: #fff !important;
}body.phsd2-order-form .gform_wrapper .gf_step_active { opacity: 1; }body.phsd2-order-form .gform_wrapper .gf_step_active .gf_step_number {
  background: var(--primary, #00747A) !important;
  border-color: var(--primary, #00747A) !important;
  color: #fff !important;
  transform: scale(1.12);
  animation: gfPulse 2s ease-in-out infinite;
}@keyframes gfPulse {0%, 100% { box-shadow: 0 0 0 0 rgba(0,116,122,0.4); }50% { box-shadow: 0 0 0 8px rgba(0,116,122,0); }
}body.phsd2-order-form .gform_wrapper .gf_step_label {
  font-family: UnitPro, sans-serif !important;
  font-weight: 300 !important;
  transition: color 0.35s ease, font-weight 0.35s ease;
}body.phsd2-order-form .gform_wrapper .gf_step_active .gf_step_label {
  color: var(--primary, #00747A) !important;
  font-weight: 400 !important;
}/* Clickable steps — forward and back */
body.phsd2-order-form .gform_wrapper .gf_step.gf-step-clickable { cursor: pointer; }body.phsd2-order-form .gform_wrapper .gf_step.gf-step-clickable:hover { opacity: 0.85; }body.phsd2-order-form .gform_wrapper .gf_step.gf-step-clickable .gf_step_number:hover {
  transform: scale(1.1);
  filter: brightness(0.92);
}body.phsd2-order-form .gform_wrapper .gf_step.gf-step-clickable:focus-visible {
  outline: 2px solid var(--primary, #00747A);
  outline-offset: 3px;
}/* While walking pages, block further clicks */
body.phsd2-order-form.gf-stepping .gform_wrapper .gf_step { pointer-events: none; }body.phsd2-order-form.gf-stepping .gform_wrapper { opacity: 0.75; transition: opacity 0.2s ease; }/* Status message */
body.phsd2-order-form .gf-step-status {
  position: fixed;
  left: 50%;
  bottom: 24px;
  transform: translateX(-50%);
  background: #16202b;
  color: #fff;
  font-family: UnitPro, sans-serif;
  font-weight: 300;
  font-size: 0.9375rem;
  padding: 10px 18px;
  border-radius: 4px;
  z-index: 100001;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}body.phsd2-order-form .gf-step-status--on { opacity: 1; }@media (prefers-reduced-motion: reduce) {body.phsd2-order-form .gform_wrapper .gf_step, body.phsd2-order-form .gform_wrapper .gf_step_number, body.phsd2-order-form .gform_wrapper .gf_step_label { transition: none; }body.phsd2-order-form .gform_wrapper .gf_step_active .gf_step_number { animation: none; }
}/* ===== Read-only fields ===== */
/* Read-only styling — reads as "displayed value", not "broken input". */
body.phsd2-order-form .gform_wrapper input[readonly] {
  background: #f1f3f5 !important;
  border-color: #dde2e8 !important;
  color: #333b45 !important;
  cursor: default !important;
  box-shadow: none !important;
}body.phsd2-order-form .gform_wrapper input[readonly]:focus {
  outline: 2px solid var(--primary, #00747A);
  outline-offset: 2px;
}/* ===== Number field guard ===== */
/* Mark a field the browser is refusing to parse */
body.phsd2-order-form .gfield--type-number input.num-bad {
  border: 1px solid #c02b0a !important;
  background: #fff9f9 !important;
}body.phsd2-order-form .num-guard-msg {
  display: none;
  position: fixed;
  left: 50%;
  bottom: 24px;
  transform: translateX(-50%);
  z-index: 100002;
  background: #b42318;
  color: #fff;
  font-family: UnitPro, sans-serif;
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.4;
  padding: 10px 18px;
  border-radius: 4px;
  max-width: 90vw;
  box-shadow: 0 6px 20px rgba(15, 23, 32, 0.25);
}body.phsd2-order-form .num-guard-msg.num-guard-on { display: block; }/* ===== Early submit button ===== */
/* ---- the early submit button ---- */
body.phsd2-order-form .gform_wrapper .gf-early-submit {
  display: none;
  align-items: center;
  justify-content: center;
  font-family: UnitPro, sans-serif;
  font-weight: 400;
  font-size: 0.9375rem;
  line-height: 1.2;
  padding: 11px 20px;
  cursor: pointer;
  border-radius: 8px;
  background: #B5147F;
  border: 1px solid #B5147F;
  color: #fff;
  transition: filter 0.15s ease;
}body.phsd2-order-form .gform_wrapper .gf-early-submit.gf-early-on { display: inline-flex; }body.phsd2-order-form .gform_wrapper .gf-early-submit:hover { filter: brightness(0.92); }body.phsd2-order-form .gform_wrapper .gf-early-submit:focus-visible {
  outline: 2px solid #8F0F66;
  outline-offset: 2px;
}/* ---- footer layout ----
   Default: single row, Save & Continue pushed right by its auto margin. */
body.phsd2-order-form .gform_wrapper .gform_page_footer, body.phsd2-order-form .gform_wrapper .gform_footer {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}body.phsd2-order-form .gform_wrapper .gform_save_link {
  margin-left: auto !important;
}/* ---- 1138px and below ----
   Drop the auto margin so Save & Continue follows the nav buttons and, when
   the row runs out of space, wraps to the left of the second row. */
body.phsd2-order-form @media (max-width: 1138px) {body.phsd2-order-form .gform_wrapper .gform_page_footer, body.phsd2-order-form .gform_wrapper .gform-page-footer, body.phsd2-order-form .gform_wrapper .gform_footer {
    row-gap: 12px !important;
  }body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_save_link, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_save_link, body.phsd2-order-form .gform_wrapper .gform_footer .gform_save_link {
    margin-left: 0 !important;
  }
}/* ---- 1004px and below ----
   ANOTHER HTML FIELD already switches the footer to a column at this width
   and assigns orders (Previous 1, Next 2, Save 3). That rule has the same
   specificity as a plain .gform_wrapper selector, so these use the wrapper
   ID to outrank it. Our button just needs a slot in that existing stack.

   TODO: consolidate the two footer rules into one field. Two blocks laying
   out the same element is how the page-9 save-link conflict started. */
body.phsd2-order-form @media (max-width: 1004px) {body.phsd2-order-form .gform_wrapper .gform_page_footer .gf-early-submit, body.phsd2-order-form .gform_wrapper .gform-page-footer .gf-early-submit {
    order: 3 !important;
    align-self: flex-start !important;
    margin-left: 0 !important;
  }body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_save_link, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_save_link {
    order: 4 !important;
  }
}/* ---- 799px and below: every button full width ---- */
body.phsd2-order-form @media (max-width: 799px) {body.phsd2-order-form .gform_wrapper .gform_page_footer, body.phsd2-order-form .gform_wrapper .gform-page-footer, body.phsd2-order-form .gform_wrapper .gform_footer {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    row-gap: 10px !important;
  }body.phsd2-order-form .gform_wrapper .gform_page_footer > *, body.phsd2-order-form .gform_wrapper .gform-page-footer > *, body.phsd2-order-form .gform_wrapper .gform_footer > * {
    width: 100% !important;
    max-width: none !important;
    align-self: stretch !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    justify-content: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }/* Keep the same order as the wider column layout. */
  body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_previous_button, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_previous_button { order: 1 !important; }body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_next_button, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_next_button { order: 2 !important; }body.phsd2-order-form .gform_wrapper .gform_page_footer .gf-early-submit, body.phsd2-order-form .gform_wrapper .gform-page-footer .gf-early-submit { order: 3 !important; }body.phsd2-order-form .gform_wrapper .gform_page_footer .gform_save_link, body.phsd2-order-form .gform_wrapper .gform-page-footer .gform_save_link { order: 4 !important; }
}/* ===== Links open in new tab ===== */
/* Visually hidden text announcing the new tab — required for WCAG 3.2.5,
   since an unannounced context change disorients screen reader users. */
body.phsd2-order-form .newtab-sr {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}/* ===== Buttons ===== */
body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_next_button, body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_button[type="submit"], body.phsd2-order-form .gform_wrapper.gform_wrapper input[type="submit"].gform_button, body.phsd2-order-form .gform_wrapper.gform_wrapper button.gform_button, body.phsd2-order-form .gform_wrapper.gform_wrapper .gf-early-submit {
  width: fit-content;
  padding: 12px 28px;
  border-radius: 6px;
  background-color: var(--primary, #00747A);
  background-image: none;
  color: #fff;
  border: 1px solid var(--primary, #00747A);
  box-shadow: none;
  font-family: UnitPro, sans-serif;
  font-weight: 400;
  font-size: 0.9375rem;
  line-height: 1.2;
  cursor: pointer;
  -webkit-appearance: none !important;
  appearance: none !important;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_previous_button, body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_save_link {
  width: fit-content;
  padding: 12px 28px;
  border-radius: 6px;
  background-color: #fff;
  background-image: none;
  color: #4b5563;
  border: 1px solid #cfd6df;
  box-shadow: none;
  font-family: UnitPro, sans-serif;
  font-weight: 400;
  font-size: 0.9375rem;
  line-height: 1.2;
  cursor: pointer;
  -webkit-appearance: none !important;
  appearance: none !important;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}body.phsd2-order-form .gform_wrapper.gform_wrapper .gf-early-submit {
  background-color: #B5147F;
  border-color: #B5147F;
}body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_next_button:hover, body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_button[type="submit"]:hover, body.phsd2-order-form .gform_wrapper.gform_wrapper input[type="submit"].gform_button:hover, body.phsd2-order-form .gform_wrapper.gform_wrapper button.gform_button:hover, body.phsd2-order-form .gform_wrapper.gform_wrapper .gf-early-submit:hover {
  filter: brightness(0.93);
}body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_previous_button:hover, body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_save_link:hover {
  background-color: #f1f3f5;
}body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_next_button:focus-visible, body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_previous_button:focus-visible, body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_save_link:focus-visible, body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_button:focus-visible, body.phsd2-order-form .gform_wrapper.gform_wrapper .gf-early-submit:focus-visible {
  outline: 2px solid var(--primary, #00747A);
  outline-offset: 2px;
}body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_next_button:disabled, body.phsd2-order-form .gform_wrapper.gform_wrapper .gform_next_button[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}/* ===== Step navigation: pages already reached ===== */
body.phsd2-order-form .gform_wrapper .gf_step.gf-step-clickable { cursor: pointer; }body.phsd2-order-form .gform_wrapper .gf_step.gf-step-visited .gf_step_number {
  border-color: var(--primary, #00747A) !important;
}body.phsd2-order-form .gform_wrapper .gf_step.gf-step-clickable:not(.gf-step-visited) .gf_step_number {
  border-style: dashed !important;
}body.phsd2-order-form .gform_wrapper .gf_step.gf-step-clickable:focus-visible {
  outline: 2px solid var(--primary, #00747A);
  outline-offset: 3px;
}/* ===== Field description as a notice ===== */
body.phsd2-order-form .gform_wrapper .gfield.phsd-notice-field {
  display: flex !important;
  flex-direction: column !important;
}body.phsd2-order-form .gform_wrapper .gfield.phsd-notice-field .gfield_label { order: 1; }body.phsd2-order-form .gform_wrapper .gfield.phsd-notice-field .gfield_description { order: 2; }body.phsd2-order-form .gform_wrapper .gfield.phsd-notice-field .ginput_container { order: 3; }body.phsd2-order-form .gform_wrapper .gfield.phsd-notice-field .gfield_validation_message, body.phsd2-order-form .gform_wrapper .gfield.phsd-notice-field .validation_message { order: 4; }body.phsd2-order-form .gform_wrapper .gfield.phsd-notice-field .gfield_description {
  position: relative;
  margin: 0 0 10px 0 !important;
  padding: 10px 12px 10px 36px !important;
  border-left: 3px solid #b7791f;
  background: #fdf8ec;
  border-radius: 3px;
  box-sizing: border-box;
  font-family: UnitPro, sans-serif;
  font-weight: 300;
  font-size: 0.8125rem !important;
  line-height: 1.5 !important;
  color: #4b5563;
  width: 100%;
}body.phsd2-order-form .gform_wrapper .gfield.phsd-notice-field .gfield_description::before {
  content: "";
  position: absolute;
  left: 12px;
  top: 12px;
  width: 16px;
  height: 16px;
  background-color: #b7791f;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 9v4'/><path d='M12 17h.01'/><path d='M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/></svg>") no-repeat center / contain;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 9v4'/><path d='M12 17h.01'/><path d='M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/></svg>") no-repeat center / contain;
}body.phsd2-order-form .gform_wrapper .gfield.phsd-notice-field .gfield_description strong {
  display: block;
  margin-top: 6px;
  font-weight: 400;
  color: #000;
}
