.pj360-analysis-nav {
    margin: 32px auto 24px;
    padding: 20px;
    max-width: 1200px;
    background: #fff;
    border: 1px solid #dbe3ec;
    border-radius: 14px;
    box-shadow: 0 4px 18px rgba(15,23,42,.06);
}

.pj360-analysis-progress {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 8px;
    margin-bottom: 18px;
}

.pj360-analysis-step {
    padding: 10px 8px;
    border: 1px solid #dbe3ec;
    border-radius: 8px;
    background: #f8fafc;
    color: #64748b;
    cursor: pointer;
    font-size: 13px;
}

.pj360-analysis-step.completed {
    background: #ecfdf5;
    border-color: #86efac;
    color: #166534;
}

.pj360-analysis-step.active {
    background: #0f766e;
    border-color: #0f766e;
    color: white;
    font-weight: 700;
}

.pj360-analysis-actions {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
}

.pj360-analysis-current {
    text-align: center;
    color: #334155;
}

.pj360-analysis-current span {
    display: block;
    margin-top: 3px;
    font-size: 13px;
    color: #64748b;
}

.pj360-nav-button {
    min-height: 44px;
    padding: 10px 18px;
    border-radius: 8px;
    border: 0;
    font-weight: 700;
    cursor: pointer;
}

.pj360-nav-button.primary {
    background: #0f766e;
    color: white;
    justify-self: end;
}

.pj360-nav-button.secondary {
    background: #e2e8f0;
    color: #334155;
    justify-self: start;
}

.pj360-nav-button:disabled {
    opacity: .45;
    cursor: not-allowed;
}

@media(max-width:700px) {
    .pj360-analysis-progress {
        grid-template-columns: 1fr 1fr;
    }

    .pj360-analysis-actions {
        grid-template-columns: 1fr;
    }

    .pj360-analysis-current {
        grid-row: 1;
    }

    .pj360-nav-button.primary,
    .pj360-nav-button.secondary {
        justify-self: stretch;
        width: 100%;
    }
}

/* PJ360_NAV_STICKY_TOP_V1 */
.pj360-analysis-nav{
    position:sticky;
    top:0;
    z-index:1000;
    width:100%;
    background:rgba(255,255,255,.98);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    border-bottom:1px solid #dbe3ea;
    box-shadow:0 4px 14px rgba(15,43,63,.10);
    margin:0;
    padding:10px max(18px, calc((100% - 1250px) / 2 + 18px));
}

.pj360-analysis-nav .pj360-analysis-progress{
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scrollbar-width:thin;
}

.pj360-analysis-nav .pj360-analysis-step{
    white-space:nowrap;
}

@media(max-width:800px){
    .pj360-analysis-nav{
        padding:8px 12px;
    }

    .pj360-analysis-nav .pj360-analysis-progress{
        display:flex;
        flex-wrap:nowrap;
        gap:7px;
    }

    .pj360-analysis-nav .pj360-analysis-step{
        flex:0 0 auto;
    }

    /*
     * Em telas pequenas prioriza as etapas.
     * Voltar/avançar continuam disponíveis no fluxo normal
     * quando houver espaço.
     */
    .pj360-analysis-nav .pj360-analysis-actions{
        margin-top:7px;
    }
}

@media print{
    .pj360-analysis-nav{
        position:static;
        box-shadow:none;
        backdrop-filter:none;
        -webkit-backdrop-filter:none;
    }
}

/* PJ360_NAV_COMPACT_V2 */

.pj360-analysis-nav{
    padding:7px 18px !important;
    min-height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.pj360-analysis-progress{
    width:min(100%,1250px);
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    flex-wrap:nowrap;
}

.pj360-analysis-step{
    margin:0 !important;
    min-height:34px;
    padding:7px 13px !important;
    border-radius:7px;
    font-size:12px;
    line-height:1.15;
    flex:0 1 auto;
}

.pj360-analysis-footer-nav{
    margin-top:20px;
}

.pj360-analysis-footer-nav .pj360-analysis-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
}

@media(max-width:800px){
    .pj360-analysis-nav{
        padding:6px 8px !important;
    }

    .pj360-analysis-progress{
        justify-content:flex-start;
        overflow-x:auto;
        padding:1px 0 4px;
    }

    .pj360-analysis-step{
        flex:0 0 auto;
        padding:7px 10px !important;
    }
}

