/*
 * quote-form.css -- the refreshed public quote form, /customers/quote.php only.
 *
 * 2026-10-04. Loaded LAST (after customers-quote.min.css and chosen.min.css).
 * customers-quote.min.css is shared with 11 legacy pages and bundled into the homepage
 * (index-late.min.css), so it is not edited; everything here is scoped to this page.
 *
 * Brand tokens (taken from the site, none invented):
 *   navy #00406e (headings #003156)   teal CTA #0a7c77 / hover #086b64
 *   text #405260   muted #66798a (on white only)   error #a94442
 *   hairline #e3e7eb   control border #d9dce3   focus ring #9ecaed + navy outline
 *   radius 5px controls / 10px card and toggle   card shadow 0 2px 4px rgba(0,0,0,.125)
 *
 * Rules of the road:
 *   - px only: bootstrap-lite sets html{font-size:10px}, so rem would be tiny.
 *   - #quote-form prefixes where a rule must beat "#quote-form label" (customers-quote),
 *     Bootstrap's .btn-success / .has-error, or Chosen's deep selectors.
 *   - Never restyle generic div / input / label / [aria-hidden] with !important inside
 *     the form: the form_guard honeypot is hidden only by its own inline style.
 *   - No overflow:hidden on anything that contains a Chosen box (it clips the dropdown).
 */

.tsu-quote [hidden],
.tsu-quote-side [hidden] { display:none !important; }

