/* Bottom navigation for phones (resources/views/frontend/includes/mobile-nav.blade.php).
   Visibility (<=575px) still comes from custom.css .add_newp. */
.sg-bnav.add_newp {
    padding: 0 6px env(safe-area-inset-bottom);
    background: #fff;
    border-top: 1px solid #E3E7EC;
    box-shadow: 0 -4px 16px rgba(18, 22, 28, .08);
    z-index: 1000;
    font-family: Poppins, system-ui, -apple-system, "Segoe UI", sans-serif;
    transition: transform .2s ease;
}
.sg-bnav.is-hidden { transform: translateY(110%); }
.sg-bnav ul { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: end; margin: 0; padding: 0; list-style: none; }
.sg-bnav li { display: flex; justify-content: center; }
.sg-bnav a { -webkit-tap-highlight-color: transparent; text-decoration: none; }
.sg-bnav-item {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    width: 100%; min-height: 60px; padding: 8px 2px 6px; color: #5B6470;
}
.sg-bnav-item:hover, .sg-bnav-item:focus { color: #12161C; text-decoration: none; }
.sg-bnav-item.is-active { color: #157A2C; }
.sg-bnav-item.is-active::before {
    content: ""; position: absolute; top: 0; left: 50%; width: 28px; height: 3px; margin-left: -14px;
    border-radius: 0 0 3px 3px; background: #157A2C;
}
.sg-bnav-ic { position: relative; display: flex; }
.sg-bnav svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sg-bnav-item.is-active svg { stroke-width: 2.2; }
.sg-bnav-label { font-size: 11px; font-weight: 500; line-height: 1.2; white-space: nowrap; color: inherit; margin: 0; }
.sg-bnav-item.is-active .sg-bnav-label { font-weight: 600; }
.sg-bnav-badge {
    position: absolute; top: -5px; left: 14px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
    background: #D92D20; color: #fff; font-size: 10px; font-weight: 700; line-height: 18px; text-align: center;
    box-shadow: 0 0 0 2px #fff;
}
.sg-bnav-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }

/* Post ad: raised green button */
.sg-bnav-post { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 0 2px 6px; color: #157A2C; }
.sg-bnav-post:hover, .sg-bnav-post:focus { color: #11662A; text-decoration: none; }
.sg-bnav-fab {
    display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin-top: -22px;
    border-radius: 50%; background: #157A2C; color: #fff;
    box-shadow: 0 6px 16px rgba(21, 122, 44, .35), 0 0 0 4px #fff;
    transition: transform .15s ease, background-color .15s ease;
}
.sg-bnav-fab svg { width: 28px; height: 28px; stroke-width: 2.4; }
.sg-bnav-post:active .sg-bnav-fab { transform: scale(.94); }
.sg-bnav-post:hover .sg-bnav-fab, .sg-bnav-post.is-active .sg-bnav-fab { background: #11662A; }
.sg-bnav-post .sg-bnav-label { font-weight: 600; }

.sg-bnav a:focus-visible { outline: 3px solid #0070C0; outline-offset: -3px; border-radius: 10px; }
.sg-bnav-post:focus-visible { outline-offset: 2px; }

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