/* public inquiry forms, inside the portal's marquee shell (or the standalone fallback page);
   site branding is still to be decided */

/* the public has no portal navigation; with the toggle gone, marquee.css must not reserve its
   slot when lining the brand up with the content column */
.inquiry-public #sidebar-toggle, .inquiry-public #portal-side { display: none; }
body.layout-marquee.inquiry-public { --marquee-brand-left-fixed: 0px; }

/* office phone at the right of the header: the header is a centered flex row, and the margin
   mirrors marquee.css's brand offset so the number ends at the content column's right edge */
body.layout-marquee #portal-header .header_phone {
	margin-left: auto;
	margin-right: max(0px, calc((100% - var(--marquee-content-width)) / 2));
	font-size: 1.8em;
	font-weight: 600;
	line-height: 1.1;
	color: inherit;
	text-decoration: none;
	white-space: nowrap;
}
body.layout-marquee #portal-header .header_phone:hover { text-decoration: underline; }
@media (max-width: 600px) {
	body.layout-marquee #portal-header .header_phone { font-size: 1.05em; }
}

.inquiry-public #portal-content .body_title { font-size: 1.7em; }

.inquiry_form ul { list-style: none; margin: 0; padding: 0; }

/* washcreek's public.css unboxes and centers .form-public li:last-child, expecting the submit
   button there (submit_item()); these forms keep it in .form_actions, outside the lists (one
   per step), so the last field of each list keeps the usual box. The extra class outranks
   public.css, which loads after this sheet; the progress bar's list is left alone. */
