﻿/* ---------- Breadcrumb / navigator bar ---------- */
:root {
    --hp-surface: #FFFFFF;
    --surface-blue: #d3e1ef;
    --surface-text: #49525b;
    --layout-width: 1360px;
    --sidebar-width: 280px;
    --breadcrumb-gap: 45px;
   
   
}
.page-breadcrumb-bar {
    background: var(--surface-blue);
    border-bottom: 1px solid var(--hp-border);
    width:100%;
}


.page-breadcrumb {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .85rem 0;
    margin: 0;
    list-style: none;
    font-size: .85rem;
    flex-wrap: wrap;
    max-width: var(--layout-width);
    margin: 0 auto; /* دقیقاً همون وسط‌چینی که کانتینر اصلی صفحه داره */
    padding-right: calc(var(--sidebar-width) + var(--breadcrumb-gap));
}

@media (max-width:759px)
{
    .page-breadcrumb {
        display: flex;
        align-items: center;
        gap: .5rem;
        padding: .85rem 0;
        margin: 0;
        list-style: none;
        font-size: .85rem;
        flex-wrap: wrap;
        padding-right: 15px;
    }
}
    .page-breadcrumb li {
        display: flex;
        align-items: center;
        gap: .5rem;
    }

    .page-breadcrumb a {
        display: inline-flex;
        align-items: center;
        gap: .35rem;
        color: var(--surface-text);
        text-decoration: none;
        transition: color .15s ease;
    }

        .page-breadcrumb a:hover, .page-crumb-home-full :hover{
            font-weight: 600;
        }

    .page-breadcrumb .page-crumb-current {
        color: var(--surface-text);
        font-weight: 700;
    }

.page-breadcrumb .page-crumb-sep {
    color: #49525b;
    display: flex;
    align-items: center;
}

        .page-breadcrumb .page-crumb-sep svg {
            display: block;
        }

.page-crumb-home-short
{
    display:none;
}
@media (max-width: 767px) {
    .page-crumb-home-full {
        display: none;
    }

    .page-crumb-home-short {
        display: inline;
        font-family: 'JetBrains Mono', monospace;
        font-weight: 700;
    }
}