/* ==========================================================
   Mexora — city/service legacy discovery cleanup
   Dark search + unified 13 Marketplace service groups
   ========================================================== */

.mx-city-page-v2 .location-hero{
  overflow:visible;
}

/* Pagini de oras: hero mai compact si pe desktop (continutul sa urce mai sus).
   Mobilul e tratat separat in media query-ul de mai jos. */
.mx-city-page-v2 .location-hero{
  padding-bottom:28px!important;
}
.mx-city-page-v2 .location-hero>.container{
  padding-bottom:0!important;
}

.mx-city-page-v2 .location-hero>.container{
  position:relative;
  z-index:10;
}

/* Override the legacy white .market-search component. */
.mx-city-group-search,
.mx-service-location-search{
  background:#0c171d!important;
  border:1px solid #2b3b43!important;
  box-shadow:0 18px 48px rgba(0,0,0,.28)!important;
  color:#e9edef!important;
}
.mx-city-group-search label,
.mx-service-location-search label{
  border-right:1px solid #27363e!important;
  color:#81919a!important;
}
.mx-city-group-search select,
.mx-service-location-search select,
.mx-city-group-search input,
.mx-service-location-search input{
  background:#0c171d!important;
  color:#eef2f3!important;
}
.mx-city-group-search .mx-select-trigger,
.mx-service-location-search .mx-select-trigger{
  background:#0e1a20!important;
  border:1px solid #2d3d45!important;
  color:#eef2f3!important;
}
.mx-city-group-search .mx-select-menu,
.mx-service-location-search .mx-select-menu{
  background:#0b151a!important;
  border-color:#33434b!important;
  color:#dce3e6!important;
}
.mx-city-group-search .mx-select-option,
.mx-service-location-search .mx-select-option{
  background:transparent!important;
  color:#dce3e6!important;
  border:0!important;
}
.mx-city-group-search .mx-select-option + .mx-select-option,
.mx-service-location-search .mx-select-option + .mx-select-option{
  border-top:1px solid rgba(255,255,255,.04)!important;
}
.mx-city-group-search .mx-select-option.is-selected,
.mx-service-location-search .mx-select-option.is-selected{
  background:#291923!important;
  color:#ff8da8!important;
}
.mx-city-group-search .mx-select-option:hover,
.mx-service-location-search .mx-select-option:hover{
  background:#122027!important;
}
.mx-city-group-search select.mx-select-native,
.mx-service-location-search select.mx-select-native{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* 13-group city section */
.mx-city-group-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.mx-city-group-grid>a{
  min-height:62px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 15px;
  border:1px solid #27363e;
  border-radius:12px;
  background:#0d171c;
  color:#dce3e6;
  box-sizing:border-box;
}
.mx-city-group-grid>a:hover{
  border-color:#673545;
  background:#161116;
  color:#fff;
}
.mx-city-group-grid span{
  font-size:12px;
  font-weight:750;
  line-height:1.3;
}
.mx-city-group-grid b{
  flex:0 0 auto;
  color:#e4758e;
  font-size:15px;
}

@media(max-width:850px){
  .mx-city-group-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:700px){
  .mx-city-group-search,
  .mx-service-location-search{
    padding:8px!important;
    gap:8px!important;
  }
  .mx-city-group-search label,
  .mx-service-location-search label{
    border-right:0!important;
    border-bottom:0!important;
  }
  .mx-city-group-search .mx-select.mobile-open .mx-select-menu,
  .mx-service-location-search .mx-select.mobile-open .mx-select-menu{
    max-height:min(72vh,650px)!important;
  }
  .mx-city-group-search .mx-select-option,
  .mx-service-location-search .mx-select-option{
    min-height:43px!important;
    padding:.66rem .75rem!important;
    font-size:14px!important;
  }
}

@media(max-width:520px){
  .mx-city-group-grid{
    grid-template-columns:1fr;
  }
}


/* Stage 6 — city search CTA proportion fix */
.mx-city-group-search{
  grid-template-columns:minmax(0,1fr) 112px!important;
  max-width:540px!important;
}
.mx-city-group-search .mx-city-search-submit{
  width:112px;
  min-width:112px;
  padding:0 14px!important;
  font-size:11px!important;
  white-space:nowrap;
}
@media(max-width:700px){
  .mx-city-group-search{
    grid-template-columns:1fr!important;
    max-width:100%!important;
  }
  .mx-city-group-search .mx-city-search-submit{
    width:100%;
    min-width:0;
    min-height:44px;
  }
}


/* ==========================================================
   City landing — search + specialists cleanup
   ========================================================== */

/* Wider, calmer search row while keeping the CTA compact. */
.mx-city-page-v2 .mx-city-group-search{
  width:min(780px,100%)!important;
  max-width:780px!important;
  grid-template-columns:minmax(0,1fr) 126px!important;
  gap:10px!important;
  padding:12px!important;
  /* Butonul si campul se aliniaza pe aceeasi linie de baza, centrate vertical. */
  align-items:end!important;
}
.mx-city-page-v2 .mx-city-group-search .mx-city-group-field{
  min-width:0;
  display:grid!important;
  /* 12px intre label si dropdown (inainte 7px - pareau lipite). */
  gap:12px!important;
  align-content:end!important;
}
.mx-city-page-v2 .mx-city-group-search .mx-city-group-field>span{
  line-height:1.2;
}
.mx-city-page-v2 .mx-city-group-search .mx-select-trigger{
  height:50px!important;
  min-height:50px!important;
  padding-left:14px!important;
  padding-right:14px!important;
  display:flex!important;
  align-items:center!important;
  box-sizing:border-box!important;
}
/* Select nativ (fara wrapper custom): aceeasi inaltime ca butonul. */
.mx-city-page-v2 .mx-city-group-search .mx-city-group-field select:not(.mx-select-native),
.mx-city-page-v2 .mx-city-group-search .mx-city-group-field input:not([type=hidden]){
  height:50px!important;
  box-sizing:border-box!important;
}
.mx-city-page-v2 .mx-city-group-search .mx-city-search-submit{
  width:126px!important;
  min-width:126px!important;
  height:50px!important;
  min-height:50px!important;
  padding:0 16px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  align-self:end!important;
  box-sizing:border-box!important;
}

/* The old .pro-grid defaults to 5 columns; city pages need roomier cards. */
.mx-city-page-v2 .pro-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
  width:100%;
}
.mx-city-page-v2 .pro-grid>.mx5b-pro-card{
  min-height:180px;
  padding:17px!important;
}