/* ---- Above the form ---------------------------------------------------------- */
.tsu-quote-lead { margin:8px 0 8px; font-size:16.8px; line-height:1.5; color:#405260; }
.tsu-quote-chips { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; padding:0; list-style:none; }
.tsu-quote-chips li { padding:4px 10px; font-size:14px; line-height:20px; color:#405260; background:#fff; border:1px solid #d9dce3; border-radius:16px; }
.tsu-quote-chips a { color:#405260; text-decoration:none; }
.tsu-quote-chips a:hover { color:#003156; text-decoration:underline; }
.tsu-quote-chips .fa-star { color:#e7a400; }

/* ---- The card ------------------------------------------------------------------ */
.tsu-quote-card { margin:0 0 24px; padding:24px; background:#fff; border-radius:10px; box-shadow:0 2px 4px rgba(0,0,0,.125); color:#405260; font-size:16px; }
.tsu-quote-card fieldset { margin:0; padding:0 0 24px; border:0; min-width:0; }
/* The divider sits on the legend, not the fieldset: a fieldset's legend is drawn inside its top
   border, so fieldset padding would land BELOW the heading. */
#quote-form.tsu-quote-card fieldset + fieldset legend { padding-top:24px; border-top:1px solid #e3e7eb; }
#quote-form.tsu-quote-card legend { display:flex; align-items:center; width:100%; margin:0 0 16px; padding:0; border:0; font-size:20px; line-height:28px; font-weight:600; color:#003156; }
#quote-form.tsu-quote-card legend:before { content:none; display:none; }
.tsu-quote-num { display:inline-block; flex:0 0 28px; width:28px; height:28px; margin-right:10px; border-radius:50%; background:#00406e; color:#fff; font-size:15px; line-height:28px; text-align:center; }

#quote-form.tsu-quote-card label,
.tsu-quote-label { display:block; margin:0 0 6px; font-size:15px; font-weight:600; color:#405260; }
#quote-form.tsu-quote-card .text-muted { font-weight:400; color:#66798a; }
.tsu-quote-card .form-group { margin-bottom:16px; }
.tsu-quote-card .help-block { margin:6px 0 0; font-size:14px; color:#66798a; }

/* ---- Text inputs and native selects ------------------------------------------------ */
#quote-form .form-control { height:46px; padding:10px 12px; font-size:16px; color:#333; background:#fff; border:1px solid #d9dce3; border-radius:5px; box-shadow:none; }
#quote-form select.form-control { padding:8px 10px; }
/* Phones show a multi-select as a one-line picker; keep it the same height as the other fields. */
#quote-form select[multiple].form-control { height:46px; overflow:hidden; }
#quote-form textarea.form-control { height:auto; min-height:96px; line-height:1.45; resize:vertical; }
#quote-form .form-control:focus { border-color:#0a7c77; outline:0; box-shadow:0 0 0 3px rgba(10,124,119,.18); }
#quote-form .form-control[disabled] { background:#f4f4f4; }
#quote-form .form-control::placeholder { color:#8a94a6; }

/* Two fields side by side from tablet width up. */
.tsu-quote-pair { display:flex; gap:16px; }
.tsu-quote-pair > div { flex:1 1 0; min-width:0; }
.tsu-quote-langs { display:block; }

/* ---- Individual / Business toggle (pattern: www/jobs/careers.php .careers-yesno) --- */
.tsu-quote-seg { display:flex; width:100%; max-width:420px; border:2px solid #d9dce3; border-radius:10px; background:#fff; }
.tsu-quote-seg input { position:absolute; opacity:0; width:1px; height:1px; margin:0; }
#quote-form.tsu-quote-card .tsu-quote-seg label { flex:1 1 50%; margin:0; padding:11px 16px; font-size:16px; font-weight:600; line-height:22px; text-align:center; color:#405260; background:#fff; cursor:pointer; transition:background-color .15s, color .15s; }
#quote-form.tsu-quote-card .tsu-quote-seg label:first-of-type { border-radius:8px 0 0 8px; }
#quote-form.tsu-quote-card .tsu-quote-seg label:last-of-type { border-radius:0 8px 8px 0; border-left:2px solid #d9dce3; }
#quote-form.tsu-quote-card .tsu-quote-seg label:hover { color:#00406e; background:#f4f8fa; }
#quote-form.tsu-quote-card .tsu-quote-seg input:checked + label { color:#fff; background:#00406e; }
#quote-form.tsu-quote-card .tsu-quote-seg input:focus + label { outline:2px solid #00406e; outline-offset:2px; }
#quote-form.tsu-quote-card .tsu-quote-seg input:focus:not(:focus-visible) + label { outline:0; }
#quote-form.tsu-quote-card .tsu-quote-seg input:focus-visible + label { outline:2px solid #00406e; outline-offset:2px; box-shadow:inset 0 0 0 3px #9ecaed; }
.tsu-quote-company { margin-top:16px; max-width:420px; }
.tsu-quote-translator { margin:12px 0 0; font-size:14px; }
.tsu-quote-translator a { color:#1a8ab0; }
.tsu-quote-translator a:hover { color:#106e8e; }

/* ---- Chosen (desktop only; it switches itself off on phones) ------------------------ */
#quote-form .chosen-container { font-size:16px; }
#quote-form .chosen-container-single .chosen-single { height:46px; padding:0 0 0 12px; line-height:44px; color:#333; background:#fff; border:1px solid #d9dce3; border-radius:5px; box-shadow:none; }
#quote-form .chosen-container-single .chosen-single span { margin-right:30px; }
#quote-form .chosen-container-single .chosen-default { color:#8a94a6; }
/* Arrow sprite: keep Chosen's 18px column, only move the arrow down to the new height. */
#quote-form .chosen-container-single .chosen-single div { right:6px; }
#quote-form .chosen-container-single .chosen-single div b { background-position:0 13px; }
#quote-form .chosen-container-active.chosen-with-drop .chosen-single div b { background-position:-18px 13px; }
#quote-form .chosen-container-active .chosen-single,
#quote-form .chosen-container-active .chosen-choices { border-color:#0a7c77; box-shadow:0 0 0 3px rgba(10,124,119,.18); }
#quote-form .chosen-container-active.chosen-with-drop .chosen-single { background:#fff; border-radius:5px 5px 0 0; }
#quote-form .chosen-container-multi .chosen-choices { min-height:46px; padding:5px 8px; background:#fff; border:1px solid #d9dce3; border-radius:5px; box-shadow:none; }
#quote-form .chosen-container-multi .chosen-choices li.search-field input[type=text] { height:34px; margin:0; font-size:16px; color:#333; }
#quote-form .chosen-container-multi .chosen-choices li.search-choice { margin:3px 6px 3px 0; padding:6px 26px 6px 10px; font-size:15px; line-height:18px; color:#0a5f5b; background:#e6f2f1; border:1px solid #b5d8d5; border-radius:4px; box-shadow:none; }
#quote-form .chosen-container-multi .chosen-choices li.search-choice .search-choice-close { top:8px; right:6px; }
#quote-form .chosen-container .chosen-drop { border-color:#0a7c77; border-radius:0 0 5px 5px; box-shadow:0 4px 8px rgba(0,0,0,.12); }
#quote-form .chosen-container .chosen-results li { padding:8px 10px; line-height:20px; }
#quote-form .chosen-container .chosen-results li.highlighted { background:#0a7c77; }
#quote-form .chosen-container .chosen-results li.group-result { color:#003156; }
#quote-form .chosen-container .chosen-search input[type=text] { height:38px; font-size:16px; }

/* ---- Uploader (valums file-uploader) ------------------------------------------------ */
#file_uploader_div2 { min-height:96px; }
#quote-form .qq-uploader { position:relative; display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; padding:20px; background:#f7fafb; border:2px dashed #b9cfd9; border-radius:10px; }
#quote-form .qq-upload-button { display:inline-flex; align-items:center; gap:8px; width:auto; padding:10px 18px; font-size:16px; font-weight:600; color:#0a7c77; background:#fff; border:2px solid #0a7c77; border-radius:5px; cursor:pointer; box-shadow:none; }
/* The library lays an invisible file input over the button; stretch it over all of it. */
#quote-form .qq-upload-button input { left:0; width:100%; height:100%; cursor:pointer; }
#quote-form .qq-upload-button .fa,
#quote-form .qq-upload-button-text { pointer-events:none; }
#quote-form .qq-upload-button-hover { color:#fff; background:#0a7c77; }
#quote-form .qq-upload-button-focus { outline:2px solid #00406e; outline-offset:2px; }
.qq-upload-hint { font-size:15px; color:#66798a; }
@media (hover:none) { .qq-upload-hint { display:none; } }
#quote-form .qq-upload-drop-area { min-height:0; border-radius:8px; background:rgba(10,124,119,.12); border:2px dashed #0a7c77; }
#quote-form .qq-upload-drop-area span { margin-top:-11px; font-size:17px; font-weight:600; color:#0a5f5b; }
#quote-form .qq-upload-drop-area-active { background:rgba(10,124,119,.22); }
#quote-form .qq-upload-list { flex:1 0 100%; margin:0; padding:0; list-style:none; }
#quote-form .qq-upload-list:empty { display:none; }
#quote-form .qq-upload-list li { display:flex; align-items:center; flex-wrap:wrap; gap:4px 10px; margin:8px 0 0; padding:8px 8px 8px 12px; font-size:15px; line-height:20px; color:#405260; background:#fff; border:1px solid #e3e7eb; border-radius:5px; }
#quote-form .qq-upload-file { flex:1 1 auto; min-width:0; margin:0; overflow-wrap:anywhere; }
#quote-form .qq-upload-success .qq-upload-file:before { content:"\f00c"; font-family:FontAwesome; margin-right:8px; color:#0a7c77; }
#quote-form .qq-upload-size,
#quote-form .qq-upload-cancel { margin:0; font-size:13px; color:#66798a; }
#quote-form .qq-upload-cancel { color:#a94442; }
#quote-form .qq-upload-fail { border-color:#e4b9b8; }
#quote-form .qq-upload-failed-text { margin:0; color:#a94442; }
#quote-form .qq-upload-remove { display:none; width:32px; height:32px; margin:0 0 0 auto; padding:0; font-size:22px; line-height:28px; font-weight:400; color:#66798a; background:transparent; border:1px solid transparent; border-radius:50%; cursor:pointer; }
#quote-form .qq-upload-remove.is-restored { display:inline-block; }
#quote-form .qq-upload-remove:hover,
#quote-form .qq-upload-remove:focus { color:#a94442; background:#fbeeee; border-color:#e4b9b8; outline:0; }
#upload-progress { font-weight:600; color:#0a7c77; }

/* ---- Errors ------------------------------------------------------------------------- */
#quote-form #quote-errors { margin:0 0 24px; padding:16px 20px; color:#8b2d2b; background:#fbeeee; border:1px solid #e4b9b8; border-radius:5px; }
#quote-form #quote-errors:focus { outline:2px solid #a94442; outline-offset:2px; }
#quote-form #quote-errors h4 { margin:0 0 8px; font-size:17px; font-weight:600; color:#8b2d2b; }
#quote-form #quote-errors ul { margin:0; padding-left:20px; }
#quote-form .has-error .form-control,
#quote-form .has-error .chosen-single,
#quote-form .has-error .chosen-choices { border-color:#a94442 !important; }
#quote-form .has-error .qq-uploader { border-color:#a94442; }
#quote-form .has-error .cf-turnstile,
#quote-form .has-error .g-recaptcha > div { outline:1px solid #a94442; border-radius:4px; }
#quote-form .has-error > label,
#quote-form .has-error .tsu-quote-label { color:#a94442; }
#quote-form .language-error,
#quote-form .upload-error { display:block; margin-top:6px; font-size:14px; color:#a94442; }

/* ---- Captcha + submit --------------------------------------------------------------- */
.tsu-quote-captcha { margin:0 0 16px; }
.tsu-quote-captcha:empty { display:none; }
.tsu-quote-submit { padding-top:8px; }
#quote-form #submit-btn { display:block; width:100%; min-height:52px; padding:14px 24px; font-size:18px; font-weight:600; line-height:24px; color:#fff; background:#0a7c77; border:0; border-radius:5px; box-shadow:0 2px 8px rgba(0,0,0,.2); text-shadow:none; transition:background-color .15s; }
#quote-form #submit-btn:hover,
#quote-form #submit-btn:focus,
#quote-form #submit-btn:active { color:#fff; background:#086b64; }
#quote-form #submit-btn:focus-visible { outline:2px solid #00406e; outline-offset:3px; }
#quote-form #submit-btn[disabled],
#quote-form #submit-btn.is-sending { opacity:.75; cursor:wait; }
.tsu-quote-reassure { margin:10px 0 0; font-size:14px; text-align:center; color:#66798a; }
#quote-form-notice { margin:0 0 10px; font-weight:600; color:#a94442; }

/* ---- Sidebar ------------------------------------------------------------------------ */
.tsu-quote-side .sidebar_wrap { margin-top:8px; }
.tsu-quote-contact { margin:16px 0 24px; padding:20px; text-align:center; background:#fff; border-radius:10px; box-shadow:0 2px 4px rgba(0,0,0,.125); color:#405260; }
.tsu-quote-contact h3 { margin:0 0 14px; font-size:18px; font-weight:600; color:#003156; }
.tsu-quote-contact img { display:block; width:120px; height:120px; margin:0 auto 10px; border-radius:50%; object-fit:cover; }
.tsu-quote-contact-name { margin:0 0 12px; font-size:17px; font-weight:600; color:#003156; }
.tsu-quote-contact-name span { display:block; font-size:14px; font-weight:400; color:#66798a; }
.tsu-quote-contact ul { margin:0; padding:0; list-style:none; font-size:15px; line-height:26px; }
.tsu-quote-contact a { color:#1a8ab0; overflow-wrap:anywhere; }
.tsu-quote-why-title { margin:0 0 12px; font-size:20px; font-weight:600; color:#003156; }
.tsu-quote-why { margin:0 0 24px; padding:0; list-style:none; font-size:16px; line-height:24px; color:#405260; }
.tsu-quote-why li { position:relative; margin:0 0 8px; padding-left:28px; }
.tsu-quote-why li:before { content:"\f00c"; position:absolute; left:2px; top:0; font-family:FontAwesome; color:#0a7c77; }

/* ---- Below the form: local info, how it works, services, FAQ ------------------------ */
.tsu-quote-more { clear:both; margin:8px 0 24px; padding:24px; background:#fff; border-radius:10px; box-shadow:0 2px 4px rgba(0,0,0,.125); color:#405260; font-size:16px; line-height:1.6; }
.tsu-quote-more h2 { margin:24px 0 12px; font-size:20px; line-height:28px; font-weight:600; color:#003156; }
.tsu-quote-more-grid { display:flex; gap:32px; }
.tsu-quote-more-grid > div { flex:1 1 0; min-width:0; }
.tsu-quote-more-grid h2 { margin-top:0; }
.tsu-quote-more p { margin:0 0 12px; }
.tsu-quote-more a { color:#1a8ab0; }
.tsu-quote-more a:hover { color:#106e8e; }
.tsu-quote-howto { margin:0; padding-left:22px; }
.tsu-quote-howto li { margin:0 0 10px; }
.tsu-quote-services { display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none; }
.tsu-quote-services a { display:inline-block; padding:6px 12px; font-size:15px; color:#003156; text-decoration:none; background:#f4f8fa; border:1px solid #d9dce3; border-radius:16px; }
.tsu-quote-services a:hover { color:#fff; background:#00406e; border-color:#00406e; }
.tsu-quote-faq details { border-top:1px solid #e3e7eb; }
.tsu-quote-faq details:last-child { border-bottom:1px solid #e3e7eb; }
.tsu-quote-faq summary { position:relative; padding:14px 36px 14px 0; font-size:17px; font-weight:600; color:#003156; cursor:pointer; list-style:none; }
.tsu-quote-faq summary::-webkit-details-marker { display:none; }
.tsu-quote-faq summary:after { content:"+"; position:absolute; right:6px; top:10px; font-size:24px; font-weight:400; color:#0a7c77; }
.tsu-quote-faq details[open] summary:after { content:"\2212"; }
.tsu-quote-faq summary:focus-visible { outline:2px solid #00406e; outline-offset:2px; }
.tsu-quote-faq details p { margin:0 0 16px; }

/* ---- Responsive --------------------------------------------------------------------- */
@media (min-width:992px) {
    .tsu-quote-langs { display:flex; gap:16px; }
    .tsu-quote-langs > .form-group { flex:1 1 0; min-width:0; }
}
@media (max-width:767px) {
    .tsu-quote-card { padding:16px; border-radius:8px; }
    .tsu-quote-chips { margin-bottom:12px; }
    .tsu-quote-chips li { font-size:13px; }
    .tsu-quote-more-grid { display:block; }
    .tsu-quote-more { padding:16px; }
    .tsu-quote-contact { margin-top:8px; }
}
@media (max-width:540px) {
    .tsu-quote-pair { display:block; }
    .tsu-quote-pair > div + div { margin-top:16px; }
    #quote-form .qq-uploader { padding:16px; }
    #quote-form .qq-upload-button { width:100%; justify-content:center; }
}