/*
 * LocalHub V20.3 — mobile safe-area and touch ergonomics.
 * Visual identity is intentionally unchanged.
 */
:root{
  --lh-safe-top:env(safe-area-inset-top,0px);
  --lh-safe-right:env(safe-area-inset-right,0px);
  --lh-safe-bottom:env(safe-area-inset-bottom,0px);
  --lh-safe-left:env(safe-area-inset-left,0px);
  --lh-visual-height:100dvh;
}

html{
  background:#070708;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

@media(max-width:768px){
  html{
    /* Keeps standalone iPhone/PWA content below the status area.
       On devices without a notch the value is simply zero. */
    padding-top:var(--lh-safe-top);
    min-width:100%;
    width:100%;
    box-sizing:border-box;
    overflow-x:hidden;
  }

  body{
    box-sizing:border-box;
    width:100%;
    max-width:100%;
    min-width:0;
    min-height:calc(100dvh - var(--lh-safe-top));
    overflow-x:hidden!important;
    overscroll-behavior-x:none;
    -webkit-tap-highlight-color:transparent;
  }

  body.lh-unified-shell{
    min-height:calc(100dvh - var(--lh-safe-top))!important;
  }

  main,
  .main,
  .dashboard-content,
  .catalog-content,
  .feed-shell,
  .feed,
  .wrap,
  .container,
  .shell,
  .profile-main,
  .saved-main,
  .discover-main,
  .post-wrap{
    min-width:0!important;
    max-width:100%;
  }

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

  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  select,
  textarea{
    font-size:16px!important;
    max-width:100%;
  }

  input,
  select,
  textarea,
  button,
  a,
  [role="button"]{
    touch-action:manipulation;
  }

  textarea{resize:vertical}

  /* Keep fixed public navigation clear of rounded corners/home indicator. */
  .lh-mobile-nav{
    left:max(8px,var(--lh-safe-left))!important;
    right:max(8px,var(--lh-safe-right))!important;
    bottom:calc(8px + var(--lh-safe-bottom))!important;
  }

  .lh-nav-toast{
    bottom:calc(94px + var(--lh-safe-bottom))!important;
  }

  /* Owner nav variants, when present on a page. */
  .owner-mobile-nav,
  .owner-bottom-nav,
  .mobile-bottom-nav{
    left:max(8px,var(--lh-safe-left));
    right:max(8px,var(--lh-safe-right));
    bottom:calc(8px + var(--lh-safe-bottom));
  }

  /* Forms/controls remain easy to hit without changing the visual theme. */
  button[type="submit"],
  input[type="submit"],
  .btn-save,
  .publish-submit,
  .profile-save,
  .saved-open,
  .btn-view,
  .submit{
    min-height:44px;
  }

  /* Long translated labels/addresses must wrap rather than push the page sideways. */
  .place-card,
  .saved-card,
  .post,
  .card,
  .panel,
  .profile-card,
  .profile-section,
  .place-switcher,
  .review,
  .item{
    min-width:0;
    overflow-wrap:anywhere;
  }

  [id]{
    scroll-margin-top:calc(12px + var(--lh-safe-top));
  }

  /* iOS keyboard: fixed bottom bars should not sit on top of text fields. */
  html.lh-keyboard-open .lh-mobile-nav,
  html.lh-keyboard-open .owner-mobile-nav,
  html.lh-keyboard-open .owner-bottom-nav,
  html.lh-keyboard-open .mobile-bottom-nav{
    opacity:0!important;
    pointer-events:none!important;
    transform:translateY(120%)!important;
  }

  html.lh-keyboard-open body{
    padding-bottom:16px!important;
  }
}

/* Narrow phones: preserve readability instead of squeezing three tiny stat cards. */
@media(max-width:390px){
  .stats-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .owner-header-actions{
    grid-template-columns:1fr!important;
  }

  .place-switcher-actions{
    grid-template-columns:1fr!important;
  }

  .place-switcher-actions select{
    grid-column:auto!important;
  }
}

/* Landscape phones: honor left/right sensor/notch safe areas. */
@media(max-width:900px) and (orientation:landscape){
  body{
    padding-left:var(--lh-safe-left);
    padding-right:var(--lh-safe-right);
  }
}