/*
|--------------------------------------------------------------------------
| AHNAAF FREE STARTER — SHARED PUBLIC UI
|--------------------------------------------------------------------------
| Mobile-first public shell. Page-specific CSS should use its own prefix.
|--------------------------------------------------------------------------
*/

:root{
    --pub-primary:#2557d6;
    --pub-primary-dark:#173c94;
    --pub-secondary:#7048df;
    --pub-accent:#d89a1d;
    --pub-background:#f4f7fb;
    --pub-surface:#fff;
    --pub-text:#102033;
    --pub-muted:#718096;
    --pub-line:#e1e8f1;
    --pub-danger:#bd2936;
    --pub-success:#087653;
    --pub-radius:16px;
    --pub-shadow:0 10px 30px rgba(27,50,96,.08);
    --pub-header-height:61px;
    --pub-bottom-height:68px;
}

*{
    box-sizing:border-box;
}

html{
    min-height:100%;
    scroll-behavior:smooth;
}

body.pub-body{
    min-height:100%;
    margin:0;
    padding:0 0 calc(
        var(--pub-bottom-height)
        + env(safe-area-inset-bottom)
        + 12px
    );
    color:var(--pub-text);
    background:var(--pub-background);
    font-family:
        "Vazirmatn",
        Tahoma,
        Arial,
        sans-serif;
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
}

body.pub-body.is-layer-open{
    overflow:hidden;
}

.pub-body button,
.pub-body input,
.pub-body select,
.pub-body textarea{
    font:inherit;
}

.pub-body a{
    color:inherit;
    text-decoration:none;
}

.pub-body img{
    max-width:100%;
}

.pub-container{
    width:min(1180px,calc(100% - 20px));
    margin-inline:auto;
}

.pub-main{
    min-height:50vh;
}

.pub-skip-link{
    position:fixed;
    z-index:100000;
    top:8px;
    right:8px;
    padding:9px 12px;
    border-radius:10px;
    color:#fff;
    background:var(--pub-primary-dark);
    font-size:11px;
    font-weight:900;
    transform:translateY(-150%);
}

.pub-skip-link:focus{
    transform:translateY(0);
}

.pub-icon-button{
    width:42px;
    height:42px;
    display:inline-grid;
    place-items:center;
    padding:0;
    border:1px solid var(--pub-line);
    border-radius:12px;
    color:#526178;
    background:#fff;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
}

.pub-icon-button:focus-visible,
.pub-account-button:focus-visible,
.pub-desktop-nav a:focus-visible,
.pub-bottom-nav a:focus-visible,
.pub-bottom-nav button:focus-visible,
.pub-button:focus-visible{
    outline:3px solid rgba(37,87,214,.22);
    outline-offset:2px;
}

/* Header */
.pub-header{
    position:sticky;
    z-index:1000;
    top:0;
    border-bottom:1px solid rgba(222,230,241,.92);
    background:rgba(255,255,255,.95);
    box-shadow:0 7px 24px rgba(15,32,51,.05);
    backdrop-filter:blur(15px);
}

.pub-header__bar{
    min-height:var(--pub-header-height);
    display:flex;
    align-items:center;
}

.pub-header__inner{
    display:grid;
    grid-template-columns:42px minmax(0,1fr) auto;
    align-items:center;
    gap:8px;
}

.pub-brand{
    min-width:0;
    display:inline-flex;
    align-items:center;
    gap:9px;
}

.pub-brand-logo,
.pub-brand-mark{
    width:42px;
    height:42px;
    flex:0 0 42px;
    border-radius:13px;
}

.pub-brand-logo{
    object-fit:contain;
    background:#fff;
}

.pub-brand-mark{
    display:grid;
    place-items:center;
    color:#fff;
    background:
        linear-gradient(
            135deg,
            var(--pub-primary-dark),
            var(--pub-primary) 58%,
            var(--pub-secondary)
        );
    box-shadow:0 8px 18px rgba(37,87,214,.22);
    font-size:17px;
}

.pub-brand__copy{
    min-width:0;
}

