/* GUSTI E-map — responsive. Mobile & tablet stay map-first. */

/* ---------- tablet ---------- */
@media (min-width:641px) and (max-width:1024px){
  .searchbox{width:min(300px,42vw)}
  .poi-card{width:340px}
  .tb-left .interreg{height:30px}
}

/* ---------- mobile ---------- */
@media (max-width:640px){
  :root{--header-h:54px}

  .loading .wrap{gap:14px}
  .loading .load-logo{width:104px}
  .loading .load-wave{width:154px}

  .topbar{padding:0 10px;gap:8px}
  .tb-left{gap:10px}
  .tb-left .interreg{height:23px}
  .tb-brand{padding-left:10px}
  .tb-brand .gusti-word{height:16px}
  .tb-nav{display:none}                       /* nav lives in the dock on mobile */
  .lang button{padding:4px 9px;font-size:11px}

  .searchbox{left:10px;right:10px;top:calc(var(--header-h) + 10px);width:auto}
  .searchbox .field{height:40px}
  .region-chip{
    left:10px;right:10px;top:calc(var(--header-h) + 60px);width:auto;justify-content:center;height:38px;
  }
  .region-chip .rc-cap{display:none}
  .map::after{display:none}

  .dock{left:10px;right:10px;bottom:10px;transform:none;justify-content:space-around;padding:4px}
  .dockbtn{flex:1;justify-content:center;padding:9px 6px;font-size:12px}
  .dockbtn span:not(.badge){font-size:11.5px}

  /* popovers & POI card become bottom sheets */
  .popover{
    left:0;right:0;bottom:0;transform:none;width:100%;max-height:72vh;
    border-radius:18px 18px 0 0;border-bottom:0;animation:sheet var(--dur) var(--ease);
  }
  .poi-card{
    top:auto;left:0;right:0;bottom:0;width:100%;
    height:62vh;max-height:92vh;
    border-radius:18px 18px 0 0;border-bottom:0;
    transform:translateY(calc(100% + 24px));
    transition:transform var(--dur) var(--ease),height var(--dur) var(--ease);
  }
  .poi-card.open{transform:none}
  .poi-card.expanded{height:92vh}
  .poi-card.route-mode{height:46vh}            /* route detail: keep the route visible above */
  .poi-card.route-mode.expanded{height:92vh}
  .poi-card .pc-grip{
    display:block;position:absolute;top:0;left:0;right:0;height:22px;z-index:6;
    background:transparent;border:0;
  }
  .poi-card .pc-grip::after{
    content:"";position:absolute;top:8px;left:50%;transform:translateX(-50%);
    width:40px;height:4px;border-radius:3px;background:rgba(255,255,255,.7);
  }
  .poi-card .pc-scroll{padding-top:6px}
  .pc-photo{aspect-ratio:16/9}
  body.panel-open .dock{opacity:0;pointer-events:none;transition:opacity var(--dur)}

  .maplibregl-ctrl-bottom-right{margin-bottom:62px}

  @keyframes sheet{from{transform:translateY(14px);opacity:.6}to{transform:translateY(0);opacity:1}}
}

/* ---------- short viewports ---------- */
@media (max-height:560px){
  .poi-card{max-height:calc(100vh - var(--header-h) - 16px)}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}