/*
 * BúscameYa - Parche final responsive público
 * Enfocado en la página principal y categorías públicas.
 * Corrige: botones, textos, búsquedas populares, slider de destacados y grupos principales.
 * Rango móvil considerado: iPhone 7, Samsung A12, iPhone 13 y Samsung S22 Ultra.
 */

:root{
  --bm-safe-x: 14px;
  --bm-card-w: min(342px, calc(100vw - 84px));
  --bm-blue: #1769ff;
  --bm-text: #0f172a;
  --bm-muted: #64748b;
  --bm-line: rgba(15,23,42,.10);
  --bm-shadow: 0 16px 36px rgba(15,23,42,.14);
}

html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden!important;
}

*{
  box-sizing:border-box;
}

img,
svg,
video,
canvas{
  max-width:100%;
  height:auto;
}

/* Contención general para evitar que textos o botones generen scroll lateral */
.topbar,
.topbar-inner,
main,
#inicio,
.gl-hero,
.gl-hero-layout,
.section,
.quick-strip,
.gl-rail-wrap,
.category-grid,
.promo-grid,
.footer-phc{
  max-width:100%;
}

.gl-hero h1,
.section-head h2,
.business-info h3,
.cat-card strong,
.side-card strong,
.big-promo strong,
.brand-text strong{
  overflow-wrap:anywhere;
  text-wrap:balance;
}

.gl-lead,
.section-head p,
.business-desc,
.business-meta-line,
.business-hours-mini,
.location-summary span,
.gl-trust-item span,
.side-card p{
  overflow-wrap:anywhere;
}

/* Header público */
.topbar{
  z-index:990!important;
}

.topbar-inner{
  min-width:0;
}

.brand,
.nav-search,
.top-actions{
  min-width:0;
}

.nav-search input{
  min-width:0!important;
}

/* Botones: que no se estiren ni queden gigantes en móvil */
.primary-btn,
.details-btn,
.ghost-btn,
.filter-chip,
.gl-tag-mini,
.gl-location-field,
.see-all,
.card-actions a,
.card-actions button,
.card-actions .readonly-contact{
  max-width:100%;
  min-width:0!important;
  white-space:nowrap;
  text-align:center;
}

.gl-actions,
.quick-filter-bar,
.gl-popular-tags,
.card-actions,
.top-actions.phc-public-nav{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}

/* Búsquedas populares */
.gl-popular-tags{
  line-height:1.25!important;
}

.gl-popular-tags .popular-label{
  font-weight:950;
  color:var(--bm-muted);
}

.gl-tag-mini{
  cursor:pointer;
}

/* Slider destacados: comportamiento base seguro */
.gl-rail-wrap{
  position:relative!important;
  overflow:visible!important;
}

.gl-rail{
  display:flex!important;
  flex-wrap:nowrap!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  gap:16px!important;
  scroll-snap-type:x mandatory!important;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}

.gl-rail .business-card{
  flex:0 0 320px!important;
  width:320px!important;
  min-width:320px!important;
  max-width:320px!important;
  scroll-snap-align:start!important;
  cursor:pointer;
}

/* Flechas visibles del slider */
.rail-arrow,
.bm-rail-arrow{
  position:absolute!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  min-height:38px!important;
  border-radius:999px!important;
  border:1px solid rgba(23,105,255,.16)!important;
  background:rgba(255,255,255,.97)!important;
  color:var(--bm-blue)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:28px!important;
  line-height:1!important;
  font-weight:950!important;
  box-shadow:var(--bm-shadow)!important;
  z-index:40!important;
  cursor:pointer!important;
  opacity:1!important;
}

.rail-prev,
.bm-rail-prev{left:0!important;}
.rail-next,
.bm-rail-next{right:0!important;}

.rail-arrow:disabled,
.bm-rail-arrow:disabled{
  opacity:.46!important;
}

.gl-rail-wrap::before,
.gl-rail-wrap::after{
  content:"";
  position:absolute;
  top:0;
  bottom:14px;
  width:34px;
  z-index:25;
  pointer-events:none;
}

.gl-rail-wrap::before{
  left:0;
  background:linear-gradient(90deg, rgba(255,255,255,.98), rgba(255,255,255,0));
}

.gl-rail-wrap::after{
  right:0;
  background:linear-gradient(270deg, rgba(255,255,255,.98), rgba(255,255,255,0));
}

