/* v92 - Contact Us Service picker matches the Quick Enquiry popup.
   Desktop keeps the normal compact select. On mobile the native select is hidden
   and the same in-flow custom dropdown pattern as the popup is shown. */
#contact-form .contact-page-subject-field{
  display:grid!important;
  gap:6px!important;
  min-width:0;
  width:100%;
}
#contact-form .contact-page-subject-field>label{
  display:block!important;
  margin:0!important;
  font-size:11px;
  font-weight:700;
  color:#4c5661;
}
#contact-form .contact-page-subject-field>select{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  min-height:46px;
  padding:10px 12px;
  border:1px solid #dfe3e7;
  border-radius:5px;
  background:#fff;
  color:#1c2733;
  font:inherit;
  font-size:13px;
}
#contact-form .contact-page-mobile-select{display:none!important}
/* Neutralize the old v91 radio-grid rules if cached CSS is still present. */
#contact-form .contact-service-choice-field,
#contact-form .contact-service-choice-grid{display:none!important}

@media (max-width:767px){
  #contact-form .contact-form-card,
  #contact-form .contact-form,
  #contact-form .form-row{
    min-width:0;
    max-width:100%;
  }
  #contact-form .contact-form-card,
  #contact-form .contact-form{overflow:visible!important}

  #contact-form .contact-page-subject-field>select{
    display:none!important;
  }
  #contact-form .contact-page-mobile-select{
    display:grid!important;
    gap:7px;
    width:100%;
    min-width:0;
    max-width:100%;
    position:static!important;
  }
  #contact-form .contact-page-mobile-select-toggle{
    display:block!important;
    width:100%;
    min-width:0;
    min-height:46px;
    padding:11px 42px 11px 13px;
    border:1px solid #dfe3e7;
    border-radius:5px;
    background:#fff;
    color:#1c2733;
    font:inherit;
    font-size:13px;
    line-height:1.25;
    text-align:left;
    position:relative;
    cursor:pointer;
    box-shadow:none;
    appearance:none;
    -webkit-appearance:none;
  }
  #contact-form .contact-page-mobile-select-toggle:focus-visible{
    outline:none;
    border-color:#ff9a55;
    box-shadow:0 0 0 3px rgba(255,116,23,.10);
  }
  #contact-form .contact-page-mobile-select-chevron{
    position:absolute;
    right:15px;
    top:50%;
    width:8px;
    height:8px;
    border-right:2px solid #52616f;
    border-bottom:2px solid #52616f;
    transform:translateY(-65%) rotate(45deg);
    transition:transform .18s ease;
    pointer-events:none;
  }
  #contact-form .contact-page-mobile-select-toggle[aria-expanded="true"] .contact-page-mobile-select-chevron{
    transform:translateY(-30%) rotate(225deg);
  }
  #contact-form .contact-page-mobile-select-menu{
    position:static!important;
    inset:auto!important;
    transform:none!important;
    float:none!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    max-height:190px;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    box-sizing:border-box;
    border:1px solid #dfe3e7;
    border-radius:8px;
    background:#fff;
    padding:5px;
    margin:0;
    box-shadow:0 8px 22px rgba(7,29,52,.10);
    z-index:auto!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scrollbar-color:#b9c2ca #f4f6f8;
  }
  #contact-form .contact-page-mobile-select-menu[hidden]{display:none!important}
  #contact-form .contact-page-mobile-select-option{
    display:block!important;
    width:100%;
    min-height:40px;
    padding:9px 11px;
    margin:0;
    border:0;
    border-radius:5px;
    background:#fff;
    color:#162536;
    font:inherit;
    font-size:13px;
    line-height:1.3;
    text-align:left;
    white-space:normal;
    cursor:pointer;
    appearance:none;
    -webkit-appearance:none;
  }
  #contact-form .contact-page-mobile-select-option + .contact-page-mobile-select-option{margin-top:2px}
  #contact-form .contact-page-mobile-select-option:hover,
  #contact-form .contact-page-mobile-select-option:focus-visible,
  #contact-form .contact-page-mobile-select-option.is-selected{
    outline:none;
    background:#fff1e7;
    color:#c9580d;
  }
}