.pub-brand__copy strong,
.pub-brand__copy small{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.pub-brand__copy strong{
    color:var(--pub-text);
    font-size:13px;
    font-weight:950;
}

.pub-brand__copy small{
    margin-top:1px;
    color:#8390a2;
    font-size:7px;
}

.pub-desktop-nav{
    display:none;
}

.pub-header__actions{
    display:flex;
    align-items:center;
    gap:6px;
}

.pub-account-button{
    width:42px;
    height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(37,87,214,.16);
    border-radius:12px;
    color:var(--pub-primary);
    background:#eef4ff;
    -webkit-tap-highlight-color:transparent;
}

.pub-account-button span{
    display:none;
}

.pub-install-button{
    min-height:42px;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:8px 11px;
    border:1px solid #dbe5f5;
    border-radius:12px;
    color:var(--pub-primary);
    background:#fff;
    font-size:9px;
    font-weight:900;
    cursor:pointer;
}

.pub-install-button:not([hidden]){
    display:none;
}

.pub-mobile-search-row{
    padding:0 0 8px;
}

.pub-inline-search{
    min-height:45px;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:8px;
    padding:0 7px 0 11px;
    border:1px solid var(--pub-line);
    border-radius:13px;
    background:#f7f9fd;
}

.pub-inline-search > i{
    color:var(--pub-primary);
    font-size:12px;
}

.pub-inline-search input{
    width:100%;
    min-width:0;
    min-height:42px;
    border:0;
    outline:0;
    color:var(--pub-text);
    background:transparent;
    font-size:16px;
}

.pub-inline-search button{
    min-height:34px;
    padding:7px 11px;
    border:0;
    border-radius:9px;
    color:#fff;
    background:var(--pub-primary);
    font-size:8px;
    font-weight:900;
    cursor:pointer;
}

/* Mobile drawer */
.pub-menu-backdrop{
    position:fixed;
    z-index:1090;
    inset:0;
    border:0;
    background:rgba(8,20,42,.58);
    backdrop-filter:blur(4px);
}

.pub-mobile-menu{
    position:fixed;
    z-index:1100;
    top:0;
    right:0;
    bottom:0;
    width:min(340px,87vw);
    overflow:auto;
    padding:
        max(12px,env(safe-area-inset-top))
        12px
        max(18px,env(safe-area-inset-bottom));
    border-left:1px solid rgba(255,255,255,.15);
    background:#fff;
    box-shadow:-24px 0 60px rgba(5,18,45,.25);
    transform:translateX(105%);
    transition:transform .22s ease;
}

.pub-mobile-menu.is-open{
    transform:translateX(0);
}

.pub-mobile-menu__head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding-bottom:12px;
    border-bottom:1px solid #e9eef5;
}

.pub-brand--menu{
    min-width:0;
}

.pub-mobile-menu__nav{
    display:grid;
    gap:5px;
    padding:12px 0;
}

.pub-mobile-menu__nav a{
    min-height:48px;
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    align-items:center;
    gap:8px;
    padding:6px 8px;
    border-radius:12px;
    color:#59687d;
    font-size:10px;
    font-weight:900;
}

.pub-mobile-menu__nav a i{
    width:36px;
    height:36px;
    display:grid;
    place-items:center;
    border-radius:10px;
    color:var(--pub-primary);
    background:#eef4ff;
}

.pub-mobile-menu__nav a.is-active{
    color:var(--pub-primary-dark);
    background:#f2f6ff;
}

.pub-mobile-menu__account{
    display:grid;
    grid-template-columns:42px minmax(0,1fr) auto;
    align-items:center;
    gap:9px;
    padding:10px;
    border-radius:14px;
    color:#fff;
    background:
        linear-gradient(
            135deg,
            var(--pub-primary-dark),
            var(--pub-primary) 58%,
            var(--pub-secondary)
        );
    box-shadow:0 12px 28px rgba(37,87,214,.20);
}

.pub-mobile-menu__account > i:first-child{
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:rgba(255,255,255,.14);
}

.pub-mobile-menu__account strong,
.pub-mobile-menu__account small{
    display:block;
}

.pub-mobile-menu__account strong{
    font-size:10px;
}

.pub-mobile-menu__account small{
    margin-top:2px;
    color:#dce7fb;
    font-size:7px;
}

/* Search dialog */
.pub-search-layer{
    position:fixed;
    z-index:1200;
    inset:0;
    display:flex;
    align-items:flex-end;
    justify-content:center;
    visibility:hidden;
    opacity:0;
    transition:
        visibility .2s ease,
        opacity .2s ease;
}

.pub-search-layer.is-open{
    visibility:visible;
    opacity:1;
}

