/* PawPort App Shell — bottom tab bar
   Only rendered when running inside the packaged Capacitor app (see app-shell.js).
   On the regular website this file has no visible effect. */

#app-tabbar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 200;
  display: flex;
  background: rgba(250,246,238,0.96);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-top: 1px solid #EAE2D2;
  padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
}

.app-tab {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 6px 2px;
  text-decoration: none;
  color: #6E6759;
  font-family: 'Instrument Sans', sans-serif;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.1px;
  border-radius: 14px;
  transition: color 0.15s;
}

.app-tab-icon { font-size: 20px; line-height: 1; }
.app-tab.active { color: #BE3D26; }

body.has-app-tabbar { padding-bottom: 78px; }

/* window.print() is a no-op inside the iOS webview — hide the dead button in the app */
body.has-app-tabbar .btn-print { display: none; }

@media (min-width: 900px) {
  #app-tabbar { display: none; }
  body.has-app-tabbar { padding-bottom: 0; }
}