/* Mexora mobile refinements — 2026-09-24 (round 2)
   Visual changes are mobile-only. Data correctness fixes live in PHP. */

.mx-service-county-filter{display:none!important}

@media(max-width:760px){
  html,body{max-width:100%;overflow-x:hidden}

  /* iOS Safari zooms focused inputs when font-size is below 16px. */
  .market-home input[type="text"],
  .mx-a-page input[type="text"],
  .market-service-page input[type="text"],
  .market-service-page select{
    font-size:16px!important;
  }

  /* Homepage search: keep the control anchored to the viewport and the
     category menu fully visible on narrow iPhones. */
  .market-home .hero-inner>div{width:100%;min-width:0}
  .market-home .mx-home-search{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    padding:8px!important;
    gap:8px!important;
    overflow:visible!important;
  }
  .market-home .mx-home-service>input{font-size:16px!important}
  .market-home .mx-home-service-menu{
    left:0!important;
    right:0!important;
    width:100%!important;
    max-width:100%!important;
    transform:none!important;
  }
  .market-home .mx-home-service-menu button{font-size:14px!important;line-height:1.3}

  /* Search result tabs: "Profesioniști" must never be clipped. */
  .mx-a-page .search-type-tabs a{
    white-space:normal!important;
    overflow:visible!important;
    padding-left:5px!important;
    padding-right:5px!important;
    gap:4px!important;
  }
  .mx-a-page .search-type-tabs a>span{
    min-width:0!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:normal!important;
    font-size:13px!important;
    line-height:1.05!important;
  }
  .mx-a-page .search-type-tabs a>small{flex:0 0 auto!important}

  /* Service page location filter: on mobile use all Romanian counties,
     independent of whether a provider is currently listed there. */
  .market-service-page .mx-service-city-filter{display:none!important}
  .market-service-page .mx-service-county-filter{display:grid!important}
  .market-service-page .mx-service-location-search{
    width:min(100%,360px)!important;
    max-width:360px!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    margin-top:18px!important;
    padding:8px!important;
    border:1px solid #2a3942!important;
    border-radius:16px!important;
    background:#0b1419!important;
    box-shadow:0 16px 34px rgba(0,0,0,.26)!important;
  }
  .market-service-page .mx-service-location-search>label{
    padding:0!important;
    border:0!important;
    background:transparent!important;
    color:#8e9ba2!important;
  }
  .market-service-page .mx-service-location-search>label>span{
    display:block;
    padding:3px 8px 6px;
    color:#97a4aa!important;
    font-size:10px!important;
  }
  .market-service-page .mx-service-location-search .mx-select-trigger{
    min-height:54px!important;
    padding:0 14px!important;
    border:1px solid #2f414b!important;
    border-radius:12px!important;
    background:#081115!important;
    color:#fff!important;
    box-shadow:none!important;
    font-size:16px!important;
    font-weight:700!important;
  }
  .market-service-page .mx-service-location-search .mx-select-value{color:#fff!important}
  .market-service-page .mx-service-location-search .mx-select-chevron{color:#a8b2b7!important}
  .market-service-page .mx-service-location-search .btn{
    min-height:48px!important;
    width:100%!important;
    border-radius:11px!important;
  }

  /* Booking page: generic .container padding was stacking with the page-head
     padding and creating a very large empty block. */
  .booking-page-head{padding:0!important}
  .booking-page-head>.container{
    padding-top:22px!important;
    padding-bottom:18px!important;
  }
  .booking-page-head .breadcrumbs{margin-bottom:14px!important}
  .booking-page-head h1{margin:6px 0 10px!important;line-height:1.02!important}
  .booking-page-head p{margin:0!important;line-height:1.45!important}
  .booking-flow{padding-top:20px!important}
}

@media(max-width:390px){
  .mx-a-page .search-type-tabs a>span{font-size:12px!important}
  .mx-a-page .search-type-tabs a>small{min-width:20px!important;height:20px!important;font-size:9px!important}
  .market-service-page .mx-service-location-search{max-width:340px!important}
}

/* ==== TABS-FIT: "Profesioniști" încape complet ==== */

@media (max-width: 560px) {
    .mx-a-page .search-type-tabs,
    .search-type-tabs {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        width: 100% !important;
        gap: 6px !important;
        box-sizing: border-box;
    }

    .mx-a-page .search-type-tabs a,
    .search-type-tabs a {
        width: 100% !important;
        min-width: 0 !important;
        padding: 9px 6px !important;
        gap: 5px !important;
        box-sizing: border-box;
        overflow: visible !important;
    }

    /* textul se strânge, dar rămâne lizibil */
    .mx-a-page .search-type-tabs a > span,
    .search-type-tabs a > span {
        font-size: 12.5px !important;
        line-height: 1.1 !important;
        min-width: 0 !important;
        overflow: visible !important;
        white-space: nowrap !important;
        letter-spacing: -.02em;
    }

    .mx-a-page .search-type-tabs a > small,
    .search-type-tabs a > small {
        min-width: 19px !important;
        height: 19px !important;
        padding: 0 5px !important;
        font-size: 9.5px !important;
        flex: 0 0 auto !important;
    }
}

/* ecrane foarte înguste: coborâm și mai mult */
@media (max-width: 380px) {
    .mx-a-page .search-type-tabs a > span,
    .search-type-tabs a > span {
        font-size: 11.5px !important;
    }

    .mx-a-page .search-type-tabs a,
    .search-type-tabs a {
        padding: 8px 4px !important;
    }
}

/* ==== TABS-FIT-2: font mai puțin gros pentru încadrare ==== */

@media (max-width: 560px) {
    .mx-a-page .search-type-tabs a,
    .search-type-tabs a {
        padding: 9px 5px !important;
        gap: 4px !important;
    }

    .mx-a-page .search-type-tabs a > span,
    .search-type-tabs a > span {
        font-size: 12.5px !important;
        font-weight: 600 !important;
        letter-spacing: -.03em !important;
    }

    .mx-a-page .search-type-tabs a > small,
    .search-type-tabs a > small {
        min-width: 18px !important;
        height: 18px !important;
        padding: 0 4px !important;
        font-size: 9px !important;
        font-weight: 700 !important;
    }
}

@media (max-width: 380px) {
    .mx-a-page .search-type-tabs a > span,
    .search-type-tabs a > span {
        font-size: 12px !important;
        letter-spacing: -.04em !important;
    }
}

/* ==== TABS-FIT-3: încadrare finală ==== */

@media (max-width: 560px) {
    .mx-a-page .search-type-tabs,
    .search-type-tabs {
        gap: 5px !important;
    }

    .mx-a-page .search-type-tabs a,
    .search-type-tabs a {
        padding: 9px 4px !important;
        gap: 3px !important;
    }

    .mx-a-page .search-type-tabs a > span,
    .search-type-tabs a > span {
        font-size: 12px !important;
        letter-spacing: -.03em !important;
    }
}

/* ==== TABS-AUTO: coloane după conținut, fără tăiere ==== */

@media (max-width: 560px) {
    .mx-a-page .search-type-tabs,
    .search-type-tabs {
        display: flex !important;
        grid-template-columns: none !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
        gap: 5px !important;
        box-sizing: border-box;
        overflow: visible !important;
    }

    .mx-a-page .search-type-tabs a,
    .search-type-tabs a {
        flex: 1 1 auto !important;
        width: auto !important;
        min-width: 0 !important;
        padding: 9px 6px !important;
        gap: 4px !important;
        box-sizing: border-box;
        overflow: visible !important;
    }

    /* coloana lungă primește mai mult spațiu decât cele scurte */
    .mx-a-page .search-type-tabs a:last-child,
    .search-type-tabs a:last-child {
        flex-grow: 1.6;
    }

    .mx-a-page .search-type-tabs a > span,
    .search-type-tabs a > span {
        font-size: 12px !important;
        font-weight: 600 !important;
        letter-spacing: -.03em !important;
        line-height: 1.1 !important;
        min-width: 0 !important;
        white-space: nowrap !important;
        overflow: visible !important;
    }

    .mx-a-page .search-type-tabs a > small,
    .search-type-tabs a > small {
        min-width: 18px !important;
        height: 18px !important;
        padding: 0 4px !important;
        font-size: 9px !important;
        flex: 0 0 auto !important;
    }
}

/* sub 380px: textul coboară puțin, ca să nu se atingă */
@media (max-width: 380px) {
    .mx-a-page .search-type-tabs a,
    .search-type-tabs a {
        padding: 8px 4px !important;
        gap: 3px !important;
    }

    .mx-a-page .search-type-tabs a > span,
    .search-type-tabs a > span {
        font-size: 11.5px !important;
        letter-spacing: -.04em !important;
    }

    .mx-a-page .search-type-tabs a > small,
    .search-type-tabs a > small {
        min-width: 17px !important;
        height: 17px !important;
        padding: 0 3px !important;
        font-size: 8.5px !important;
    }
}

@media (max-width: 340px) {
    .mx-a-page .search-type-tabs a > span,
    .search-type-tabs a > span {
        font-size: 11px !important;
    }
}