/* The 13 service cards were redundant with the hero dropdown. */
.mx-city-page-v2 .mx-city-groups-section{
  display:none!important;
}

@media(max-width:1050px){
  .mx-city-page-v2 .pro-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:700px){
  .mx-city-page-v2 .mx-city-group-search{
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    align-items:stretch!important;
  }
  .mx-city-page-v2 .mx-city-group-search .mx-city-group-field{
    gap:12px!important;
  }
  .mx-city-page-v2 .mx-city-group-search .mx-city-search-submit{
    width:100%!important;
    min-width:0!important;
    height:50px!important;
    min-height:50px!important;
  }
  .mx-city-page-v2 .pro-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  .mx-city-page-v2 .pro-grid>.mx5b-pro-card{
    min-height:0;
    padding:15px!important;
  }
}


/* ==========================================================
   Mobile consolidated fixes — city landing
   ========================================================== */
.mx-city-page-v2 .mx-city-title span{
  display:inline;
}
.mx-city-page-v2 .mx-city-title span + span::before{
  content:" ";
}

@media(max-width:700px){
  .mx-city-page-v2 .location-hero{
    min-height:auto!important;
    padding-bottom:18px!important;
  }

  .mx-city-page-v2 .location-hero>.container{
    padding-left:20px!important;
    padding-right:20px!important;
  }

  .mx-city-page-v2 .mx-city-title{
    max-width:100%!important;
    margin:12px 0 14px!important;
    font-size:clamp(22px,6.5vw,30px)!important;
    line-height:1.02!important;
    letter-spacing:-.025em!important;
  }

  .mx-city-page-v2 .mx-city-title span{
    display:block!important;
  }

  .mx-city-page-v2 .mx-city-title span + span::before{
    content:""!important;
  }

  .mx-city-page-v2 .location-hero p{
    font-size:16px!important;
    line-height:1.48!important;
    margin-bottom:22px!important;
  }

  /* Kill the legacy white search shell on mobile. */
  .mx-city-page-v2 .market-search.mx-city-group-search{
    display:grid!important;
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    margin-top:0!important;
    padding:12px!important;
    align-items:end!important;
    background:#0c171d!important;
    border:1px solid #2b3b43!important;
    border-radius:16px!important;
    box-shadow:0 16px 42px rgba(0,0,0,.28)!important;
  }

  .mx-city-page-v2 .mx-city-group-search .mx-city-group-field{
    display:grid!important;
    gap:12px!important;
    padding:0!important;
    background:transparent!important;
    align-content:end!important;
  }
  /* Wrapper-ul si butonul au aceeasi inaltime, ca sa fie centrate identic. */
  .mx-city-page-v2 .mx-city-group-search .mx-select{
    height:52px!important;
    min-height:52px!important;
    box-sizing:border-box!important;
    border:0!important;
  }

  .mx-city-page-v2 .mx-city-group-search .mx-city-group-field>span{
    padding:0 3px!important;
    color:#8f9ba2!important;
    font-size:10px!important;
    font-weight:850!important;
    letter-spacing:.08em!important;
    text-transform:uppercase!important;
  }

  .mx-city-page-v2 .mx-city-group-search .mx-select{
    width:100%!important;
  }

  .mx-city-page-v2 .mx-city-group-search .mx-select-trigger{
    width:100%!important;
    min-height:52px!important;
    border-radius:12px!important;
    background:#0b151a!important;
    border:1px solid #33444c!important;
    color:#fff!important;
  }

  .mx-city-page-v2 .mx-city-group-search .mx-city-search-submit{
    min-height:50px!important;
    border-radius:12px!important;
  }

  /* Show all 13 service groups in the mobile sheet and keep it scrollable. */
  .mx-city-page-v2 .mx-city-group-search .mx-select.mobile-open .mx-select-menu{
    display:block!important;
    max-height:min(72vh,650px)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    background:#0b151a!important;
  }

  .mx-city-page-v2 .mx-city-group-search .mx-select-option{
    display:flex!important;
    width:100%!important;
    min-height:46px!important;
    align-items:center!important;
    padding:11px 12px!important;
    color:#dce3e6!important;
  }
}

/* ===== Continutul de sub hero incepe mai sus (pagini de oras) =====
   Inainte: searchbar -> h2 avea ~92px (padding 38px + margini). Prea mult gol. */
.mx-city-page-v2 .location-hero + .container.market-section,
.mx-city-page-v2 .location-hero ~ .container.market-section:first-of-type{
  padding-top:22px!important;
}
.mx-city-page-v2 .salon-city-copy h2{
  margin-top:0!important;
  margin-bottom:10px!important;
}
.mx-city-page-v2 .salon-city-copy p{
  margin-top:0!important;
}
.mx-city-page-v2 .salon-city-copy h3{
  margin-top:18px!important;
  margin-bottom:6px!important;
}
@media(max-width:700px){
  .mx-city-page-v2 .location-hero + .container.market-section,
  .mx-city-page-v2 .location-hero ~ .container.market-section:first-of-type{
    padding-top:18px!important;
  }
  .mx-city-page-v2 .salon-city-copy h2{
    font-size:24px!important;
    line-height:1.25!important;
    margin-bottom:8px!important;
  }
  .mx-city-page-v2 .salon-city-copy p{
    font-size:14.5px!important;
    line-height:1.5!important;
  }
}