/* V3.2.4 - compact premium mobile tab bar + refined mobile hero search */
.search-label-mobile{display:none}

@media (max-width:760px){
  /* Keep page content visible above the mobile tab bar without wasting space. */
  body{padding-bottom:calc(56px + env(safe-area-inset-bottom))!important}

  .kh-mobile-bottom{
    height:54px!important;
    min-height:54px!important;
    padding:3px 6px max(3px,env(safe-area-inset-bottom))!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    align-items:center!important;
    background:rgba(255,255,255,.965)!important;
    border-top:1px solid rgba(218,225,235,.9)!important;
    box-shadow:0 -5px 18px rgba(15,35,65,.07)!important;
    backdrop-filter:blur(18px) saturate(1.3)!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.3)!important;
  }
  .kh-mobile-bottom>a,
  .kh-mobile-bottom>button{
    height:46px!important;
    min-height:46px!important;
    padding:2px 1px!important;
    gap:1px!important;
    border-radius:10px!important;
    font-size:8px!important;
    line-height:1!important;
    font-weight:760!important;
    letter-spacing:-.01em!important;
    color:#697386!important;
  }
  .kh-mobile-bottom>a:active,
  .kh-mobile-bottom>button:active{background:#f3f6fb!important;transform:scale(.97)}
  .kh-mobile-bottom>a>span,
  .kh-mobile-bottom>button>span{
    display:grid!important;
    place-items:center!important;
    width:24px!important;
    height:22px!important;
    margin:0!important;
    font-size:16px!important;
    line-height:1!important;
    color:#48566b!important;
  }
  .kh-mobile-bottom .kh-mobile-request{
    width:auto!important;
    height:46px!important;
    min-height:46px!important;
    margin:0 2px!important;
    transform:translateY(-5px)!important;
    border:0!important;
    border-radius:14px!important;
    background:linear-gradient(145deg,var(--blue),color-mix(in srgb,var(--blue) 76%,#061e4d))!important;
    color:#fff!important;
    box-shadow:0 7px 16px color-mix(in srgb,var(--blue) 22%,transparent)!important;
  }
  .kh-mobile-bottom .kh-mobile-request>span{
    width:22px!important;
    height:20px!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#fff!important;
    font-size:18px!important;
  }
  .kh-mobile-bottom .kh-mobile-request b{
    font-size:7.5px!important;
    font-weight:850!important;
    color:#fff!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  /* Home hero: a single, app-like search control instead of a tall two-row form. */
  .kh-home-hero .smart-search{
    width:100%!important;
    max-width:none!important;
    margin:14px 0 10px!important;
  }
  .kh-home-hero .smart-search-box{
    display:flex!important;
    align-items:center!important;
    grid-template-columns:none!important;
    gap:7px!important;
    min-height:52px!important;
    padding:5px 5px 5px 12px!important;
    border:1px solid rgba(213,222,234,.98)!important;
    border-radius:16px!important;
    background:rgba(255,255,255,.97)!important;
    box-shadow:0 10px 28px rgba(22,47,83,.13),0 1px 0 rgba(255,255,255,.8) inset!important;
    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;
    transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease!important;
  }
  .kh-home-hero .smart-search:focus-within .smart-search-box{
    border-color:color-mix(in srgb,var(--blue) 48%,#d5deea)!important;
    box-shadow:0 12px 30px rgba(22,47,83,.16),0 0 0 3px color-mix(in srgb,var(--blue) 9%,transparent)!important;
    transform:translateY(-1px)!important;
  }
  .kh-home-hero .smart-search-box>span{
    flex:0 0 25px!important;
    width:25px!important;
    display:grid!important;
    place-items:center!important;
    font-size:19px!important;
    color:var(--blue)!important;
    opacity:.9!important;
  }
  .kh-home-hero .smart-search-box input{
    flex:1 1 auto!important;
    min-width:0!important;
    width:auto!important;
    height:40px!important;
    padding:7px 2px!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    font-size:15px!important;
    line-height:1.2!important;
    color:#17233b!important;
  }
  .kh-home-hero .smart-search-box input::placeholder{color:#8793a6!important;opacity:1!important}
  .kh-home-hero .smart-search-box button{
    grid-column:auto!important;
    flex:0 0 auto!important;
    width:48px!important;
    min-width:48px!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    padding:0 8px!important;
    border-radius:12px!important;
    background:linear-gradient(145deg,var(--blue),color-mix(in srgb,var(--blue) 80%,#173763))!important;
    color:#fff!important;
    box-shadow:0 5px 13px color-mix(in srgb,var(--blue) 22%,transparent)!important;
    font-size:11px!important;
    font-weight:850!important;
  }
  .search-label-desktop{display:none!important}
  .search-label-mobile{display:inline!important}

  .kh-home-hero .smart-suggestions{
    left:0!important;
    right:0!important;
    top:calc(100% + 7px)!important;
    max-height:276px!important;
    overflow:auto!important;
    border:1px solid #dfe6ef!important;
    border-radius:15px!important;
    background:rgba(255,255,255,.985)!important;
    box-shadow:0 16px 38px rgba(14,34,64,.18)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
    z-index:120!important;
  }
  .kh-home-hero .smart-suggestions button,
  .kh-home-hero .smart-suggestions a{
    min-height:52px!important;
    padding:9px 12px!important;
    display:grid!important;
    gap:1px!important;
    border-bottom:1px solid #eef2f6!important;
    background:transparent!important;
  }
  .kh-home-hero .smart-suggestions button:last-child,
  .kh-home-hero .smart-suggestions a:last-child{border-bottom:0!important}
  .kh-home-hero .smart-suggestions b{font-size:12.5px!important;line-height:1.25!important;color:#17233b!important}
  .kh-home-hero .smart-suggestions span{font-size:10px!important;line-height:1.35!important;color:#768399!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .kh-home-hero .smart-no-result{padding:13px!important;font-size:11px!important}

  /* Give the hero a little more breathing room now that search is shorter. */
  .kh-home-hero .kh-popular-tags{margin-top:7px!important;gap:5px!important}
  .kh-home-hero .kh-popular-tags button{padding:5px 8px!important;font-size:9px!important;border-radius:999px!important}
}

@media (max-width:380px){
  body{padding-bottom:calc(53px + env(safe-area-inset-bottom))!important}
  .kh-mobile-bottom{height:51px!important;min-height:51px!important;padding-inline:3px!important}
  .kh-mobile-bottom>a,.kh-mobile-bottom>button{height:43px!important;min-height:43px!important;font-size:7.5px!important}
  .kh-mobile-bottom .kh-mobile-request{height:43px!important;min-height:43px!important;margin-inline:1px!important;transform:translateY(-4px)!important}
  .kh-home-hero .smart-search-box{padding-left:9px!important;gap:4px!important}
  .kh-home-hero .smart-search-box input{font-size:14px!important}
  .kh-home-hero .smart-search-box button{width:44px!important;min-width:44px!important}
}