form.inquiry_form.form-public > ul > li:last-child, form.inquiry_form.form-public fieldset > ul > li:last-child { border: 1px solid #ddd; margin-bottom: 30px; text-align: start; }
.inquiry_form li { margin: 0 0 16px; }
.inquiry_form label { display: block; font-weight: 600; margin-bottom: 4px; }
.inquiry_form .radio_group label, .inquiry_form .checkbox_group label { display: inline; font-weight: normal; }
.inquiry_form li.required > label::after { content: " *"; color: #b00; }
/* field notes; field lists only, so the progress bar's markers are left alone */
.inquiry_form > ul > li > span:last-child:not(.radio_span), .inquiry_form fieldset > ul > li > span:last-child:not(.radio_span) { display: block; color: #666; font-size: 0.9em; }
.inquiry_form input[type=text], .inquiry_form input[type=email], .inquiry_form input[type=tel],
.inquiry_form input[type=date], .inquiry_form select, .inquiry_form textarea { width: 100%; max-width: 100%; padding: 8px; border: 1px solid #d6d6d6; border-radius: 4px; font: inherit; box-sizing: border-box; }
.inquiry_form .input_prefixed { display: flex; align-items: center; gap: 6px; clear: both; }
.inquiry_form .input_prefixed > .input_prefix { display: inline; margin: 0; padding: 0; background: none; text-align: start; font-weight: 600; color: #444; }
.inquiry_form .input_prefixed > input { flex: 1; min-width: 0; }
.inquiry_form .subhead { font-weight: 700; margin-top: 24px; }
.inquiry_form fieldset { border: 0; padding: 0; margin: 0; }
.inquiry_form legend { font-size: 1.2em; font-weight: 600; margin-bottom: 12px; }
.inquiry_form table.grid { border-collapse: collapse; width: 100%; }
.inquiry_form table.grid th, .inquiry_form table.grid td { padding: 6px; border-bottom: 1px solid #d6d6d6; }
.inquiry_form table.grid th[scope=row] { text-align: left; font-weight: normal; }
.inquiry_form table.grid td { text-align: center; }
/* the last field's own bottom margin is the space above the buttons, as on single-page forms */
.step_nav { display: flex; gap: 12px; margin: 0 0 16px; }
/* text set per form (fablawinq_form::$intro, $disclaimer) above and below the form */
.form_intro {    margin: 0px 0 1.25em;
    font-size: 1.2em;
    padding-bottom: 0.75em;
    border-bottom: 1px dotted rgba(128, 128, 128, 0.5);
    }
.form_disclaimer { margin: 16px 0 0; font-size: 0.85em; color: #666; }
@media (prefers-color-scheme: dark) {
	.form_disclaimer { color: #aaa; }
}

/* progress bar: numbered circles joined by a line, in the header's brand color; the form
   prefix outranks public.css's .form-public li rules */
form.inquiry_form .step_progress { margin: 0 0 24px; }
form.inquiry_form .step_progress ol { display: flex; list-style: none; margin: 0; padding: 0; }
form.inquiry_form .step_progress li { flex: 1; position: relative; text-align: center; border: 0; padding: 0; margin: 0; }
form.inquiry_form .step_progress li + li::before { content: ""; position: absolute; top: 14px; right: 50%; width: 100%; height: 2px; background: #ccc; z-index: 0; }
form.inquiry_form .step_progress li.done + li::before, form.inquiry_form .step_progress li.current::before { background: #261F99; }
/* li > .step_mark outranks public.css's .form-public li > span (help-text styling) */
form.inquiry_form .step_progress li > .step_mark { position: relative; z-index: 1; display: inline-flex; flex-direction: column; align-items: center; gap: 4px; background: none; border: 0; padding: 0; margin: 0; font: inherit; font-weight: normal; color: #666; text-align: center; }
form.inquiry_form .step_progress button.step_mark { cursor: pointer; }
form.inquiry_form .step_progress .num { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; border: 2px solid #ccc; background: #fff; font-weight: 600; box-sizing: border-box; }
form.inquiry_form .step_progress .label { font-size: 0.85em; line-height: 1.2; }
form.inquiry_form .step_progress .done .num { background: #261F99; border-color: #261F99; color: #fff; }
form.inquiry_form .step_progress .done .step_mark:hover .label, form.inquiry_form .step_progress .done .step_mark:focus-visible .label { text-decoration: underline; }
form.inquiry_form .step_progress .current .num { border-color: #261F99; color: #261F99; }
form.inquiry_form .step_progress .current .step_mark { color: #261F99; font-weight: 600; }
.visually_hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* phones: numbers only, with the current step's name in the caption beneath */
form.inquiry_form .step_progress .step_caption { display: none; margin: 6px 0 0; text-align: center; color: #261F99; font-weight: 600; }
@media (max-width: 600px) {
	form.inquiry_form .step_progress .label { display: none; }
	form.inquiry_form .step_progress .step_caption { display: block; }
}

/* dark mode: circles take the form's #333 (base.css), and the brand blue is lightened enough
   to read against it */
@media (prefers-color-scheme: dark) {
	form.inquiry_form .step_progress .num { background: #333; border-color: #666; }
	form.inquiry_form .step_progress li + li::before { background: #666; }
	form.inquiry_form .step_progress li.done + li::before, form.inquiry_form .step_progress li.current::before { background: #9a94ff; }
	form.inquiry_form .step_progress li > .step_mark { color: #aaa; }
	form.inquiry_form .step_progress .done .num { background: #9a94ff; border-color: #9a94ff; color: #111; }
	form.inquiry_form .step_progress .current .num { border-color: #9a94ff; color: #9a94ff; }
	form.inquiry_form .step_progress .current .step_mark, form.inquiry_form .step_progress .step_caption { color: #9a94ff; }
}
.hp_field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.js .branch_hidden, .js .step_inactive, [hidden] { display: none !important; }

/* standalone fallback page only */
.inquiry-fallback { margin: 0; background: #fff; color: #222; font: 16px/1.5 Helvetica, Arial, sans-serif; }
.inquiry-fallback header { padding: 14px 16px; border-bottom: 3px solid #1f4e79; }
.inquiry-fallback .site_name { font-size: 1.2em; font-weight: 600; color: #1f4e79; }
.inquiry-fallback .portal_name { display: block; color: #666; }
.inquiry-fallback .header_phone { float: right; font-size: 1.2em; font-weight: 600; color: #1f4e79; text-decoration: none; }
.inquiry-fallback main { max-width: 760px; margin: 0 auto; padding: 16px; }
.inquiry-fallback footer { max-width: 760px; margin: 32px auto 0; padding: 16px; border-top: 1px solid #d6d6d6; font-size: 0.85em; color: #666; }
.inquiry-fallback .form_button, .inquiry-fallback .step_nav input[type=button] { padding: 10px 20px; border: 0; border-radius: 4px; background: #1f4e79; color: #fff; font: inherit; }