/* v88 - Mobile Quick Enquiry service selector
   Keeps the service list inside the popup flow so it never covers the rest of the form. */
.popup-subject-field{
  display:grid;
  gap:6px;
  min-width:0;
}
.popup-subject-field>label{
  display:block;
  font-size:11px;
  font-weight:700;
  color:#4c5661;
}
.popup-mobile-select{display:none}

@media (max-width:767px){
  .contact-popup-dialog{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain;
  }

  .contact-popup-form .popup-subject-field{
    width:100%;
    min-width:0;
  }

  .contact-popup-form .popup-subject-field>select{
    display:none!important;
  }

  .contact-popup-form .popup-mobile-select{
    display:grid;
    gap:7px;
    width:100%;
    min-width:0;
  }

  .popup-mobile-select-toggle{
    width:100%;
    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;
  }

  .popup-mobile-select-toggle:focus-visible{
    outline:none;
    border-color:#ff9a55;
    box-shadow:0 0 0 3px rgba(255,116,23,.10);
  }

  .popup-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;
  }
  .popup-mobile-select-toggle[aria-expanded="true"] .popup-mobile-select-chevron{
    transform:translateY(-30%) rotate(225deg);
  }

  .popup-mobile-select-menu{
    position:static!important;
    width:100%;
    max-height:190px;
    overflow-y:auto;
    overflow-x:hidden;
    border:1px solid #dfe3e7;
    border-radius:8px;
    background:#fff;
    padding:5px;
    box-shadow:0 8px 22px rgba(7,29,52,.10);
    scrollbar-width:thin;
    scrollbar-color:#b9c2ca #f4f6f8;
  }
  .popup-mobile-select-menu[hidden]{display:none!important}

  .popup-mobile-select-option{
    display:block;
    width:100%;
    min-height:40px;
    padding:9px 11px;
    border:0;
    border-radius:5px;
    background:#fff;
    color:#162536;
    font:inherit;
    font-size:13px;
    line-height:1.3;
    text-align:left;
    cursor:pointer;
  }
  .popup-mobile-select-option+ .popup-mobile-select-option{margin-top:2px}
  .popup-mobile-select-option:hover,
  .popup-mobile-select-option:focus-visible,
  .popup-mobile-select-option.is-selected{
    outline:none;
    background:#fff1e7;
    color:#c9580d;
  }

  /* When the options list opens it stays inside the modal and pushes the fields below it. */
  .contact-popup-form:has(.popup-mobile-select-toggle[aria-expanded="true"]){
    padding-bottom:4px;
  }
}