@media print{
    /*
     * Na impressão não repetimos a navegação interativa.
     */
    .pj360-analysis-nav,
    .pj360-analysis-footer-nav{
        display:none !important;
    }
}

/* PJ360_NAV_ALIGN_V3
 * O JS informa a largura e posição reais do <main>.
 * Assim a navegação acompanha cada página, sem largura fixa.
 */
.pj360-analysis-nav{
    justify-content:flex-start !important;
}

.pj360-analysis-nav .pj360-analysis-progress{
    width:var(--pj360-main-width, 100%) !important;
    max-width:none !important;
    margin-left:var(--pj360-main-left, 0px) !important;
    margin-right:0 !important;
    justify-content:flex-start !important;
}

@media(max-width:800px){
    .pj360-analysis-nav .pj360-analysis-progress{
        width:100% !important;
        margin-left:0 !important;
    }
}


/* PJ360_NAV_ALIGN_FIX_V4 */
.pj360-analysis-nav{
    width:100% !important;
    display:block !important;
    box-sizing:border-box !important;
}

.pj360-analysis-nav .pj360-analysis-progress{
    max-width:none !important;
    margin-right:0 !important;
    justify-content:flex-start !important;
}

@media(max-width:800px){
    .pj360-analysis-nav .pj360-analysis-progress{
        overflow-x:auto;
    }
}


/* PJ360_NAV_V5_FINAL
 *
 * A barra ocupa a viewport.
 * As etapas usam o mesmo container central do conteúdo.
 * Nenhum posicionamento horizontal é calculado por JavaScript.
 */

.pj360-analysis-nav{
    position:sticky !important;
    top:0 !important;
    z-index:1000 !important;

    display:block !important;

    width:100% !important;
    max-width:none !important;

    margin:0 !important;
    padding:7px 0 !important;

    box-sizing:border-box !important;

    background:#fff !important;
}

.pj360-analysis-nav .pj360-analysis-progress{
    display:flex !important;

    width:calc(100% - 36px) !important;
    max-width:886px !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding:0 !important;

    align-items:center !important;
    justify-content:flex-start !important;

    gap:7px !important;
    flex-wrap:nowrap !important;
}

.pj360-analysis-nav .pj360-analysis-step{
    flex:0 0 auto !important;
    margin:0 !important;
}

/* Documentos/XML trabalha com área maior */
body.pj360-documents-page
.pj360-analysis-nav
.pj360-analysis-progress{
    max-width:1250px !important;
}

@media(max-width:922px){
    .pj360-analysis-nav .pj360-analysis-progress{
        width:calc(100% - 24px) !important;
        max-width:none !important;

        margin-left:auto !important;
        margin-right:auto !important;

        overflow-x:auto !important;
    }
}

@media print{
    .pj360-analysis-nav{
        display:none !important;
    }
}

/* ============================================================
   PJ360_NAV_SAME_WIDTH_V6
   Navegação com a MESMA largura visual do conteúdo da página.
   Sobrescreve as tentativas anteriores de largura full-screen.
   ============================================================ */

.pj360-analysis-nav{
    position:sticky !important;
    top:0 !important;
    z-index:1000 !important;

    /* mesma largura do conteúdo do Perfil */
    width:calc(100% - 36px) !important;
    max-width:886px !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding:7px 10px !important;
    box-sizing:border-box !important;

    background:#fff !important;
    border:1px solid #dbe3ea !important;
    border-top:0 !important;
    border-radius:0 0 10px 10px !important;

    box-shadow:0 4px 12px rgba(15,43,63,.08) !important;
}

.pj360-analysis-nav .pj360-analysis-progress{
    width:100% !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 !important;

    display:grid !important;
    grid-template-columns:
        1.15fr
        1.20fr
        .72fr
        1.08fr
        .90fr;

    gap:7px !important;
    align-items:stretch !important;
}

.pj360-analysis-nav .pj360-analysis-step{
    width:100% !important;
    min-width:0 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    box-sizing:border-box !important;
    white-space:nowrap !important;
}

/* telas menores */
@media(max-width:922px){
    .pj360-analysis-nav{
        width:calc(100% - 24px) !important;
        max-width:none !important;
    }

    .pj360-analysis-nav .pj360-analysis-progress{
        display:flex !important;
        overflow-x:auto !important;
    }

    .pj360-analysis-nav .pj360-analysis-step{
        width:auto !important;
        flex:0 0 auto !important;
    }
}

