/* =============================================================================
   mapa-site.css — /v2/mapa_do_site/
   Lista hierarquica de links das categorias.
   ============================================================================= */

.cw-mapa {
    max-width: 1120px;
    margin: 0 auto;
    padding: var(--espaco-5) var(--espaco-4) var(--espaco-7);
}

/* Breadcrumb */
.cw-mapa__breadcrumb {
    font-size: var(--texto-sm);
    color: var(--cor-texto-suave);
    display: flex;
    align-items: center;
    gap: var(--espaco-2);
    margin-bottom: var(--espaco-4);
    flex-wrap: wrap;
}
.cw-mapa__breadcrumb-link {
    color: var(--cor-marca);
    text-decoration: none;
}
.cw-mapa__breadcrumb-link:hover { text-decoration: underline; }

/* Cabecalho */
.cw-mapa__cabecalho {
    background: linear-gradient(135deg, var(--cor-fundo) 0%, #ecfdf5 100%);
    border: 1px solid var(--cor-borda);
    border-radius: var(--raio-xl);
    padding: var(--espaco-5);
    margin-bottom: var(--espaco-5);
    box-shadow: var(--sombra-sm);
}
.cw-mapa__titulo {
    font-size: var(--texto-2xl);
    color: var(--cor-texto);
    margin: 0 0 var(--espaco-2);
}
.cw-mapa__sub {
    color: var(--cor-texto-suave);
    margin: 0;
    font-size: var(--texto-sm);
}

/* Atalhos (pills) */
.cw-mapa__atalhos {
    display: flex;
    gap: var(--espaco-2);
    flex-wrap: wrap;
    margin-bottom: var(--espaco-5);
}
.cw-mapa__pill {
    display: inline-flex;
    align-items: center;
    padding: var(--espaco-2) var(--espaco-4);
    background: var(--cor-fundo);
    border: 1px solid var(--cor-borda);
    border-radius: var(--raio-pill);
    color: var(--cor-texto);
    font-weight: 600;
    font-size: var(--texto-sm);
    text-decoration: none;
    transition: background var(--transicao-rapida), border-color var(--transicao-rapida);
}
.cw-mapa__pill:hover {
    background: var(--cor-fundo-suave);
    border-color: var(--cor-marca);
}

/* Arvore */
.cw-mapa__arvore {
    background: var(--cor-fundo);
    border: 1px solid var(--cor-borda);
    border-radius: var(--raio-xl);
    padding: var(--espaco-5);
    box-shadow: var(--sombra-sm);
}

.cw-mapa__lista {
    list-style: none;
    padding-left: var(--espaco-4);
    margin: 0;
    border-left: 2px dashed var(--cor-borda);
}
.cw-mapa__arvore > .cw-mapa__lista {
    padding-left: 0;
    border-left: 0;
}

.cw-mapa__item {
    margin: var(--espaco-3) 0;
    padding-left: var(--espaco-3);
}
.cw-mapa__arvore > .cw-mapa__lista > .cw-mapa__item {
    padding-left: 0;
}

.cw-mapa__link {
    display: inline-flex;
    align-items: center;
    padding: var(--espaco-2) var(--espaco-3);
    background: var(--cor-fundo);
    color: var(--cor-marca);
    border: 2px solid rgba(0, 138, 32, 0.25);
    border-radius: var(--raio-md);
    font-weight: 700;
    font-size: var(--texto-sm);
    text-decoration: none;
    transition: background var(--transicao-rapida), border-color var(--transicao-rapida),
                color var(--transicao-rapida), transform var(--transicao-rapida);
}
.cw-mapa__link:hover {
    background: var(--cor-marca);
    color: #fff;
    border-color: var(--cor-marca);
    transform: translateY(-1px);
}

.cw-mapa__desc {
    font-size: var(--texto-xs);
    color: var(--cor-texto-suave);
    margin-top: var(--espaco-1);
    margin-bottom: var(--espaco-2);
    padding-left: var(--espaco-3);
}

.cw-mapa__vazio {
    color: var(--cor-texto-suave);
    text-align: center;
    padding: var(--espaco-5);
    background: var(--cor-fundo-suave);
    border-radius: var(--raio-md);
}

/* ============================================================
   Desktop
   ============================================================ */
@media (min-width: 768px) {
    .cw-mapa {
        padding: var(--espaco-6) var(--espaco-5) var(--espaco-8);
    }
    .cw-mapa__titulo {
        font-size: var(--texto-3xl);
    }
}