.pub-search-layer__backdrop{
    position:absolute;
    inset:0;
    border:0;
    background:rgba(8,20,42,.62);
    backdrop-filter:blur(5px);
}

.pub-search-panel{
    position:relative;
    z-index:2;
    width:100%;
    padding:
        13px
        13px
        calc(16px + env(safe-area-inset-bottom));
    border-radius:22px 22px 0 0;
    background:#fff;
    box-shadow:0 -24px 60px rgba(8,20,42,.22);
    transform:translateY(105%);
    transition:transform .22s ease;
}

.pub-search-layer.is-open .pub-search-panel{
    transform:translateY(0);
}

.pub-search-panel__head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding-bottom:10px;
    border-bottom:1px solid #e8edf4;
}

.pub-search-panel__head > span{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--pub-text);
    font-size:12px;
    font-weight:950;
}

.pub-search-panel__head > span i{
    color:var(--pub-primary);
}

.pub-search-panel__form{
    display:grid;
    gap:11px;
    padding-top:12px;
}

.pub-search-panel__form label > span:first-child{
    display:block;
    margin-bottom:6px;
    color:#607086;
    font-size:8px;
    font-weight:900;
}

.pub-search-panel__input{
    min-height:50px;
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:9px;
    padding:0 13px;
    border:1px solid var(--pub-line);
    border-radius:13px;
    background:#f7f9fd;
}

.pub-search-panel__input i{
    color:var(--pub-primary);
}

.pub-search-panel__input input{
    width:100%;
    min-height:48px;
    border:0;
    outline:0;
    color:var(--pub-text);
    background:transparent;
    font-size:16px;
}

/* Buttons and generic page utilities */
.pub-button{
    min-height:44px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:9px 14px;
    border:1px solid transparent;
    border-radius:12px;
    font-size:9px;
    font-weight:950;
    cursor:pointer;
}

.pub-button--primary{
    color:#fff;
    background:
        linear-gradient(
            135deg,
            var(--pub-primary),
            var(--pub-primary-dark)
        );
}

.pub-page{
    padding:16px 0 30px;
}

.pub-page-card{
    border:1px solid var(--pub-line);
    border-radius:var(--pub-radius);
    background:#fff;
    box-shadow:var(--pub-shadow);
}

.pub-section-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:12px;
    margin-bottom:13px;
}

.pub-section-head h1,
.pub-section-head h2{
    margin:0;
    color:var(--pub-text);
    font-weight:950;
}

.pub-section-head p{
    margin:4px 0 0;
    color:var(--pub-muted);
    font-size:9px;
    line-height:1.8;
}

/* Footer */
.pub-footer{
    padding:24px 0 12px;
    background:
        linear-gradient(
            180deg,
            transparent,
            #eaf0f8
        );
}

.pub-footer__card{
    display:grid;
    gap:20px;
    padding:19px;
    border:1px solid #dde6f1;
    border-radius:21px;
    background:#fff;
    box-shadow:0 12px 35px rgba(26,48,88,.07);
}

.pub-brand--footer .pub-brand__copy strong{
    font-size:14px;
}

.pub-footer__brand p{
    margin:11px 0 0;
    color:#718096;
    font-size:9px;
    line-height:1.9;
}

.pub-footer__links,
.pub-footer__contact{
    display:grid;
    align-content:start;
    gap:8px;
}

.pub-footer__links > strong,
.pub-footer__contact > strong{
    margin-bottom:2px;
    color:var(--pub-text);
    font-size:10px;
    font-weight:950;
}

.pub-footer__links a{
    color:#68778d;
    font-size:9px;
}

.pub-footer__contact a,
.pub-footer__contact > span{
    min-width:0;
    display:grid;
    grid-template-columns:28px minmax(0,1fr);
    align-items:center;
    gap:7px;
    color:#68778d;
    font-size:8px;
}

.pub-footer__contact i{
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:8px;
    color:var(--pub-primary);
    background:#edf3ff;
}

.pub-footer__contact span span,
.pub-footer__contact a span{
    overflow:hidden;
    text-overflow:ellipsis;
}

.pub-footer__bottom{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:6px 13px;
    padding:13px 5px 0;
    color:#8290a3;
    font-size:7px;
    text-align:center;
}

