/* APD 218.0.0 — Servicios parity + one stable mobile primary action. */
@media (max-width: 767px) {
  html body.apd218-mobile-services.apd186-search-modal-open,
  html body.apd218-mobile-services.apd186-search-modal-open .apd186-search-portal {
    overflow-x: hidden !important;
  }

  /* One visible submit action only. The fixed APD footer owns the mobile CTA. */
  html body.apd218-mobile-services.apd186-search-modal-open
  .apd186-search-portal #apd5-search > .apd5-search-submit {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* Servicios: the compact row becomes the direct chip selector shown in the
     reference capture; there is no intermediate vertical "Elegí un servicio" list. */
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-service-selector-open
  .apd186-search-portal #apd5-search > [data-search-field="service"] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  html body.apd218-mobile-services.apd186-search-modal-open.apd218-service-selector-open
  .apd186-search-portal #apd5-search > [data-search-panel="service"].apd218-service-panel {
    display: block !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    margin: 18px 0 112px !important;
    padding: 26px 24px 30px !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 26px !important;
    background: #fff !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.10) !important;
  }

  html body.apd218-mobile-services .apd218-service-title {
    display: block !important;
    margin: 0 0 22px !important;
    color: #222 !important;
    font-size: 27px !important;
    line-height: 1.16 !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
  }

  html body.apd218-mobile-services .apd218-service-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 12px 10px !important;
    width: 100% !important;
  }

  html body.apd218-mobile-services .apd218-service-option {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    min-height: 50px !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 1px solid #d6d6d6 !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #222 !important;
    box-shadow: none !important;
    font: inherit !important;
    font-size: 17px !important;
    line-height: 1.1 !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    transition: none !important;
  }

  html body.apd218-mobile-services .apd218-service-option.is-selected,
  html body.apd218-mobile-services .apd218-service-option[aria-pressed="true"] {
    border: 2px solid #222 !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    font-weight: 500 !important;
  }

  html body.apd218-mobile-services .apd218-service-option:active {
    transform: scale(.985) !important;
  }

  html body.apd218-mobile-services .apd218-service-icon {
    display: inline-flex !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    height: 22px !important;
    align-items: center !important;
    justify-content: center !important;
    color: #222 !important;
  }
  html body.apd218-mobile-services .apd218-service-icon svg {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
  }

  /* Reduce vertical waste so Lugar + Fechas + the full nine-category selector
     fit naturally above the fixed footer on current iPhones. */
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-service-selector-open
  .apd186-search-portal #apd5-search {
    padding-bottom: calc(104px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* Flicker-proof CTA: older controllers can change DOM text/classes, but the
     painted label/color comes only from APD 218's final state classes. */
  html body.apd218-mobile-services.apd186-search-modal-open .apd176-mobile-footer .apd176-footer-primary {
    transition: none !important;
    animation: none !important;
    font-size: 0 !important;
    color: transparent !important;
    text-shadow: none !important;
  }
  html body.apd218-mobile-services.apd186-search-modal-open .apd176-mobile-footer .apd176-footer-primary::after {
    display: inline-block !important;
    color: #fff !important;
    font-size: 22px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
  }
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-search .apd176-mobile-footer .apd176-footer-primary,
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-search .apd176-mobile-footer .apd176-footer-primary.is-final-step,
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-search .apd176-mobile-footer .apd176-footer-primary.apd212-next-action,
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-search .apd176-mobile-footer .apd176-footer-primary.apd212-search-action {
    background: #e31c5f !important;
    color: transparent !important;
    box-shadow: 0 10px 24px rgba(227,28,95,.20) !important;
  }
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-search .apd176-mobile-footer .apd176-footer-primary::after {
    content: "Buscar" !important;
  }
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-next .apd176-mobile-footer .apd176-footer-primary,
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-next .apd176-mobile-footer .apd176-footer-primary.is-final-step,
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-next .apd176-mobile-footer .apd176-footer-primary.apd212-next-action,
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-next .apd176-mobile-footer .apd176-footer-primary.apd212-search-action {
    background: #222 !important;
    color: transparent !important;
    box-shadow: 0 10px 22px rgba(0,0,0,.16) !important;
  }
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-next .apd176-mobile-footer .apd176-footer-primary::after {
    content: "Siguiente" !important;
  }
}

@media (max-width: 767px) {
  /* Stable reset label too: prevents APD 176/APD 212 from visually racing. */
  html body.apd218-mobile-services.apd186-search-modal-open .apd176-mobile-footer .apd176-footer-reset {
    font-size: 0 !important;
    color: transparent !important;
    text-shadow: none !important;
    transition: none !important;
    animation: none !important;
  }
  html body.apd218-mobile-services.apd186-search-modal-open .apd176-mobile-footer .apd176-footer-reset::after {
    display: inline-block !important;
    color: #111 !important;
    font-size: 22px !important;
    line-height: 1 !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
    text-underline-offset: 4px !important;
  }
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-reset-all .apd176-mobile-footer .apd176-footer-reset::after {
    content: "Borrar todo" !important;
  }
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-reset-step .apd176-mobile-footer .apd176-footer-reset::after {
    content: "Restablecer" !important;
  }

  /* Search glyph on the final red action, matching the supplied reference. */
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-search .apd176-mobile-footer .apd176-footer-primary {
    background-color: #e31c5f !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.8'/%3E%3Cpath d='m16 16 4.5 4.5'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: 24px 24px !important;
    background-position: 28px 50% !important;
    padding-left: 58px !important;
  }
  html body.apd218-mobile-services.apd186-search-modal-open.apd218-primary-next .apd176-mobile-footer .apd176-footer-primary {
    background-image: none !important;
    padding-left: 28px !important;
  }
}
