.category-tree {

    background:white;

    border-radius:12px;

    overflow:hidden;

    box-shadow:0 2px 12px rgba(0,0,0,.08);

}


.category-tree-header {

    background:#0d6efd;

    color:white;

    padding:15px 18px;

    font-weight:600;

    font-size:1.1rem;

}



/* Base link styling */
.category-link {

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:12px 16px;

    text-decoration:none;

    color:#333;

    transition:.2s;

}


.category-link:hover {

    background:#f4f7fb;

    color:#0d6efd;

}



/* Summary element - make entire row clickable for toggle */
.category-item summary {

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:0;

    margin:0;

    list-style:none;

    cursor:pointer;

}


.category-item summary::-webkit-details-marker {

    display:none;

}


/* When summary contains a link, the whole summary is clickable */
.category-item summary .category-link {

    display:flex;

    justify-content:space-between;

    align-items:center;

    width:100%;

    padding:12px 16px;

    margin:0;

    color:#333;

    text-decoration:none;

    transition:.2s;

}

.category-item summary .category-link:hover {

    background:#f4f7fb;

    color:#0d6efd;

}



/* Pil */

.toggle-icon {

    display:inline-block;

    width:20px;

    margin-right:6px;

    flex-shrink:0;

}


.toggle-icon:before {

    content:"▶";

    font-size:.75rem;

    color:#777;

}



.category-item[open] > summary .toggle-icon:before {

    content:"▼";

}



/* Underkategorier - nested lists inside details */
.category-item > .category-children {

    margin-left:18px;

    padding-left:0;

    border-left:1px solid #ddd;

}

/* Support both ul and div for children */
.category-item > .category-children ul,
.category-item > .category-children li {

    list-style:none;

    margin:0;

    padding:0;

}



.category-count {

    background:#eef1f5;

    color:#555;

    font-size:.8rem;

    padding:3px 9px;

    border-radius:20px;

    min-width:28px;

    text-align:center;

}



/* Aktiv kategori */

.category-link.active,
.category-item summary.active {

    background:#e7f0ff;

    color:#0d6efd;

    font-weight:600;

}


/* Leaf icon - small circle for leaf categories */
.category-title .leaf-icon {
    display:inline-block;
    width:8px;
    height:8px;
    border-radius:50%;
    background-color:#ccc;
    flex-shrink:0;
    transition:.2s;
}

.category-link:hover .leaf-icon {
    background-color:#0d6efd;
}

.category-link.active .leaf-icon {
    background-color:#0d6efd;
}


/* Make sure toggle-icon and leaf-icon have consistent positioning */
.category-title .toggle-icon,
.category-title .leaf-icon {
    display:inline-flex;
    align-items:center;
    justify-content:center;
}


.all-products {

    font-weight:600;

    border-bottom:1px solid #eee;

}