/* ================================================================
   PRIYO STORY — BOTTOM NAVIGATION (phones only)
   ================================================================ */
.bnav{ display:none; }

@media (max-width:880px){
  .bnav{
    position:fixed;
    left:0; right:0; bottom:0;
    z-index:9000;
    display:flex;
    align-items:stretch;
    background:var(--card, #fff);
    border-top:1px solid var(--border, #e2e8e4);
    padding-bottom:env(safe-area-inset-bottom, 0px);
    box-shadow:0 -2px 14px rgba(15,81,50,.07);
    transition:transform .25s ease;
  }
  /* slides away while reading, comes back on the way up */
  .bnav.down{ transform:translateY(115%); }

  .bnav-item{
    flex:1;
    display:flex; flex-direction:column;
    align-items:center; justify-content:center;
    gap:5px;
    padding:11px 0 9px;
    color:var(--muted, #6b7a72);
    text-decoration:none;
    position:relative;
    -webkit-tap-highlight-color:transparent;
  }
  .bnav-item svg{ width:26px; height:26px; }
  .bnav-item.on{ color:var(--green-dark, #0f5132); }

  /* the small line under the active tab */
  .bnav-dot{
    width:22px; height:3px;
    border-radius:3px;
    background:transparent;
  }
  .bnav-item.on .bnav-dot{ background:var(--green-dark, #0f5132); }

  .bnav-me img{
    width:27px; height:27px;
    border-radius:50%;
    object-fit:cover;
    display:block;
    border:2px solid transparent;
  }
  .bnav-me.on img{ border-color:var(--green-dark, #0f5132); }

  /* ---------------- the post button ----------------
     Raised out of the bar and filled green so it reads as the one
     thing you do rather than a place you go. */
  .bnav-plus{
    border:none;
    background:transparent;
    cursor:pointer;
    padding:0;
    flex:0 0 auto;
    width:74px;
  }
  .bnav-plus-ring{
    width:52px; height:52px;
    margin-top:-16px;
    border-radius:50%;
    background:var(--green-dark, #0f5132);
    color:#fff;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 4px 14px rgba(15,81,50,.34);
    border:3px solid var(--card, #fff);
    transition:transform .14s ease;
  }
  .bnav-plus:active .bnav-plus-ring{ transform:scale(.92); }
  .bnav-plus svg{ width:26px; height:26px; }
  .bnav-plus .bnav-dot{ display:none; }

  /* room so the last post is never hidden behind the bar */
  body.has-bnav{ padding-bottom:64px; }
  body.has-bnav .site-footer{ margin-bottom:6px; }

  /* full-screen things sit above it, and it gets out of their way */
  body.cp-lock .bnav,
  body.ch-open .bnav{ display:none; }
}

@media (max-width:380px){
  .bnav-item svg{ width:24px; height:24px; }
  .bnav-item{ padding:10px 0 8px; }
  .bnav-me img{ width:25px; height:25px; }
  .bnav-plus{ width:64px; }
  .bnav-plus-ring{ width:48px; height:48px; margin-top:-14px; }
  .bnav-plus svg{ width:24px; height:24px; }
}

@media (prefers-reduced-motion:reduce){
  .bnav{ transition:none; }
}