/*
 * IRF v325 - Desktop navigation between active Fajr archive pages.
 * Mobile is intentionally untouched: the whole block is hidden at 820px and below.
 */
@media (min-width:821px){
    body.fajr260-page .fajr325-period-navigation{
        position:relative;
        isolation:isolate;
        width:min(1180px,calc(100% - 40px));
        margin:24px auto 0;
        padding:22px;
        overflow:hidden;
        border:1px solid rgba(215,174,83,.46);
        border-radius:22px;
        background:
            radial-gradient(circle at 8% 0%,rgba(215,174,83,.11),transparent 32%),
            linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
        box-shadow:0 22px 58px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.035);
    }
    body.fajr260-page .fajr325-period-navigation::before{
        content:"";
        position:absolute;
        z-index:-1;
        inset:auto -80px -115px auto;
        width:260px;
        height:260px;
        border-radius:50%;
        background:rgba(215,174,83,.07);
        filter:blur(3px);
        pointer-events:none;
    }
    body.fajr260-page .fajr325-period-navigation__head{
        display:flex;
        align-items:flex-end;
        justify-content:space-between;
        gap:20px;
        margin-bottom:18px;
    }
    body.fajr260-page .fajr325-period-navigation__title{
        display:flex;
        align-items:center;
        gap:12px;
        min-width:0;
    }
    body.fajr260-page .fajr325-period-navigation__icon{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        flex:0 0 42px;
        width:42px;
        height:42px;
        border:1px solid rgba(215,174,83,.34);
        border-radius:13px;
        color:var(--fajr260-gold-2,#f3d38b);
        background:rgba(215,174,83,.09);
    }
    body.fajr260-page .fajr325-period-navigation__icon svg{
        width:22px;
        height:22px;
        display:block;
    }
    body.fajr260-page .fajr325-period-navigation__title small{
        display:block;
        margin-bottom:2px;
        color:var(--fajr260-gold-2,#f3d38b);
        font-size:10px;
        font-weight:900;
    }
    body.fajr260-page .fajr325-period-navigation__title h2{
        margin:0;
        color:#fff;
        font-size:20px;
        line-height:1.5;
        font-weight:950;
    }
    body.fajr260-page .fajr325-period-navigation__hint{
        flex:0 0 auto;
        color:#9eabb8;
        font-size:11px;
        font-weight:700;
    }
    body.fajr260-page .fajr325-period-navigation__links{
        display:grid;
        grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
        gap:12px;
    }
    body.fajr260-page .fajr325-period-link{
        position:relative;
        display:flex;
        min-width:0;
        min-height:92px;
        padding:14px 15px 13px;
        flex-direction:column;
        align-items:flex-start;
        justify-content:center;
        overflow:hidden;
        border:1px solid rgba(255,255,255,.09);
        border-radius:16px;
        background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.025));
        color:#fff;
        text-decoration:none;
        box-shadow:0 12px 28px rgba(0,0,0,.16);
        transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease;
    }
    body.fajr260-page a.fajr325-period-link:hover,
    body.fajr260-page a.fajr325-period-link:focus-visible{
        transform:translateY(-4px);
        border-color:rgba(215,174,83,.62);
        background:linear-gradient(145deg,rgba(215,174,83,.16),rgba(255,255,255,.035));
        box-shadow:0 18px 38px rgba(0,0,0,.27);
        outline:none;
    }
    body.fajr260-page .fajr325-period-link::after{
        content:"";
        position:absolute;
        left:-24px;
        bottom:-38px;
        width:92px;
        height:92px;
        border:1px solid rgba(215,174,83,.12);
        border-radius:50%;
        pointer-events:none;
    }
    body.fajr260-page .fajr325-period-link small{
        position:relative;
        z-index:1;
        display:block;
        color:#aeb9c4;
        font-size:10px;
        font-style:normal;
        font-weight:800;
        white-space:nowrap;
    }
    body.fajr260-page .fajr325-period-link strong{
        position:relative;
        z-index:1;
        display:block;
        margin-top:4px;
        color:#fff;
        font-size:24px;
        line-height:1.2;
        font-weight:950;
        white-space:nowrap;
    }
    body.fajr260-page .fajr325-period-link em{
        position:relative;
        z-index:1;
        display:block;
        margin-top:6px;
        color:rgba(255,255,255,.52);
        font-size:9px;
        line-height:1;
        font-style:normal;
        font-weight:800;
        opacity:0;
        transform:translateY(3px);
        transition:opacity .22s ease,transform .22s ease;
    }
    body.fajr260-page a.fajr325-period-link:hover em,
    body.fajr260-page a.fajr325-period-link:focus-visible em{
        opacity:1;
        transform:translateY(0);
    }
    body.fajr260-page .fajr325-period-link.is-current{
        cursor:default;
        border-color:#f0cb70;
        background:linear-gradient(135deg,#f4cf73,#d8a936);
        color:#171106;
        box-shadow:0 18px 42px rgba(215,174,83,.22);
    }
    body.fajr260-page .fajr325-period-link.is-current::before{
        content:"";
        position:absolute;
        inset:0;
        background:linear-gradient(120deg,rgba(255,255,255,.28),transparent 42%);
        pointer-events:none;
    }
    body.fajr260-page .fajr325-period-link.is-current::after{
        border-color:rgba(32,22,5,.14);
    }
    body.fajr260-page .fajr325-period-link.is-current small,
    body.fajr260-page .fajr325-period-link.is-current strong,
    body.fajr260-page .fajr325-period-link.is-current em{
        color:#171106;
    }
    body.fajr260-page .fajr325-period-link.is-current em{
        opacity:.72;
        transform:none;
    }
}
@media (max-width:820px){
    body.fajr260-page .fajr325-period-navigation{display:none!important}
}