/* Autocompletado / búsqueda predictiva: evita que se salga en móvil */
.predictive-search-wrap,
.gl-search-field,
.nav-search,
.gl-search-panel{
  position:relative;
  overflow:visible!important;
}

.auto-list,
.predictive-results{
  max-width:100vw!important;
  z-index:9999!important;
}

.auto-list li,
.predictive-item,
.predictive-copy strong,
.predictive-copy small,
.predictive-copy em{
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Móvil general */
@media (max-width: 767px){
  :root{
    --bm-safe-x: 12px;
  }

  body{
    padding-bottom:88px!important;
  }

  .topbar{
    padding:8px 0!important;
  }

  .topbar-inner{
    width:calc(100% - 20px)!important;
    display:flex!important;
    flex-wrap:wrap!important;
    justify-content:center!important;
    align-items:center!important;
    gap:8px!important;
  }

  .brand{
    flex:0 1 auto!important;
    justify-content:center!important;
  }

  .brand-icon{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    border-radius:14px!important;
  }

  .brand-text strong{
    font-size:15px!important;
    line-height:1.05!important;
  }

  .brand-text small{
    font-size:10px!important;
    line-height:1.05!important;
  }

  .top-actions.phc-public-nav{
    width:100%!important;
    justify-content:center!important;
    order:3;
  }

  .top-actions.phc-public-nav .ghost-btn{
    display:inline-flex!important;
    font-size:10px!important;
    min-height:30px!important;
    padding:0 9px!important;
    border-radius:999px!important;
  }

  .nav-search{
    order:2;
    flex:1 1 100%!important;
    width:100%!important;
    max-width:100%!important;
    min-height:42px!important;
    padding:0 8px!important;
    border-radius:16px!important;
  }

  .nav-search input{
    height:42px!important;
    font-size:12px!important;
  }

  .filter-icon,
  .theme-dot{
    min-width:32px!important;
    min-height:32px!important;
  }

  /* Hero más liviano */
  .gl-hero{
    width:100%!important;
    padding:20px var(--bm-safe-x) 8px!important;
    margin:0 auto!important;
  }

  .gl-hero::before,
  .gl-visual{
    display:none!important;
  }

  .gl-hero-layout{
    display:block!important;
  }

  .gl-eyebrow{
    margin:0 auto 10px!important;
    max-width:100%!important;
    width:max-content!important;
    font-size:10px!important;
    padding:7px 10px!important;
  }

  .gl-hero h1{
    max-width:360px!important;
    margin:10px auto 0!important;
    text-align:center!important;
    font-size:clamp(28px, 8.1vw, 34px)!important;
    line-height:1.02!important;
    letter-spacing:-.055em!important;
  }

  .gl-lead{
    max-width:340px!important;
    margin:10px auto 0!important;
    text-align:center!important;
    font-size:12px!important;
    line-height:1.45!important;
  }

  .gl-actions{
    justify-content:center!important;
    margin-top:14px!important;
  }

  .gl-actions .primary-btn,
  .gl-actions .details-btn,
  .primary-btn,
  .details-btn{
    font-size:11px!important;
    min-height:34px!important;
    padding:0 11px!important;
    border-radius:999px!important;
  }

  /* Buscador principal */
  .gl-search-panel{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:7px!important;
    max-width:360px!important;
    margin:14px auto 0!important;
    padding:9px!important;
    border-radius:20px!important;
  }

  .gl-search-field,
  .gl-location-field{
    min-height:40px!important;
    padding:0 10px!important;
    border-radius:14px!important;
    font-size:12px!important;
  }

  .gl-search-field input{
    font-size:12px!important;
  }

  .gl-search-panel .primary-btn,
  .gl-location-field{
    width:auto!important;
    justify-self:center!important;
  }

  .gl-search-panel .primary-btn{
    min-width:118px!important;
  }

  /* Búsquedas populares y filtros */
  .gl-popular-tags,
  .quick-filter-bar{
    width:100%!important;
    max-width:360px!important;
    margin:10px auto 0!important;
    justify-content:center!important;
    text-align:center!important;
    gap:6px!important;
    padding:6px 2px!important;
  }

  .gl-popular-tags .popular-label{
    width:100%!important;
    display:block!important;
    font-size:11px!important;
    margin-bottom:1px!important;
  }

  .gl-tag-mini,
  .filter-chip{
    font-size:10px!important;
    min-height:28px!important;
    padding:0 8px!important;
    border-radius:999px!important;
  }

  .filter-chip.active{
    transform:none!important;
  }

  .location-summary{
    max-width:340px!important;
    width:auto!important;
    margin:10px auto 0!important;
    justify-content:center!important;
    text-align:center!important;
    padding:8px 10px!important;
    border-radius:16px!important;
    gap:4px!important;
  }

  .location-summary strong{
    width:100%!important;
    font-size:11px!important;
  }

  .location-summary span{
    font-size:10px!important;
    line-height:1.25!important;
  }

  /* Quick strip compacto */
  .quick-strip{
    width:calc(100% - 24px)!important;
    margin:16px auto 0!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }

  .callout-main{
    padding:12px!important;
    border-radius:18px!important;
    justify-content:center!important;
    text-align:left!important;
  }

  .callout-main .pin{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    font-size:22px!important;
  }

  .callout-main strong{
    font-size:18px!important;
    line-height:1.05!important;
  }

  .callout-small{
    display:none!important;
  }

  /* Secciones */
  .section{
    width:100%!important;
    margin:28px auto 0!important;
    padding-left:var(--bm-safe-x)!important;
    padding-right:var(--bm-safe-x)!important;
  }

  .section-head{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    text-align:center!important;
    gap:6px!important;
    margin-bottom:12px!important;
  }

  .section-head > div,
  .section-head p{
    width:100%!important;
  }

  .section-head h2{
    font-size:19px!important;
    line-height:1.08!important;
    letter-spacing:-.035em!important;
    margin:0 auto 4px!important;
    max-width:340px!important;
  }

  .section-head p{
    max-width:330px!important;
    margin:0 auto!important;
    font-size:11px!important;
    line-height:1.35!important;
  }

  .see-all{
    font-size:10px!important;
    min-height:28px!important;
    padding:0 10px!important;
    border-radius:999px!important;
    background:#fff!important;
    border:1px solid rgba(15,23,42,.08)!important;
  }

  /* Slider de destacados */
  .gl-rail-wrap{
    width:100%!important;
    max-width:100vw!important;
    margin:0 auto!important;
    padding:0 34px 18px!important;
    overflow:visible!important;
  }

  .gl-rail{
    gap:11px!important;
    padding:4px 0 14px!important;
  }

  .gl-rail .business-card{
    flex:0 0 var(--bm-card-w)!important;
    width:var(--bm-card-w)!important;
    min-width:var(--bm-card-w)!important;
    max-width:var(--bm-card-w)!important;
    min-height:260px!important;
    padding:12px!important;
    border-radius:22px!important;
  }

  .rail-arrow,
  .bm-rail-arrow{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    font-size:22px!important;
  }

  .rail-prev,
  .bm-rail-prev{left:2px!important;}
  .rail-next,
  .bm-rail-next{right:2px!important;}

  .business-cover{
    min-height:56px!important;
    height:56px!important;
    border-radius:16px!important;
  }

  .card-distance{
    font-size:10px!important;
    padding:5px 7px!important;
    max-width:calc(100% - 12px)!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .business-main{
    gap:9px!important;
    align-items:flex-start!important;
  }

  .business-logo{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    border-radius:15px!important;
    font-size:22px!important;
  }

  .business-info{
    min-width:0!important;
  }

  .business-info h3{
    font-size:14px!important;
    line-height:1.12!important;
    margin-bottom:3px!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden!important;
  }

  .business-meta-line,
  .business-desc,
  .business-hours-mini{
    font-size:10px!important;
    line-height:1.25!important;
  }

  .business-desc{
    display:-webkit-box!important;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden!important;
    margin-top:3px!important;
  }

  .verified-pill,
  .business-hours-mini{
    margin-top:4px!important;
  }

  .rating-row{
    display:flex!important;
    flex-wrap:wrap!important;
    justify-content:center!important;
    gap:5px!important;
  }

  .rating-row span,
  .tag,
  .verified-pill,
  .business-hours-mini,
  .plan-note,
  .badge-featured,
  .open-badge,
  .rating-score{
    font-size:9.5px!important;
    min-height:24px!important;
    padding:5px 7px!important;
    line-height:1.05!important;
    border-radius:999px!important;
  }

  .card-actions{
    display:flex!important;
    flex-wrap:wrap!important;
    justify-content:center!important;
    gap:7px!important;
    margin-top:8px!important;
  }

  .card-actions .readonly-contact,
  .card-actions .details-btn,
  .card-actions a,
  .card-actions button{
    font-size:10.5px!important;
    min-height:30px!important;
    padding:0 9px!important;
    border-radius:999px!important;
    max-width:100%!important;
  }

  .readonly-contact strong{
    font-size:10.5px!important;
  }

  /* Grupos principales de a 2 */
  .category-grid{
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
    gap:10px!important;
  }

  .category-grid .cat-card{
    min-height:112px!important;
    padding:11px 8px!important;
    border-radius:18px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    gap:7px!important;
  }

  .category-grid .cat-card i{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
    display:grid!important;
    place-items:center!important;
    margin:0 auto!important;
    font-size:24px!important;
  }

  .category-grid .cat-card strong{
    font-size:11.5px!important;
    line-height:1.12!important;
    display:block!important;
  }

  .category-grid .cat-card small{
    display:none!important;
  }

  .category-count{
    display:inline-flex!important;
    margin-top:2px!important;
    font-size:9.5px!important;
    line-height:1!important;
  }

  /* Promos y footer compactos */
  .promo-grid{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  .big-promo,
  .side-card{
    border-radius:20px!important;
    padding:16px!important;
    min-height:auto!important;
  }

  .big-promo strong{
    font-size:24px!important;
    line-height:1.02!important;
  }

  .side-card strong{
    font-size:16px!important;
  }

  .side-card p{
    font-size:11px!important;
    line-height:1.35!important;
  }

  .footer-phc{
    width:calc(100% - 24px)!important;
    margin:28px auto 90px!important;
    padding:16px 0!important;
    display:block!important;
    text-align:center!important;
  }

  .footer-phc span,
  .footer-phc a{
    font-size:11px!important;
  }

  .footer-links{
    display:flex!important;
    flex-wrap:wrap!important;
    justify-content:center!important;
    gap:10px!important;
    margin-top:8px!important;
  }

  .mobile-cta{
    left:10px!important;
    right:10px!important;
    bottom:10px!important;
    padding:9px!important;
    min-height:48px!important;
    border-radius:999px!important;
  }

  .mobile-cta span,
  .mobile-cta a{
    font-size:11px!important;
  }

  .mobile-cta a{
    padding:9px 12px!important;
  }

  /* Autocomplete viejo y nuevo */
  .auto-list,
  .predictive-results{
    left:0!important;
    right:0!important;
    top:calc(100% + 6px)!important;
    border-radius:15px!important;
    max-height:320px!important;
    font-size:12px!important;
  }

  .auto-list li{
    padding:9px 10px!important;
    font-size:12px!important;
  }
}

/* Teléfonos pequeños: Samsung A12 / equipos de 360px */
@media (max-width: 374px){
  :root{
    --bm-safe-x: 10px;
    --bm-card-w: calc(100vw - 72px);
  }

  .gl-hero h1{
    font-size:27px!important;
  }

  .gl-lead{
    font-size:11.5px!important;
  }

  .gl-rail-wrap{
    padding-left:30px!important;
    padding-right:30px!important;
  }

  .rail-arrow,
  .bm-rail-arrow{
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
    min-height:28px!important;
  }

  .category-grid{
    gap:8px!important;
  }

  .category-grid .cat-card{
    min-height:106px!important;
    padding:10px 6px!important;
  }

  .category-grid .cat-card strong{
    font-size:10.5px!important;
  }
}

/* iPhone 13 / S22 Ultra: mejor balance de ancho */
@media (min-width: 390px) and (max-width: 430px){
  :root{
    --bm-card-w:min(350px, calc(100vw - 92px));
  }

  .gl-hero h1{
    font-size:32px!important;
  }

  .category-grid .cat-card{
    min-height:120px!important;
  }
}

/* Modo tablet y teléfonos horizontales */
@media (min-width: 768px) and (max-width: 1024px){
  .gl-hero-layout{
    grid-template-columns:1fr!important;
  }

  .gl-visual{
    max-width:720px;
    margin:0 auto;
  }

  .category-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr))!important;
  }
}