.pub-powered-by strong,
.pub-powered-by a{
    color:var(--pub-primary);
    font-weight:950;
}

/* One mobile bottom navigation */
.pub-bottom-nav{
    position:fixed;
    z-index:1050;
    right:7px;
    left:7px;
    bottom:max(7px,env(safe-area-inset-bottom));
    min-height:var(--pub-bottom-height);
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    align-items:end;
    gap:2px;
    padding:5px 5px 6px;
    border:1px solid rgba(220,229,241,.95);
    border-radius:18px;
    background:rgba(255,255,255,.96);
    box-shadow:0 15px 40px rgba(12,29,56,.18);
    backdrop-filter:blur(17px);
}

.pub-bottom-nav a,
.pub-bottom-nav button{
    min-width:0;
    min-height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:4px;
    padding:3px 2px;
    border:0;
    border-radius:12px;
    color:#738197;
    background:transparent;
    font-size:6.8px;
    font-weight:900;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
}

.pub-bottom-nav a > i{
    font-size:15px;
}

.pub-bottom-nav a.is-active{
    color:var(--pub-primary);
    background:#edf3ff;
}

.pub-bottom-nav__search{
    position:relative;
    overflow:visible;
    color:var(--pub-primary)!important;
}

.pub-bottom-nav__search-icon{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    margin-top:-18px;
    border:4px solid #fff;
    border-radius:14px;
    color:#fff;
    background:
        linear-gradient(
            135deg,
            var(--pub-primary),
            var(--pub-secondary)
        );
    box-shadow:0 8px 20px rgba(37,87,214,.30);
    font-size:14px;
}

@media(min-width:760px){
    body.pub-body{
        padding-bottom:0;
    }

    .pub-container{
        width:min(1180px,calc(100% - 34px));
    }

    .pub-footer__card{
        grid-template-columns:1.4fr .75fr 1fr;
        gap:30px;
        padding:25px;
    }

    .pub-bottom-nav{
        display:none;
    }

    .pub-search-panel{
        width:min(540px,calc(100% - 30px));
        margin:auto;
        padding:17px;
        border-radius:21px;
        transform:translateY(25px) scale(.98);
    }

    .pub-search-layer{
        align-items:center;
    }

    .pub-search-layer.is-open .pub-search-panel{
        transform:translateY(0) scale(1);
    }
}

@media(min-width:992px){
    :root{
        --pub-header-height:74px;
    }

    .pub-header__inner{
        grid-template-columns:auto minmax(0,1fr) auto;
        gap:24px;
    }

    .pub-menu-button,
    .pub-mobile-search-row{
        display:none;
    }

    .pub-brand-logo,
    .pub-brand-mark{
        width:46px;
        height:46px;
        flex-basis:46px;
        border-radius:14px;
    }

    .pub-brand__copy strong{
        font-size:15px;
    }

    .pub-brand__copy small{
        font-size:8px;
    }

    .pub-desktop-nav{
        display:flex;
        align-items:center;
        justify-content:center;
        gap:4px;
    }

    .pub-desktop-nav a{
        min-height:40px;
        display:inline-flex;
        align-items:center;
        padding:8px 11px;
        border-radius:10px;
        color:#617086;
        font-size:9px;
        font-weight:900;
    }

    .pub-desktop-nav a:hover,
    .pub-desktop-nav a.is-active{
        color:var(--pub-primary);
        background:#edf3ff;
    }

    .pub-account-button{
        width:auto;
        min-height:43px;
        gap:7px;
        padding:8px 13px;
        border-color:transparent;
        color:#fff;
        background:
            linear-gradient(
                135deg,
                var(--pub-primary),
                var(--pub-primary-dark)
            );
        font-size:9px;
        font-weight:950;
    }

    .pub-account-button span{
        display:inline;
    }

    .pub-install-button:not([hidden]){
        display:inline-flex;
    }
}

@media(max-width:380px){
    .pub-container{
        width:calc(100% - 14px);
    }

    .pub-brand__copy small{
        display:none;
    }

    .pub-header__inner{
        gap:5px;
    }

    .pub-bottom-nav{
        right:4px;
        left:4px;
        bottom:max(4px,env(safe-area-inset-bottom));
    }
}

@media(prefers-reduced-motion:reduce){
    *,
    *::before,
    *::after{
        scroll-behavior:auto!important;
        transition:none!important;
        animation:none!important;
    }
}
