/* PGCO — nav-mobile.css (Telegram-like skin; fixed) */

@media (max-width: 767.98px){
    body{
        padding-bottom: calc(var(--footer-h, 86px) + env(safe-area-inset-bottom, 0px));
    }

    .pgco-mobile-nav{
        position: fixed;
        inset: auto 0 10px 0;
        z-index: 900;
        display: grid;
        place-items: end center;
        pointer-events: none;
        overflow: visible; /* تا CTA بریده نشه */
    }

    .pgco-nav-bar{
        pointer-events: auto;
        position: relative;
        display: flex; align-items: center; justify-content: space-between;
        width: min(92vw, 620px);
        min-height: 56px;                 /* ارتفاع کمتر */
        padding: 8px 12px;                /* فشرده‌تر */
        background: color-mix(in srgb, var(--pgco-card) 92%, transparent);
        backdrop-filter: saturate(160%) blur(12px);
        -webkit-backdrop-filter: saturate(160%) blur(12px);
        border: 1px solid color-mix(in srgb, var(--pgco-border) 80%, transparent);
        border-radius: 26px;
        box-shadow: 0 10px 28px rgba(0,0,0,.12);
        direction: rtl;
        overflow: visible;                 /* قرص/CTA بیرون نزند */
    }

    .pgco-nav-bar .nav-group{
        display: flex; gap: 8px;
        width: 42%;                        /* جا برای دکمهٔ وسط */
        justify-content: space-around;
        min-width: 0;
    }

    .nav-item{
        position: relative;
        display: inline-grid; justify-items: center;
        row-gap: 4px;
        padding: 7px 11px;
        border: 0; background: transparent;
        border-radius: 20px;
        cursor: pointer;
        color: var(--pgco-muted);
        font-family: "Vazirmatn", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
        font-size: 11px; line-height: 1.1;
        transition: background .18s ease, color .18s ease;
    }
    .nav-item i{ font-size: 18px; line-height: 1; }
    .nav-item span{ font-size: 11px; line-height: 1.1; }

    /* قرص پس‌زمینه آیتم فعال (شفاف‌تر شد) */
    .nav-item .circle{
        position: absolute; inset: 0;
        border-radius: 20px;
        background: var(--pgco-brand);
        opacity: 0%;                        /* پنهان در حالت عادی */
        transform: scale(.7);
        transition: transform .22s ease, opacity .22s ease;
        z-index: 0;
    }
    .nav-item.active .circle{
        opacity: .80;                      /* کمی شفاف */
        transform: scale(1);
    }
    .nav-item > i, .nav-item > span{ position: relative; z-index: 1; }
    .nav-item.active i, .nav-item.active span{ color: #fff; }
    .nav-item:not(.active):active{ background: rgba(0,0,0,.05); }

    /* دکمه وسط: کمی کوچک‌تر و پایین‌تر + سایه لطیف‌تر */
    .nav-center{
        pointer-events: auto;
        position: absolute; left: 50%; top: 0;
        transform: translate(-50%, -2%);  /* پایین‌تر از قبل (-35% بود) */
        width: 53px; height: 53px;         /* کمی کوچک‌تر (66px → 60px) */
        border-radius: 50%;
        display: grid; place-items: center;
        background: var(--pgco-accent);
        color: #fff;
        border: 1px solid rgba(255,255,255,.7);
        box-shadow: 0 8px 18px rgba(0,0,0,.18); /* سایه ریزتر */
    }
    .nav-center i{ font-size: 18px; line-height: 1; }
}

@media (min-width: 768px){
    .pgco-mobile-nav{ display: none; }
}