/*==========================================================
CODEEXAI
GLOBAL RESPONSIVE / MOBILE BOTTOM NAVIGATION
==========================================================*/


/*==========================================================
MOBILE BOTTOM NAV
(hidden on desktop, shown as a fixed glass pill on mobile/tablet)
==========================================================*/

.tb-mobile-bottom-nav{
    display:none;
}

@media (max-width:991px){

    .tb-mobile-bottom-nav{
        display:flex;
        position:fixed;
        left:50%;
        bottom:12px;
        bottom:calc(12px + env(safe-area-inset-bottom));
        transform:translateX(-50%);
        width:calc(100% - 24px);
        max-width:420px;
        backdrop-filter:blur(14px) saturate(180%);
        -webkit-backdrop-filter:blur(14px) saturate(180%);
        background:rgba(22,163,74,.55);
        border:1px solid rgba(255,255,255,.35);
        box-shadow:0 10px 30px rgba(0,0,0,.18);
        padding:8px;
        border-radius:999px;
        justify-content:space-between;
        align-items:stretch;
        gap:4px;
        z-index:9997;
    }

    .tb-bottom-link{
        flex:1 1 0;
        min-width:0;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:2px;
        padding:8px 4px;
        border-radius:999px;
        color:rgba(255,255,255,.92);
        background:transparent;
        border:none;
        font-family:inherit;
        font-size:11px;
        font-weight:600;
        text-decoration:none;
        -webkit-tap-highlight-color:transparent;
        transition:background .2s ease,color .2s ease,transform .2s ease;
        cursor:pointer;
    }

    .tb-bottom-link i{
        font-size:19px;
        line-height:1;
    }

    .tb-bottom-link span{
        font-size:10px;
        line-height:1;
    }

    .tb-bottom-link:hover{
        background:rgba(255,255,255,.2);
        color:#ffffff;
    }

    .tb-bottom-link:active{
        transform:scale(.96);
    }

    .tb-bottom-link-disabled,
    .tb-bottom-link:disabled{
        opacity:.4;
        cursor:not-allowed;
    }

    .tb-bottom-link-disabled:hover,
    .tb-bottom-link:disabled:hover{
        background:transparent;
        color:rgba(255,255,255,.92);
        transform:none;
    }

    /* Whichever item is actually open/active right now gets the
       highlighted white pill — not just Prompt Generator by default. */
    .tb-bottom-link.active{
        background:#ffffff;
        color:#15803d !important;
    }

    /* keep page content and footer clear of the floating bar */
    body{
        padding-bottom:86px;
    }

}


/*==========================================================
VERY SMALL SCREENS
==========================================================*/

@media (max-width:420px){

    .tb-mobile-bottom-nav{
        width:calc(100% - 16px);
        padding:6px;
    }

    .tb-bottom-link i{
        font-size:17px;
    }

    .tb-bottom-link span{
        font-size:9px;
    }

}


/*==========================================================
PRINT
==========================================================*/

@media print{

    .tb-mobile-bottom-nav{
        display:none !important;
    }

}