/* RXOPD INDEX MOBILE REFERENCE V3
   Unique filename = cache-safe. This layer is intentionally loaded after every
   previous home stylesheet from landing.php. It reproduces the approved mobile
   reference while preserving the existing PHP/search/business logic. */
body.rx-ui-home{
  --rxv3-ink:#0d315c;
  --rxv3-muted:#6d8194;
  --rxv3-line:#dce7ef;
  --rxv3-green:#079f73;
  --rxv3-blue:#1876d2;
}

/* --- hero title + medical location illustration --- */
body.rx-ui-home .rxhome-hero-title-row{display:block!important}
body.rx-ui-home .rxhome-hero-title-copy{min-width:0!important}
body.rx-ui-home .rxhome-hero-medical-pin{display:none!important}

/* Speciality control has a real stethoscope icon, not a decorative background. */
body.rx-ui-home #rxhome-care-search .rxhome-field-select{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  align-items:center!important;
  overflow:hidden!important;
  padding:0!important;
}
body.rx-ui-home #rxhome-care-search .rxhome-speciality-icon{
  grid-column:1!important;
  display:grid!important;
  place-items:center!important;
  width:38px!important;
  height:100%!important;
  color:#0e3a6c!important;
  background:#f8fbff!important;
  border-right:1px solid #e2ebf2!important;
}
body.rx-ui-home #rxhome-care-search .rxhome-speciality-icon svg{width:20px!important;height:20px!important;display:block!important}
body.rx-ui-home #rxhome-care-search .rxhome-field-select select{
  grid-column:2!important;
  width:100%!important;
  padding-left:11px!important;
  padding-right:32px!important;
  border:0!important;
  outline:0!important;
  background-color:#fff!important;
}
body.rx-ui-home #rxhome-care-search .rxhome-field-select::after{right:11px!important;pointer-events:none!important}

/* Keep GPS control visually close to Google Maps' locate-me treatment. */
body.rx-ui-home #rxhome-care-search .rxhome-location-detect{
  background:#f7fbff!important;
  color:#1477d4!important;
  border-right:1px solid #e1ebf2!important;
}
body.rx-ui-home #rxhome-care-search .rxhome-location-svg{width:18px!important;height:18px!important}

/* --- Explore Near You base reset: remove the legacy tall card geometry --- */
body.rx-ui-home .rxhome-near-section{overflow:hidden!important}
body.rx-ui-home .rxhome-near-grid{align-items:stretch!important}
body.rx-ui-home .rxhome-map-card,
body.rx-ui-home .rxhome-near-card{
  height:auto!important;
  max-height:none!important;
  aspect-ratio:auto!important;
}
body.rx-ui-home .rxhome-map-card{position:relative!important;padding:0!important;overflow:hidden!important}
body.rx-ui-home .rxhome-map-card>img{
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  object-fit:cover!important;
  background:transparent!important;
}
/* Explicitly neutralise older generic .rxhome-map-card span geometry. */
body.rx-ui-home .rxhome-map-card>.rxhome-map-chip{
  position:absolute!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:0!important;
  max-width:max-content!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:6px 9px!important;
  border:1px solid #d8e6f0!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.96)!important;
  color:#176dcc!important;
  box-shadow:0 5px 14px rgba(24,67,100,.10)!important;
  font-size:9.5px!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:visible!important;
}
body.rx-ui-home .rxhome-map-card>.rxhome-map-chip svg{width:13px!important;height:13px!important;flex:0 0 13px!important}

