/* doc-project | projet/assets/css/product-configurator-v2/nav-compact.css | Styles scopes de la navigation basse compacte du configurateur V2 avec pcv2-nav reduit en hauteur, boutons courts, progression et message d aide non bloquant. | Expose: pcv2-nav, pcv2-nav__button, pcv2-nav__progress, pcv2-nav__help | Dépend de: product-configurator-v2/base.css | Impacte: hauteur disponible dans la modale configurateur V2, lisibilite mobile desktop de la navigation precedente suivante et conservation des hooks JS existants | Tables: aucune */
.pcv2-nav{
    position:sticky;
    bottom:0;
    z-index:7;
    display:grid;
    grid-template-columns:minmax(88px,auto) minmax(72px,1fr) minmax(88px,auto);
    align-items:center;
    gap:8px;
    min-height:0;
    padding:7px 10px;
    border-top:1px solid rgba(82,54,34,.12);
    background:linear-gradient(180deg,rgba(255,250,244,.7),#fffaf4 40%);
    box-shadow:0 -10px 24px rgba(63,42,28,.07);
}

.pcv2-nav__button{
    width:auto;
    min-width:0;
    min-height:34px;
    padding:7px 12px;
    gap:6px;
    border-radius:999px;
    font-size:.9rem;
    line-height:1;
    white-space:nowrap;
}

.pcv2-nav__button--prev{
    justify-self:start;
}

.pcv2-nav__button--next{
    justify-self:end;
}

.pcv2-nav__button-icon{
    display:inline-grid;
    place-items:center;
    width:18px;
    height:18px;
    border-radius:999px;
    background:rgba(255,255,255,.18);
    font-size:1.25rem;
    font-weight:900;
    line-height:1;
}

.pcv2-button--ghost .pcv2-nav__button-icon{
    background:rgba(111,67,36,.1);
}

.pcv2-nav__progress{
    justify-self:center;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:5px;
    min-height:30px;
    max-width:100%;
    padding:5px 10px;
    border:1px solid rgba(82,54,34,.14);
    border-radius:999px;
    background:rgba(255,255,255,.72);
    color:#725a48;
    font-size:.78rem;
    font-weight:800;
    line-height:1;
    white-space:nowrap;
}

.pcv2-nav__progress strong{
    color:#3f2a1c;
    font-size:.9rem;
    font-weight:950;
}

.pcv2-nav__next{
    display:grid;
    gap:4px;
    justify-items:end;
    min-width:0;
}

.pcv2-nav__help{
    max-width:min(360px,42vw);
    margin:0;
    color:#8a1f11;
    font-size:.78rem;
    font-weight:800;
    line-height:1.18;
    text-align:right;
}

.pcv2-nav__help:not([hidden]){
    padding:3px 0 0;
}

@media (max-width:900px){
    .pcv2-nav{
        grid-template-columns:minmax(74px,auto) minmax(54px,1fr) minmax(74px,auto);
        gap:6px;
        padding:6px 8px max(6px,env(safe-area-inset-bottom));
    }

    .pcv2-nav__button{
        width:auto;
        min-height:32px;
        padding:6px 10px;
        font-size:.84rem;
    }

    .pcv2-nav__progress{
        min-height:28px;
        padding:5px 8px;
        font-size:.72rem;
    }

    .pcv2-nav__progress-label{
        position:absolute!important;
        width:1px;
        height:1px;
        padding:0;
        margin:-1px;
        overflow:hidden;
        clip:rect(0 0 0 0);
        white-space:nowrap;
        border:0;
    }

    .pcv2-nav__help{
        max-width:44vw;
        font-size:.72rem;
        line-height:1.12;
    }
}

@media (max-width:420px){
    .pcv2-nav{
        grid-template-columns:minmax(44px,auto) minmax(42px,1fr) minmax(44px,auto);
    }

    .pcv2-nav__button{
        padding-inline:9px;
    }

    .pcv2-nav__button-icon{
        width:17px;
        height:17px;
    }
}