/* impressão */
@media print{
    .pj360-analysis-nav{
        display:none !important;
    }
}

/* PJ360_NAV_RESPONSIVE_V6
 *
 * Navegação gerencial centralizada e responsiva.
 * Substitui o limite legado de 886px sem depender de JS
 * para cálculo de largura ou posição horizontal.
 */

.pj360-analysis-nav .pj360-analysis-progress {
    width: min(1250px, calc(100% - 28px)) !important;
    max-width: 1250px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    display: grid !important;
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;

    gap: 7px !important;
    overflow: visible !important;
}

.pj360-analysis-nav .pj360-analysis-step {
    width: 100% !important;
    min-width: 0 !important;

    padding: 7px 6px !important;

    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;

    text-align: center !important;
}

@media (max-width: 900px) {
    .pj360-analysis-nav .pj360-analysis-progress {
        width: calc(100% - 16px) !important;

        display: flex !important;
        justify-content: flex-start !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;

        scrollbar-width: thin;
    }

    .pj360-analysis-nav .pj360-analysis-step {
        flex: 0 0 auto !important;
        width: auto !important;

        padding: 7px 10px !important;

        overflow: visible !important;
        text-overflow: clip !important;
    }
}

@media print {
    .pj360-analysis-nav,
    .pj360-analysis-footer-nav {
        display: none !important;
    }
}


/* ============================================================
   PJ360_NAV_MULTI_FLOW_V8
   Fluxos independentes + sete etapas gerenciais em largura útil.
   Camada final: prevalece sobre V1-V6.
   ============================================================ */

.pj360-analysis-nav {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 7px 18px 8px !important;

    box-sizing: border-box !important;

    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;

    background: #fff !important;
}

/* ------------------------------------------------------------
   SELETOR DOS FLUXOS
   ------------------------------------------------------------ */

.pj360-analysis-nav .pj360-flow-switcher {
    width: 100% !important;
    max-width: none !important;

    margin: 0 0 7px !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    gap: 7px !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;
}

.pj360-analysis-nav .pj360-flow-access {
    flex: 0 0 auto !important;

    min-height: 29px !important;

    padding: 5px 11px !important;

    box-sizing: border-box !important;

    border: 1px solid #cbd5e1 !important;
    border-radius: 7px !important;

    background: #f8fafc !important;
    color: #334155 !important;

    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;

    white-space: nowrap !important;

    cursor: pointer !important;
}

.pj360-analysis-nav
.pj360-flow-access.active {
    background: #0f172a !important;
    border-color: #0f172a !important;
    color: #fff !important;
}

.pj360-analysis-nav
.pj360-flow-access.pending {
    background: #f8fafc !important;
    border-style: dashed !important;
    color: #94a3b8 !important;

    cursor: not-allowed !important;
}

/* ------------------------------------------------------------
   SETE ETAPAS DA SIMULAÇÃO GERENCIAL
   ------------------------------------------------------------ */

.pj360-analysis-nav
.pj360-analysis-progress {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    display: grid !important;

    grid-template-columns:
        repeat(7, minmax(0, 1fr)) !important;

    gap: 7px !important;

    align-items: stretch !important;

    overflow: visible !important;
}

.pj360-analysis-nav
.pj360-analysis-step {
    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 7px 6px !important;

    box-sizing: border-box !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    white-space: nowrap !important;

    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* ------------------------------------------------------------
   RESPONSIVO
   ------------------------------------------------------------ */

@media (max-width: 900px) {

    .pj360-analysis-nav {
        padding: 6px 8px 7px !important;
    }

    .pj360-analysis-nav
    .pj360-flow-switcher {
        padding-bottom: 2px !important;
    }

    .pj360-analysis-nav
    .pj360-analysis-progress {
        display: flex !important;

        justify-content: flex-start !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;

        scrollbar-width: thin;
    }

    .pj360-analysis-nav
    .pj360-analysis-step {
        flex: 0 0 auto !important;

        width: auto !important;

        padding: 7px 10px !important;

        overflow: visible !important;
        text-overflow: clip !important;
    }
}

@media print {
    .pj360-analysis-nav,
    .pj360-analysis-footer-nav {
        display: none !important;
    }
}