body.rx-ui-home .rxhome-near-card{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr) 11px!important;
  grid-template-rows:auto auto!important;
  align-content:center!important;
  align-items:center!important;
  column-gap:8px!important;
  row-gap:2px!important;
  padding:9px!important;
  overflow:hidden!important;
}
body.rx-ui-home .rxhome-near-card::after{
  content:'›'!important;
  grid-column:3!important;
  grid-row:1 / 3!important;
  align-self:center!important;
  justify-self:end!important;
  color:#183b5a!important;
  font-size:18px!important;
  line-height:1!important;
}
body.rx-ui-home .rxhome-near-icon{
  grid-column:1!important;
  grid-row:1 / 3!important;
  display:grid!important;
  place-items:center!important;
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  min-height:36px!important;
  margin:0!important;
  border-radius:10px!important;
}
body.rx-ui-home .rxhome-near-svg{width:19px!important;height:19px!important}
body.rx-ui-home .rxhome-near-card>strong{
  grid-column:2!important;
  grid-row:1!important;
  margin:0!important;
  color:#173957!important;
  font-size:10.5px!important;
  line-height:1.16!important;
  font-weight:800!important;
  white-space:normal!important;
}
body.rx-ui-home .rxhome-near-card>small{
  grid-column:2!important;
  grid-row:2!important;
  margin:0!important;
  color:#71869a!important;
  font-size:8.2px!important;
  line-height:1.2!important;
  white-space:normal!important;
}

@media(max-width:850px){
  /* Mobile/tablet follows approved reference: no redundant filter chips. */
  body.rx-ui-home .rxhome-pills{display:none!important;height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:hidden!important}

  /* Hero is compact and includes the medical-location illustration beside title. */
  body.rx-ui-home .rxhome-hero{grid-template-columns:1fr!important;gap:9px!important;padding:13px!important}
  body.rx-ui-home .rxhome-hero-title-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 48px!important;
    gap:9px!important;
    align-items:center!important;
    margin-bottom:8px!important;
  }
  body.rx-ui-home .rxhome-hero-medical-pin{
    display:grid!important;
    place-items:center!important;
    width:48px!important;
    height:56px!important;
    justify-self:end!important;
    filter:drop-shadow(0 6px 10px rgba(30,99,169,.12))!important;
  }
  body.rx-ui-home .rxhome-hero-medical-pin svg{width:46px!important;height:55px!important;display:block!important}
  body.rx-ui-home .rxhome-hero-copy h1{margin:0 0 3px!important;font-size:23px!important;line-height:1.06!important;letter-spacing:-.025em!important}
  body.rx-ui-home .rxhome-hero-title-copy>p{margin:0!important;font-size:11.5px!important;line-height:1.3!important;color:#65798d!important}

  /* Existing doctor-team hero image is redundant on narrow screens; the reference uses the compact pin illustration instead. */
  body.rx-ui-home .rxhome-hero-art{display:none!important}

  /* Row 1 = location. Row 2 = stethoscope + speciality | Search. */
  body.rx-ui-home #rxhome-care-search.rxhome-location-search-compact{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 92px!important;
    grid-template-rows:40px 40px!important;
    gap:7px!important;
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    min-height:87px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  body.rx-ui-home #rxhome-care-search .rxhome-location-entry{
    grid-column:1/-1!important;
    grid-row:1!important;
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr)!important;
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    border:1px solid #d4e2ec!important;
    border-radius:10px!important;
    overflow:hidden!important;
    background:#fff!important;
    box-shadow:none!important;
  }
  body.rx-ui-home #rxhome-care-search .rxhome-location-detect{width:38px!important;min-width:38px!important;height:38px!important;min-height:38px!important;padding:0!important}
  body.rx-ui-home #rxhome-care-search .rxhome-field-location,
  body.rx-ui-home #rxhome-care-search .rxhome-field-location input{width:100%!important;height:38px!important;min-height:38px!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#fff!important}
  body.rx-ui-home #rxhome-care-search .rxhome-field-location input{padding:0 9px!important;font-size:10.8px!important}
  body.rx-ui-home #rxhome-care-search .rxhome-field-select{
    grid-column:1!important;
    grid-row:2!important;
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    border:1px solid #d4e2ec!important;
    border-radius:10px!important;
    background:#fff!important;
    box-shadow:none!important;
  }
  body.rx-ui-home #rxhome-care-search .rxhome-speciality-icon{width:38px!important;height:38px!important}
  body.rx-ui-home #rxhome-care-search .rxhome-speciality-icon svg{width:18px!important;height:18px!important}
  body.rx-ui-home #rxhome-care-search .rxhome-field-select select{height:38px!important;min-height:38px!important;font-size:10.8px!important;padding-left:8px!important;padding-right:28px!important}
  body.rx-ui-home #rxhome-care-search .rxhome-btn.rxhome-btn-green{
    grid-column:2!important;
    grid-row:2!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:92px!important;
    min-width:92px!important;
    max-width:92px!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    padding:0 8px!important;
    border:0!important;
    border-radius:10px!important;
    font-size:10px!important;
    gap:5px!important;
  }
  body.rx-ui-home #rxhome-care-search .rxhome-search-btn-svg{width:14px!important;height:14px!important;flex:0 0 14px!important}

  /* Explore section exactly as compact reference: map + two-by-two care cards. */
  body.rx-ui-home .rxhome-near-section{margin-top:12px!important;padding:11px!important;border-radius:15px!important}
  body.rx-ui-home .rxhome-near-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin:0 0 8px!important}
  body.rx-ui-home .rxhome-near-head h2{margin:0!important;font-size:16.5px!important;line-height:1.1!important}
  body.rx-ui-home .rxhome-map-head-link{font-size:9.5px!important;line-height:1!important}
  body.rx-ui-home .rxhome-map-head-link span{font-size:15px!important}
  body.rx-ui-home .rxhome-near-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
  body.rx-ui-home .rxhome-map-card{
    grid-column:1/-1!important;
    min-height:112px!important;
    height:112px!important;
    max-height:112px!important;
    border-radius:13px!important;
  }
  body.rx-ui-home .rxhome-map-card>img{height:112px!important;min-height:112px!important;max-height:112px!important}
  body.rx-ui-home .rxhome-map-card>.rxhome-map-chip{right:7px!important;top:7px!important;left:auto!important;bottom:auto!important}
  body.rx-ui-home .rxhome-near-card{
    min-height:68px!important;
    height:68px!important;
    max-height:68px!important;
    border-radius:12px!important;
  }
  body.rx-ui-home .rxhome-near-footer{margin:7px 0 0!important}
  body.rx-ui-home .rxhome-viewall-link{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-height:34px!important;
    height:34px!important;
    margin:0!important;
    padding:0 10px!important;
    border:0!important;
    border-radius:999px!important;
    background:#e9f8f2!important;
    color:#078a66!important;
    font-size:9.5px!important;
    font-weight:850!important;
    text-decoration:none!important;
  }
}

