/* 
 * Enhanced Dynamic Sitemap Styles
 * Path: /sitemap/assets/css/sitemap.css
 */

.tree-nav {
    margin: 20px 0;
    padding-left: 10px;
}
.tree-nav ul {
    list-style: none;
    position: relative;
    padding-left: 28px;
    margin: 0;
}
.tree-nav ul:before {
    content: "";
    display: block;
    width: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    border-left: 1px solid #cbd5e1;
}
.tree-nav li {
    margin: 0;
    padding: 8px 0;
    position: relative;
}
.tree-nav li:before {
    content: "";
    display: block;
    width: 18px;
    height: 0;
    border-top: 1px solid #cbd5e1;
    position: absolute;
    top: 20px;
    left: -28px;
}
.tree-nav li:last-child:before {
    background: #f8fafc; /* Matches the container's background fallback */
    height: auto;
    top: 20px;
    bottom: 0;
    left: -28px;
    border-top: none;
    border-left: 1px solid transparent;
}

/* Ensure the background on the last item matches for the tree branch truncation */
.tree-nav li:last-child {
    background-color: #f8fafc;
}

.tree-node {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.tree-link {
    font-weight: 600;
    color: #1e293b;
    text-decoration: none;
    transition: color 0.15s;
}
.tree-link:hover { color: #2563eb; }

.tree-desc {
    font-size: 0.82rem;
    color: #64748b;
    font-weight: 400;
    background: #f1f5f9;
    padding: 2px 8px;
    border-radius: 4px;
    border: 1px solid #e2e8f0;
}

.category-label {
    font-weight: 700;
    color: #1e3a8a;
    font-size: 1.05rem;
    display: flex;
    align-items: center;
    gap: 8px;
}
.category-label i { 
    width: 20px; 
    text-align: center; 
    font-size: 0.9rem; 
}

.root-node {
    font-size: 1.1rem;
    font-weight: 800;
    color: #0f172a;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

@media (max-width: 640px) {
    .tree-nav { padding: 25px 15px; }
    .tree-nav ul { padding-left: 20px; }
    .tree-nav li:before { width: 12px; left: -20px; }
    .tree-nav li:last-child:before { left: -20px; }
}