@media(max-width:390px){
  body.rx-ui-home .rxhome-hero-copy h1{font-size:22px!important}
  body.rx-ui-home .rxhome-hero-title-copy>p{font-size:10.8px!important}
  body.rx-ui-home .rxhome-hero-title-row{grid-template-columns:minmax(0,1fr) 44px!important}
  body.rx-ui-home .rxhome-hero-medical-pin{width:44px!important;height:52px!important}
  body.rx-ui-home .rxhome-hero-medical-pin svg{width:42px!important;height:50px!important}
  body.rx-ui-home .rxhome-near-card{grid-template-columns:34px minmax(0,1fr) 10px!important;padding:7px!important;column-gap:6px!important}
  body.rx-ui-home .rxhome-near-icon{width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important}
  body.rx-ui-home .rxhome-near-card>strong{font-size:10px!important}
  body.rx-ui-home .rxhome-near-card>small{font-size:7.8px!important}
}

@media(max-width:350px){
  body.rx-ui-home #rxhome-care-search.rxhome-location-search-compact{grid-template-columns:minmax(0,1fr) 82px!important}
  body.rx-ui-home #rxhome-care-search .rxhome-btn.rxhome-btn-green{width:82px!important;min-width:82px!important;max-width:82px!important}
  body.rx-ui-home .rxhome-near-card>small{display:block!important;font-size:7.2px!important}
}
